{開発記録}{先入観}{}{}{十分}{デライト}{<path>}{希哲17年5月4日の副日記}{方針変更}{交代させる}(118)

{希哲17年5月4日の開発 K#F85E/E74C-E5D4}

CSS アイコン実装から動的引連 SVG アイコン実装切り替えることにした。軽く実験してみたやたら捗ったため,改めて早期実装目指すことにした。

昨日の開発記録書いてみてCSS アイコン調整かかる時間馬鹿にならないなと考えながら何気なく Google 検索素出覗いていたら,意外に上手くアイコンSVG表現出来ているなとは思ったが,やはり HTML出力している引連 SVG アイコン気持ち悪い感じたここで,「行き詰まり防ぐための選択肢」として残すことにしていた4月27日の開発記録動的引連 SVG凌ぐことを思い付いた

これまで見てきた解説悪かったか,「SVG煩雑」という先入観がありずっと苦手意識持っていたが,引連 SVG 関しては<path>中心に削ぎ落とせ十分簡潔出来ることが分かった例えば従来のデライト+ アイコン以下の記述十分表現出来る

<svg viewBox="0 0 32 32">
  <path d="M 4 16 H 28 M 16 4 V 28" fill="none" stroke-width="5.5" stroke-linecap="round"/>
</svg>

引連 SVG なので,CSSJavaScript での各部分操作容易だ。直接編集やたら難しい言われているので面倒臭そうだなと思っていたが,何のことはないすぐに習得出来てしまったCSS アイコン調整比べれば直感的ですらあるし,拡縮時品質比べ物にならない。これで外部通類への依存という懸念払拭出来たあとはHTML の肥大化保守性の低下という引連 SVG二大欠点スクリプト補えばいい。動的引連 SVG なら部品再利用十分柔軟に出来る

元々 CSS アイコン中心とした枠組み応付だったので,作ってきた枠組みそのまま活かせるのも嬉しい所だった。動的引連 SVG中心にCSS アイコン応付として交代させるだけで大きな方針変更必要なかった

{開発記録}{}{デライト}{ダークテーマ実装}{希哲17年2月12日}{希哲17年2月11日の副日記}{希哲17年2月11日}{上げられた}{高くなかった}{慣れてしまった}(91)

{希哲17年2月11日の開発 K#F85E/E74C-0185}

まだぼんやりしていたため,中途半端な状態出振るい邪魔になっていた装体整理兼ダークテーマ実装準備運動がてら進めたら,一日熱中してかなり捗ったしかも思いのほか手応えが良く,ダークテーマ実装持ち辺急速に上がってきた

全知検索窓固定機能実装などを優先するつもりだったが,このまま明日中の出振るい機能公開目指して作業を進めることにした。


デライトではあまり暗い印象与えたくないという宣伝上の都合もあり,ライトテーマ基本として調整してきて,私自身それに慣れてしまったので,ダークテーマそのもの対する持ち辺高くなかった白黒対比利用したデザインでもあり,そもそもダークテーマとの相性良くないのではないかとすら思っていた装体整理兼ねさせ何とか優先順位上げられたものの,とりあえずおまけ程度実装して,長い目で見どこまで調整出来るか,という感じだった。

ところが配色整理進めてみると,意外にも早くしっくり来るものが出来そう感触がある。自分では手定め以上使う予定はなかったが,すでにかなり心地良いものになってきているので常用してしまうかもしれない。

デライトデザインダークテーマともしっかり調和するというのは嬉しい発見だった。

{開発記録}{方向}{}{ダークテーマ実装}{希哲17年1月30日}{希哲17年1月30日の副日記}{認識させたい}{非固定}{重たく見える}{変えたり}(93)

{希哲17年1月30日の開発 K#F85E/E74C-8429}

ダークテーマ実装その他軽微な装体調整など。

ダークテーマ実装ではテーマ切り替えボタン機能実装概ね完了し残す装体整理のみとなった。今後は色設定CSS 変数への置換中心に装体整理兼ダークテーマ実装」を少しずつでも進め機能公開目指す

テーマ切り替えボタン機能25日4歩検討通りで,初期状態では司組設定追従司組設定異なる切り替える固定同じ切り替えるとまた司組設定追従するただし実装としては初期化というよりライトテーマダークテーマ固定有無組み合わせ4種類状態持たせることにした後縁非固定設定認識させたいため)

外観については drop-shadow影を付けたり月アイコン方向変えたり調整することを考えていたが,結局現状維持とした。限りなく薄く付けても不必要重たく見える月アイコンも,欠けている部分左向き沿うので調和的見える

状態クッキー保存するため後縁での最適化出来単純なトグルボタンのみで4種類状態直感的に切り替えることも出来見触れ良好,と理想的なテーマ切り替えボタン出来上がった

舞覧開発者通類テーマ司組設定簡単に切り替えられることを知り手定め捗った

{開発記録}{十分}{悪い意味}{希哲17年1月20日の副日記}{概念的に}{両記法}{とらわれない}{態勢に入っていた}{理解しやすくする}{増やせる}(164)

{希哲17年1月20日の開発 K#F85E/E74C-D455}

全知検索演算子についての検討1歩交度埋め込み記法実装方針検討数式記法含めた概念整理5歩知名デラング対応方針についての検討7歩交度記法対応言語スクリプト動的に追加する方法についての検討12歩など,検討作業よく捗った

実作業も,交度写し取りボタン実装13歩16歩交度埋め込み記法調整などそこそこ捗ったが,特に大きかったのは,交度埋め込み記法数式記法概念整理出来たことだった。

交度埋め込み記法数式記法概念整理

交度埋め込み記法では,対応言語texlatexkatex追加したこれまで katex のみを追加するつもりだったが,意図の明示という観点から使い分けられる方が望ましい例えばKaTeX という実装こだわらず LaTeX書きたいということは十分に考えられる

また,これまで数式記法KaTeX 交度埋め込み記法糖衣構文程度考えていたが,ここで「数式のための TeX 風記法」と位置付け直すことにした。これにより,例えば mhchem などの数式以外応用交度埋め込み記法使うといった使い分け可能になる


Mermaid 対応以後交度埋め込み記法KaTeX対応する機会を窺っていた。これは同記法考案した時点考えていたこと希哲16年2月15日18歩で,いずれ対応するつもりではあったが,30分もあれば十分だろうという実装コストの低さにもかかわらずいまいち気が乗らなかった

数式記法糖衣構文として再定義する,それ以上意義見出せなかった整合性という大義名分はあったが,悪い意味での冗長性加えるような感覚もあり,なんとなくぼんやりしたすっきりしないものを感じていた

読み込み中...
{捗った}

{}