app/View/Components/Bookmark.php

@@ -1,28 +0,0 @@
-<?php
-
-namespace App\View\Components;
-
-use App\Models\Bookmark as ModelsBookmark;
-use Closure;
-use Illuminate\Contracts\View\View;
-use Illuminate\View\Component;
-
-class Bookmark extends Component
-{
-    /**
-     * Create a new component instance.
-     */
-    public function __construct(
-        public ModelsBookmark $bookmark
-    ) {
-        //
-    }
-
-    /**
-     * Get the view / contents that represent the component.
-     */
-    public function render(): View|Closure|string
-    {
-        return view('components.bookmark');
-    }
-}

resources/sass/app.scss

@@ -1,88 +1,22 @@
-* {
-    box-sizing: border-box;
-}
-
-html {
-    margin: 0;
-    padding: 0;
-}
-
 body {
-    margin: 0;
+    font-family: Helvetica, Arial, sans-serif;
-    padding: 0;
+    background-color: hsl(100, 50%, 90%);
-    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI Adjusted", "Segoe UI", "Liberation Sans", sans-serif;
-    background-color: #335C67;
-}
-
-h1 {
-    color: #FFF3B0;
-    text-align: center;
 }
 
 .container {
     max-width: 40rem;
-    margin: 1em auto;
 }
 
 .bookmark {
-    display: grid;
+    padding: 1ex;
-    align-items: center;
-    gap: 0px 0px;
-    grid-template-areas:
-    "title title"
-    "href href"
-    "description description"
-    "date tags";
-
-    margin-bottom: 1em;
-    padding: 0;
-    border: 2px solid #540B0E;
-    background-color: #FFF3B0;
 
     &-title {
-        margin: 0;
+        margin-top: 0;
-        padding: 1ex;
-        background-color: #E09F3E;
-        grid-area: title;
-        font-weight: bold;
-    }
-
-    &-href,
-    &-description,
-    &-date,
-    &-tags {
-        padding: 1ex;
-        margin: 0;
-    }
-
-    &-href,
-    &-description,
-    &-date {
-        font-size: 0.9em;
-    }
-
-    &-href {
-        grid-area: href;
-    }
-
-    &-description {
-        grid-area: description;
-
-        > p {
-            border-left: 3px solid #9E2A2B;
-            margin: 0;
-            padding: 0.5ex 0 0.5ex 1ex;
-        }
-    }
-
-    &-date {
-        grid-area: date;
     }
 
     &-tags {
-        font-size: 0.8em;
+        padding: 0;
-        grid-area: tags;
+        margin: 1em 0;
-        text-align: right;
     }
 
     &-tag {
@@ -92,7 +26,7 @@ h1 {
         margin: 0 0 0.2ex 0;
 
         border-radius: 7px;
-        background-color: #9E2A2B;
+        background-color: hsl(230, 50%, 50%);
-        color: #FFF3B0;
+        color: #fff;
     }
 }

resources/views/bookmarks/index.blade.php

@@ -1,9 +1,5 @@
-@extends('layouts.app')
-
-@section('content')
-
 @foreach ($bookmarks as $bookmark)
-    <x-bookmark :bookmark="$bookmark" />
-@endforeach
 
-@endsection
+@include('bookmarks.show')
+
+@endforeach

resources/views/bookmarks/show.blade.php

@@ -1,5 +1,19 @@
 @extends('layouts.app')
 
 @section('content')
-    <x-bookmark :bookmark="$bookmark" />
+<div class="bookmark">
+    <p class="bookmark-title">{{ $bookmark->title }}</p>
+    <p class="bookmark-href"><a href="{{ $bookmark->href }}">{{ $bookmark->href }}</a></p>
+    @if ($bookmark->description)
+        <p class="bookmark-description">{{ $bookmark->description }}</p>
+    @endif
+    <p>{{ $bookmark->created_at }}</p>
+    <ul class="bookmark-tags">
+        @foreach ($bookmark->tags as $tag)
+            <li class="bookmark-tag">
+                {{ $tag->tag->name }}
+            </li>
+        @endforeach
+    </ul>
+</div>
 @endsection

resources/views/components/bookmark.blade.php

@@ -1,19 +0,0 @@
-<div class="bookmark">
-    <p class="bookmark-title">{{ $bookmark->title }}</p>
-    <p class="bookmark-href"><a href="{{ $bookmark->href }}">{{ $bookmark->href }}</a></p>
-    @if (!empty($bookmark->description))
-        <div class="bookmark-description">
-            <p>{{ strip_tags($bookmark->description) }}</p>
-        </div>
-    @endif
-    <p class="bookmark-date">
-        <time datetime="{{ $bookmark->created_at }}">{{ $bookmark->created_at->diffForHumans() }}</time>
-    </p>
-    <ul class="bookmark-tags">
-        @foreach ($bookmark->tags as $tag)
-            <li class="bookmark-tag">
-                {{ $tag->tag->name }}
-            </li>
-        @endforeach
-    </ul>
-</div>

resources/views/layouts/app.blade.php

@@ -1,12 +1,11 @@
 <!doctype html>
 <html lang="en">
 <head>
-    <title>urlsnail</title>
+    <title>urlslug</title>
     @vite(['resources/sass/app.scss'])
 </head>
 <body>
     <div class="container">
-        <h1>url snail</h1>
         @yield('content')
     </div>
 </body>