chore: update content design

Author: mckenziearts

resources/css/app.css

@@ -17,6 +17,37 @@
 @source '../**/*.blade.php';
 @source '../**/*.js';
 
+:root {
+  --laravel: #F56857;
+  --livewire: #fb70a9;
+  --inertia: #8b5cf6;
+  --javascript: #f7df1e;
+  --typesript: #007acc;
+  --react: #53c1de;
+  --vue-js: #41b883;
+  --php: #777bb3;
+  --digital-ocean: #0080ff;
+  --forge: #19b69b;
+  --packages: #4f46e5;
+  --outils: #22d3ee;
+  --tailwindcss: #06b6d4;
+  --design: #78350f;
+  --alpinejs: #2d3441;
+  --open-source: #f97316;
+  --freelance: #f43f5e;
+  --salaire: #c7d2fe;
+  --projets: #14b8a6;
+  --entrepreneuriat: #0ea5e9;
+  --paiement-en-ligne: #10b981;
+  --branding: #ec4899;
+  --applications: #0284c7;
+  --developpement: #4d7c0f;
+  --event: #36bffa;
+  --tutoriel: #164e63;
+  --communaute: #dd2590;
+  --astuces: #d6bbfb;
+}
+
 @theme {
   /* Custom Colors */
   --color-flag-green: #099170;
@@ -101,34 +132,3 @@
   initial-value: 0deg;
   syntax: '<angle>';
 }
-
-:root {
-    --laravel: #F56857;
-    --livewire: #fb70a9;
-    --inertia: #8b5cf6;
-    --javascript: #f7df1e;
-    --typesript: #007acc;
-    --react: #53c1de;
-    --vue-js: #41b883;
-    --php: #777bb3;
-    --digital-ocean: #0080ff;
-    --forge: #19b69b;
-    --packages: #4f46e5;
-    --outils: #22d3ee;
-    --tailwindcss: #06b6d4;
-    --design: #78350f;
-    --alpinejs: #2d3441;
-    --open-source: #f97316;
-    --freelance: #f43f5e;
-    --salaire: #c7d2fe;
-    --projets: #14b8a6;
-    --entrepreneuriat: #0ea5e9;
-    --paiement-en-ligne: #10b981;
-    --branding: #ec4899;
-    --applications: #0284c7;
-    --developpement: #4d7c0f;
-    --event: #36bffa;
-    --tutoriel: #164e63;
-    --communaute: #dd2590;
-    --astuces: #d6bbfb;
-}

resources/css/components/base.css

@@ -60,3 +60,13 @@ input { width: 100%; }
 .iti--inline-dropdown .iti__dropdown-content {
   @apply !mt-2 !rounded-lg !border-gray-200 dark:!border-white/10 !shadow;
 }
