当技術Blogにて文頭のiOS, macOS,iPadOSが大文字になってしまった問題が開設当初から存在していたのだがこちらを修正した際のメモ。

問題

単一ブログコンテンツだけ文頭文字が大文字になってしまう。カテゴリやタグ検索で表示される文章は大文字にはならなかった。

解決方法

単一ブログコンテンツのスタイルシート(.stc.js)の擬似要素(Pseudo-elements)である &:first-letterを除外する。

&:first-letter{
    text-transform: capitalize;
}

ignore対象の文字だけ例外化しようとしたが、&:first-letterを除外した方が後々おかしなことにならないと思われたので採用している。

cssに熟練している人なら真っ先に擬似要素(Pseudo-elements)を疑うのであろうが自分のcssに関する知識が抜け落ちてるため修正が後回し位になった感が否めない。

使用している商用テンプレートのアップデートが来ていたので適用予定。商用テンプレートの提供元がファイルベースのためソースコード管理(git)へのコードマージ作業に幾分手間を感じてしまう。