自閉症用ビジュアルスケジュールボード
先日作成したものは画像を各自で取り込むため、herokuの設定が複雑なので幾らか修正しました。
画像はこちらで３０枚ほど用意したものでよければこちらで使うことが出来ます。無料で宣伝も出てこないので是非とも使って感想など頂けたら幸いです。
利用方法
最初の画面がスケジュール作成画面になります。
１．まずはスケジュールの名前を入れます。既に登録されているとエラーが出ますので、自分だけの名前を入力してください。（例 りさの病院）
2.表示された画像の左にある番号をスケジュール順に入力
3.作成をクリック
クリックすると完成したスケジュールが表示されます。
これをスクショするなどしてご自分の端末に保存してお使いください。他にも作りたい場合は
印刷しようとしたらスタイルが崩れていた時
完成したと思って印刷のプレビューを見たら、デザインが総崩れを起こしていました。
参考サイト
ではと、
zoom:70%;を@media print {}内のbodyに追記
margin-bottom: 200px;では、@media print {}内に対象エリア内で上記を追記
@media奥が深いなー
枠線のついたリボンデザインをcssで作る
本当はこれを作りたかったのですが、
影を付けるのに断念。before,afterにくの字を付けることを参考に一応影無しは完成
マイグレーションしたらエラーした
エラーメッセージ
MethodIlluminateDatabaseSchemaBlueprint::○○ does not exist.マイグレーションできませんね。
原因はdatabase/migrationsにあるcreated_××table.phpのこの記述がきちんと書いてなかったからでした。
スケジュールボードをLaravelで作ってみました。
初めてしたこと
- Dockerで作成
- 画像をstorageにアップロードして利用できるようにする
- 並び替え機能
- スクロール表示
- 検索機能
１．Dockerで作成
これが一番苦労しました。色々なサイトを参考にするも失敗の繰り返し。結局こちらのサイトを参考に最後まで行けました。https://reffect.co.jp/laravel/finally-understand-laravel-on-docker#docker-composeyml-2
2.画像をstorageにアップロードして利用できるようにする
これも上げるだけならいいのですが、上げたものを利用するとなるとちょっと、工夫が必要かな？と、色んなサイトを見てこちらの二つを主に参考にしました。https://qiita.com/RitaChan/items/d59001430f50789c570f
3. 並び替え機能
これはJSを使わずform action でsubmitする形を使いました。参照サイトはhttps://qiita.com/kenji__n/items/a3fc7bf6b5e6416059b7
4. スクロール表示
これはこちらを参照 https://www.purin-it.com/spring-boot-css-table-scroll
5. 検索機能
これはこちらを参照 https://laraweb.net/tutorial/607/