+
+/* Gradient */
+.section-gradient {
+  background: radial-gradient(60% 60% at 22% 0, #f4f4f5, #ffffff);
+  position: relative
+}
+
+.dark .section-gradient {
+  background: radial-gradient(60% 60% at 22% 0, #0d1d1c, #151515);
+}

resources/views/components/buttons/default.blade.php

@@ -1,5 +1,5 @@
 @php
-    $classes = 'inline-flex justify-center py-2 px-4 bg-white border-0 ring-1 ring-gray-200 dark:ring-white/20 rounded-lg shadow-xs text-sm text-gray-700 hover:text-gray-900 dark:text-gray-400 hover:bg-white/50 dark:hover:bg-white/10 focus:outline-hidden focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-green-500 dark:bg-gray-800 dark:focus:ring-offset-gray-900';
+    $classes = 'inline-flex items-center justify-center py-2 px-4 bg-white ring-1 ring-gray-200 dark:ring-white/20 rounded-lg shadow-xs font-medium text-sm text-gray-700 hover:text-gray-900 hover:bg-white/50 dark:text-white dark:hover:text-white dark:bg-gray-800 dark:hover:bg-white/10 focus:outline-hidden focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-primary-500 dark:focus:ring-offset-gray-900';
 @endphp
 
 @if ($attributes->hasAny(['href', ':href']))

resources/views/components/buttons/primary.blade.php

@@ -1,5 +1,5 @@
 @php
-    $classes = 'inline-flex items-center justify-center py-2 px-4 border-0 text-sm font-medium rounded-lg text-white bg-green-600 hover:bg-green-700 focus:outline-hidden focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-green-500 dark:ring-offset-gray-900';
+    $classes = 'inline-flex items-center justify-center py-2 px-4 text-sm font-medium rounded-lg text-white bg-primary-600 hover:bg-primary-700 focus:outline-hidden focus:ring-2 focus:ring-offset-2 focus:ring-offset-white focus:ring-primary-500 dark:bg-primary-400/10 dark:hover:bg-primary-800/20 dark:text-primary-400 dark:inset-ring dark:inset-ring-primary-500/20 dark:ring-offset-gray-900';
 @endphp
 
 @if ($attributes->hasAny(['href', ':href']))

resources/views/components/icon/cosna.blade.php

@@ -1,30 +1,30 @@
-<svg {{ $attributes }} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 927.43 150.18">
+<svg {{ $attributes }} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 928 150">
     <path
-        fill="#37384e"
+        fill="currentColor"
         d="M107.54,128.28c0,3.56-1.92,5.77-5.64,5.79-4,0-5.75-2.27-5.77-6.09,0-5.19,0-10.38-.06-15.56a15.82,15.82,0,0,0-.8-5.83c-.59-1.35-2.32-3.07-3.52-3.06a4.67,4.67,0,0,0-3.42,3.09c-.55,4.67-.46,9.42-.61,14.13-.09,2.74,0,5.5-.3,8.22-.37,3.35-2.4,5.19-5.84,5.11s-5.41-2-5.56-5.4c-.16-4,0-7.93,0-11.9h.11c0-3.81-.22-7.64,0-11.43.54-8.06,6.65-13.64,14.75-13.76,9.42-.15,15.91,4.81,16.45,13.35C107.82,112.7,107.6,120.5,107.54,128.28Z"
     />
     <path
         fill="#218366"
         d="M175.77,143.73a21.47,21.47,0,0,1-13.09,1.63c-12.74-2.63-25.28-6.21-37.89-9.46-5.55-1.43-8.35-5.11-8.43-10.92,0-2.6.1-5.2,0-7.78-.18-3.63,1-5.25,4.83-3.89a22.11,22.11,0,0,0,7,1.67c2.14,0,5-.53,6.2-2,1-1.16.61-4.47-.4-6Q115.35,78.34,96.28,49.94c-2.67-4-6.39-3.92-9.11.16C74.58,68.93,62,87.77,49.66,106.75a7.91,7.91,0,0,0-.48,6.5c1.18,2.61,4,3,6.73,1.66a16,16,0,0,1,2.23-.45c10.37-3,9-2.1,9,7,0,10.6-1.74,12.75-12.08,15.35-11.31,2.84-22.59,5.78-33.89,8.63-9.79,2.47-17.7-1.75-20.54-10.88C-1,129.15.74,124.47,3.71,120q25.49-38.37,51-76.76C62.15,32,69.61,20.69,77.15,9.46c8.38-12.47,20.79-12.67,29-.27q37,55.59,73.86,111.34C185.83,129.27,184.25,139.44,175.77,143.73Z"
     />
     <path
-        fill="#37384e"
+        fill="currentColor"
         d="M305.11,10.86h17A3.5,3.5,0,0,1,326,14.73V115.35a3.5,3.5,0,0,1-3.87,3.87H310.53a5.38,5.38,0,0,1-4.8-2.48l-37-57.89v56.5a3.51,3.51,0,0,1-3.88,3.87h-17a3.5,3.5,0,0,1-3.87-3.87V14.73a3.5,3.5,0,0,1,3.87-3.87h11.61a5.39,5.39,0,0,1,4.8,2.47l37,57.9V14.73A3.51,3.51,0,0,1,305.11,10.86Z"
     />
     <path
-        fill="#37384e"
+        fill="currentColor"
         d="M340,80.52a41,41,0,1,1,41,40.87A40.57,40.57,0,0,1,340,80.52Zm58.82,0c0-11-7.74-18.27-17.8-18.27s-17.8,7.28-17.8,18.27,7.74,18.27,17.8,18.27S398.77,91.51,398.77,80.52Z"
     />
     <path
-        fill="#37384e"
+        fill="currentColor"
         d="M475.41,45.69V60.24a3.51,3.51,0,0,1-3.87,3.87H463v51.24a3.5,3.5,0,0,1-3.87,3.87H443.67a3.5,3.5,0,0,1-3.87-3.87V64.11h-8.51a3.5,3.5,0,0,1-3.87-3.87V45.69a3.5,3.5,0,0,1,3.87-3.87h8.51V20.92a3.5,3.5,0,0,1,3.87-3.87h15.48A3.5,3.5,0,0,1,463,20.92v20.9h8.52A3.51,3.51,0,0,1,475.41,45.69Z"
     />
     <path
-        fill="#37384e"
+        fill="currentColor"
         d="M559.93,94.14c-4.8,16.1-20,27.25-38.08,27.25-23.53,0-41-17.8-41-40.87s17.49-40.87,41-40.87c18.11,0,33.28,11.15,38.08,27.25.93,2.63-.62,4.33-3.25,4.33h-17A5.45,5.45,0,0,1,535,68.6c-2.79-3.87-7.59-6-13.16-6-10.06,0-17.8,7.28-17.8,18s7.74,18,17.8,18c5.57,0,10.37-2.17,13.16-5.88,1.24-1.86,2.47-2.79,4.64-2.79h17C559.31,89.81,560.86,91.51,559.93,94.14Z"
     />
     <path
-        fill="#37384e"
+        fill="currentColor"
         d="M640,70.15v45.2a3.51,3.51,0,0,1-3.87,3.87H620.62a3.5,3.5,0,0,1-3.87-3.87V72.16c0-7.74-4.49-11.14-10.37-11.14-7,0-11.31,3.86-11.31,13v41.33a3.5,3.5,0,0,1-3.87,3.87H575.72a3.51,3.51,0,0,1-3.87-3.87V14.73a3.51,3.51,0,0,1,3.87-3.87H591.2a3.5,3.5,0,0,1,3.87,3.87V48.89c3.64-5.38,10.23-9.24,20.13-9.24C629.6,39.65,640,50.8,640,70.15Z"
     />
     <path

resources/views/components/icon/notchpay.blade.php

@@ -0,0 +1,30 @@
+<svg {{ $attributes }} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 264 43" role="img" aria-label="Shopper Labs">
+    <path d="M2.92 10.38h29.16V43H2.92V10.38Z" fill="url(#shopper-labs-radial-a)"/>
+    <path d="m35 26.69-11.67 2.97v-8.9L35 17.79v8.9Z" fill="url(#shopper-labs-linear-b)"/>
+    <path d="M11.67 37.07 0 40.03v-8.9l11.67-2.96v8.9Z" fill="url(#shopper-labs-linear-c)"/>
+    <path d="M17.5 17.8a7.36 7.36 0 0 1-7.3-7.42H7.3a10.3 10.3 0 0 0 10.2 10.38 10.3 10.3 0 0 0 10.2-10.38h-2.9c0 4.1-3.28 7.41-7.3 7.41Z" fill="url(#shopper-labs-linear-d)"/>
+    <path d="M17.5 2.97c4.02 0 7.3 3.32 7.3 7.4h2.9A10.3 10.3 0 0 0 17.5 0 10.3 10.3 0 0 0 7.3 10.38h2.9c0-4.1 3.28-7.41 7.3-7.41Z" fill="url(#shopper-labs-linear-e)"/>
+    <path d="M56.51 38.72a9.04 9.04 0 0 1-4.32-1 7.68 7.68 0 0 1-2.91-2.74A9.33 9.33 0 0 1 48 30.82l3.46-.22c.15 1.08.45 2 .9 2.75a4.47 4.47 0 0 0 1.75 1.7 5.6 5.6 0 0 0 2.53.53c.94 0 1.73-.11 2.37-.35a3.26 3.26 0 0 0 1.47-1.08 2.8 2.8 0 0 0 .52-1.7 3.3 3.3 0 0 0-.48-1.79c-.32-.5-.9-.98-1.73-1.4-.83-.43-2.05-.87-3.65-1.31-1.56-.43-2.83-.91-3.81-1.44a5.26 5.26 0 0 1-2.15-1.98 5.88 5.88 0 0 1-.67-2.95c0-1.3.3-2.44.9-3.42.62-1 1.5-1.77 2.62-2.33a9.45 9.45 0 0 1 4.13-.83c1.58 0 2.93.3 4.04.93a6.75 6.75 0 0 1 2.65 2.59 9.03 9.03 0 0 1 1.22 3.83l-3.46.2a5.97 5.97 0 0 0-.73-2.3 3.86 3.86 0 0 0-1.5-1.54 4.4 4.4 0 0 0-2.31-.58c-1.26 0-2.27.31-3.01.93a2.91 2.91 0 0 0-1.1 2.36c0 .67.16 1.2.46 1.63.3.43.82.81 1.57 1.16.74.34 1.79.69 3.13 1.05 1.82.49 3.26 1.06 4.32 1.7a5.96 5.96 0 0 1 2.3 2.3c.48.9.71 1.96.71 3.2 0 1.23-.33 2.33-.99 3.28a6.6 6.6 0 0 1-2.78 2.21c-1.18.51-2.56.77-4.17.77ZM67.83 38.2V15.52h3.24v9.4l-.32-.13a5 5 0 0 1 1.09-2.24 4.55 4.55 0 0 1 1.85-1.3 6.68 6.68 0 0 1 2.4-.42c1.2 0 2.2.27 3.01.83a4.78 4.78 0 0 1 1.86 2.27c.43.96.64 2.06.64 3.32v10.97h-3.23V28.07c0-1.53-.28-2.65-.84-3.35-.53-.73-1.33-1.09-2.4-1.09-1.21 0-2.2.38-2.94 1.15-.75.77-1.12 1.9-1.12 3.39V38.2h-3.24ZM92.7 38.59a7.87 7.87 0 0 1-4.17-1.09 7.37 7.37 0 0 1-2.75-3.1 10.8 10.8 0 0 1-.96-4.7c0-1.8.32-3.37.96-4.7a7.37 7.37 0 0 1 2.75-3.1 7.87 7.87 0 0 1 4.16-1.08 7.7 7.7 0 0 1 4.13 1.08 7.1 7.1 0 0 1 2.76 3.1c.66 1.33.99 2.9.99 4.7 0 1.8-.33 3.36-1 4.7a7.1 7.1 0 0 1-2.75 3.1 7.7 7.7 0 0 1-4.13 1.09Zm0-2.97c1.42 0 2.52-.53 3.3-1.57.78-1.04 1.18-2.5 1.18-4.35 0-1.85-.4-3.3-1.19-4.34a3.85 3.85 0 0 0-3.3-1.57c-1.43 0-2.54.52-3.32 1.57-.77 1.04-1.16 2.49-1.16 4.34 0 1.86.39 3.3 1.16 4.35a3.93 3.93 0 0 0 3.32 1.57ZM103.63 43V21.2h3.07l.07 3.87-.39-.2a5.7 5.7 0 0 1 2.08-3 5.78 5.78 0 0 1 3.46-1.05c1.64 0 2.99.41 4.03 1.24a7.25 7.25 0 0 1 2.34 3.23c.51 1.34.77 2.82.77 4.41 0 1.6-.26 3.07-.77 4.41a7.47 7.47 0 0 1-2.34 3.26 6.4 6.4 0 0 1-4.03 1.22c-.88 0-1.69-.14-2.43-.42a5.63 5.63 0 0 1-1.92-1.24 5.06 5.06 0 0 1-1.12-1.98l.41-.45V43h-3.23Zm7.68-7.38c1.37 0 2.44-.52 3.2-1.54.77-1.02 1.16-2.48 1.16-4.38s-.39-3.35-1.16-4.38a3.78 3.78 0 0 0-3.2-1.53 4.07 4.07 0 0 0-3.9 2.62 8.63 8.63 0 0 0-.55 3.3c0 1.31.18 2.41.55 3.29a4.3 4.3 0 0 0 1.53 1.98c.69.42 1.48.64 2.37.64ZM121.86 43V21.2h3.08l.06 3.87-.38-.2a5.69 5.69 0 0 1 2.08-3 5.78 5.78 0 0 1 3.45-1.05c1.65 0 3 .41 4.04 1.24a7.24 7.24 0 0 1 2.33 3.23c.52 1.34.77 2.82.77 4.41 0 1.6-.25 3.07-.77 4.41a7.46 7.46 0 0 1-2.33 3.26 6.4 6.4 0 0 1-4.04 1.22c-.87 0-1.68-.14-2.43-.42a5.65 5.65 0 0 1-1.92-1.24 5.06 5.06 0 0 1-1.12-1.98l.42-.45V43h-3.24Zm7.69-7.38c1.36 0 2.43-.52 3.2-1.54.76-1.02 1.15-2.48 1.15-4.38s-.39-3.35-1.15-4.38a3.78 3.78 0 0 0-3.2-1.53 4.07 4.07 0 0 0-3.91 2.62 8.65 8.65 0 0 0-.54 3.3c0 1.31.18 2.41.54 3.29a4.3 4.3 0 0 0 1.54 1.98c.68.42 1.47.64 2.37.64ZM147.62 38.59c-1.6 0-3-.36-4.2-1.09a7.37 7.37 0 0 1-2.75-3.1 10.8 10.8 0 0 1-.96-4.7c0-1.79.32-3.34.96-4.66a7.72 7.72 0 0 1 2.72-3.1 7.53 7.53 0 0 1 4.13-1.12 7.03 7.03 0 0 1 6.7 4.16c.66 1.31.99 2.91.99 4.79v.9h-12.1c.1 1.61.55 2.85 1.34 3.7a4.27 4.27 0 0 0 3.2 1.25c1 0 1.84-.24 2.5-.7a3.8 3.8 0 0 0 1.38-1.9l3.39.23a7.52 7.52 0 0 1-2.66 3.9 7.44 7.44 0 0 1-4.64 1.44Zm-4.51-10.52h8.6c-.12-1.45-.57-2.52-1.34-3.23a3.99 3.99 0 0 0-2.85-1.05c-1.2 0-2.17.36-2.94 1.09a5.34 5.34 0 0 0-1.47 3.2ZM163.04 38.2v-17h2.56l.28 4.35-.28-.03a5.64 5.64 0 0 1 1.37-3.26c.7-.7 1.68-1.06 2.92-1.06h3.61v2.81h-3.49c-.8 0-1.49.16-2.04.48-.56.3-.99.76-1.28 1.38-.28.6-.42 1.34-.42 2.23v10.1h-3.23Zm-4.32 0V35.5h12.86v2.72h-12.87Zm0-14.28V21.2h6.14v2.72h-6.15ZM195.63 38.2V15.52h3.36v21.42l-2.05-1.89h12.9v3.17h-14.21ZM218.03 38.59c-1.07 0-2.03-.2-2.89-.58a5.02 5.02 0 0 1-2.04-1.63 4.2 4.2 0 0 1-.74-2.46c0-1.45.44-2.58 1.31-3.39.9-.8 2.24-1.38 4.04-1.72l5.5-1.15c0-1.32-.29-2.31-.86-2.98-.58-.66-1.44-.99-2.6-.99-1.06 0-1.9.25-2.5.74-.59.49-1 1.17-1.2 2.04l-3.4-.22a6.52 6.52 0 0 1 2.33-3.93c1.24-1 2.83-1.5 4.77-1.5 2.18 0 3.84.62 4.97 1.85 1.15 1.24 1.72 2.94 1.72 5.12v6.7c0 .4.09.67.26.84.17.15.42.22.74.22h.96v2.66l-.64.06-.84.03c-.76 0-1.41-.13-1.95-.38a2.62 2.62 0 0 1-1.22-1.18 5.66 5.66 0 0 1-.44-2.08h.5a4 4 0 0 1-.98 2.01 5.48 5.48 0 0 1-2.05 1.4 7.2 7.2 0 0 1-2.75.52Zm.48-2.65c1.02 0 1.88-.19 2.59-.55.7-.36 1.22-.87 1.57-1.53.36-.66.54-1.44.54-2.33V30.2l-4.74.96c-1.02.2-1.74.5-2.14.9-.4.4-.6.94-.6 1.6 0 .7.24 1.25.73 1.66.49.4 1.17.6 2.05.6ZM239.9 38.59c-1.19 0-2.23-.27-3.13-.8a5.73 5.73 0 0 1-2.08-2.2l-.1 2.62h-3V15.5h3.23v8.09a5.85 5.85 0 0 1 5.09-2.78c1.45 0 2.7.36 3.78 1.08a6.73 6.73 0 0 1 2.46 3.07c.58 1.32.86 2.9.86 4.73a12 12 0 0 1-.86 4.77 6.96 6.96 0 0 1-2.46 3.06 6.7 6.7 0 0 1-3.78 1.06Zm-.54-2.97c1.35 0 2.4-.53 3.14-1.57.75-1.07 1.12-2.51 1.12-4.35 0-1.85-.37-3.3-1.12-4.34a3.58 3.58 0 0 0-3.07-1.57c-.96 0-1.78.23-2.47.7a4.62 4.62 0 0 0-1.6 2.02 8.34 8.34 0 0 0-.54 3.2c0 1.2.18 2.26.54 3.16.39.87.91 1.55 1.57 2.04.68.47 1.5.7 2.43.7ZM257.05 38.59a9.12 9.12 0 0 1-3.9-.77 6.25 6.25 0 0 1-2.53-2.04 5.9 5.9 0 0 1-1.03-2.91l3.3-.2c.17.92.6 1.66 1.28 2.21.69.53 1.66.8 2.92.8a6 6 0 0 0 2.69-.48c.61-.32.92-.82.92-1.5 0-.43-.1-.78-.32-1.06-.21-.3-.62-.54-1.21-.73-.58-.21-1.43-.43-2.56-.64-1.69-.32-3.01-.7-3.97-1.12-.94-.45-1.61-1-2.02-1.66-.4-.68-.6-1.5-.6-2.46 0-.98.24-1.87.73-2.66a5.12 5.12 0 0 1 2.24-1.85c.98-.47 2.2-.7 3.65-.7a7.8 7.8 0 0 1 3.74.8 6.09 6.09 0 0 1 2.3 2.01c.56.83.92 1.74 1.06 2.72l-3.3.19a3.59 3.59 0 0 0-.67-1.44 3.15 3.15 0 0 0-1.28-.99 4.25 4.25 0 0 0-1.85-.38c-1.13 0-1.97.22-2.5.67-.53.44-.8.99-.8 1.63 0 .5.13.92.38 1.24a3 3 0 0 0 1.28.77c.6.2 1.41.38 2.44.58 1.73.27 3.06.64 4 1.08.94.43 1.6.96 1.98 1.6.39.64.58 1.43.58 2.37 0 1.02-.3 1.9-.9 2.65a5.6 5.6 0 0 1-2.43 1.7 10.3 10.3 0 0 1-3.62.57Z" fill="currentColor"/>
+    <defs>
+        <linearGradient id="shopper-labs-linear-b" x1="0" y1="43" x2="13.65" y2="-40.78" gradientUnits="userSpaceOnUse">
+            <stop stop-color="#dbeafe"/>
+            <stop offset="1" stop-color="#93c5fd"/>
+        </linearGradient>
+        <linearGradient id="shopper-labs-linear-c" x1="0" y1="43" x2="13.65" y2="-40.78" gradientUnits="userSpaceOnUse">
+            <stop stop-color="#93c5fd"/>
+            <stop offset="1" stop-color="#dbeafe"/>
+        </linearGradient>
+        <linearGradient id="shopper-labs-linear-d" x1="0" y1="21.5" x2="264" y2="21.5" gradientUnits="userSpaceOnUse">
+            <stop stop-color="#1e40af"/>
+            <stop offset="1" stop-color="#3b82f6"/>
+        </linearGradient>
+        <linearGradient id="shopper-labs-linear-e" x1="0" y1="21.5" x2="264" y2="21.5" gradientUnits="userSpaceOnUse">
+            <stop stop-color="#3b82f6"/>
+            <stop offset="1" stop-color="#1e40af"/>
+        </linearGradient>
+        <radialGradient id="shopper-labs-radial-a" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(356.4 0 0 52.7727 250.8 1.95)">
+            <stop stop-color="#60a5fa"/>
+            <stop offset="1" stop-color="#2563eb"/>
+        </radialGradient>
+    </defs>
+</svg>

resources/views/components/icon/shopper-labs.blade.php

@@ -2,51 +2,42 @@
     'title',
 ])
 
