一般社団法人 全国個人事業主支援協会

COLUMN コラム

  • ん?CSSが効かない? Laravelでの開発での注意点。
以下のコードはちゃんとCSSが機能したコードです。
開発当初どうやってもCSSがきかなくてどうしてだろうと思っていました。

原因は一番上に書いている、x-app-layoutの部分。これがないとLaravelでCSSを機能させることができるみたいです。

それはそうと以下は登録された勤怠時間を操作するためのものです。

その一部にはなるものの、新しい知識を使うというのは大変ですね・・・

<x-app-layout>
    <x-slot name=”header”>
        <h2 class=”font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight”>
            {{ __(‘管理者用ページ’) }}
        </h2>
    </x-slot>
    <div class=”py-12″>
        <div class=”max-w-7xl mx-auto sm:px-6 lg:px-8″>
            <div class=”bg-white dark:bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg”>
                <div class=”p-6 text-gray-900 dark:text-gray-100″>
                    @foreach ($times as $time)
                        <form class=”time-form” method=”POST” action=”{{ route(‘update.time’, $time->id) }}”>
                            @csrf
                            @method(‘PUT’)
                            <div class=”form-group”>
                                <label for=”start_at”>勤務開始時間:</label>
                                <input type=”text” name=”start_at” value=”{{ $time->start_at }}” required>
                            </div>
                            <div class=”form-group”>
                                <label for=”end_at”>退勤時間:</label>
                                <input type=”text” name=”end_at” value=”{{ $time->end_at }}” required>
                            </div>
                            <div class=”form-group”>
                                <label for=”comment”>日報コメント:</label>
                                <p>{{ $time->content }}</p>
                            </div>
                            <button type=”submit” class=”submit-button”>更新</button>
                        </div>
                        </form>
                    @endforeach
                </div>
            </div>
        </div>
    </div>
</x-app-layout>
The following two tabs change content below.

佐藤 海

この記事をシェアする

  • Twitterでシェア
  • Facebookでシェア
  • LINEでシェア