Inkdrop V6 - basyura's blog

愛用しているマークダウンノートアプリ Inkdrop の V6 がリリースされた 🎉

いい感じのところ

いいところは色々あるけど、特に起動が V6 に比べて明らかに速くなった。特に Windows。マシンパワーとか Windows Defender が頑張りすぎているというのもあるけど、起動したと見せかけて触れない時間帯が結構長かったのが無くなった。非同期で plugin 詠み込むとか色々工夫されてそう。とはいえ、起動した後は立ち上げっぱなしだし個別にウインドウを開いてみることもほぼ無いので困ってはなかったけど、嬉しい人は多そう。

細かいところだけど ( や " をを入力すると対になる ) や " が入力されるようになってて便利。

css

本家の UI はこちら(https://www.inkdrop.app)。本家のサイトでアプリから切り出された UI が動いてて動かせるのはすごい (謎のスキル)。

僕の Inkdrop の UI はコレ。

利用者が個別に設定できる Styles.css を編集して自分好みの表示にした。今回は前々から気になっていたノートのタイトル領域とステータス領域、アクションボタン？領域の配置を一行に変えた。合わせて使わないアイコンを非表示にした。スッキリした上に、タイトルに # を表示し、本文は ## の見出しを使うので、エディター、プレビューともにタイトルと本文が並んでる感じでいい感じ。プレビューも見た目は同じ (メタデータ領域を消している)。

合わせてドラッグできる領域も調整。css で app-region: drag; app-region: no-drag; を付けばいいというのは知らなかった (codex に教えてもらった)。

それ以外の見た目に関してはノートリストにある Date Update ↓ の位置がちょっときになるけど・・・・妙案がないのでそのままとしている。ここは個人的には v5 のような検索 input の横にある方がいいけど、ここはもはや好み。

設定の ⚙️ アイコンは消した。新規ノートの 🗒️ アイコンも不要に思って消してみたけど、しっくりこなくて表示したままにした (もはや病気) 。

端末固有のスタイルも指定したい

git で styles.css、keymap.json、init.js を管理して端末間で共有している。主に mac と windows 間では細かいところ (閉じるボタンの位置とか) に違いがあるのでローカルのスタイルも使いたい。 css の @import を使ってもいいのだけど、styles.css と同じ位置にしたいので init.js に仕込んだ。

const userStylePath = inkdrop.styles.getUserStyleSheetPath();
const localStylePath = path.join(
  path.dirname(userStylePath),
  "styles.local.css"
);

if (fs.existsSync(localStylePath)) {
  const css = fs.readFileSync(localStylePath, "utf8");
  inkdrop.styles.addStyleSheet(css, {
    sourcePath: localStylePath,
    priority: 21,
  });
}

気になるところ

タスク完了と未完了と画像のスタイルを区別できない。

* [ ] Hello #aeb7bf
* [x] World lightgreen
* ![](img.png)

感想

v5 で特に困ってなかった (満足してた) けど、v6 がリリースされると機能が追加されたりパフォーマンスが上がってたりとやっぱりいいものだ。