diff --git a/resources/css/app.css b/resources/css/app.css index 5d07e0e..9198d64 100644 --- a/resources/css/app.css +++ b/resources/css/app.css @@ -6,3 +6,66 @@ @theme inline { --font-sans: Instrument Sans, ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; } + +.page-container { display: grid; + grid-template-columns: 1fr; + grid-template-rows: 1.4fr 0.6fr; + gap: 2em 0em; + grid-auto-flow: row; + grid-template-areas: + "currentForecast" + "weeklyReport"; +} + +.currentForecast { display: grid; + grid-template-columns: 1fr 1fr; + grid-template-rows: 1fr; + gap: 0px 0px; + grid-auto-flow: row; + grid-template-areas: + "forecast secondaryInfo"; + grid-area: currentForecast; +} + +.forecast { display: grid; + grid-template-columns: 1fr; + grid-template-rows: 1fr 1fr 1fr; + gap: 0px 0px; + grid-auto-flow: row; + grid-template-areas: + "shortDescription" + "longDescription" + "currentTemp"; + grid-area: forecast; +} + +.shortDescription { grid-area: shortDescription; } + +.longDescription { grid-area: longDescription; } + +.currentTemp { grid-area: currentTemp; } + +.secondaryInfo { display: grid; + grid-template-columns: 1fr; + grid-template-rows: 1fr 1fr; + gap: 0px 0px; + grid-auto-flow: row; + grid-template-areas: + "windContainer" + "solarClock"; + grid-area: secondaryInfo; +} + +.windContainer { grid-area: windContainer; } + +.solarClock { grid-area: solarClock; } + +.weeklyReport { display: grid; + grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; + grid-template-rows: 1fr; + gap: 0px 0px; + grid-auto-flow: row; + grid-template-areas: + ". . . . . ."; + grid-area: weeklyReport; +} diff --git a/resources/js/pages/Weather.vue b/resources/js/pages/Weather.vue new file mode 100644 index 0000000..ad50cc2 --- /dev/null +++ b/resources/js/pages/Weather.vue @@ -0,0 +1,25 @@ + + + diff --git a/resources/js/pages/Welcome.vue b/resources/js/pages/Welcome.vue deleted file mode 100644 index f18bb4e..0000000 --- a/resources/js/pages/Welcome.vue +++ /dev/null @@ -1,12 +0,0 @@ - - - diff --git a/routes/web.php b/routes/web.php index 99ab7de..b9d3b1e 100644 --- a/routes/web.php +++ b/routes/web.php @@ -4,5 +4,5 @@ use Illuminate\Support\Facades\Route; use Inertia\Inertia; Route::get('/', function () { - return Inertia::render('Welcome'); + return Inertia::render('Weather'); })->name('home');