refactor:add product categories on homepage

pagebuilder
apurvab 2024-05-18 20:43:28 +05:30
parent 39ed244609
commit 45c479d572
3 changed files with 61 additions and 59 deletions

View File

@ -876,26 +876,11 @@ select {
margin-bottom: 2rem;
}
.my-\[30px\] {
margin-top: 30px;
margin-bottom: 30px;
}
.my-\[20px\] {
margin-top: 20px;
margin-bottom: 20px;
}
.my-\[35px\] {
margin-top: 35px;
margin-bottom: 35px;
}
.my-\[40px\] {
margin-top: 40px;
margin-bottom: 40px;
}
.my-\[45px\] {
margin-top: 45px;
margin-bottom: 45px;
@ -909,12 +894,12 @@ select {
margin-bottom: 3rem;
}
.mb-2 {
margin-bottom: 0.5rem;
.mb-16 {
margin-bottom: 4rem;
}
.mb-20 {
margin-bottom: 5rem;
.mb-2 {
margin-bottom: 0.5rem;
}
.mb-3 {
@ -925,10 +910,6 @@ select {
margin-bottom: 1rem;
}
.mb-6 {
margin-bottom: 1.5rem;
}
.mb-8 {
margin-bottom: 2rem;
}
@ -977,10 +958,6 @@ select {
margin-top: 6rem;
}
.mt-28 {
margin-top: 7rem;
}
.mt-3 {
margin-top: 0.75rem;
}
@ -997,8 +974,12 @@ select {
margin-top: 2rem;
}
.mb-16 {
margin-bottom: 4rem;
.mb-20 {
margin-bottom: 5rem;
}
.mb-32 {
margin-bottom: 8rem;
}
.block {
@ -2030,16 +2011,16 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
}
@media (min-width: 640px) {
.sm\:mb-4 {
margin-bottom: 1rem;
}
.sm\:flex {
display: flex;
}
.sm\:text-justify {
text-align: justify;
.sm\:flex-col {
flex-direction: column;
}
.sm\:flex-wrap {
flex-wrap: wrap;
}
.sm\:text-sm {
@ -2141,6 +2122,11 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
padding-right: 12rem;
}
.md\:text-2xl {
font-size: 1.5rem;
line-height: 2rem;
}
.md\:text-base {
font-size: 1rem;
line-height: 1.5rem;
@ -2156,11 +2142,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
line-height: 1.25rem;
}
.md\:text-2xl {
font-size: 1.5rem;
line-height: 2rem;
}
.md\:text-xl {
font-size: 1.25rem;
line-height: 1.75rem;
@ -2180,10 +2161,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
right: 0px;
}
.lg\:mt-28 {
margin-top: 7rem;
}
.lg\:mb-20 {
margin-bottom: 5rem;
}
@ -2274,14 +2251,9 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
line-height: 2rem;
}
.lg\:text-3xl {
font-size: 1.875rem;
line-height: 2.25rem;
}
.lg\:text-4xl {
font-size: 2.25rem;
line-height: 2.5rem;
.lg\:text-lg {
font-size: 1.125rem;
line-height: 1.75rem;
}
.lg\:text-xl {
@ -2289,11 +2261,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
line-height: 1.75rem;
}
.lg\:text-lg {
font-size: 1.125rem;
line-height: 1.75rem;
}
.lg\:shadow-none {
--tw-shadow: 0 0 #0000;
--tw-shadow-colored: 0 0 #0000;

View File

@ -37,6 +37,41 @@
</a>
</section>
<div class="container">
<h2 class="products-section-title text-2xl font-bold mb-16 mt-20"> Product Categories </h2>
<div class=" flex md:flex-row flex-col gap-8 lg:mb-32">
<div href="https://brooksbingham.com/module/thob/configurator?id_product=74">
<a href="https://brooksbingham.com/module/thob/configurator?id_product=74">
<img class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100" src="https://stage.brooksbingham.com/111-home_default/business-shirt.jpg"/>
<h3 class="text-center text-lg pt-4 font-semibold">Custom Made Shirts</h3>
</a>
</div>
<div>
<a href="https://brooksbingham.com/module/thob/configurator?id_product=75">
<img class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100" src="https://stage.brooksbingham.com/107-home_default/business-suit.jpg"/>
<h3 class="text-center text-lg pt-4 font-semibold">Custom Suits Online</h3>
</a>
</div>
<div>
<a href="https://brooksbingham.com/module/thob/configurator?id_product=76">
<img class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100" src="https://stage.brooksbingham.com/108-home_default/sports-jacket.jpg"/>
<h3 class="text-center text-lg pt-4 font-semibold">Sport Jackets for Men</h3>
</a>
</div>
<div>
<a href="https://brooksbingham.com/module/thob/configurator?id_product=77">
<img class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100" src="https://stage.brooksbingham.com/112-home_default/tuxedo.jpg"/>
<h3 class="text-center text-lg pt-4 font-semibold">Custom made Tuxedos</h3>
</a>
</div>
</div>
<div/>
<h1 class="font-bold md:text-2xl text-center mt-20 mb-8 ">Business Suits for Men</h1>
<h3 class="font-semibold md:text-xl text-center text-sm">Tailored business Suits designed for you to make a powerful impression and radiate confidence.</h3>

View File

@ -103,7 +103,7 @@
</div>
</div> -->
</div>
<a class="all-product-link text-2xl font-bold w-full flex items-center justify-end mt-4" href="https://brooksbingham.com/content/9-gallery">
<a class="all-product-link text-2xl font-bold w-full flex items-center justify-end mt-8" href="https://brooksbingham.com/content/9-gallery">
{l s='View More' d='Shop.Theme.Catalog'}
<svg xmlns="http://www.w3.org/2000/svg" class="icon stroke-gray-600 stroke-[3px] icon-tabler icon-tabler-chevron-right" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M9 6l6 6l-6 6" /></svg>
</a>