refactor: separate blade components to separate ui directory

This commit is contained in:
kusowl 2026-01-09 14:10:04 +05:30
parent ec7ae434c4
commit 9ddaa71acf
16 changed files with 50 additions and 50 deletions

View File

@ -6,28 +6,28 @@
Back to Home Back to Home
</a> </a>
</div> </div>
<x-card class="sm:w-96 w-full"> <x-ui.card class="sm:w-96 w-full">
<div class="flex flex-col items-center space-y-5"> <div class="flex flex-col items-center space-y-5">
<x-logo class="w-fit"/> <x-logo class="w-fit"/>
<h1 class="font-bold text-2xl">Welcome Back</h1> <h1 class="font-bold text-2xl">Welcome Back</h1>
<p class=" text-accent-600 text-sm">Sign in to your {{config('app.name')}} account</p> <p class=" text-accent-600 text-sm">Sign in to your {{config('app.name')}} account</p>
</div> </div>
<form action="" class="flex flex-col space-y-5"> <form action="" class="flex flex-col space-y-5">
<x-input label="Email" name="email" type="email" placeholder="you@example.com"/> <x-ui.input label="Email" name="email" type="email" placeholder="you@example.com"/>
<x-input label="Password" name="password" type="password"/> <x-ui.input label="Password" name="password" type="password"/>
<div class="flex flex-col md:flex-row md:justify-between space-y-4"> <div class="flex flex-col md:flex-row md:justify-between space-y-4">
<div class="flex items-center space-x-2"> <div class="flex items-center space-x-2">
<input type="checkbox" name="remember_me"> <ui.input type="checkbox" name="remember_me" />
<label class="text-sm font-bold text-accent-600">Remember me</label> <label class="text-sm font-bold text-accent-600">Remember me</label>
</div> </div>
<a class="text-blue-500 font-bold text-sm" href="">Forgot password?</a> <a class="text-blue-500 font-bold text-sm" href="">Forgot password?</a>
</div> </div>
<x-button variant="neutral">Sign In</x-button> <x-ui.button variant="neutral">Sign In</x-ui.button>
</form> </form>
<p class="text-center text-accent-600 text-xs">Don't have an account? <p class="text-center text-accent-600 text-xs">Don't have an account?
<a href="{{route('register.create')}}" class="text-blue-500 font-bold">Sign Up</a> <a href="{{route('register.create')}}" class="text-blue-500 font-bold">Sign Up</a>
</p> </p>
</x-card> </x-ui.card>
</section> </section>
</x-layout> </x-layout>

View File

@ -12,7 +12,7 @@ class="bg-linear-135 flex-1 overflow-y-scroll wrapper py-12 from-[#EFF6FF] to-[#
Back to Home Back to Home
</a> </a>
</div> </div>
<x-card class="sm:w-96 w-full "> <x-ui.card class="sm:w-96 w-full ">
<div class="flex flex-col items-center space-y-5"> <div class="flex flex-col items-center space-y-5">
<x-logo class="w-fit"/> <x-logo class="w-fit"/>
<h1 class="font-bold text-2xl">Create Account</h1> <h1 class="font-bold text-2xl">Create Account</h1>
@ -21,19 +21,19 @@ class="bg-linear-135 flex-1 overflow-y-scroll wrapper py-12 from-[#EFF6FF] to-[#
</div> </div>
<form action="{{route('register.store')}}" method="post" class="flex flex-col space-y-5"> <form action="{{route('register.store')}}" method="post" class="flex flex-col space-y-5">
@csrf @csrf
<x-input label="Full Name" name="name" placeholder="Jhon Doe"/> <x-ui.input label="Full Name" name="name" placeholder="Jhon Doe"/>
<x-input label="Email" name="email" type="email" placeholder="you@example.com"/> <x-ui.input label="Email" name="email" type="email" placeholder="you@example.com"/>
<x-select name="role" :options="$options" value-key="value" label-key="label" label="Account Type"/> <x-ui.select name="role" :options="$options" value-key="value" label-key="label" label="Account Type"/>
<x-input label="Password" name="password" type="password"/> <x-ui.input label="Password" name="password" type="password"/>
<x-input label="Confirm Password" name="password_confirmation" type="password"/> <x-ui.input label="Confirm Password" name="password_confirmation" type="password"/>
<x-button variant="neutral">Create Account</x-button> <x-ui.button variant="neutral">Create Account</x-ui.button>
</form> </form>
<p class="text-center text-accent-600 text-xs">Already have an account? <p class="text-center text-accent-600 text-xs">Already have an account?
<a href="{{route('login')}}" class="text-blue-500 font-bold">Sign In</a> <a href="{{route('login')}}" class="text-blue-500 font-bold">Sign In</a>
</p> </p>
</x-card> </x-ui.card>
</div> </div>
</section> </section>

