Implemented new colors and various tweaks

resources/core-overwrites/layouts/checkout/footer.blade.php

@@ -1,5 +1,5 @@
 <footer class="mt-auto">
-    <div class="mt-10 flex items-center justify-center gap-6 border-b-4 border-b-ct-enhanced bg-ct-inactive-100 py-4 text-sm text-ct-inactive">
+    <div class="mt-10 flex items-center justify-center gap-6 border-b-4 border-b-primary bg py-4 text-sm text-muted">
         @foreach (['Privacy Policy', 'Terms & Conditions'] as $link)
             <a class="hover:underline" href="#">
                 {{ $link }}

resources/core-overwrites/layouts/checkout/header.blade.php

@@ -1,4 +1,4 @@
-<div class="bg-inactive-100 text-ct-inactive relative py-3 text-xs font-semibold">
+<div class="bg-inactive-100 text-muted relative py-3 text-xs font-semibold">
     <slider reference="header-usp-slider" autoplay loop>
         <div
             ref="header-usp-slider"
@@ -7,7 +7,7 @@ class="scrollbar-hide flex snap-x snap-mandatory items-center gap-7 overflow-x-a
         >
             @foreach (['Wide range of products', 'Free returns', 'All items shown are in stock', 'Free shipping'] as $usp)
                 <div class="flex shrink-0 snap-center items-center justify-center gap-2 max-lg:w-full">
-                    <x-heroicon-o-check class="size-4 text-ct-enhanced stroke-2" />
+                    <x-heroicon-o-check class="size-4 text-primary stroke-2" />
                     <span>{{ $usp }}</span>
                 </div>
             @endforeach

resources/views/account/order.blade.php

@@ -33,7 +33,7 @@
                 <x-rapidez::button.outline href="/account/orders">
                     @lang('Back to my orders')
                 </x-rapidez::button.outline>
-                <span class="text-ct-inactive">
+                <span class="text-muted">
                     @lang('Order date'): @{{ (new Date(order.order_date)).toLocaleDateString() }}
                 </span>
             </x-rapidez-ct::toolbar>

resources/views/account/partials/account-features.blade.php

@@ -4,15 +4,15 @@
     </x-rapidez-ct::title.lg>
     <x-rapidez-ct::usp-list>
         <li>
-            <x-heroicon-o-check class="absolute left-0 top-0 h-5 text-ct-accent" stroke-width="2.5" />
+            <x-heroicon-o-check class="absolute left-0 top-0 h-5 text-primary" stroke-width="2.5" />
             <span>@lang('Track status of your order and view order history')</span>
         </li>
         <li>
-            <x-heroicon-o-check class="absolute left-0 top-0 h-5 text-ct-accent" stroke-width="2.5" />
+            <x-heroicon-o-check class="absolute left-0 top-0 h-5 text-primary" stroke-width="2.5" />
             <span>@lang('Quick and easy ordering without having to fill in your details every time')</span>
         </li>
         <li>
-            <x-heroicon-o-check class="absolute left-0 top-0 h-5 text-ct-accent" stroke-width="2.5" />
+            <x-heroicon-o-check class="absolute left-0 top-0 h-5 text-primary" stroke-width="2.5" />
             <span>@lang('Everything centralized in 1 place such as returns, exchanges and customer service')</span>
         </li>
     </x-rapidez-ct::usp-list>

resources/views/account/partials/address-cards.blade.php

@@ -10,7 +10,7 @@
                 </x-rapidez-ct::button.link>
             </x-rapidez-ct::card.address>
         </template>
-        <a href="/account/address/new" class="min-h-[180px] flex flex-col items-center justify-center gap-y-2 font-medium bg-ct-disabled rounded max-md:hidden">
+        <a href="/account/address/new" class="min-h-[180px] flex flex-col items-center justify-center gap-y-2 font-medium bg-emphasis rounded max-md:hidden">
             <span>+</span>
             <span>@lang('Add new address')</span>
         </a>

