JSFiddle( Editor 画面)の CSS を読む
Editor 画面で Minify されていた CSS を DirtyMarkup: CSS Beautifier で適当に整形して読んだ。JSFiddle は普段からよく使っているが、今回コードを読むときにサイトの表示はあまり見てない。
CSS は整形後 700行くらい。
アンチエイリアスを抑えてフォントをきれいに見せる。
*, body, button, html, input, select, textarea { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
リンクの状態変化は :hover
だけで指定。:hover, :visited, :active
みたいな指定はしてない。
a { ... } a:hover { ... }
font-family
の指定にはまたしても Fira Sans がいた。
#app-updates
や #sidebar
など、その他にも多く ID セレクタが見てとれた。#id .class
の指定が多い。BEM は使われておらず、カスケーディングを基本としたセレクタの指定。
単位は px
が基本。
透過させた色を表示したいときは hsla()
を使ってる... と思いきや rgba()
も使っており、混在。
font-weight
はキーワードじゃなくて数値の指定。400
と 700
、ときどき 600
。
svg
要素に視覚的調整と思われる top: -1px
の指定を発見。
突如あらわる !important
。
#actions .actionItem a.aiButton span { margin-right: 6px!important; }