View File

@ -8,21 +8,21 @@
Discover verified deals and recommendations that you can count on. Discover verified deals and recommendations that you can count on.
</p> </p>
<div class="flex space-x-5"> <div class="flex space-x-5">
<x-footer-icon> <x-ui.footer-icon>
<svg viewBox="0 0 1920 1920" xmlns="http://www.w3.org/2000/svg"> <svg viewBox="0 0 1920 1920" xmlns="http://www.w3.org/2000/svg">
<path <path
d="m1416.013 791.915-30.91 225.617h-371.252v789.66H788.234v-789.66H449.808V791.915h338.426V585.137c0-286.871 176.207-472.329 449.09-472.329 116.87 0 189.744 6.205 231.822 11.845l-3.272 213.66-173.5.338c-4.737-.451-117.771-9.25-199.332 65.655-52.568 48.169-79.191 117.433-79.191 205.65v181.96h402.162Zm-247.276-304.018c44.446-41.401 113.71-36.889 118.787-36.663l289.467-.113 6.204-417.504-43.544-10.717C1511.675 16.02 1426.053 0 1237.324 0 901.268 0 675.425 235.206 675.425 585.137v93.97H337v451.234h338.425V1920h451.234v-789.66h356.7l61.932-451.233H1126.66v-69.152c0-54.937 14.214-96 42.078-122.058Z" d="m1416.013 791.915-30.91 225.617h-371.252v789.66H788.234v-789.66H449.808V791.915h338.426V585.137c0-286.871 176.207-472.329 449.09-472.329 116.87 0 189.744 6.205 231.822 11.845l-3.272 213.66-173.5.338c-4.737-.451-117.771-9.25-199.332 65.655-52.568 48.169-79.191 117.433-79.191 205.65v181.96h402.162Zm-247.276-304.018c44.446-41.401 113.71-36.889 118.787-36.663l289.467-.113 6.204-417.504-43.544-10.717C1511.675 16.02 1426.053 0 1237.324 0 901.268 0 675.425 235.206 675.425 585.137v93.97H337v451.234h338.425V1920h451.234v-789.66h356.7l61.932-451.233H1126.66v-69.152c0-54.937 14.214-96 42.078-122.058Z"
fill-rule="evenodd"/> fill-rule="evenodd"/>
</svg> </svg>
</x-footer-icon> </x-ui.footer-icon>
<x-footer-icon> <x-ui.footer-icon>
<svg viewBox="0 0 31.812 26"> <svg viewBox="0 0 31.812 26">
<path <path
d="M20.877,2.000 C22.519,2.000 24.382,2.652 25.426,3.738 C26.724,3.486 27.949,3.025 29.050,2.386 C28.625,3.687 27.718,4.779 26.540,5.469 C27.693,5.332 28.797,5.035 29.820,4.590 C29.054,5.707 28.087,6.690 26.971,7.477 C26.981,7.715 26.987,7.955 26.987,8.195 C26.987,15.562 21.445,24.000 10.939,24.000 C7.715,24.000 4.507,23.133 1.982,21.551 C2.428,21.605 2.883,21.631 3.343,21.631 C6.019,21.631 8.482,20.740 10.439,19.242 C7.937,19.199 5.827,17.586 5.103,15.373 C5.450,15.437 5.810,15.473 6.178,15.473 C6.696,15.473 7.203,15.406 7.681,15.277 C5.068,14.768 3.100,12.514 3.100,9.813 C3.100,9.787 3.100,9.764 3.100,9.740 C3.871,10.158 4.750,10.410 5.687,10.440 C4.154,9.437 3.147,7.734 3.147,5.799 C3.147,4.777 3.428,3.818 3.919,2.998 C6.735,6.367 10.945,8.588 15.693,8.822 C15.594,8.414 15.543,7.984 15.543,7.553 C15.543,4.473 17.721,2.000 20.877,2.000 M29.820,4.590 L29.825,4.590 M20.877,-0.000 C17.033,-0.000 14.060,2.753 13.614,6.552 C10.425,5.905 7.524,4.204 5.440,1.711 C5.061,1.257 4.503,0.998 3.919,0.998 C3.867,0.998 3.815,1.000 3.763,1.004 C3.123,1.055 2.547,1.413 2.216,1.966 C1.525,3.122 1.159,4.447 1.159,5.799 C1.159,6.700 1.321,7.579 1.625,8.400 C1.300,8.762 1.113,9.238 1.113,9.740 L1.113,9.813 C1.113,11.772 1.882,13.589 3.160,14.952 C3.087,15.294 3.103,15.655 3.215,15.998 C3.657,17.348 4.459,18.510 5.499,19.396 C4.800,19.552 4.079,19.631 3.343,19.631 C2.954,19.631 2.577,19.609 2.222,19.565 C2.141,19.556 2.061,19.551 1.981,19.551 C1.148,19.551 0.391,20.078 0.108,20.886 C-0.202,21.770 0.140,22.753 0.932,23.249 C3.764,25.023 7.318,26.000 10.939,26.000 C17.778,26.000 22.025,22.843 24.383,20.195 C27.243,16.984 28.907,12.718 28.972,8.455 C29.899,7.682 30.717,6.790 31.410,5.792 C31.661,5.458 31.810,5.041 31.810,4.590 C31.810,3.909 31.473,3.308 30.958,2.946 C31.181,2.176 30.925,1.342 30.303,0.833 C29.940,0.537 29.496,0.386 29.049,0.386 C28.708,0.386 28.365,0.474 28.056,0.654 C27.391,1.040 26.680,1.344 25.931,1.562 C24.555,0.592 22.688,-0.000 20.877,-0.000 L20.877,-0.000 Z"/> d="M20.877,2.000 C22.519,2.000 24.382,2.652 25.426,3.738 C26.724,3.486 27.949,3.025 29.050,2.386 C28.625,3.687 27.718,4.779 26.540,5.469 C27.693,5.332 28.797,5.035 29.820,4.590 C29.054,5.707 28.087,6.690 26.971,7.477 C26.981,7.715 26.987,7.955 26.987,8.195 C26.987,15.562 21.445,24.000 10.939,24.000 C7.715,24.000 4.507,23.133 1.982,21.551 C2.428,21.605 2.883,21.631 3.343,21.631 C6.019,21.631 8.482,20.740 10.439,19.242 C7.937,19.199 5.827,17.586 5.103,15.373 C5.450,15.437 5.810,15.473 6.178,15.473 C6.696,15.473 7.203,15.406 7.681,15.277 C5.068,14.768 3.100,12.514 3.100,9.813 C3.100,9.787 3.100,9.764 3.100,9.740 C3.871,10.158 4.750,10.410 5.687,10.440 C4.154,9.437 3.147,7.734 3.147,5.799 C3.147,4.777 3.428,3.818 3.919,2.998 C6.735,6.367 10.945,8.588 15.693,8.822 C15.594,8.414 15.543,7.984 15.543,7.553 C15.543,4.473 17.721,2.000 20.877,2.000 M29.820,4.590 L29.825,4.590 M20.877,-0.000 C17.033,-0.000 14.060,2.753 13.614,6.552 C10.425,5.905 7.524,4.204 5.440,1.711 C5.061,1.257 4.503,0.998 3.919,0.998 C3.867,0.998 3.815,1.000 3.763,1.004 C3.123,1.055 2.547,1.413 2.216,1.966 C1.525,3.122 1.159,4.447 1.159,5.799 C1.159,6.700 1.321,7.579 1.625,8.400 C1.300,8.762 1.113,9.238 1.113,9.740 L1.113,9.813 C1.113,11.772 1.882,13.589 3.160,14.952 C3.087,15.294 3.103,15.655 3.215,15.998 C3.657,17.348 4.459,18.510 5.499,19.396 C4.800,19.552 4.079,19.631 3.343,19.631 C2.954,19.631 2.577,19.609 2.222,19.565 C2.141,19.556 2.061,19.551 1.981,19.551 C1.148,19.551 0.391,20.078 0.108,20.886 C-0.202,21.770 0.140,22.753 0.932,23.249 C3.764,25.023 7.318,26.000 10.939,26.000 C17.778,26.000 22.025,22.843 24.383,20.195 C27.243,16.984 28.907,12.718 28.972,8.455 C29.899,7.682 30.717,6.790 31.410,5.792 C31.661,5.458 31.810,5.041 31.810,4.590 C31.810,3.909 31.473,3.308 30.958,2.946 C31.181,2.176 30.925,1.342 30.303,0.833 C29.940,0.537 29.496,0.386 29.049,0.386 C28.708,0.386 28.365,0.474 28.056,0.654 C27.391,1.040 26.680,1.344 25.931,1.562 C24.555,0.592 22.688,-0.000 20.877,-0.000 L20.877,-0.000 Z"/>
</svg> </svg>
</x-footer-icon> </x-ui.footer-icon>
<x-footer-icon> <x-ui.footer-icon>
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"> <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" <path fill-rule="evenodd" clip-rule="evenodd"
d="M12 18C15.3137 18 18 15.3137 18 12C18 8.68629 15.3137 6 12 6C8.68629 6 6 8.68629 6 12C6 15.3137 8.68629 18 12 18ZM12 16C14.2091 16 16 14.2091 16 12C16 9.79086 14.2091 8 12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16Z" d="M12 18C15.3137 18 18 15.3137 18 12C18 8.68629 15.3137 6 12 6C8.68629 6 6 8.68629 6 12C6 15.3137 8.68629 18 12 18ZM12 16C14.2091 16 16 14.2091 16 12C16 9.79086 14.2091 8 12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16Z"
@ -34,14 +34,14 @@ class="fill-[#BDC1D2]"/>
d="M1.65396 4.27606C1 5.55953 1 7.23969 1 10.6V13.4C1 16.7603 1 18.4405 1.65396 19.7239C2.2292 20.8529 3.14708 21.7708 4.27606 22.346C5.55953 23 7.23969 23 10.6 23H13.4C16.7603 23 18.4405 23 19.7239 22.346C20.8529 21.7708 21.7708 20.8529 22.346 19.7239C23 18.4405 23 16.7603 23 13.4V10.6C23 7.23969 23 5.55953 22.346 4.27606C21.7708 3.14708 20.8529 2.2292 19.7239 1.65396C18.4405 1 16.7603 1 13.4 1H10.6C7.23969 1 5.55953 1 4.27606 1.65396C3.14708 2.2292 2.2292 3.14708 1.65396 4.27606ZM13.4 3H10.6C8.88684 3 7.72225 3.00156 6.82208 3.0751C5.94524 3.14674 5.49684 3.27659 5.18404 3.43597C4.43139 3.81947 3.81947 4.43139 3.43597 5.18404C3.27659 5.49684 3.14674 5.94524 3.0751 6.82208C3.00156 7.72225 3 8.88684 3 10.6V13.4C3 15.1132 3.00156 16.2777 3.0751 17.1779C3.14674 18.0548 3.27659 18.5032 3.43597 18.816C3.81947 19.5686 4.43139 20.1805 5.18404 20.564C5.49684 20.7234 5.94524 20.8533 6.82208 20.9249C7.72225 20.9984 8.88684 21 10.6 21H13.4C15.1132 21 16.2777 20.9984 17.1779 20.9249C18.0548 20.8533 18.5032 20.7234 18.816 20.564C19.5686 20.1805 20.1805 19.5686 20.564 18.816C20.7234 18.5032 20.8533 18.0548 20.9249 17.1779C20.9984 16.2777 21 15.1132 21 13.4V10.6C21 8.88684 20.9984 7.72225 20.9249 6.82208C20.8533 5.94524 20.7234 5.49684 20.564 5.18404C20.1805 4.43139 19.5686 3.81947 18.816 3.43597C18.5032 3.27659 18.0548 3.14674 17.1779 3.0751C16.2777 3.00156 15.1132 3 13.4 3Z" d="M1.65396 4.27606C1 5.55953 1 7.23969 1 10.6V13.4C1 16.7603 1 18.4405 1.65396 19.7239C2.2292 20.8529 3.14708 21.7708 4.27606 22.346C5.55953 23 7.23969 23 10.6 23H13.4C16.7603 23 18.4405 23 19.7239 22.346C20.8529 21.7708 21.7708 20.8529 22.346 19.7239C23 18.4405 23 16.7603 23 13.4V10.6C23 7.23969 23 5.55953 22.346 4.27606C21.7708 3.14708 20.8529 2.2292 19.7239 1.65396C18.4405 1 16.7603 1 13.4 1H10.6C7.23969 1 5.55953 1 4.27606 1.65396C3.14708 2.2292 2.2292 3.14708 1.65396 4.27606ZM13.4 3H10.6C8.88684 3 7.72225 3.00156 6.82208 3.0751C5.94524 3.14674 5.49684 3.27659 5.18404 3.43597C4.43139 3.81947 3.81947 4.43139 3.43597 5.18404C3.27659 5.49684 3.14674 5.94524 3.0751 6.82208C3.00156 7.72225 3 8.88684 3 10.6V13.4C3 15.1132 3.00156 16.2777 3.0751 17.1779C3.14674 18.0548 3.27659 18.5032 3.43597 18.816C3.81947 19.5686 4.43139 20.1805 5.18404 20.564C5.49684 20.7234 5.94524 20.8533 6.82208 20.9249C7.72225 20.9984 8.88684 21 10.6 21H13.4C15.1132 21 16.2777 20.9984 17.1779 20.9249C18.0548 20.8533 18.5032 20.7234 18.816 20.564C19.5686 20.1805 20.1805 19.5686 20.564 18.816C20.7234 18.5032 20.8533 18.0548 20.9249 17.1779C20.9984 16.2777 21 15.1132 21 13.4V10.6C21 8.88684 20.9984 7.72225 20.9249 6.82208C20.8533 5.94524 20.7234 5.49684 20.564 5.18404C20.1805 4.43139 19.5686 3.81947 18.816 3.43597C18.5032 3.27659 18.0548 3.14674 17.1779 3.0751C16.2777 3.00156 15.1132 3 13.4 3Z"
class="fill-[#BDC1D2]"/> class="fill-[#BDC1D2]"/>
</svg> </svg>
</x-footer-icon> </x-ui.footer-icon>
<x-footer-icon> <x-ui.footer-icon>
<svg viewBox="0 0 1920 1920" xmlns="http://www.w3.org/2000/svg"> <svg viewBox="0 0 1920 1920" xmlns="http://www.w3.org/2000/svg">
<path <path
d="M1168 601.321v74.955c72.312-44.925 155.796-71.11 282.643-71.11 412.852 0 465.705 308.588 465.705 577.417v733.213L1438.991 1920v-701.261c0-117.718-42.162-140.06-120.12-140.06-74.114 0-120.12 23.423-120.12 140.06V1920l-483.604-4.204V601.32H1168Zm-687.52-.792v1318.918H0V600.53h480.48Zm-120.12 120.12H120.12v1078.678h240.24V720.65Zm687.52.792H835.267v1075.316l243.364 2.162v-580.18c0-226.427 150.51-260.18 240.24-260.18 109.55 0 240.24 45.165 240.24 260.18v580.18l237.117-2.162v-614.174c0-333.334-93.573-457.298-345.585-457.298-151.472 0-217.057 44.925-281.322 98.98l-16.696 14.173H1047.88V721.441ZM240.24 0c132.493 0 240.24 107.748 240.24 240.24 0 132.493-107.747 240.24-240.24 240.24C107.748 480.48 0 372.733 0 240.24 0 107.748 107.748 0 240.24 0Zm0 120.12c-66.186 0-120.12 53.934-120.12 120.12s53.934 120.12 120.12 120.12 120.12-53.934 120.12-120.12-53.934-120.12-120.12-120.12Z" d="M1168 601.321v74.955c72.312-44.925 155.796-71.11 282.643-71.11 412.852 0 465.705 308.588 465.705 577.417v733.213L1438.991 1920v-701.261c0-117.718-42.162-140.06-120.12-140.06-74.114 0-120.12 23.423-120.12 140.06V1920l-483.604-4.204V601.32H1168Zm-687.52-.792v1318.918H0V600.53h480.48Zm-120.12 120.12H120.12v1078.678h240.24V720.65Zm687.52.792H835.267v1075.316l243.364 2.162v-580.18c0-226.427 150.51-260.18 240.24-260.18 109.55 0 240.24 45.165 240.24 260.18v580.18l237.117-2.162v-614.174c0-333.334-93.573-457.298-345.585-457.298-151.472 0-217.057 44.925-281.322 98.98l-16.696 14.173H1047.88V721.441ZM240.24 0c132.493 0 240.24 107.748 240.24 240.24 0 132.493-107.747 240.24-240.24 240.24C107.748 480.48 0 372.733 0 240.24 0 107.748 107.748 0 240.24 0Zm0 120.12c-66.186 0-120.12 53.934-120.12 120.12s53.934 120.12 120.12 120.12 120.12-53.934 120.12-120.12-53.934-120.12-120.12-120.12Z"
fill-rule="evenodd"/> fill-rule="evenodd"/>
</svg> </svg>
</x-footer-icon> </x-ui.footer-icon>
</div> </div>
</article> </article>