resources/views/account/partials/forgotpassword.blade.php

@@ -22,7 +22,7 @@
             />
         </label>
         <div class="mt-5 flex items-center justify-between">
-            <a href="{{ route('account.login') }}" class="text-sm text-ct-inactive underline">
+            <a href="{{ route('account.login') }}" class="text-sm text-muted underline">
                 @lang('Back to login')
             </a>
             <x-rapidez::button.secondary

resources/views/account/partials/login.blade.php

@@ -18,7 +18,7 @@
             />
         </label>
         <div class="flex items-center justify-between">
-            <a href="{{ route('account.forgotpassword') }}" class="text-sm text-ct-inactive underline">
+            <a href="{{ route('account.forgotpassword') }}" class="text-sm text-muted underline">
                 @lang('Forgot your password?')
             </a>
             <x-rapidez::button.secondary

resources/views/account/partials/order/products.blade.php

@@ -1,4 +1,4 @@
-<div class="mt-5 rounded bg-ct-inactive-100 py-4 text-sm">
+<div class="mt-5 rounded bg py-4 text-sm">
     <div class="flex w-full flex-wrap gap-y-3 gap-x-3 text-sm sm:gap-x-6 sm:pr-6 md:items-center">
         <div class="sm:w-[150px]"></div>
         <div class="flex-1 sm:w-[150px]">@lang('Product')</div>
@@ -24,7 +24,7 @@ class="max-h-[100px] max-w-[150px]"
             </div>
             <div class="flex w-[150px] flex-1 flex-col items-start">
                 <a :href="item.url" dusk="cart-item-name">@{{ item.product_name }}</a>
-                <div class="text-xs text-ct-inactive">
+                <div class="text-xs text-muted">
                     @{{ item.product_sku }}
                 </div>
                 <div v-for="(optionValue, option) in item.options">

resources/views/account/partials/orders.blade.php

@@ -7,13 +7,13 @@
                         @lang('Order') #@{{ order.number }}
                     </x-rapidez-ct::title.lg>
                     <x-rapidez-ct::card.white class="mt-5 flex flex-wrap items-center gap-x-3 md:gap-x-8">
-                        <x-heroicon-s-shopping-cart class="h-5 text-ct-inactive" />
+                        <x-heroicon-s-shopping-cart class="h-5 text-muted" />
                         <div class="flex flex-col">
                             <span class="font-medium">
                                 @lang('Number of products')
                                 (@{{ order.items.length }})
                             </span>
-                            <span class="text-ct-inactive">
+                            <span class="text-muted">
                                 @lang('Total price'): @{{ order.total.grand_total.value | price }}
                                 /
                                 @lang('Order date'): @{{ (new Date(order.order_date)).toLocaleDateString() }}

resources/views/cart/coupon.blade.php

@@ -10,7 +10,7 @@
                     :error-callback="checkResponseForExpiredCart"
                     v-slot="{ mutate }"
                 >
-                    <form v-on:submit.prevent="mutate" class="text-ct-inactive mt-1 flex items-center gap-x-2">
+                    <form v-on:submit.prevent="mutate" class="text-muted mt-1 flex items-center gap-x-2">
                         <button type="submit">
                             <x-heroicon-s-x-mark class="size-4 text-black-400"/>
                         </button>

resources/views/cart/partials/product/price.blade.php

@@ -2,7 +2,7 @@
     <div v-if="item.prices.specialPrice">
         @{{ item.prices.specialPrice | price }}
     </div>
-    <div :class="{ 'line-through text-xs text-ct-inactive font-normal': item.prices.specialPrice }">
+    <div :class="{ 'line-through text-xs text-muted font-normal': item.prices.specialPrice }">
         @{{ item.prices.price_including_tax.value | price }}
     </div>
 </td>

resources/views/cart/partials/product/remove-button.blade.php

@@ -6,7 +6,7 @@
     :error-callback="checkResponseForExpiredCart"
     v-slot="{ mutate }"
 >
