Cyber​​dev Obsidian テーマ

導入

私は、夜遅くまでコンピューターに向かってコードを書いたりメモを取ったりする開発者向けに特別な Obsidian テーマをデザインしました。このテーマは、画面の前で長時間過ごすユーザーの目の疲れを最小限に抑えるために開発されました。黒の背景に対照的な色を使用することで高いコントラストが実現され、可読性が向上し、快適なユーザー エクスペリエンスが提供されます。

このテーマの開発中に直面した主な課題は次のとおりです:

• 画面の明るさ: 長時間使用しても目に負担をかけない設計です。

• 可読性: テキストとコードが簡単に区別でき、理解できることを保証します。

• シンプルさとミニマリズム: 不必要な視覚的な混乱を避け、焦点を絞ったユーザー エクスペリエンスを提供します。

• コードの可読性: コードを簡単に区別して分析できる配色を設計します。

これらの基準を念頭に置いて、ユーザーエクスペリエンスを優先したテーマの作成を目指しました。

開発ノート

テーマ テンプレート ファイルは、Obsidian テンプレート ファイルから新しく作成された Obsidian Vault ファイルにコピーされました。

テンプレート ファイルが .obsidian/themes フォルダーに移動された後、manifest.json ファイルが編集されました。

ここで注意すべき最も重要な点は、manifest.json ファイルの名前フィールドに割り当てられた値がフォルダー名と一致する必要があるということです。たとえば、値が "name": "cyberdev" の場合、テンプレート フォルダー名も "cyberdev" に更新する必要があります。

この時点から、すべての調整はtheme.cssファイルで行われます。この段階で、理解すべき重要な点が 2 つあります:

1. Obsidian API のデフォルト CSS 変数:
   Obsidian には、色、フォント サイズ、フォント ファミリー、境界線の太さなどの値を直接変更できるデフォルトの CSS 変数が用意されています。これらの変数は、Obsidian ドキュメントの CSS 変数セクションにあります。

2. 開発者ツールの使用:
   Obsidian インターフェイスを開いた後、CTRL SHIFT I を押して開発者ツールにアクセスできます。次に、CTRL SHIFT C ショートカットを使用して、検査モードを有効にできます。これにより、マウスを使用して画面上の特定の要素を選択できるようになります。選択した要素に関連する CSS 変数が表示されます。 .cm-em{} などのこれらのクラスの場合は、ドット表記で記述し、中括弧内で変数を定義する必要があります。

ライセンス情報

他の Obsidian テーマ コードと同様、テーマ は MIT ライセンスのもとでオープンソースです。これをコンピューターにダウンロードするか、リポジトリからフォークを介してブランチを作成した後、必要に応じてカスタマイズして機能を追加できます。必要に応じて、リポジトリのクローンを作成し、コンピュータ上で編集することもできます。

プロジェクトファイルへのアクセス

次の GitHub アドレスでプロジェクトを確認できます:

gokayburuc/cyberdev-obsidian-theme

テーマをダウンロードする手順は、指定されたリポジトリ内にあります。

接触

このプロジェクトに関しては、次のチャネルから私にご連絡いただけます

電報 : @gokayburuc
メール : gokayburuc@yandex.com
リンクツリー : https://linktr.ee/gokayburuc

この記事が気に入ったら、チャンネル登録してこの記事を共有してください。

以上がCyber​​dev Obsidian テーマの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。