View File

@ -7,15 +7,15 @@
<section class="grid grid-cols-1 md:grid-cols-2 gap-8"> <section class="grid grid-cols-1 md:grid-cols-2 gap-8">
<!-- left section, contact form --> <!-- left section, contact form -->
<x-card class="bg-[#F9FAFB]! shadow-none!"> <x-ui.card class="bg-[#F9FAFB]! shadow-none!">
<form action="" class=" flex flex-col space-y-6"> <form action="" class=" flex flex-col space-y-6">
<x-input label="Name" name="name" placeholder="Your name"/> <x-ui.input label="Name" name="name" placeholder="Your name"/>
<x-input label="Email" name="email" placeholder="your.email@example.com" type="email"/> <x-ui.input label="Email" name="email" placeholder="your.email@example.com" type="email"/>
<x-textarea label="Message" name="message" placeholder="Tell us how we can help..."/> <x-ui.textarea label="Message" name="message" placeholder="Tell us how we can help..."/>
<x-button type="submit" variant="neutral">Send Message</x-button> <x-ui.button type="submit" variant="neutral">Send Message</x-ui.button>
</form> </form>
</x-card> </x-ui.card>
<!-- right section, contact details--> <!-- right section, contact details-->
<div class="mt-2 flex flex-col space-y-6"> <div class="mt-2 flex flex-col space-y-6">