-    <button v-on:click="mutate" class="text-ct-inactive mt-1 text-xs hover:underline" :dusk="'item-delete-' + index">
+    <button v-on:click="mutate" class="text-muted mt-1 text-xs hover:underline" :dusk="'item-delete-' + index">
         @lang('Remove')
     </button>
 </graphql-mutation>

resources/views/cart/partials/products.blade.php

@@ -1,5 +1,5 @@
 <table class="w-full border-b">
-    <thead class="bg-ct-inactive-100 flex rounded md:table-header-group">
+    <thead class="bg flex rounded md:table-header-group">
         <tr class="text-xs *:py-4 *:font-normal *:px-5">
             <th class="!pl-0 max-md:hidden"></th>
             <th class="text-start">@lang('Product')</th>

resources/views/cart/partials/sidebar/summary.blade.php

@@ -12,7 +12,7 @@
             <dd v-if="cart.shipping_addresses[0].selected_shipping_method.amount.value > 0">
                 @{{ cart.shipping_addresses[0].selected_shipping_method.amount.value | price  }}
             </dd>
-            <dd v-else class="font-medium text-ct-enhanced">
+            <dd v-else class="font-medium text-primary">
                 @lang('Free')
             </dd>
         </div>
@@ -36,7 +36,7 @@
     </x-rapidez::button.conversion>
 
     <div class="mt-4 flex items-center justify-center gap-1 text-center text-sm">
-        <x-heroicon-o-check class="h-5 text-ct-accent" stroke-width="2.5" />
+        <x-heroicon-o-check class="h-5 text-primary" stroke-width="2.5" />
         @lang('Ordered within 2 minutes')
     </div>
 </x-rapidez-ct::card>

resources/views/checkout/pages/credentials.blade.php

@@ -10,8 +10,8 @@
             <x-rapidez-ct::title-progress-bar :href="route('cart')" :$checkoutSteps :$currentStep :$currentStepKey>
                 @lang('Credentials')
             </x-rapidez-ct::title-progress-bar>
-            <x-slot:sidebar>
-                <a href="{{ url('/') }}" class="*:h-auto *:max-h-20 *:w-full *:object-contain max-lg:hidden">
+            <x-slot:sidebar class="max-lg:hidden">
+                <a href="{{ url('/') }}" class="*:h-auto *:max-h-20 *:w-full *:object-contain">
                     <x-rapidez-ct::logo />
                 </a>
             </x-slot:sidebar>

resources/views/checkout/pages/login.blade.php

@@ -10,8 +10,8 @@
             <x-rapidez-ct::title-progress-bar :href="route('cart')" :$checkoutSteps :$currentStep :$currentStepKey>
                 @lang('Login')
             </x-rapidez-ct::title-progress-bar>
-            <x-slot:sidebar>
-                <a href="{{ url('/') }}" class="*:h-auto *:max-h-20 *:w-full *:object-contain max-lg:hidden">
+            <x-slot:sidebar class="max-lg:hidden">
+                <a href="{{ url('/') }}" class="*:h-auto *:max-h-20 *:w-full *:object-contain">
                     <x-rapidez-ct::logo />
                 </a>
             </x-slot:sidebar>

resources/views/checkout/partials/buttons/new-address.blade.php

@@ -1,4 +1,4 @@
-<button v-on:click.prevent="toggleEdit" class="flex flex-col items-center justify-center gap-y-2 font-medium bg-ct-disabled rounded max-md:hidden">
+<button v-on:click.prevent="toggleEdit" class="flex flex-col items-center justify-center gap-y-2 font-medium bg-emphasis rounded max-md:hidden">
     <span>+</span>
     <span>@lang('Add new address')</span>
 </button>

resources/views/checkout/partials/sections/login.blade.php

@@ -1,5 +1,5 @@
 <login v-slot="{ email, password, go, loginInputChange, emailAvailable, logout }">
