feat: add Sniglet font and update styles

- Added Google Fonts preconnect links and imported the Sniglet font in the public layout. - Updated heading styles in public.scss to use the Sniglet font. - Removed unnecessary font-weight from heading in the public index view.

feat: add Sniglet font and update styles
f6f7141d · Sofiane Lasri · d44d265e · f6f7141d · f6f7141d · f6f7141d
Verified Commit f6f7141d authored 3 months ago by Sofiane Lasri
--- a/resources/scss/public.scss
+++ b/resources/scss/public.scss
@@ -3,6 +3,10 @@
 @tailwind utilities;
 @import "fonts";

+h1, h2, h3, h4, h5, h6 {
+    font-family: "Sniglet", serif;
+}
+
 .markdown {
    * {
        @apply mb-4;

--- a/resources/views/layouts/public.blade.php
+++ b/resources/views/layouts/public.blade.php
@@ -5,9 +5,6 @@
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ !empty($title) ? $title . ' - Rann Graphic Design' : 'Rann Graphic Design' }}</title>
    <link rel="icon" type="image/svg+xml" href="{{ asset('favicon.svg') }}"/>
-    <link rel="preconnect" href="https://fonts.googleapis.com">
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    @vite(['resources/scss/public.scss', 'resources/js/app.js'])

    <meta property="og:locale" content="{{ config('app.locale') }}">
    <meta property="og:locale:alternate" content="{{ config('app.fallback_locale') }}">
@@ -24,6 +21,11 @@
        <meta property="og:image:width" content="{{ $image->width }}">
        <meta property="og:image:height" content="{{ $image->height }}">
    @endif
+
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Sniglet:wght@400;800&display=swap" rel="stylesheet">
+    @vite(['resources/scss/public.scss', 'resources/js/app.js'])
 </head>
 <body>
 @yield('content')

--- a/resources/views/public/index.blade.php
+++ b/resources/views/public/index.blade.php
@@ -21,7 +21,7 @@ class="absolute hidden 2xl:block left-[-96px] top-[-26px] origin-top-left rotate
                                    </span>
                                    <x-public.arrow class="hidden xl:block w-28 h-9"/>
                                </span>
-                                <span class="text-5xl xl:text-6xl font-bold">
+                                <span class="text-5xl xl:text-6xl">
                                    {{ __('home.hero.second_row') }}
                                </span>
                            </h1>