なぜこんな無意味なことを思いつくんだろう。
フローティング・ツールバー
モバイルツールバーを浮かせてから 「これこそマスキングテープじゃね?」と思い、 そうしてみました。
どうしたんですかねぇ。
tape.css
こういう感じです。
.mobile-toolbar, .workspace-drawer-active-tab-header { background-color: #fff; background-image: linear-gradient(-45deg, rgba(210,250,210,.5) 25%, transparent 25%, transparent 50%, rgba(210,250,210,.5) 50%, rgba(210,250,210,.5) 75%, transparent 75%, transparent 100%), linear-gradient(45deg, rgba(210,250,210,.5) 25%, transparent 25%, transparent 50%, rgba(210,250,210,.5) 50%, rgba(210,250,210,.5) 75%, transparent 75%, transparent 100%); background-size: 30px 30px; } .workspace-drawer-active-tab-header { text-align: center; border-radius: 1rem; box-shadow: 1px 1px 2px #ddd; }
すると、こうなります。
だからどうした?と自分に突っ込みたい。
サイドバーも
サイドバーのヘッダーもちょっと凝ってみました。
丸みがついて絆創膏テープみたい。
まとめ
見慣れると、アクセントとして違和感がないから恐ろしい。