View File

@ -7,8 +7,8 @@
<section class="grid grid-cols-1 md:grid-cols-3 gap-x-8 gap-y-12"> <section class="grid grid-cols-1 md:grid-cols-3 gap-x-8 gap-y-12">
<x-card class="relative"> <x-ui.card class="relative">
<x-card-number text="01" /> <x-ui.card-number text="01" />
<div class="p-4 rounded-lg w-fit bg-linear-135 from-[#DEEAFE] to-[#EEEAFF] text-blue-700"> <div class="p-4 rounded-lg w-fit bg-linear-135 from-[#DEEAFE] to-[#EEEAFF] text-blue-700">
<x-heroicon-o-user-plus class="w-8"/> <x-heroicon-o-user-plus class="w-8"/>
</div> </div>
@ -17,10 +17,10 @@
<p class="text-accent-600 text-md">Verified brokers share exclusive deals, services and recommendations on <p class="text-accent-600 text-md">Verified brokers share exclusive deals, services and recommendations on
the platform.</p> the platform.</p>
</x-card> </x-ui.card>
<x-card class="relative"> <x-ui.card class="relative">
<x-card-number text="02" /> <x-ui.card-number text="02" />
<div class="p-4 rounded-lg w-fit bg-linear-135 from-[#DEEAFE] to-[#EEEAFF] text-blue-700"> <div class="p-4 rounded-lg w-fit bg-linear-135 from-[#DEEAFE] to-[#EEEAFF] text-blue-700">
<x-heroicon-o-eye class="w-8"/> <x-heroicon-o-eye class="w-8"/>
</div> </div>
@ -29,10 +29,10 @@
<p class="text-accent-600 text-md">Browse, search, like and save deals. Click through to learn more and <p class="text-accent-600 text-md">Browse, search, like and save deals. Click through to learn more and
contact brokers directly.</p> contact brokers directly.</p>
</x-card> </x-ui.card>
<x-card class="relative"> <x-ui.card class="relative">
<x-card-number text="03" /> <x-ui.card-number text="03" />
<div class="p-4 rounded-lg w-fit bg-linear-135 from-[#DEEAFE] to-[#EEEAFF] text-blue-700"> <div class="p-4 rounded-lg w-fit bg-linear-135 from-[#DEEAFE] to-[#EEEAFF] text-blue-700">
<x-heroicon-o-arrow-trending-up class="w-8"/> <x-heroicon-o-arrow-trending-up class="w-8"/>
</div> </div>
@ -41,6 +41,6 @@
<p class="text-accent-600 text-md">The most engaging deals automatically rise to the top, helping you <p class="text-accent-600 text-md">The most engaging deals automatically rise to the top, helping you
discover the best opportunities.</p> discover the best opportunities.</p>
</x-card> </x-ui.card>
</section> </section>
</section> </section>

