Closed nonuplet closed 9 months ago
indexページのCSS周りやデザインの修正、bladeテンプレートからvueへの置き換えを行いました。
index.blade.php の内容を新たに作成した IndexPage.vue に置き換えました。
index.blade.php
IndexPage.vue
このbladeの影響で一部CSSが app.scss に記載していたことにより、scoped になっておらず他のコンポーネントのデザインに悪影響を及ぼしていたため、Vueファイルに分割し閉じ込めるようにしました。
app.scss
scoped
この修正によるデザインの変更はありません。
indexページで使っていた .box-alert や .box-error などについて、CSSの定義だけで拡張性に乏しい状態でした。そこで新たにInfoBoxコンポーネントを実装しました。
.box-alert
.box-error
オマケとしてアイコン設定も出来るようになっています。FontAwesomeのクラスを指定するとアイコンを決められます。指定しない場合は notify alert errorのボックス指定によって自動的にアイコンが割り当てられます。 独自アイコンを使用する場合は、 library.add() をお忘れなく…
notify
alert
error
library.add()
Overview
indexページのCSS周りやデザインの修正、bladeテンプレートからvueへの置き換えを行いました。
index.blade.phpの内容をIndexPage.vueへ置き換え
index.blade.php
の内容を新たに作成したIndexPage.vue
に置き換えました。このbladeの影響で一部CSSが
app.scss
に記載していたことにより、scoped
になっておらず他のコンポーネントのデザインに悪影響を及ぼしていたため、Vueファイルに分割し閉じ込めるようにしました。この修正によるデザインの変更はありません。
Infoboxの実装
indexページで使っていた
.box-alert
や.box-error
などについて、CSSの定義だけで拡張性に乏しい状態でした。そこで新たにInfoBoxコンポーネントを実装しました。オマケとしてアイコン設定も出来るようになっています。FontAwesomeのクラスを指定するとアイコンを決められます。指定しない場合は
notify
alert
error
のボックス指定によって自動的にアイコンが割り当てられます。 独自アイコンを使用する場合は、library.add()
をお忘れなく…