nisse/niisse-net
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added links to nav buttons

Browse Source
This commit is contained in:
Nisse Lommerde 2023-06-10 22:58:26 +02:00
parent 73809cb730
commit 29398c8ce2
7 changed files with 72 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
resources/views/about.blade.php Normal file
View File

@ -0,0 +1,3 @@
<x-app-layout>
</x-app-layout>

20
resources/views/components/nav-button.blade.php
View File

@ -1,20 +1,25 @@
@props(['active']) @props(['active', 'route'])
@php @php
$classes = ($active ?? false) $classes = ($active ?? false)
? 'py-1 px-3 bg-zinc-700/75 text-white hover:bg-zinc-700 group pixel-corner-sm active:bg-zinc-900' ? 'py-1 px-3 bg-zinc-700/75 text-white hover:bg-zinc-700 group pixel-corner-sm active:bg-zinc-900'
: 'py-1 px-3 bg-zinc-800 text-white hover:bg-zinc-700 group pixel-corner-sm active:bg-zinc-900' : 'py-1 px-3 bg-zinc-800 text-white hover:bg-zinc-700 group pixel-corner-sm active:bg-zinc-900'
// $classes = ($active ?? false)
// ? 'group-hover:underline text-lime-100 text-shadow-sm shadow-lime-950 font-bold'
// : 'group-hover:underline text-blue-100 text-shadow-sm shadow-blue-950'
@endphp @endphp
<form action="{{$route}}"
<button class=" filter drop-shadow-pixel-sm hover:drop-shadow-pixel-sm-hover shadow-black"> method="get">
<button class="filter drop-shadow-pixel-sm hover:drop-shadow-pixel-sm-hover shadow-black"
type="submit">
<div class="{{$classes}}"> <div class="{{$classes}}">
<div class="flex flex-row"> <div class="flex flex-row {{isset($active) ? 'font-bold' : ''}}">
<div class="text-neutral-200 mr-[3px] text-shadow-sm shadow-zinc-950"> <div class="text-neutral-200 mr-[3px] text-shadow-sm shadow-zinc-950 ">
< <
</div> </div>
<div {{$attributes->merge(['class' => 'group-hover:underline text-shadow-sm'])}}> <div {{$attributes->merge(['class' => 'text-shadow-sm'])}}>
{{ $slot }} {{ $slot }}
</div> </div>
<div class="text-neutral-200 ml-[2px] text-shadow-sm shadow-zinc-950"> <div class="text-neutral-200 ml-[2px] text-shadow-sm shadow-zinc-950">
@ -22,4 +27,5 @@
</div> </div>
</div> </div>
</div> </div>
</button> </button>
</form>

26
resources/views/dashboard.blade.php
View File

@ -6,12 +6,17 @@
<x-outer-card class="md:col-span-2"> <x-outer-card class="md:col-span-2">
<x-inner-card class="h-full"> <x-inner-card class="h-full">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the <p>
industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and Hi! My name is Nisse. I'm a 25-year-old software development student. I created this website to
scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap serve as a small repository and showcase of what I'm up to in my digital life. It's also an excuse to
into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the <span class="line-through">ramble</span> write about some of the (probably at least mildly obscure) things I think a lot about.
release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing </p>
software like Aldus PageMaker including versions of Lorem Ipsum. <br>
<p>
Things I care about include music technology (including - but not limited to - custom samplers and
sequencers) as well as music production, programming, electronics, digital minimalism, Linux,
retro things of all sorts, video production, self-improvement and much more.
</p>
</x-inner-card> </x-inner-card>
</x-outer-card> </x-outer-card>
@ -24,12 +29,15 @@
<x-outer-card class="md:col-span-2"> <x-outer-card class="md:col-span-2">
<x-inner-card> <x-inner-card>
<p>
This website was designed from scratch as an homage to 90's and early 00's web design, perhaps
reminiscent of spaces like GeoCities.
</p>
<br>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the
industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and
scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap
into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the into electronic typesetting, remaining essentially unchanged.
release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing
software like Aldus PageMaker including versions of Lorem Ipsum.
</x-inner-card> </x-inner-card>
</x-outer-card> </x-outer-card>

8
resources/views/home/recent-blog.blade.php
View File