-    <div class="grid gap-4 sm:gap-5 md:grid-cols-2 md:items-end">
+    <div class="grid gap-4 sm:gap-5 md:grid-cols-1 md:items-end">
         <template v-if="!loggedIn">
             @include('rapidez-ct::checkout.partials.sections.login.logged-out')
         </template>

resources/views/checkout/partials/sections/login/logged-in.blade.php

@@ -9,8 +9,8 @@ class="justify-center"
     :placeholder="__('Enter your e-mail address')"
 />
 <div>
-    <p class="text-sm font-medium text-ct-neutral">@lang('Welcome back') @{{ $root.user?.firstname }}!</p>
-    <span class="text-ct-inactive text-sm">
+    <p class="text-sm font-medium">@lang('Welcome back') @{{ $root.user?.firstname }}!</p>
+    <span class="text-muted text-sm">
         @lang('Is this not your account?')
         <user>
             <template v-slot="user">

resources/views/checkout/partials/sections/login/logged-out.blade.php

@@ -13,7 +13,7 @@ class="justify-center"
             />
         </label>
 
-        <p v-if="checkoutLogin.isEmailAvailable" class="self-end text-ct-inactive">
+        <p v-if="checkoutLogin.isEmailAvailable" class="self-end text-muted">
             @lang('We will send your order confirmation to this e-mail address. We will also check if you already have an account so you can checkout more efficiently.')
         </p>
 
@@ -27,7 +27,7 @@ class="justify-center"
                 />
             </label>
         </template>
-        <p v-if="!loggedIn && !checkoutLogin.isEmailAvailable" class="self-end text-ct-inactive">
+        <p v-if="!loggedIn && !checkoutLogin.isEmailAvailable" class="self-end text-muted">
             @lang('You already have an account with this e-mail address. Please log in to continue.')
             <a href="{{ route('account.forgotpassword') }}" class="underline hover:no-underline">@lang('Forgot your password?')</a>
         </p>

resources/views/checkout/partials/sections/payment.blade.php

@@ -21,7 +21,7 @@
     <div v-if="data?.checkoutAgreements?.length" class="mt-5 flex flex-col gap-y-4" slot-scope="{ data }">
         <div v-for="agreement in data.checkoutAgreements">
             <label
-                class="text-ct-primary cursor-pointer text-sm underline"
+                class="cursor-pointer text-sm underline"
                 v-bind:for="agreement.checkbox_text"
                 v-if="agreement.mode == 'AUTO'"
             >

resources/views/checkout/partials/sections/payment/agreement-checkbox.blade.php

@@ -5,7 +5,7 @@
         dusk="agreements"
         required
     />
-    <label class="text-ct-primary cursor-pointer text-sm underline" v-bind:for="agreement.checkbox_text">
+    <label class="cursor-pointer text-sm underline" v-bind:for="agreement.checkbox_text">
         @{{ agreement.checkbox_text }}
     </label>
 </div>

resources/views/checkout/partials/sections/success/features.blade.php

@@ -4,15 +4,15 @@
     </x-rapidez-ct::title.lg>
     <x-rapidez-ct::usp-list>
         <li>
-            <x-heroicon-o-check class="absolute left-0 top-0 h-5 text-ct-accent" stroke-width="2.5" />
+            <x-heroicon-o-check class="absolute left-0 top-0 h-5 text-primary" stroke-width="2.5" />
             <span>@lang('Success usp 1')</span>
         </li>
         <li>
-            <x-heroicon-o-check class="absolute left-0 top-0 h-5 text-ct-accent" stroke-width="2.5" />
+            <x-heroicon-o-check class="absolute left-0 top-0 h-5 text-primary" stroke-width="2.5" />
             <span>@lang('Success usp 2')</span>
         </li>
         <li>
-            <x-heroicon-o-check class="absolute left-0 top-0 h-5 text-ct-accent" stroke-width="2.5" />
+            <x-heroicon-o-check class="absolute left-0 top-0 h-5 text-primary" stroke-width="2.5" />
             <span>@lang('Success usp 3')</span>
         </li>
     </x-rapidez-ct::usp-list>