View File

@ -14,15 +14,15 @@
</ul> </ul>
</div> </div>
<div class="nav-buttons space-x-4 font-medium hidden md:block "> <div class="nav-ui.buttons space-x-4 font-medium hidden md:block ">
<a href="{{route('login')}}">Login</a> <a href="{{route('login')}}">Login</a>
<a href="{{route('register.create')}}" class="ui-btn ui-btn-neutral">Register</a> <a href="{{route('register.create')}}" class="ui-btn ui-btn-neutral">Register</a>
</div> </div>
<!-- mobile menu btn--> <!-- mobile menu btn-->
<x-button class="md:hidden" id="openBtn"> <x-ui.button class="md:hidden" id="openBtn">
<x-heroicon-o-bars-3 class="w-8"/> <x-heroicon-o-bars-3 class="w-8"/>
</x-button> </x-ui.button>
</nav> </nav>
@ -30,9 +30,9 @@
<div id='mobileMenu' class="hidden absolute top-0 h-[101vh] overflow-y-hidden w-[101vw] bg-gray-200 text-xl z-1 p-10"> <div id='mobileMenu' class="hidden absolute top-0 h-[101vh] overflow-y-hidden w-[101vw] bg-gray-200 text-xl z-1 p-10">
<div class="flex justify-between mb-8"> <div class="flex justify-between mb-8">
<x-logo/> <x-logo/>
<x-button id="closeBtn"> <x-ui.button id="closeBtn">
<x-heroicon-o-x-mark class="w-8 ml-auto"/> <x-heroicon-o-x-mark class="w-8 ml-auto"/>
</x-button> </x-ui.button>
</div> </div>
<div class="nav-links mb-10"> <div class="nav-links mb-10">
<ul class="flex flex-col space-y-8 text-accent-600"> <ul class="flex flex-col space-y-8 text-accent-600">

