💄

#1033
realodix · Dec 30, 2024 · ef1e03b · ef1e03b
1 parent 7e87c06
commit ef1e03b
Show file tree

Hide file tree

Showing 21 changed files with 87 additions and 92 deletions.
diff --git a/app/Livewire/Table/UserTable.php b/app/Livewire/Table/UserTable.php
@@ -58,12 +58,12 @@ public function fields(): PowerGridFields
             ->add('action', function (User $user) {
                 return
                     '<a role="button" href="' . route('user.edit', $user) . '" title="' . __('Details') . '"
-                        class="btn btn-secondary btn-xs"
+                        class="btn btn-primary btn-xs"
                     >'
                         . Blade::render('@svg(\'icon-person-edit\')') .
                     '</a>
                     <a role="button" href="' . route('user.password.show', $user) . '" title="' . __('Change Password') . '"
-                        class="btn btn-secondary btn-xs"
+                        class="btn btn-primary btn-xs"
                     >'
                         . Blade::render('@svg(\'icon-key\')') .
                     '</a>';

diff --git a/resources/css/base.css b/resources/css/base.css
@@ -14,7 +14,7 @@ main {
 }
 
 .frontend, .backend, .auth {
-    @apply bg-gray-50 font-sans text-gray-900 antialiased;
+    @apply bg-gray-50 font-sans text-slate-900 antialiased;
 }
 
 .logo {
@@ -40,7 +40,7 @@ main {
 }
 
 hr {
-    @apply !border-uh-border-color;
+    @apply !border-border-200;
 }
 
 /*
@@ -70,18 +70,13 @@ hr {
 
 .btn {
     @apply inline-flex items-center justify-center px-4 h-10 min-h-10 ;
-    @apply border rounded-md border-gray-300 duration-300 ease-out cursor-pointer select-none disabled:opacity-25;
+    @apply border rounded-md border-border-300 duration-300 ease-out cursor-pointer select-none disabled:opacity-25;
     @apply text-base font-normal text-center no-underline align-middle tracking-wide;
     /* box-shadow: 0px 1.6px 2px rgba(0,0,0,0.13), 0px 0px 2px rgba(0,0,0,0.11) !important;
     transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; */
 
     &-primary {
-        @apply bg-gray-100 text-black border-gray-300;
-        @apply hover:bg-gray-200 active:bg-gray-100;
-    }
-
-    &-secondary {
-        @apply bg-gray-100 border-gray-200;
+        @apply bg-gray-100 border-border-300;
         @apply hover:bg-gray-200 active:bg-gray-100;
     }
 
@@ -110,7 +105,7 @@ hr {
 
 .--card-style {
     @apply bg-white;
-    @apply border-y border-uh-border-color shadow-sm;
+    @apply border-y border-border-200 shadow-sm;
     @apply sm:border sm:shadow-sm sm:rounded-lg;
 }
 
@@ -120,11 +115,11 @@ hr {
     /* @apply sm:shadow-[0_1px_2px_#e5e5e8]; */
 
     .card_header {
+        @apply border-b border-border-200;
         color: #1f2328;
         font-size: 1.5rem;
         font-weight: 600;
         line-height: 1.25;
-        border-bottom: 1px solid #e6e6e6;
         padding-bottom: 0.5rem;
     }
 
@@ -161,10 +156,10 @@ hr {
 
 .form-input {
     @apply block w-full;
-    @apply border-uh-border-color focus:ring-0 focus:border-primary-500 rounded;
-    @apply bg-gray-50 focus:bg-white;
+    @apply border-border-300 focus:ring-0 focus:border-indigo-500 rounded;
+    @apply bg-[#fdfdfd] focus:bg-white;
 
     &[disabled], &:disabled {
-        @apply bg-gray-300 text-gray-700 bg-opacity-50 text-opacity-50;
+        @apply bg-gray-300 text-slate-700 bg-opacity-50 text-opacity-50;
     }
 }
diff --git a/resources/css/main.css b/resources/css/main.css
@@ -1,8 +1,8 @@
 @import 'base.css';
 
 .navbar {
-    @apply bg-white text-primary-800;
-    @apply border-b border-uh-border-color;
+    @apply bg-white text-indigo-800;
+    @apply border-b border-border-200;
 
     &-brand {
         @apply flex items-center text-4xl;
@@ -13,30 +13,30 @@
     }
 
     .nav-item {
-        @apply text-sm text-gray-700 hover:bg-primary-50 hover:text-primary-800 focus:bg-slate-100 leading-5;
+        @apply text-sm text-slate-800 hover:bg-gray-100 focus:bg-slate-100 leading-5;
         @apply block px-4 py-2 focus:outline-none transition;
     }
 }
 
 .navbar-mobile {
     .nav-item {
-        @apply text-gray-700;
+        @apply text-slate-800;
         @apply block pl-3 pr-4 py-2 font-medium transition;
 
         &-username {
             @apply font-semibold;
         }
 
         &-email {
-            @apply text-gray-500 font-medium text-sm;
+            @apply text-slate-500 font-medium text-sm;
         }
     }
 }
 
 
 #power-grid-table-base {
     div:has(> div > table) {
-        @apply border-uh-border-color;
+        @apply border-border-200;
         scrollbar-width: thin;
     }
 
@@ -52,31 +52,31 @@
         }
 
         td {
-            @apply border border-uh-border-color;
+            @apply border border-border-200;
             @apply first:border-l-0 last:border-r-0;
         }
     }
 
-    input, select {
-        @apply focus:ring-primary-500 focus-within:focus:ring-primary-500 focus-within:ring-primary-500 focus-within:ring-1;
+    input, select, button {
+        @apply ring-border-200 focus:ring-indigo-500 focus-within:focus:ring-indigo-500 focus-within:ring-indigo-500 focus-within:ring-1;
     }
 
     button[data-cy^="toggle-columns-"] {
-        @apply bg-gray-100 border-gray-200 hover:bg-gray-200 active:bg-gray-100 focus-within:ring-1;
+        @apply bg-gray-100 hover:bg-gray-200 active:bg-gray-100 focus-within:ring-1;
         @apply duration-300 ease-out;
 
         svg {
-            @apply text-gray-800;
+            @apply text-slate-800;
         }
     }
 
     nav[aria-label="Pagination Navigation"] {
         span, a {
-            @apply !border-uh-border-color;
+            @apply border-border-200;
         }
 
         span {
-            @apply bg-primary-50 text-primary-700;
+            @apply bg-gray-100 text-slate-800;
             @apply first:rounded-l-md last:rounded-r-md;
         }
 
@@ -88,6 +88,10 @@
             border-left: none;
         }
     }
+
+    #pg-footer {
+        @apply border-border-200;
+    }
 }
 
 

diff --git a/resources/svg/person-edit.svg b/resources/svg/person-edit.svg
diff --git a/resources/views/auth/forgot-password.blade.php b/resources/views/auth/forgot-password.blade.php
@@ -26,7 +26,7 @@
 
     <div class="auth-card">
         <p class="font-bold">{{ __('Forgot your password? No problem.') }}
-        <p class="text-gray-600">
+        <p class="text-slate-600">
             {{ __('Just let us know your email address and we will email you a password reset link that will allow you to choose a new one.') }}
         </p>
 

diff --git a/resources/views/auth/verify-email.blade.php b/resources/views/auth/verify-email.blade.php
@@ -16,10 +16,10 @@
         <p class="font-bold">
             {{ __('Thanks for signing up!') }}
         </p>
-        <p class="text-gray-600">
+        <p class="text-slate-600">
             {{ __('Before getting started, could you verify your email address by clicking on the link we just emailed to you?') }}
         </p>
-        <p class="text-gray-600">
+        <p class="text-slate-600">
             {{ __('If you didn\'t receive the email, we will gladly send you another.') }}
         </p>
     </div>

diff --git a/resources/views/backend/about.blade.php b/resources/views/backend/about.blade.php
@@ -10,7 +10,7 @@
             <div class="flex flex-row space-x-4 items-center">
                 <div>
                     <p class="text-[#4f5b93] text-sm font-medium leading-4">PHP</p>
-                    <p class="text-2xl font-bold text-gray-600 inline-flex items-center space-x-2">
+                    <p class="text-2xl font-bold text-slate-600 inline-flex items-center space-x-2">
                         {{ phpversion() }}
                     </p>
                 </div>
@@ -20,7 +20,7 @@
             <div class="flex flex-row space-x-4 items-center">
                 <div>
                     <p class="text-[#ff2d20] text-sm font-medium leading-4">Laravel</p>
-                    <p class="text-2xl font-bold text-gray-600 inline-flex items-center space-x-2">
+                    <p class="text-2xl font-bold text-slate-600 inline-flex items-center space-x-2">
                         {{ app()->version() }}
                     </p>
                 </div>
@@ -107,7 +107,7 @@
 
             <dt class="mt-2"><code>domain_blacklist</code></dt>
             <dd class="mt-2">
-                <div class="bg-gray-50 p-2 border border-gray-300 rounded text-sm">
+                <div class="bg-gray-50 p-2 border border-border-300 rounded text-sm">
                     @if (!empty($domainBlacklist))
                         <code>{{ implode(", ", $domainBlacklist) }}</code>
                     @else
@@ -118,8 +118,8 @@
 
             <dt class="mt-2 mb-2">Reserved Keywords</dt>
             <dd class="mt-2 mb-2">
-                <div class="bg-gray-50 p-2 border border-gray-300 rounded text-sm">
-                    <code class="text-gray-500">// {{ $reservedKeyword->count() }} Strings</code> <br>
+                <div class="bg-gray-50 p-2 border border-border-300 rounded text-sm">
+                    <code class="text-slate-500">// {{ $reservedKeyword->count() }} Strings</code> <br>
                     <code>{{ $reservedKeyword->implode(', ') }}</code>
 
                     @if (!empty($reservedActiveKeyList))

diff --git a/resources/views/backend/dashboard.blade.php b/resources/views/backend/dashboard.blade.php
@@ -8,8 +8,8 @@
             <div class="flex flex-row space-x-4 items-center">
                 @svg('icon-link', 'mr-1.5 text-emerald-600 text-3xl')
                 <div>
-                    <p class="text-gray-400 text-sm font-medium uppercase leading-4">Total Links</p>
-                    <p class="text-2xl font-bold text-gray-900 inline-flex items-center space-x-2">
+                    <p class="text-slate-400 text-sm font-medium uppercase leading-4">Total Links</p>
+                    <p class="text-2xl font-bold text-slate-900 inline-flex items-center space-x-2">
                         {{ n_abb($url->currentUserUrlCount(auth()->id())) }}
                     </p>
                 </div>
@@ -19,8 +19,8 @@
             <div class="flex flex-row space-x-4 items-center">
                 @svg('icon-chart-line-alt', 'mr-1.5 text-amber-600 text-3xl')
                 <div>
-                    <p class="text-gray-400 text-sm font-medium uppercase leading-4">Total Clicks</p>
-                    <p class="text-2xl font-bold text-gray-900 inline-flex items-center space-x-2">
+                    <p class="text-slate-400 text-sm font-medium uppercase leading-4">Total Clicks</p>
+                    <p class="text-2xl font-bold text-slate-900 inline-flex items-center space-x-2">
                         {{ $urlVisitCount }}
                     </p>
                 </div>
@@ -31,7 +31,7 @@
     <div class="card-default">
         <div class="card_header__v2">
             <div class="w-1/2">
-                <span class="text-2xl text-black">{{ __('My URLs') }}</span>
+                <span class="text-2xl text-slate-800">{{ __('My URLs') }}</span>
             </div>
             <div class="w-1/2 text-right">
                 <a href="{{ url('./') }}" target="_blank" title="{{ __('Add URL') }}" class="btn btn-primary">

diff --git a/resources/views/backend/edit.blade.php b/resources/views/backend/edit.blade.php
@@ -34,7 +34,7 @@
                 <div class="grid grid-cols-6 gap-6">
                     <div class="col-span-6 lg:col-span-4">
                         <label for="short-url" class="form-label">{{ __('Short URL') }}</label>
-                        <span class="short-url text-primary-500">{{ urlFormat($url->short_url, scheme: false) }}</span>
+                        <span class="short-url text-indigo-500">{{ urlFormat($url->short_url, scheme: false) }}</span>
                     </div>
 
                     <div class="col-span-6">

diff --git a/resources/views/backend/url-list-of-guest.blade.php b/resources/views/backend/url-list-of-guest.blade.php
@@ -7,7 +7,7 @@
     <div class="card-default">
         <div class="card_header__v2">
             <div class="w-1/2">
-                <span class="text-2xl text-black">
+                <span class="text-2xl text-slate-800">
                     {{ __('Links created by Guests') }}
                 </span>
             </div>

diff --git a/resources/views/backend/url-list-of-user.blade.php b/resources/views/backend/url-list-of-user.blade.php
@@ -7,7 +7,7 @@
     <div class="card-default">
         <div class="card_header__v2">
             <div class="w-1/2">
-                <span class="text-2xl text-black">
+                <span class="text-2xl text-slate-800">
                     {{ __('Links created by') }} {{ $authorName }}
                 </span>
             </div>

diff --git a/resources/views/backend/url-list.blade.php b/resources/views/backend/url-list.blade.php
@@ -7,7 +7,7 @@
     <div class="card-default">
         <div class="card_header__v2">
             <div class="w-1/2">
-                <span class="text-2xl text-black">
+                <span class="text-2xl text-slate-800">
                     {{ __('List of All URLs') }}
                 </span>
             </div>

diff --git a/resources/views/components/table/action-button.blade.php b/resources/views/components/table/action-button.blade.php
@@ -1,14 +1,14 @@
 <div>
     <a role="button" href="{{ $detail_link }}" target="_blank" title="{{ __('Details') }}"
-        class="btn btn-secondary btn-square btn-xs">
+        class="btn btn-primary btn-square btn-xs">
         @svg('icon-chart-line')
     </a>
     <a role="button" href="{{ $edit_link }}" title="{{ __('Edit') }}"
-        class="btn btn-secondary btn-square btn-xs">
+        class="btn btn-primary btn-square btn-xs">
         @svg('icon-edit')
     </a>
     <a role="button" href="{{ $delete_link }}" title="{{ __('Delete') }}"
-        class="btn btn-secondary btn-square btn-xs hover:bg-red-50 hover:border-red-200 hover:text-red-800 active:text-red-700">
+        class="btn btn-primary btn-square btn-xs hover:bg-red-50 hover:border-red-200 hover:text-red-800 active:text-red-700">
         @svg('icon-trash')
     </a>
 </div>
diff --git a/resources/views/components/table/destination.blade.php b/resources/views/components/table/destination.blade.php
@@ -7,7 +7,7 @@
 
     <br>
 
-    <a href="{{ $destination }}" target="_blank" title="{{ $destination }}" rel="noopener noreferrer" class="text-gray-500">
+    <a href="{{ $destination }}" target="_blank" title="{{ $destination }}" rel="noopener noreferrer" class="text-slate-500">
         {{ Helper::urlFormat($destination, $limit) }}
     </a>
 </div>
diff --git a/resources/views/components/table/keyword.blade.php b/resources/views/components/table/keyword.blade.php
@@ -1,6 +1,6 @@
 <div>
     <a href="{{ $shortLink }}" title="{{ $keyword }}" target="_blank"
-        class="bg-primary-50 text-primary-700 font-light p-1 rounded">
+        class="bg-indigo-50 text-indigo-700 font-light p-1 rounded">
         {{ mb_strimwidth($keyword, 0, 15, '...') }}
     </a>
 </div>
diff --git a/resources/views/frontend/homepage.blade.php b/resources/views/frontend/homepage.blade.php
@@ -19,7 +19,7 @@
                 font-bold text-center md:text-4xl xl:text-5xl text-3xl !leading-tight"
             >
                 Simple URL shortener <br>
-                <span class="font-thin text-black">for individuals &amp; businesses.</span>
+                <span class="font-thin text-slate-800">for individuals &amp; businesses.</span>
             </h1>
         </div>
 
@@ -31,10 +31,10 @@
                         <input name="long_url" value="{{ old('long_url') }}" placeholder="{{ __('Shorten your link') }}"
                             class="w-full md:w-4/6 px-2 md:px-4 h-12 sm:h-14
                                 text-xl outline-none
-                                border border-border-uh-border-color focus:border-green-600
+                                border border-border-200 focus:border-green-600
                                 rounded-t-md md:rounded-l-md md:rounded-r-none
                                 {{-- tailwindcss/forms --}}
-                                border-slate-300 focus:ring-inherit">
+                                border-border-300 focus:ring-inherit">
                         <button type="submit" id="actProcess"
                             class="w-full md:w-1/6 h-12 sm:h-14 align-top rounded-t-none rounded-b md:rounded-l-none md:rounded-r-md
                                 duration-300 text-lg text-white bg-emerald-600 hover:bg-emerald-700 focus:bg-emerald-700"