resources/views/checkout/partials/sections/success/products.blade.php

@@ -1,4 +1,4 @@
-<div class="mt-5 rounded bg-ct-inactive-100 py-4 text-sm">
+<div class="mt-5 rounded bg py-4 text-sm">
     <div class="flex w-full items-center gap-x-6 pr-6 text-xs">
         <div class="sm:w-[150px]"></div>
         <div class="flex-1 sm:w-[150px]">@lang('Product')</div>

resources/views/checkout/partials/shipping/methods.blade.php

@@ -30,8 +30,8 @@
                 <div class="sm:w-3/5">@{{ method.carrier_title }}</div>
                 <div class="flex-1">@{{ method.method_title }}</div>
                 <div class="text-right text-sm font-medium">
-                    <div v-if="method.amount.value > 0" class="text-ct-inactive">@{{ method.amount.value | price }}</div>
-                    <div v-else class="text-ct-enhanced">
+                    <div v-if="method.amount.value > 0" class="text-muted">@{{ method.amount.value | price }}</div>
+                    <div v-else class="text-primary">
                         @lang('Free')
                     </div>
                 </div>

resources/views/checkout/partials/sidebar/totals.blade.php

@@ -12,7 +12,7 @@
         <small v-cloak>@{{ cart.shipping_addresses[0]?.selected_shipping_method.carrier_title }} - @{{ cart.shipping_addresses[0]?.selected_shipping_method.method_title }}</small>
     </dt>
     <dd v-cloak v-if="cart.shipping_addresses[0]?.selected_shipping_method.amount.value > 0">@{{ cart.shipping_addresses[0]?.selected_shipping_method.amount.value | price }}</dd>
-    <dd v-else class="text-ct-enhanced font-medium">
+    <dd v-else class="text-primary font-medium">
         @lang('Free')
     </dd>
 </div>

resources/views/checkout/steps/success.blade.php

@@ -7,7 +7,7 @@
             </x-rapidez-ct::title>
 
             <x-rapidez-ct::sections>
-                <x-rapidez-ct::card.inactive class="!bg-ct-accent/20">
+                <x-rapidez-ct::card.inactive class="!bg-primary/20">
                 @include('rapidez-ct::checkout.partials.sections.success.order-completed-note')
             </x-rapidez-ct::card.inactive>
             </x-rapidez-ct::sections>

resources/views/components/address.blade.php

@@ -10,8 +10,8 @@
     <div {{ $attributes->whereDoesntStartWith('v-')->class('flex flex-col') }}>
         <template v-if="!isEmpty">
             <template v-if="check">
-                <div class="bg-ct-accent absolute inset-y-0 left-0 w-1 rounded-l"></div>
-                <x-heroicon-o-check class="text-ct-accent absolute right-7 top-7 w-5" stroke-width="2.5" />
+                <div class="bg-primary absolute inset-y-0 left-0 w-1 rounded-l"></div>
+                <x-heroicon-o-check class="text-primary absolute right-7 top-7 w-5" stroke-width="2.5" />
             </template>
             <template v-else-if="disabled">
                 <x-heroicon-o-lock-closed class="absolute right-5 top-5 w-6" />

resources/views/components/button/link.blade.php

@@ -1,7 +1,7 @@
 @props(['tag'])
 <x-rapidez::tag
     is="{{ $tag ?? ($attributes->has('href') || $attributes->has('v-bind:href') ? 'a' : 'button') }}"
-    {{ $attributes->merge(['class' => 'underline text-ct-inactive text-right disabled:no-underline disabled:cursor-not-allowed disabled:opacity-50']) }}
+    {{ $attributes->merge(['class' => 'underline text-muted text-right disabled:no-underline disabled:cursor-not-allowed disabled:opacity-50']) }}
 >
     {{ $slot }}
 </x-rapidez::tag>

