Merge pull request #13 from SethSharp/sharpie/dev-282-about-page-v2

Sharpie/dev 282 about page v2

app/Http/Controllers/Public/ShowAboutController.php

@@ -0,0 +1,18 @@
+<?php
+
+namespace App\Http\Controllers\Public;
+
+use Illuminate\View\View;
+use App\Support\Traits\GoogleApi;
+use App\Http\Controllers\Controller;
+
+
+class ShowAboutController extends Controller
+{
+    public function __invoke(): View
+    {
+        return view('pages/about', [
+            'team' => config('framed.team')
+        ]);
+    }
+}

config/framed.php

@@ -0,0 +1,47 @@
+<?php
+
+return [
+
+    /*
+    |--------------------------------------------------------------------------
+    | Team
+    |--------------------------------------------------------------------------
+    |
+    | Defines the team members information, name, position and description
+    |
+    */
+    'team' => [
+        [
+            'name' => 'Diane',
+            'position' => 'Director',
+            'description' => "Diane, our founder, embarked on her picture framing journey in 1993. In 1997, she realized her dream by opening her framing business on Oxley Drive. With her vision and dedication, the business thrived and has continued to this day. With over 30 years of experience in the industry, Diane's passion for framing continues to drive our business forward.",
+            'src' => 'team/diane.webp',
+            'alt' => 'Diane Team Photo',
+        ],
+        [
+            'name' => 'Karen',
+            'position' => 'Framer',
+            'description' => 'With over three decades of framing experience, Karen has been an integral part of our team. Her exceptional artistic flair enables her to assist our customers in making challenging choices, delivering outstanding results.',
+            'alt' => 'Karen Team Photo',
+        ],
+        [
+            'name' => 'John',
+            'position' => 'Framer',
+            'description' => 'John has been a valuable addition to our team and making significant contributions. With approximately six years of prior experience running his own picture framing business and a background in engineering, he brings a wealth of expertise.',
+            'alt' => 'John Team Photo',
+        ],
+        [
+            'name' => 'Bethany',
+            'position' => 'Framer',
+            'description' => 'Bethany, one of our newest team member, successfully juggles her university studies with her passion for picture framing. Her enthusiasm shines through as she continues to make impressive strides in her framing skills, consistently delivering outstanding work.',
+            'src' => 'team/bethany.webp',
+            'alt' => 'Bethany Team Photo',
+        ],
+        [
+            'name' => 'Danielle',
+            'position' => 'Framer',
+            'description' => 'Danielle, our newest team member..',
+            'alt' => 'Danielle Team Photo',
+        ]
+    ]
+];

resources/views/components/cards/member/card.blade.php

@@ -0,0 +1,19 @@
+<div>
+    <div>
+        @if (isset($member['src']) )
+            <x-image src="{{$member['src']}}" alt="{{$member['alt']}}" additionalClass="shadow mx-auto rounded-2xl overflow-hidden" />
+        @endif
+    </div>
+
+    <div class="flex max-w-2xl mx-auto">
+        <div class="rounded-r-xl transition duration-700 p-2">
+            <h1 class="text-xl text-secondary-800 font-semibold">{{ $member['name'] }}</h1>
+
+            <span class="text-base text-secondary-400"> {{ $member['position'] }} </span>
+
+            <p class="mt-4 !font-base text-md text-secondary-500">
+                {{ $member['description'] }}
+            </p>
+        </div>
+    </div>
+</div>

resources/views/components/section/divider.blade.php

@@ -1 +1 @@
-<div class="h-[1px] bg-secondary-300 w-4/5 sm:w-3/5 mx-auto my-12"></div>
+<div class="h-[1px] bg-secondary-300 w-4/5 sm:w-3/5 mx-auto my-6"></div>

resources/views/components/section/section.blade.php

@@ -1,5 +1,5 @@
 <div
-    {{ $attributes->merge(['class' => 'bg-secondary-300']) }}
+    {{ $attributes->merge(['class' => 'bg-secondary-100']) }}
 >
     {{ $slot }}
 </div>

resources/views/pages/about.blade.php

@@ -1,3 +1,33 @@
 <x-layouts.app>
-    About page
+    <x-section.section class="!bg-gradient-to-tl !from-white !to-primary-50">
+        <x-section.wrapper>
+            <x-section.content>
+                <x-slot name="title">
+                    About Us
+                </x-slot>
+
+                <x-slot name="content">
+                    Framed Just For You was established in 1997 on Oxley Drive. In 2000, the store was relocated to 142 Brisbane Road, where it served the community for the subsequent two decades. A significant move took place in August 2019, bringing the business to its current location at 122 Brisbane Road. With nearly 60 years of collective experience in the picture framing industry, the journey continues.
+                </x-slot>
+            </x-section.content>
+        </x-section.wrapper>
+
+        <x-section.divider />
+
+        <x-section.wrapper>
+            <x-section.content>
+                <x-slot name="title">
+                    Meet the Team
+                </x-slot>
+
+                <x-slot name="content">
+                    <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-4">
+                        @foreach($team as $member)
+                            <x-cards.member.card :member="$member" />
+                        @endforeach
+                    </div>
+                </x-slot>
+            </x-section.content>
+        </x-section.wrapper>
+    </x-section.section>
 </x-layouts.app>

routes/public.php

@@ -12,7 +12,7 @@
 */
 
 Route::get('/new/', \App\Http\Controllers\Public\ShowHomeController::class)->name('new.home');
-Route::get('/new/about', fn () => view('pages/about'))->name('new.about');
+Route::get('/new/about', \App\Http\Controllers\Public\ShowAboutController::class)->name('new.about');
 Route::get('/new/contact', fn () => view('pages/contact'))->name('new.contact');
 Route::get('/new/custom-framing', fn () => view('pages/custom-framing'))->name('new.custom-framing');
 Route::get('/new/printing', fn () => view('pages/printing'))->name('new.printing');