mohitj
/
theme-elegance
forked from brooksbingham/theme-elegance
1
0
Fork 0
Code Pull Requests Activity

chore: merge staging latest

staging
jatin 2024-07-04 17:26:44 +05:30
parent eba682fdaa 57eb8e4b41
commit 910777cd0d
3 changed files with 240 additions and 199 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

180
assets/css/theme.css
View File

@ -787,10 +787,6 @@ select {
bottom: 0.25rem;
}
.bottom-9 {
bottom: 2.25rem;
}
.bottom-\[50\%\] {
bottom: 50%;
}
@ -924,11 +920,6 @@ select {
margin-bottom: 0.125rem;
}
.my-12 {
margin-top: 3rem;
margin-bottom: 3rem;
}
.my-2 {
margin-top: 0.5rem;
margin-bottom: 0.5rem;
@ -949,11 +940,6 @@ select {
margin-bottom: 2rem;
}
.my-16 {
margin-top: 4rem;
margin-bottom: 4rem;
}
.mb-1 {
margin-bottom: 0.25rem;
}
@ -1090,10 +1076,6 @@ select {
aspect-ratio: 342/513;
}
.h-1\/2 {
height: 50%;
}
.h-12 {
height: 3rem;
}
@ -1126,8 +1108,12 @@ select {
height: 20px;
}
.h-\[30px\] {
height: 30px;
.h-\[30vh\] {
height: 30vh;
}
.h-\[40vh\] {
height: 40vh;
}
.h-\[50px\] {
@ -1146,26 +1132,6 @@ select {
height: 100%;
}
.h-4\/5 {
height: 80%;
}
.h-\[80vh\] {
height: 80vh;
}
.h-\[70vh\] {
height: 70vh;
}
.h-\[40vh\] {
height: 40vh;
}
.h-\[30vh\] {
height: 30vh;
}
.max-h-\[40px\] {
max-height: 40px;
}
@ -1314,6 +1280,10 @@ select {
list-style-type: square;
}
.list-disc {
list-style-type: disc;
}
.grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
@ -1407,6 +1377,11 @@ select {
column-gap: 0.25rem;
}
.gap-x-20 {
-moz-column-gap: 5rem;
column-gap: 5rem;
}
.gap-y-1 {
row-gap: 0.25rem;
}
@ -1522,6 +1497,11 @@ select {
border-color: rgb(255 255 255 / var(--tw-border-opacity));
}
.bg-\[\#E6DFD4\] {
--tw-bg-opacity: 1;
background-color: rgb(230 223 212 / var(--tw-bg-opacity));
}
.bg-black\/70 {
background-color: rgb(0 0 0 / 0.7);
}
@ -1561,25 +1541,6 @@ select {
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.bg-neutral-400 {
--tw-bg-opacity: 1;
background-color: rgb(163 163 163 / var(--tw-bg-opacity));
}
.bg-neutral-100 {
--tw-bg-opacity: 1;
background-color: rgb(245 245 245 / var(--tw-bg-opacity));
}
.bg-\[\#E6DFD4\] {
--tw-bg-opacity: 1;
background-color: rgb(230 223 212 / var(--tw-bg-opacity));
}
.bg-transparent {
background-color: transparent;
}
.stroke-black {
stroke: #000;
}
@ -1604,21 +1565,11 @@ select {
stroke-width: 3px;
}
.object-contain {
-o-object-fit: contain;
object-fit: contain;
}
.object-cover {
-o-object-fit: cover;
object-fit: cover;
}
.object-fill {
-o-object-fit: fill;
object-fit: fill;
}
.object-scale-down {
-o-object-fit: scale-down;
object-fit: scale-down;
@ -1652,6 +1603,11 @@ select {
padding: 2rem;
}
.px-0 {
padding-left: 0px;
padding-right: 0px;
}
.px-2 {
padding-left: 0.5rem;
padding-right: 0.5rem;
@ -1839,11 +1795,6 @@ select {
line-height: 2rem;
}
.text-4xl {
font-size: 2.25rem;
line-height: 2.5rem;
}
.text-5xl {
font-size: 3rem;
line-height: 1;
@ -1906,11 +1857,6 @@ select {
line-height: 1;
}
.text-\[\#000E2A\] {
--tw-text-opacity: 1;
color: rgb(0 14 42 / var(--tw-text-opacity));
}
.text-blue-900 {
--tw-text-opacity: 1;
color: rgb(30 58 138 / var(--tw-text-opacity));
@ -2346,14 +2292,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
position: absolute;
}
.md\:bottom-28 {
bottom: 7rem;
}
.md\:right-12 {
right: 3rem;
}
.md\:my-24 {
margin-top: 6rem;
margin-bottom: 6rem;
@ -2391,10 +2329,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
display: none;
}
.md\:h-\[200px\] {
height: 200px;
}
.md\:h-\[300px\] {
height: 300px;
}
@ -2407,14 +2341,14 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
height: 40px;
}
.md\:h-\[80vh\] {
height: 80vh;
}
.md\:h-\[70vh\] {
height: 70vh;
}
.md\:h-\[80vh\] {
height: 80vh;
}
.md\:h-full {
height: 100%;
}
@ -2475,6 +2409,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
width: 70%;
}
.md\:grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.md\:grid-cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
@ -2524,9 +2462,9 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
padding: 2rem;
}
.md\:px-10 {
padding-left: 2.5rem;
padding-right: 2.5rem;
.md\:px-12 {
padding-left: 3rem;
padding-right: 3rem;
}
.md\:px-4 {
@ -2570,6 +2508,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
padding-top: 0px;
}
.md\:pt-11 {
padding-top: 2.75rem;
}
.md\:pt-12 {
padding-top: 3rem;
}
@ -2578,6 +2520,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
padding-top: 0.75rem;
}
.md\:pt-5 {
padding-top: 1.25rem;
}
.md\:pt-6 {
padding-top: 1.5rem;
}
@ -2586,10 +2532,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
padding-top: 1.75rem;
}
.md\:pt-8 {
padding-top: 2rem;
}
.md\:text-left {
text-align: left;
}
@ -2656,23 +2598,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
bottom: 0.75rem;
}
.lg\:bottom-48 {
bottom: 12rem;
}
.lg\:right-0 {
right: 0px;
}
.lg\:right-20 {
right: 5rem;
}
.lg\:my-20 {
margin-top: 5rem;
margin-bottom: 5rem;
}
.lg\:my-32 {
margin-top: 8rem;
margin-bottom: 8rem;
@ -2702,10 +2631,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
display: none;
}
.lg\:h-\[300px\] {
height: 300px;
}
.lg\:h-\[400px\] {
height: 400px;
}
@ -2814,11 +2739,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
padding-bottom: 0px;
}
.lg\:py-8 {
padding-top: 2rem;
padding-bottom: 2rem;
}
.lg\:pb-6 {
padding-bottom: 1.5rem;
}
@ -2847,10 +2767,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
padding-top: 3rem;
}
.lg\:pt-16 {
padding-top: 4rem;
}
.lg\:pt-24 {
padding-top: 6rem;
}
@ -2912,14 +2828,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
}
@media (min-width: 1280px) {
.xl\:right-56 {
right: 14rem;
}
.xl\:h-\[460px\] {
height: 460px;
}
.xl\:w-1\/4 {
width: 25%;
}

187
templates/catalog/_partials/products.tpl
View File

@ -23,6 +23,7 @@
* International Registered Trademark & Property of PrestaShop SA
*}
{if $page.meta.title == 'Custom made' || $page.meta.title == 'custom made' || $page.meta.title == 'Custom Made' || $page.meta.title == 'custom'}
<div class=" mx-auto h-[50vh] flex flex-col justify-center ">
<h1 class="lg:font-semibold
@ -44,6 +45,7 @@
Step into our world of custom-made luxury with Brooks Bingham, offering you Custom Business Shirts,
Custom Sport Jackets, Custom Made Tuxedos, and more. </p>
</div>
{/if}
<div id="js-product-list" class="flex flex-col">
<div class="products flex flex-wrap">
@ -54,9 +56,12 @@
{/foreach}
</div>
{if $page.meta.title != 'Custom made' && $page.meta.title != 'custom made' && $page.meta.title != 'Custom Made' && $page.meta.title != 'custom'}
{block name='pagination'}
{include file='_partials/pagination.tpl' pagination=$listing.pagination}
{/block}
{/if}
<div class="flex justify-center md:hidden my-8">
<a href="#js-product-list-header" class="btn btn-secondary font-semibold">
@ -66,45 +71,27 @@
</div>
<div class="relative
flex
mt-16
h-1/2
mx-auto">
<img class="w-full scale-down"
src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/custom_page_banner_image.jpeg"
alt="Image">
<div class="absolute
xl:right-56
lg:right-20
md:right-12
right-4
lg:bottom-48
md:bottom-28
bottom-9
text-[#000E2A]
text-left
lg:text-4xl
md:text-2xl
text-xs
font-bold">
<h1> Because You Are Unique. </h1>
<h1> So Is Your Body… </h1>
</div>
{if $page.meta.title == 'Custom made' || $page.meta.title == 'custom made' || $page.meta.title == 'Custom Made' || $page.meta.title == 'custom'}
<div class="mb-12 w-full lg:h-[90vh]" style="clip-path: inset(4px)">
<video autoplay muted loop class="w-full h-auto object-cover" style="background-color: rgba(0, 0, 0, 0)">
<source src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/slider.mp4"
type="video/mp4" >
</video>
</div>
<div class="flex flex-col-reverse md:flex-row items-center md:mt-24 mt-16 mx-auto">
<div class="mx-3 w-full md:w-[70%] text-center md:text-left xl:pl-12 lg:pl-2 pl-0">
<h1 class="font-bold lg:text-3xl md:text-2xl text-xl">
Custom Fit for your Comfort
</h1>
<p class="lg:text-xl font-medium pt-5">
Custom-made shirts and tuxedos are tailored specifically for you, offering an unparalleled fit.
Experience unmatched comfort and style with our tailored suits, crafted to celebrate your uniqueness.
Custom-made tuxedos are tailored specifically for you, offering an unparalleled fit.
Experience unmatched comfort and style with our tailored tuxedos, crafted to celebrate your uniqueness.
</p>
<a class="all-product-link text-xl font-bold mt-8 flex items-center justify-center md:justify-start"
href="https://brooksbingham.com/17-custom-made-clothing">
Design Your Suit
href="https://brooksbingham.com/module/thob/configurator?id_product=77">
Design Your Tuxedos
<svg xmlns="http://www.w3.org/2000/svg"
class="icon stroke-gray-600 stroke-[3px] icon-tabler icon-tabler-chevron-right"
width="24"
@ -142,7 +129,7 @@
from ready-to-wear options but is also designed to be durable.
</p>
<a class="all-product-link text-xl font-bold mt-8 flex items-center justify-center md:justify-start"
href="https://brooksbingham.com/17-custom-made-clothing">
href="https://brooksbingham.com/module/thob/configurator?id_product=75">
Design Your Suit
<svg xmlns="http://www.w3.org/2000/svg"
class="icon stroke-gray-600 stroke-[3px] icon-tabler icon-tabler-chevron-right"
@ -174,7 +161,9 @@
justify-between
my-20">
<div class="center pb-6">
<h2 class="text-4xl
<h2 class="lg:text-3xl
md:text-2xl
text-xl
font-bold
text-center">
Customize Your Apparel in 3 Steps: </h2>
@ -293,39 +282,113 @@
</div>
<div class="mx-auto lg:my-20 my-12 flex flex-col justify-center px-4 md:px-10 lg:px-20">
<div class="mx-auto mb-20 flex flex-col">
<h1 class="font-bold text-xl md:text-2xl lg:text-3xl text-center">
How Can You Get Measured?
</h1>
<div class="pt-8 md:pt-12 lg:pt-16">
<ul class="font-medium text-sm md:text-xl space-y-2">
<li>- Simply scan the QR code at checkout.</li>
<li>- Carefully watch the instruction video.</li>
<li>- Next, you will have 2 photos taken to collect all needed measurements to create your custom fit.</li>
</ul>
</div>
<h2 class="font-semibold text-sm md:text-lg lg:text-xl pt-6 md:pt-8 lg:py-8 pb-10">
(Disclaimer: Please follow the instruction video closely as it will guide you to wear specific clothing, stand barefoot, etc.)
</h2>
<div class="flex justify-end">
<a class="all-product-link lg:text-xl md:text-lg text-sm font-bold flex items-center "
href="https://stage.brooksbingham.com/content/10-measurement">
Know more
<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>
<div class="md:pt-12 pt-9 lg:px-20 md:px-12 px-0">
<ul class="md:grid
md:grid-cols-2
md:gap-10
gap-x-20">
<li class="border-2
p-5
pb-10
">
<div class="flex
flex-col
items-center">
<div class="mt-4">
<h4 class="md:text-xl
text-lg
text-center
leading-6
font-bold
text-gray-900
pb-2">
Manual Measurement</h4>
<div class="md:pt-5 pt-3 font-medium text-lg">
<ul class="space-y-2 list-disc lg:text-lg md:text-md text-sm">
<li>Choose from a wide range of trendy fabrics updated every seasons</li>
<li>Choose from a wide range of trendy fabrics updated every seasons</li>
<li>Choose from a wide range of trendy fabrics updated every seasons</li>
</ul>
</div>
<div class="flex justify-end md:pt-11 pt-7">
<a class="all-product-link lg:text-lg text-md font-bold flex items-center "
href="https://stage.brooksbingham.com/content/11-manual-measurement"> Know more
<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>
</div>
</div>
</div>
</li>
<li class="border-2
p-5">
<div class="flex
flex-col
items-center">
<div class="mt-4">
<h4 class="md:text-xl
text-lg
text-center
leading-6
font-bold
text-gray-900
pb-2">
Automated Measurement </h4>
<div class="md:pt-5 pt-3 font-medium text-lg">
<ul class="space-y-2 list-disc lg:text-lg md:text-md text-sm">
<li>Choose from a wide range of trendy fabrics updated every seasons</li>
<li>Choose from a wide range of trendy fabrics updated every seasons</li>
<li>Choose from a wide range of trendy fabrics updated every seasons</li>
</ul>
</div>
<div class="flex justify-end md:pt-11 pt-7">
<a class="all-product-link lg:text-lg text-md font-bold flex items-center "
href="https://stage.brooksbingham.com/content/12-automated-measurement"> Know more
<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>
</div>
</div>
</div>
</li>
</ul>
</div>
</div>
{/if}

72
templates/layouts/layout-both-columns.tpl
View File

@ -319,7 +319,77 @@
world of custom garments.
</p>
</div>
{/if}
<!--
<div class="mt-48">
<div class=" text-white grid grid-cols-2 grid-rows-* gap-y-1 gap-x-1 mb-1">
<div class="row-span-3 col-start-1 row-end-2 relative">
<h3 class="absolute lg:bottom-3 bottom-1 right-0 lg:font-bold font-medium lg:text-xl lg:mb-2 pr-1.5 xxs lg:p-4">Business Suits for Men</h3>
<h3 class="absolute bottom-0 right-0 text-white text-lg hide-on-small p-4">Make a powerful impression and radiate confidence</h3>
<img class="object-cover" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-big%20img.jpg" alt="Tailored business Suits designed for you to make a
powerful impression and radiate confidence." />
</div>
<div class="col-span-1 col-start-2 row-span-2 flex relative">
<h3 class="absolute lg:bottom-3 bottom-1 lg:right-0 right-2 lg:font-bold font-medium lg:text-xl lg:mb-2 xxs lg:p-4">Browse through our design</h3>
<h3 class="absolute bottom-0 right-0 text-lg hide-on-small p-4">Get inspired with our curated outfit ideas</h3>
<img class=" object-cover" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Right-small-img1.png" />
</div>
<div class="row-start-1 col-start-2 col-span-1 row-span-1 relative ">
<h3 class="absolute lg:bottom-3 bottom-1 lg:right-0 right-2 lg:font-bold font-medium lg:text-xl lg:mb-2 xxs lg:p-4">Get the perfect fit</h3>
<h3 class="absolute bottom-0 right-0 text-lg p-4 hide-on-small">Get inspired with our curated outfit ideas</h3>
<img class=" object-cover h-full" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Right-small-img2.jpg"
alt="The future of fashion with our innovative designs. Customization options tailored to your measurements and discover your perfect fit in minutes" />
</div>
</div>
</div>
<div class=" text-white grid grid-cols-2 grid-rows-* gap-y-1 gap-x-1">
<div class="row-span-3 col-start-2 row-end-2 relative">
<h3 class="absolute lg:bottom-3 bottom-1 right-0 lg:font-bold font-medium pr-1.5 lg:text-xl lg:mb-2 xxs lg:p-4">Wear Your Identity</h3>
<h3 class="absolute bottom-0 right-0 text-white text-lg hide-on-small p-4">Fashion that speaks volumes</h3>
<img class="object-cover" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Right-big%20img.jpg" />
</div>
<div class="col-span-1 col-start-1 row-span-2 flex relative">
<h3 class="absolute lg:bottom-3 bottom-1 lg:right-0 right-2 lg:font-bold font-medium lg:text-xl lg:mb-2 xxs lg:p-4">Timeless Quality </h3>
<h3 class="absolute bottom-0 right-0 text-lg hide-on-small p-4">Fashion that stands the test of time</h3>
<img class=" object-cover" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg" alt="Invest in enduring fashion with our commitment to quality and
durability.From custom-made tuxedos to business suits, each piece stands the test of time." />
</div>
<div class="row-start-1 col-start-1 col-span-1 row-span-1 relative ">
<h3 class="absolute lg:bottom-3 bottom-1 lg:right-0 right-2 lg:font-bold font-medium lg:text-xl lg:mb-2 xxs lg:p-4">Tailored to your specifications </h3>
<h3 class="absolute bottom-0 right-0 hide-on-small text-lg p-4">Tailor every detail to match your preferences</h3>
<img class=" object-cover h-full" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img2.png" /> </div>
</div>
</div>
</div>
<a class="all-product-link text-2xl font-bold w-full flex items-center justify-end mt-8 mb-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>
<div class="flex h-[50vh] items-center">
<div class="flex justify-center p-4">
<div class="md:w-3/5 relative text-center">
<p class="md:text-3xl text-xl p-4 font-medium"><b class="md:text-4xl text-xl ">“</b>
<b>BrooksBingham</b> is your destination for custom-tailored menswear, where authenticity is woven into every stitch.<b class="md:text-4xl text-xl">”</b></p>
<p class="text-sm"> Our perfect fit guarantee ensures that every piece you order is tailored to your exact specifications, delivering a perfect fit every time.</p>
</div>
</div>
</div> -->
{/if}
{block name="right_column"}
<div id="right-column" class="col-xs-12 col-sm-4 col-md-3">
{if $page.page_name == 'product'}