resources/views/components/card/address.blade.php

@@ -8,7 +8,7 @@
 
 <x-rapidez-ct::card.white
     {{ $attributes->only('v-if') }}
-    v-bind:class="{!! $attributes['v-bind:disabled'] !!} ? '!bg-ct-disabled !text-ct-inactive' : ''"
+    v-bind:class="{!! $attributes['v-bind:disabled'] !!} ? '!bg-emphasis !text-muted' : ''"
     :$check
 >
     <x-rapidez-ct::address :$attributes :$customTitle>

resources/views/components/card/inactive.blade.php

@@ -1,3 +1,3 @@
-<div {{ $attributes->class('relative bg-ct-inactive-100 px-6 pt-6 pb-6 sm:px-9 sm:pt-7 sm:pb-9 rounded') }}>
+<div {{ $attributes->class('relative bg px-6 pt-6 pb-6 sm:px-9 sm:pt-7 sm:pb-9 rounded') }}>
     {{ $slot }}
 </div>

resources/views/components/card/index.blade.php

@@ -1,4 +1,4 @@
-<div {{ $attributes->class('relative flex bg-ct-inactive-100 p-3 rounded lg:w-[340px] xl:w-[370px]') }}>
+<div {{ $attributes->class('relative flex bg p-3 rounded lg:w-[340px] xl:w-[370px]') }}>
     <x-rapidez-ct::card.white>
         {{ $slot }}
     </x-rapidez-ct::card.white>

resources/views/components/card/white.blade.php

@@ -2,7 +2,7 @@
 <div {{ $attributes->class('relative flex-1 rounded border bg-white px-8 py-6') }}>
     @if ($check)
         <template v-if="{{ $check }}">
-            <x-heroicon-o-check class="absolute right-7 top-7 w-5 text-ct-accent" stroke-width="2.5" />
+            <x-heroicon-o-check class="absolute right-7 top-7 w-5 text-primary" stroke-width="2.5" />
         </template>
     @endif
     {{ $slot }}

resources/views/components/coupon-field.blade.php

@@ -10,7 +10,7 @@
 >
     <form v-on:submit.prevent="mutate" class="flex w-full gap-x-3">
         <x-rapidez::input
-            class="text-ct-primary w-60"
+            class="w-60"
             name="couponCode"
             :placeholder="__('Coupon code')"
             v-model="variables.coupon_code"

resources/views/components/dashboard/item/index.blade.php

@@ -21,7 +21,7 @@
             </strong>
         @endif
         @if ($item['subheading'] ?? false)
-            <p class="text-ct-inactive">
+            <p class="text-muted">
                 @lang($item['subheading'])
             </p>
         @endif

resources/views/components/input/checkbox/tile.blade.php

@@ -1,13 +1,13 @@
 @props(['name' => '', 'id' => uniqid('checkbox-')])
-<label for="{{ $id }}" {{ $attributes->only('class')->class('text-ct-primary relative flex cursor-pointer select-none flex-wrap gap-x-3 text-sm [&>span]:flex-1') }}>
-    <input
-        class="text-ct-accent peer size-6 cursor-pointer rounded border-ct-border transition focus:outline-none focus:ring-0 focus:ring-offset-0"
+<label for="{{ $id }}" {{ $attributes->only('class')->class('relative flex cursor-pointer select-none flex-wrap gap-x-3 text-sm') }}>
+    <x-rapidez::input.checkbox.base
+        class="size-6 text-primary peer"
         id="{{ $id }}"
         name="{{ $name }}"
-        type="checkbox"
         {{ $attributes->except('class') }}
     />
     @isset($slot)
         <span {{ $slot->attributes->class('mt-0.5') ?? '' }}>{{ $slot }}</span>
     @endisset
+    <div class="absolute -inset-y-px -left-px w-1 rounded-l bg-primary opacity-0 transition-all peer-checked:opacity-100"></div>
 </label>