-<x-container class="py-12 sm:py-16 lg:py-24">
+<div class="py-12 sm:py-16 lg:py-24">
     <p class="text-center text-lg font-medium leading-8 text-gray-700 dark:text-gray-300">
         {{ $title }}
     </p>
-    <div class="mt-5 flex flex-wrap items-center justify-center gap-8">
-        <div class="flex items-center justify-center px-2">
-            <a href="https://laravelshopper.dev" target="_blank" class="flex items-center">
-                <img
-                    loading="lazy"
-                    class="h-12 dark:hidden"
-                    src="{{ asset('/images/sponsors/shopper-logo.svg') }}"
-                    alt="Laravel Shopper"
-                />
-                <img
-                    loading="lazy"
-                    class="hidden h-12 dark:block"
-                    src="{{ asset('/images/sponsors/shopper-logo-light.svg') }}"
-                    alt="Laravel Shopper"
-                />
-            </a>
-        </div>
-        <div class="flex items-center justify-center px-2">
-            <a href="https://gdg.community.dev/gdg-douala" class="flex items-center" target="_blank">
-                <x-icon.gdg class="h-7 text-gray-900 dark:text-white" aria-hidden="true" />
-            </a>
-        </div>
-        <div class="flex items-center justify-center px-2">
-            <a href="https://notchpay.co" class="flex items-center" target="_blank">
-                <x-icon.notchpay class="h-8 w-auto text-gray-900 dark:text-white" aria-hidden="true" />
-            </a>
-        </div>
-        <div class="flex items-center justify-center px-2">
-            <a href="https://sharuco.lndev.me" class="flex items-center" target="_blank">
-                <x-icon.sharuco class="h-7 w-auto text-gray-900 dark:text-white" aria-hidden="true" />
-                <span class="ml-1 text-2xl font-bold text-gray-900 dark:text-white">Sharuco</span>
-            </a>
+    <div class="mt-4 flex items-center justify-center">
+        <div class="inline-flex divide-x divide-dotted divide-gray-200 dark:divide-white/10 flex-wrap items-center justify-center border border-dotted border-gray-200 dark:border-white/10 rounded-lg">
+            <div class="flex items-center justify-center px-4 py-2.5 lg:px-6">
+                <a href="https://shopperlabs.co" target="_blank" class="flex items-center">
+                    <x-icon.shopper-labs class="h-6 w-auto text-gray-900 dark:text-white" aria-hidden="true" />
+                </a>
+            </div>
+            <div class="flex items-center justify-center px-4 py-2.5 lg:px-6">
+                <a href="https://gdg.community.dev/gdg-douala" class="flex items-center" target="_blank">
+                    <x-icon.gdg class="h-6 text-gray-900 dark:text-white" aria-hidden="true" />
+                </a>
+            </div>
+            <div class="flex items-center justify-center px-4 py-2.5 lg:px-6">
+                <a href="https://notchpay.co" class="flex items-center" target="_blank">
+                    <x-icon.notchpay class="h-6 w-auto text-gray-900 dark:text-white" aria-hidden="true" />
+                </a>
+            </div>
+            <div class="flex items-center justify-center px-4 py-2.5 lg:px-6">
+                <a href="https://sharuco.lndev.me" class="flex items-center" target="_blank">
+                    <x-icon.sharuco class="h-6 w-auto text-gray-900 dark:text-white" aria-hidden="true" />
+                    <span class="ml-1 text-xl font-mono font-bold text-gray-900 dark:text-white">Sharuco</span>
+                </a>
+            </div>
         </div>
     </div>
     <div class="mt-6 text-center lg:mt-10">
         <x-link
-            class="text-sm leading-5 text-flag-green hover:text-green-600 hover:underline"
+            class="text-sm leading-5 text-primary-500 hover:text-primary-600 hover:underline hover:decoration-1 hover:decoration-dotted hover:decoration-primary-500"
             target="_blank"
             :href="route('sponsors')"
         >
             {{ __('pages/home.view_logo_question') }}
         </x-link>
     </div>
-</x-container>
+</div>