from ✅ダイアログの見た目を改善する Scrapbox Dialogの右の隙間を修正
after:
before:
movie:
-
-
beforeではflexのitemsの中のコンテンツにクラス名をつけて、CSSを当ててサイズをコントロールしていた
- afterではitems自体にクラス名をつける形に変えた
- widthで固定サイズにするのではなくflexで調節させる
-
ボタンを包むdivは
flex-basis: auto;で中身のサイズにして固定 -
入力欄のdivはbasisを固定値で入れた上でgrowで空きスペースいっぱいに広がらせる
- 中の入力欄は外のdivのサイズに合わせる css
div.input-icon {
flex-basis: 120px;
flex-grow: 1;
}
div.input-icon > div {
width: 100%;
}
- ページタイトルは可能なら長くなって欲しくて、プロジェクト名はあまり長くなる必要がない、これはgrowの値の違いで表現している
- これに関してはもっと良いやり方があるかも知れない