{ダークテーマ実装}{希哲17年1月14日の開発}{希哲17年1月14日の進捗}{希哲17年1月14日}{省けてしまった}{アイコン作成}{よく考えたら}{形状的}{実験中}{作るつもり}...=}(135)

{希哲17年1月14日6歩 K#F85E/E74C-ED7A}

進捗時限記録中略

課題だったテーマ切り替えボタンイメージ急速に固まったため,ダークテーマ実装におけるテーマ切り替え用合いについてまとめ終了

従来の上部メニュー様子使ってきた歯車アイコンそのまま太陽見立てトグルボタン風装飾することにした。CSS のみで表現し,ラベルには「」「」を使う開発者通類試しに装体作ってみた録落ち中のメニュー案

未録入り場合メニュー設定輪結部分に,録入り中場合設定ページ <main>右上置く。この領当て既に固まっていたが,テーマ切り替えボタン細部なかなか決まらなかった昨日までは,緑色太陽アイコン月アイコン右隣に「明るい」「暗い」のラベル付ける程度簡素なボタンイメージしていた。しかし,これでは冗長な上に直感的とも言い難い

ふとトグルボタン風にしてみたらどうかと開発者通類実験してみたら,想像以上に良かった簡潔ながら邪魔にならない程度に目立ち,ぱっと見て役割察しやすいデライトテーマ切り替えボタンとしてこれ以上出ない判断採用決めた

歯車アイコンそのまま太陽アイコンとして使えるというのは面白い発見だった。形状的にも設定という意味的にも似ていることに気付いて,設定輪結入れ替えることを思いついたのはだいぶ前で,デザイン的遊び出来そうだとは思っていたが,アイコン別に作るつもりだった。とりあえず実験中代替として使ってみた思いのほかしっくり来た

月アイコンも,よく考えたら画像用意するまでもなく CSS十分なことに気付いた結局アイコン作成手間省けてしまった


もう一つ課題として,応司ダークモードをどう扱うかという問題があったが,デライトでは明示的に切り替えた場合はその設定固定し,出放りとしては応司設定従うことにした。


残る課題装体整理のみとなったが,先日装体整理兼ダークテーマ実装という思いつきでこれも好機変わった

{希哲17年1月6日の進捗}{便利だった}{lightpink}{pink}{誤認しやすかった}{同じ装体}{輪郭削除ボタンの様子・装体調整後}{輪郭削除ボタンの様子・装体調整前}{完了ボタンの様子}{配灯時}...=}(116)

{希哲17年1月6日7歩 K#F85E/E74C-4A35}

{希哲16年9月30日}{希哲16年9月30日の副日記}{嬉しい結果}{全文検索時}{索引更新}{非標準機能}{導入しやすかった}{移行過程}{懸念していた}{全文検索索引}...=}(59)

{希哲16年9月30日の開発 K#F85E/E74C-10E9}

{デライトのダークテーマ対応}{希哲16年6月15日}{希哲16年6月}{希哲16年4月5日}{}{}{デライト}{希哲16年4月5日の開発}{希哲16年4月5日の進捗}{CSS 変数}...=}(208)

{希哲16年4月5日14歩 K#F85E/E74C-6431}

CSS 変数(カスタムプロパティ)の導入舞覧ブラウザ五年対応原則採用決め終了今後デライトでは,「5年以内離立された版存主要舞覧」を中心に対応していく

希哲15年3月1日の開発から「デライト推奨動作環境」として同様の定義考えてはいたが,当時は,古い舞覧対応努力はするが推奨はしない程度の,もっと緩やかなものを想定していた


希哲13年ECMAScript 2015HTML5CSS3比較的新しいウェブ標準導入決めてからだいぶモダンにはなったが,まだデライトの舞覧対応方針には感覚的保守的なところがあった。感覚的に影響範囲の広い付徴主要舞覧対応から10年影響範囲の狭い付徴5年目安導入考えていたrem ですら必要以上には使わなかった

先日前次記法実装グリッド領当て導入したが,これはちょうど主要舞覧使えるようになってから5年ほど経つ機能だった。一記法装体過ぎなかったこともあり,ここまで辛うじて良かったが,他にも色々応用したいことが出てき舞覧対応方針見直し必要を感じていた

決め手は,デライトのダークテーマ対応見据えて CSS 変数の導入考え始めたことだった。CSS 変数主要舞覧対応から5年ほど経つが,本格的に導入するとなると影響範囲広がり過ぎる


Can I use対応舞覧よく調べるようになってから,「5年以内離立された版存主要舞覧」が意外に普及していることに気付いた大体90%以上はある。

地域にもよるだろうが,確かに今時古い舞覧使い続ける方が難しいかもしれない。個人機なら5年平均的な買い替え周期であり,スマートフォンなら古い部類だろう。自動更新標準的になった昔と違って多数派の“普通の人”ほど新しい舞覧使っている

読み込み中...
=}
{採用}

{}