@ -18,7 +18,7 @@
</x-news-item> </x-news-item>
</li> </li>
<li> <li>
<x-news-item class="text-green-300" <x-news-item class="text-lime-300"
date="2023-06-07" date="2023-06-07"
link="#" link="#"
link_name="blog" link_name="blog"
@ -26,7 +26,7 @@
</x-news-item> </x-news-item>
</li> </li>
<li> <li>
<x-news-item class="text-green-400" <x-news-item class="text-lime-400"
date="2023-06-05" date="2023-06-05"
link="#" link="#"
link_name="blog" link_name="blog"
@ -34,7 +34,7 @@
</x-news-item> </x-news-item>
</li> </li>
<li> <li>
<x-news-item class="text-green-500" <x-news-item class="text-lime-500"
date="2023-06-02" date="2023-06-02"
link="#" link="#"
link_name="blog" link_name="blog"
@ -42,7 +42,7 @@
</x-news-item> </x-news-item>
</li> </li>
<li> <li>
<x-news-item class="text-green-600" <x-news-item class="text-lime-600"
date="2023-06-02" date="2023-06-02"
link="#" link="#"
link_name="blog" link_name="blog"

6
resources/views/home/title-banner.blade.php
View File

@ -1,8 +1,8 @@
<x-outer-card> <x-outer-card class="select-none">
<x-inner-card> <x-inner-card>
<div class="filter drop-shadow-pixel-lg shadow-black/75"> <div class="filter drop-shadow-pixel-lg shadow-black/75">
<div class="filter drop-shadow-pixel-lg shadow-blue-400/80"> <div class="filter drop-shadow-pixel-lg shadow-blue-400/80 hover:shadow-blue-600/80">
<h1 class="text-6xl uppercase text-center font-bold text-red-500/50 text-shadow-md shadow-yellow-600"> <h1 class="text-6xl uppercase text-center font-bold text-red-400/70 text-shadow-md shadow-blue-300 hover:text-red-300/70">
<< niisse.net >> << niisse.net >>
</h1> </h1>
</div> </div>

23
resources/views/layouts/navigation.blade.php
View File

@ -4,14 +4,29 @@
<div class="flex flex-row gap-x-2 text-xl font-ibm whitespace-nowrap"> <div class="flex flex-row gap-x-2 text-xl font-ibm whitespace-nowrap">
<x-nav-button class="text-red-400 shadow-red-950" <x-nav-button class="text-red-400 shadow-red-950"
:route="route('dashboard')"
:active="request()->routeIs('dashboard')">Home :active="request()->routeIs('dashboard')">Home
</x-nav-button> </x-nav-button>
<x-nav-button class="text-yellow-300 shadow-yellow-950">About Me</x-nav-button> <x-nav-button class="text-yellow-400 shadow-yellow-950"
<x-nav-button class="text-green-300 shadow-green-950">Projects</x-nav-button> :route="route('about')"
<x-nav-button class="text-blue-400 shadow-blue-950">Blog</x-nav-button> :active="request()->routeIs('about')">About Me
</x-nav-button>
<x-nav-button class="text-lime-400 shadow-lime-950"
:route="route('dashboard')"
:active="request()->routeIs('projects')"
>Projects
</x-nav-button>
<x-nav-button class="text-blue-400 shadow-blue-950"
:route="route('dashboard')"
:active="request()->routeIs('blog')"
>Blog
</x-nav-button>
<div class="ml-auto hidden md:flex"> <div class="ml-auto hidden md:flex">
<x-nav-button class="text-zinc-200 text-shadow-sm shadow-zinc-950">niisse.net</x-nav-button> <x-nav-button class="text-zinc-200 shadow-zinc-950"
:route="route('dashboard')"
>niisse.net
</x-nav-button>
</div> </div>
</div> </div>
</div> </div>

5
routes/web.php
View File

@ -21,6 +21,11 @@
Route::get('/', function () { Route::get('/', function () {
return view('dashboard'); return view('dashboard');
})->name('dashboard'); })->name('dashboard');
Route::get('/about', function () {
return view('about');
})->name('about');
// ->middleware(['auth', 'verified'])->name('dashboard'); // ->middleware(['auth', 'verified'])->name('dashboard');
//Route::middleware('auth')->group(function () { //Route::middleware('auth')->group(function () {