View File

@ -6,5 +6,5 @@
@endif @endif
<input class="bg-[#F3F3F5] py-2 px-4 rounded-lg" type="{{$type}}" placeholder="{{$placeholder}}" <input class="bg-[#F3F3F5] py-2 px-4 rounded-lg" type="{{$type}}" placeholder="{{$placeholder}}"
name="{{$name}}"> name="{{$name}}">
<x-inline-error :name="$name" /> <x-ui.inline-error :name="$name" />
</div> </div>

View File

@ -10,4 +10,4 @@
<option value="{{$option[$valueKey]}}"> {{$option[$labelKey]}} </option> <option value="{{$option[$valueKey]}}"> {{$option[$labelKey]}} </option>
@endforeach @endforeach
</select> </select>
<x-inline-error :name="$name" /> <x-ui.inline-error :name="$name" />

View File

@ -6,29 +6,29 @@
</p> </p>
<section class="grid grid-cols-1 md:grid-cols-3 gap-8"> <section class="grid grid-cols-1 md:grid-cols-3 gap-8">
<x-card> <x-ui.card>
<div class="p-4 rounded-lg bg-blue-100 text-blue-700 w-fit"> <div class="p-4 rounded-lg bg-blue-100 text-blue-700 w-fit">
<x-heroicon-o-shield-check class="w-8"/> <x-heroicon-o-shield-check class="w-8"/>
</div> </div>
<h3 class="font-bold">Verified Brokers</h3> <h3 class="font-bold">Verified Brokers</h3>
<p class="text-accent-600 text-md">All brokers are verified and vetted to ensure trustworthy recommendations and deals.</p> <p class="text-accent-600 text-md">All brokers are verified and vetted to ensure trustworthy recommendations and deals.</p>
</x-card> </x-ui.card>
<x-card> <x-ui.card>
<div class="p-4 rounded-lg bg-[#F0EBFF] text-[#9470F9] w-fit"> <div class="p-4 rounded-lg bg-[#F0EBFF] text-[#9470F9] w-fit">
<x-heroicon-o-arrow-trending-up class="w-8"/> <x-heroicon-o-arrow-trending-up class="w-8"/>
</div> </div>
<h3 class="font-bold">Trending Recommendations</h3> <h3 class="font-bold">Trending Recommendations</h3>
<p class="text-accent-600 text-md">Discover what's hot and trending based on real user interactions and feedback.</p> <p class="text-accent-600 text-md">Discover what's hot and trending based on real user interactions and feedback.</p>
</x-card> </x-ui.card>
<x-card> <x-ui.card>
<div class="p-4 rounded-lg bg-[#F9EBF3] text-[#DB5A84] w-fit"> <div class="p-4 rounded-lg bg-[#F9EBF3] text-[#DB5A84] w-fit">
<x-heroicon-o-magnifying-glass class="w-8"/> <x-heroicon-o-magnifying-glass class="w-8"/>
</div> </div>
<h3 class="font-bold">Smart discovery</h3> <h3 class="font-bold">Smart discovery</h3>
<p class="text-accent-600 text-md">Find exactly what you need with our intelligent search and category filtering.</p> <p class="text-accent-600 text-md">Find exactly what you need with our intelligent search and category filtering.</p>
</x-card> </x-ui.card>
</section> </section>
</section> </section>