小技チョコレート

ちょっとした小技を紹介するだけのブログです。

ブラウザの拡張機能“Stylus”の使用例(3)Dynalistのメニュー内の各機能を非表示にする

ブラウザの拡張機能(アドオン)である“Stylus”(Chrome版 / Firefox版)を使って、ウェブサイトの見た目を変えることができます。
この記事では、その使用例として、Dynalistのメニューの中にある任意の機能を非表示にするCSSを紹介します。

Stylus自体の使い方の解説は、下記の記事をご覧ください。


〈目次〉


概要

PC版のブラウザでDynalistを開いて、各項目の行頭にマウスカーソルを合わせると、の形のアイコンが現れ、それをクリックすると、下記のようなメニューが表示されます。
このメニューの中の不要なものを、画面上に表示しないようにします。

f:id:ichbin:20220215163003p:plain

非表示にしたサンプル

f:id:ichbin:20220222122356p:plain

各メニューを非表示にするためのCSS

メニュー内の各項目を非表示にするためのCSSは、下記のとおり約50個あります。
なお、これらを1つにまとめた状態のCSSGistに置いてありますCSSの全体を一挙にコピーしたい場合はそちらからコピーするほうがラクだと思います。

Collapse

li.MenuItem--collapse{display:none !important}  /* Collapse */

Collapse All

li.MenuItem--collapseAll{display:none !important}  /* Collapse all */

Expand

li.MenuItem--expand{display:none !important}  /* Expand */

Expand all

li.MenuItem--expandAll{display:none !important}  /* Expand all */

Expand to level

li.MenuItem--expandToLevelParent{display:none !important}  /* Expand to level */
Level 1
li[data-level="1"]{display:none !important}  /* Level 1 */
Level 2
li[data-level="2"]{display:none !important}  /* Level 2 */
Level 3
li[data-level="3"]{display:none !important}  /* Level 3 */
Level 4
li[data-level="4"]{display:none !important}  /* Level 4 */

Collapse all siblings

li.MenuItem--collapseSiblings{display:none !important}  /* Collapse all siblings */

Expand all siblings

li.MenuItem--expandSiblings{display:none !important}  /* Expand all siblings */

Zoom in

li.MenuItem--zoomIn{display:none !important}  /* Zoom In */

Add note

li.MenuItem--addNote{display:none !important}  /* Add note */

Delete

li.MenuItem--deleteNode{display:none !important}  /* Delete */

Delete checked items

li.MenuItem--deleteCheckedNodes{display:none !important}  /* Delete checked items */

Add to bookmarks

li.MenuItem--bookmarkNode{display:none !important}  /* Add to bookmarks */

Sort

li.MenuItem--sortChildren{display:none !important}  /* Sort */
Title (A to Z)
li.MenuItem--sortTitleAsc{display:none !important}  /* Title (A to Z) */
Title (Z to A)
li.MenuItem--sortTitleDesc{display:none !important}  /* Title (Z to A) */
Date (new to old)
li.MenuItem--sortDateDesc{display:none !important}  /* Date (new to old) */
Date (old to new)
li.MenuItem--sortDateAsc{display:none !important}  /* Date (old to new) */
Unchecked first
li.MenuItem--sortCheckedStatusAsc{display:none !important}  /* Unchecked first */
Checked first
li.MenuItem--sortCheckedStatusDesc{display:none !important}  /* Checked first */
Edited (new to old)
li.MenuItem--sortEditedTimeDesc{display:none !important}  /* Edited (new to old) */
Edited (old to new)
li.MenuItem--sortEditedTimeAsc{display:none !important}  /* Edited (old to new) */
Created (new to old)
li.MenuItem--sortCreatedTimeDesc{display:none !important}  /* Created (new to old) */
Created (old to new)
li.MenuItem--sortCreatedTimeAsc{display:none !important}  /* Created (old to new) */
Reverse current
li.MenuItem--reverseCurrent{display:none !important}  /* Reverse current */

Search and replace...

li.MenuItem--searchReplace{display:none !important}  /* Search and replace... */

Indent

li.MenuItem--indent{display:none !important}  /* Indent */

Unindent

li.MenuItem--unindent{display:none !important}  /* Unindent */

Move to...

li.MenuItem--moveNode{display:none !important}  /* Move to... */

Insert template...

li.MenuItem--insertTemplate{display:none !important}  /* Insert template... */

Add checkbox

li.MenuItem--showCheckbox{display:none !important}  /* Add checkbox */

Add checkbox to children

li.MenuItem--addCheckboxToChildren{display:none !important}  /* Add checkbox to children */

Remove checkbox

li.MenuItem--hideCheckbox{display:none !important}  /* Remove checkbox */

Remove checkbox to children

li.MenuItem--removeCheckboxFromChildren{display:none !important}  /* Remove checkbox to children */

Check off

li.MenuItem--check{display:none !important}  /* Check off */

Uncheck

li.MenuItem--uncheck{display:none !important}  /* Uncheck */

Number Children

li.MenuItem--makeNumberedList{display:none !important}  /* Number children */

Stop numbering children

li.MenuItem--unmakeNumberedList{display:none !important}  /* Stop numbering children */

Manage sharing...

li.MenuItem--shareRootNode{display:none !important}  /* Manage sharing... */
li.MenuItem--getLink{display:none !important}  /* Get link */

Show all references

li.MenuItem--showReferences{display:none !important}  /* Show all references */

Export...

li.MenuItem--exportNode{display:none !important}  /* Export... */

Set as inbox

li.MenuItem--setAsInbox{display:none !important}  /* Set as inbox */

Color label(項目ごとの背景色)

ul.set-color-label-menu{display:none !important}  /* Color label */

見出し化ボタン(H1, H2, H3)

ul.set-heading-level-menu{display:none !important}  /* 見出し化ボタン */

関連記事

Stylusの使用例を紹介した記事として、こちらもあります。