minor frontend updates

mortenebak · Nov 1, 2024 · 6eadac7 · 6eadac7
1 parent 376b8b3
commit 6eadac7
Show file tree

Hide file tree

Showing 49 changed files with 3,472 additions and 2,096 deletions.
diff --git a/lang/en/plans.php b/lang/en/plans.php
@@ -1,6 +1,7 @@
 <?php
 
 return [
+    'plans' => 'Plans',
     'edit_plan' => 'Edit plan',
     'delete_plan' => 'Delete plan',
     'confirm_deletion' => 'Are you sure you want to delete this plan?',

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,22 +1,24 @@
 {
     "private": true,
+    "type": "module",
     "scripts": {
         "dev": "vite",
         "build": "vite build",
         "prod": "vite build"
     },
     "devDependencies": {
+        "@defstudio/vite-livewire-plugin": "^2.0.5",
         "@tailwindcss/forms": "^0.5",
         "@tailwindcss/typography": "^0.5",
         "alpinejs": "^3.8",
         "autoprefixer": "^10.4",
-        "laravel-vite-plugin": "^0.7.2",
+        "laravel-vite-plugin": "^1.0",
         "postcss": "^8.4.31",
-        "resolve-url-loader": "^3.1",
+        "resolve-url-loader": "^5.0",
         "sass": "^1.3",
         "sass-loader": "^8.0",
-        "tailwindcss": "^3.0",
-        "vite": "^4.0.5"
+        "tailwindcss": "^3.4",
+        "vite": "^5.4"
     },
     "dependencies": {
         "@alpinejs/collapse": "^3.10.5",

diff --git a/postcss.config.js b/postcss.config.js
@@ -1,4 +1,4 @@
-module.exports = {
+export default {
     plugins: {
         tailwindcss: {},
         autoprefixer: {},

diff --git a/resources/views/account/index.blade.php b/resources/views/account/index.blade.php
@@ -2,8 +2,8 @@
 @section('title', 'Account')
 
 @section('content')
-    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
-        <div class="p-6 bg-white border-b border-gray-200">
+    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg border border-stone-200">
+        <div class="p-6">
             {{ __('Account') }}
         </div>
     </div>

diff --git a/resources/views/account/subscriptions/cancel.blade.php b/resources/views/account/subscriptions/cancel.blade.php
@@ -3,8 +3,8 @@
 
 @section('content')
     @include('components.dashboard.subscription-nav')
-   <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
-       <div class="p-6 bg-white border-b border-gray-200 prose max-w-none">
+   <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg border border-stone-200">
+       <div class="p-6 prose max-w-none">
            <h2>
                 Cancel Subscription
            </h2>

diff --git a/resources/views/account/subscriptions/card.blade.php b/resources/views/account/subscriptions/card.blade.php
@@ -3,8 +3,8 @@
 
 @section('content')
     @include('components.dashboard.subscription-nav')
-    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
-        <div class="p-6 bg-white border-b border-gray-200 prose max-w-none">
+    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg border border-stone-200">
+        <div class="p-6 prose max-w-none">
             <h2>
                 Update Creditcard Details
             </h2>

diff --git a/resources/views/account/subscriptions/coupon.blade.php b/resources/views/account/subscriptions/coupon.blade.php
@@ -3,8 +3,8 @@
 
 @section('content')
     @include('components.dashboard.subscription-nav')
-    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
-        <div class="p-6 bg-white border-b border-gray-200 prose max-w-none">
+    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg border border-stone-200">
+        <div class="p-6 prose max-w-none">
             <h2>
                 Apply a Coupon
             </h2>

diff --git a/resources/views/account/subscriptions/index.blade.php b/resources/views/account/subscriptions/index.blade.php
@@ -3,8 +3,8 @@
 
 @section('content')
     @include('components.dashboard.subscription-nav')
-    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
-        <div class="p-6 bg-white border-b border-gray-200 prose max-w-none">
+    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg border border-stone-200">
+        <div class="p-6 prose max-w-none">
             <h2>
                 Subscription overview
             </h2>
@@ -51,7 +51,9 @@
                     <p>You don't have a subscription. </p>
                     <a href="{{ route('subscriptions.plans') }}">
                         <x-button>
-                            Go check out our available plans
+
+                            <span>Go check out our available plans</span>
+                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>
                         </x-button>
                     </a>
                 </div>

diff --git a/resources/views/account/subscriptions/invoices.blade.php b/resources/views/account/subscriptions/invoices.blade.php
@@ -3,8 +3,8 @@
 
 @section('content')
     @include('components.dashboard.subscription-nav')
-    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
-        <div class="p-6 bg-white border-b border-gray-200 prose max-w-none">
+    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg border border-stone-200">
+        <div class="p-6 prose max-w-none">
             <h2>
                 Invoices
             </h2>

diff --git a/resources/views/account/subscriptions/resume.blade.php b/resources/views/account/subscriptions/resume.blade.php
@@ -3,8 +3,8 @@
 
 @section('content')
     @include('components.dashboard.subscription-nav')
-    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
-        <div class="p-6 bg-white border-b border-gray-200 prose max-w-none">
+    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg border border-stone-200">
+        <div class="p-6 prose max-w-none">
             <h2>
                 Resume your subscription
             </h2>

diff --git a/resources/views/account/subscriptions/swap.blade.php b/resources/views/account/subscriptions/swap.blade.php
@@ -3,8 +3,8 @@
 
 @section('content')
     @include('components.dashboard.subscription-nav')
-    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
-        <div class="p-6 bg-white border-b border-gray-200 prose max-w-none">
+    <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg border border-stone-200">
+        <div class="p-6 prose max-w-none">
             <h2>
                 Upgrade or downgrade your subscription
             </h2>

diff --git a/resources/views/components/admin-navigation.blade.php b/resources/views/components/admin-navigation.blade.php
@@ -6,7 +6,7 @@
                href="{{ route('admin.dashboard') }}">
                 <div class="flex items-center">
                     <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
-                         stroke="currentColor" class="dark:text-gray-400 w-6 h-6">
+                         stroke="currentColor" class="dark:text-stone-400 w-6 h-6">
                         <path stroke-linecap="round" stroke-linejoin="round"
                               d="M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25"/>
                     </svg>
@@ -24,7 +24,7 @@
                 <div class="flex w-full items-center justify-between">
                     <div class="flex items-center">
                         <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
-                             stroke="currentColor" class="dark:text-gray-400 w-6 h-6">
+                             stroke="currentColor" class="dark:text-stone-400 w-6 h-6">
                             <path stroke-linecap="round" stroke-linejoin="round"
                                   d="M15 19.128a9.38 9.38 0 002.625.372 9.337 9.337 0 004.121-.952 4.125 4.125 0 00-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 018.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0111.964-3.07M12 6.375a3.375 3.375 0 11-6.75 0 3.375 3.375 0 016.75 0zm8.25 2.25a2.625 2.625 0 11-5.25 0 2.625 2.625 0 015.25 0z"/>
                         </svg>
@@ -86,7 +86,7 @@ class="px-3 py-[2px] block text-text dark:text-slate-200 rounded truncate hover:
             <a wire:navigate aria-current="page" class="flex p-2 rounded dark:hover:bg-gray-700 "
                href="{{ route('admin.plans') }}">
                 <div class="flex items-center">
-                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="dark:text-gray-400 w-6 h-6">
+                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="dark:text-stone-400 w-6 h-6">
                         <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 18.75a60.07 60.07 0 0115.797 2.101c.727.198 1.453-.342 1.453-1.096V18.75M3.75 4.5v.75A.75.75 0 013 6h-.75m0 0v-.375c0-.621.504-1.125 1.125-1.125H20.25M2.25 6v9m18-10.5v.75c0 .414.336.75.75.75h.75m-1.5-1.5h.375c.621 0 1.125.504 1.125 1.125v9.75c0 .621-.504 1.125-1.125 1.125h-.375m1.5-1.5H21a.75.75 0 00-.75.75v.75m0 0H3.75m0 0h-.375a1.125 1.125 0 01-1.125-1.125V15m1.5 1.5v-.75A.75.75 0 003 15h-.75M15 10.5a3 3 0 11-6 0 3 3 0 016 0zm3 0h.008v.008H18V10.5zm-12 0h.008v.008H6V10.5z" />
                     </svg>
                     <div class="font-medium ml-3 duration-200">

diff --git a/resources/views/components/button.blade.php b/resources/views/components/button.blade.php
@@ -1,3 +1,3 @@
-<button {{ $attributes->merge(['type' => 'submit', 'class' => 'text-white bg-primary-700 hover:bg-primary-800 focus:ring-4 focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 mb-2 dark:bg-primary-600 dark:hover:bg-primary-700 focus:outline-none dark:focus:ring-primary-800']) }}>
+<button {{ $attributes->merge(['type' => 'submit', 'class' => 'inline-flex items-center space-x-2 text-white bg-primary-700 hover:bg-primary-800 focus:ring-4 focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 mr-2 mb-2 dark:bg-primary-600 dark:hover:bg-primary-700 focus:outline-none dark:focus:ring-primary-800']) }}>
     {{ $slot }}
 </button>
diff --git a/resources/views/components/dashboard/subscription-nav.blade.php b/resources/views/components/dashboard/subscription-nav.blade.php
@@ -1,4 +1,4 @@
-<section id="dashboard-nav" class="bg-white overflow-hidden mb-5 shadow-sm sm:rounded-lg">
+<section id="dashboard-nav" class="bg-white overflow-hidden mb-5 shadow-sm sm:rounded-lg border border-stone-200">
     <div class="max-w-7xl mx-auto px-6">
         <nav class="flex h-14 items-center space-x-4">
 

diff --git a/resources/views/components/label.blade.php b/resources/views/components/label.blade.php
@@ -1,5 +1,5 @@
 @props(['value'])
 
-<label {{ $attributes->merge(['class' => 'block font-bold text-sm text-gray-700 mb-1']) }}>
+<label {{ $attributes->merge(['class' => 'block font-bold text-sm text-stone-700 mb-1']) }}>
     {{ $value ?? $slot }}
 </label>
diff --git a/resources/views/components/notification.blade.php b/resources/views/components/notification.blade.php
@@ -11,7 +11,7 @@ class="fixed inset-0 flex px-4 py-6 items-start pointer-events-none z-50"
                 <div class="ml-2 w-0 flex-1 text-white" x-text="body">
 
                 </div>
-                <button class="inflex-flex text-gray-400"
+                <button class="inflex-flex text-stone-400"
                     x-on:click="body = ''">
                     <span class="sr-only">Close</span>
                     <span class="text-2xl">&times;</span>

diff --git a/resources/views/components/secondary-button.blade.php b/resources/views/components/secondary-button.blade.php
@@ -1,3 +1,3 @@
-<button {{ $attributes->merge(['type' => 'submit', 'class' => 'py-2.5 px-5 mr-2 mb-2 text-sm font-medium text-gray-900 focus:outline-none bg-white rounded-lg border border-gray-200 hover:bg-gray-100 hover:text-primary-700 focus:z-10 focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 dark:bg-gray-800 dark:text-gray-400 dark:border-gray-600 dark:hover:text-white dark:hover:bg-gray-700']) }}>
+<button {{ $attributes->merge(['type' => 'submit', 'class' => 'py-2.5 px-5 mr-2 mb-2 text-sm font-medium text-stone-900 focus:outline-none bg-white rounded-lg border border-gray-200 hover:bg-gray-100 hover:text-primary-700 focus:z-10 focus:ring-4 focus:ring-gray-200 dark:focus:ring-gray-700 dark:bg-gray-800 dark:text-stone-400 dark:border-gray-600 dark:hover:text-white dark:hover:bg-gray-700']) }}>
     {{ $slot }}
 </button>
diff --git a/resources/views/components/table.blade.php b/resources/views/components/table.blade.php
@@ -1,7 +1,7 @@
 <div class="shadow overflow-hidden sm:rounded-lg mb-6">
-    <table class="min-w-full w-full text-gray-500 dark:text-gray-400">
+    <table class="min-w-full w-full text-stone-500 dark:text-stone-400">
 
-        <thead class="text-xs text-gray-700 uppercase bg-gray-200 dark:bg-gray-700 dark:text-gray-400">
+        <thead class="text-xs text-stone-700 uppercase bg-gray-200 dark:bg-gray-700 dark:text-stone-400">
             <tr>
                 {{ $head }}
             </tr>

diff --git a/resources/views/layouts/admin.blade.php b/resources/views/layouts/admin.blade.php
@@ -5,8 +5,8 @@
     <div class="md:flex md:flex-col md:h-screen" x-data="{mobileOpen: false}">
         <div class="md:flex md:flex-shrink-0">
             <div class="flex items-center justify-between px-6 py-4 bg-main dark:bg-gray-900 md:flex-shrink-0 md:justify-center md:w-56">
-                <a class="mt-1 font-bold text-white dark:text-slate-200 uppercase" href="/">
-                    {{ config('app.name') }}
+                <a class="mt-1 font-medium text-white dark:text-slate-200 uppercase" href="/">
+                    Administration
                 </a>
                 <button type="button" class="md:hidden" x-on:click="mobileOpen = !mobileOpen">
                     <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-8 h-8">
@@ -25,12 +25,11 @@
                     <svg x-cloak x-show="!darkMode" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
                         <path stroke-linecap="round" stroke-linejoin="round" d="M21.752 15.002A9.718 9.718 0 0118 15.75c-5.385 0-9.75-4.365-9.75-9.75 0-1.33.266-2.597.748-3.752A9.753 9.753 0 003 11.25C3 16.635 7.365 21 12.75 21a9.753 9.753 0 009.002-5.998z" />
                     </svg>
-
                 </button>
                 <div x-data="{dropdownMenu: false}" class="relative ml-auto" @click.outside="dropdownMenu = false" @keyup.escape.window="dropdownMenu = false">
                     <button type="button" class="mt-1" @click="dropdownMenu = ! dropdownMenu">
                         <div class="group flex items-center cursor-pointer select-none">
-                            <div class="mr-1 text-gray-500 dark:text-slate-200 hover:text-gray-900 group-hover:text-primary focus:text-primary whitespace-nowrap">
+                            <div class="mr-1 text-stone-500 dark:text-slate-200 hover:text-stone-900 group-hover:text-primary focus:text-primary whitespace-nowrap">
                                 <span>{{ auth()->user()->name }}</span>
                             </div>
                             <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" class="w-5 h-5 fill-gray-500 group-hover:fill-gray-900 group-hover:fill-primary focus:fill-primary">
@@ -40,13 +39,13 @@
                     </button>
                     <!-- Dropdown list -->
                     <div x-show="dropdownMenu" x-transition="" class="absolute top-6 right-0 p-2 mt-2 bg-white border border-gray-200 rounded-md overflow-hidden shadow-lg w-56 space-y-2" style="z-index: 51; display: none;">
-                        <a wire:navigate href="{{ route('admin.profile.edit') }}" class="flex space-x-2 items-center p-2 text-sm text-gray-500 hover:text-gray-900 hover:bg-secondary hover:text-primary rounded-md transition ease-in-out">
+                        <a wire:navigate href="{{ route('admin.profile.edit') }}" class="flex space-x-2 items-center p-2 text-sm text-stone-500 hover:text-stone-900 hover:bg-secondary hover:text-primary rounded-md transition ease-in-out">
                             <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
                                 <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z"></path>
                             </svg>
                             <span>Edit Account</span>
                         </a>
-                        <a wire:navigate href="{{ route('admin.change-password') }}" class="flex space-x-2 items-center p-2 text-sm text-gray-500 hover:text-gray-900 hover:bg-secondary hover:text-primary rounded-md transition ease-in-out">
+                        <a wire:navigate href="{{ route('admin.change-password') }}" class="flex space-x-2 items-center p-2 text-sm text-stone-500 hover:text-stone-900 hover:bg-secondary hover:text-primary rounded-md transition ease-in-out">
                             <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
                                 <path stroke-linecap="round" stroke-linejoin="round"
                                       d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.324.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 011.37.49l1.296 2.247a1.125 1.125 0 01-.26 1.431l-1.003.827c-.293.24-.438.613-.431.992a6.759 6.759 0 010 .255c-.007.378.138.75.43.99l1.005.828c.424.35.534.954.26 1.43l-1.298 2.247a1.125 1.125 0 01-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.57 6.57 0 01-.22.128c-.331.183-.581.495-.644.869l-.213 1.28c-.09.543-.56.941-1.11.941h-2.594c-.55 0-1.02-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 01-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 01-1.369-.49l-1.297-2.247a1.125 1.125 0 01.26-1.431l1.004-.827c.292-.24.437-.613.43-.992a6.932 6.932 0 010-.255c.007-.378-.138-.75-.43-.99l-1.004-.828a1.125 1.125 0 01-.26-1.43l1.297-2.247a1.125 1.125 0 011.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.087.22-.128.332-.183.582-.495.644-.869l.214-1.281z"></path>
@@ -56,7 +55,7 @@
                         </a>
                         <hr>
                         <a href="{{ route('logout') }}" onclick="event.preventDefault(); document.getElementById('logout-form').submit();"
-                           class="flex space-x-2 items-center p-2 text-sm text-gray-500 hover:text-gray-900 hover:bg-secondary hover:text-primary rounded-md transition ease-in-out">
+                           class="flex space-x-2 items-center p-2 text-sm text-stone-500 hover:text-stone-900 hover:bg-secondary hover:text-primary rounded-md transition ease-in-out">
                             <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
                                 <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15M12 9l-3 3m0 0l3 3m-3-3h12.75"></path>
                             </svg>
@@ -75,14 +74,11 @@ class="flex space-x-2 items-center p-2 text-sm text-gray-500 hover:text-gray-900
                 <x-admin-navigation></x-admin-navigation>
             </div>
             <div class="px-4 pt-8 pb-16 md:flex-1 md:px-10 md:overflow-y-auto bg-main-white dark:bg-gray-800 ">
-
                 @yield('content')
 
                 @isset($slot)
                     {{ $slot }}
                 @endisset
-
-
             </div>
         </div>
     </div>

diff --git a/resources/views/livewire/admin/dashboard.blade.php b/resources/views/livewire/admin/dashboard.blade.php
@@ -1,6 +1,6 @@
 <div>
     <div class="flex justify-between items-center mb-5 h-10">
-        <h1 class="text-3xl font-bold dark:text-gray-200">
+        <h1 class="text-3xl font-bold dark:text-stone-200">
             {{ __('Dashboard') }}
         </h1>
         <div>

diff --git a/resources/views/livewire/admin/permissions/create-permission.blade.php b/resources/views/livewire/admin/permissions/create-permission.blade.php
@@ -5,11 +5,11 @@
     </h2>
 
     <div class="form-group">
-        <label for="name" class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
+        <label for="name" class="block mb-2 text-sm font-medium text-stone-900 dark:text-white">
             {{ __('Name') }}
         </label>
         <input id="name" wire:model.live="name" type="text"
-               class="@error('name') is-invalid @enderror bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
+               class="@error('name') is-invalid @enderror bg-gray-50 border border-gray-300 text-stone-900 text-sm rounded-lg focus:ring-primary-500 focus:border-primary-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
                placeholder="Enter name" required>
         @error('name') <span class="text-danger">{{ $message }}</span>@enderror
     </div>