forked from brooksbingham/theme-elegance
Compare commits
4 Commits
d20f1f437a
...
de11abaa9c
| Author | SHA1 | Date |
|---|---|---|
apurvabangali
|
de11abaa9c | |
|
apurvabangali
|
81fb5178f4 | |
 jatiny
|
7f4965a607 | |
 sayalip
|
02b82c1f18 |
|
|
@ -0,0 +1,3 @@
|
||||||
|
body{
|
||||||
|
background-color:white;
|
||||||
|
}
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
/*
|
/*
|
||||||
! tailwindcss v3.3.5 | MIT License | https://tailwindcss.com
|
! tailwindcss v3.4.4 | MIT License | https://tailwindcss.com
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|
|
@ -32,9 +32,11 @@
|
||||||
4. Use the user's configured `sans` font-family by default.
|
4. Use the user's configured `sans` font-family by default.
|
||||||
5. Use the user's configured `sans` font-feature-settings by default.
|
5. Use the user's configured `sans` font-feature-settings by default.
|
||||||
6. Use the user's configured `sans` font-variation-settings by default.
|
6. Use the user's configured `sans` font-variation-settings by default.
|
||||||
|
7. Disable tap highlights on iOS
|
||||||
*/
|
*/
|
||||||
|
|
||||||
html {
|
html,
|
||||||
|
:host {
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
/* 1 */
|
/* 1 */
|
||||||
-webkit-text-size-adjust: 100%;
|
-webkit-text-size-adjust: 100%;
|
||||||
|
|
@ -50,6 +52,8 @@ html {
|
||||||
/* 5 */
|
/* 5 */
|
||||||
font-variation-settings: normal;
|
font-variation-settings: normal;
|
||||||
/* 6 */
|
/* 6 */
|
||||||
|
-webkit-tap-highlight-color: transparent;
|
||||||
|
/* 7 */
|
||||||
}
|
}
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|
|
@ -121,8 +125,10 @@ strong {
|
||||||
}
|
}
|
||||||
|
|
||||||
/*
|
/*
|
||||||
1. Use the user's configured `mono` font family by default.
|
1. Use the user's configured `mono` font-family by default.
|
||||||
2. Correct the odd `em` font sizing in all browsers.
|
2. Use the user's configured `mono` font-feature-settings by default.
|
||||||
|
3. Use the user's configured `mono` font-variation-settings by default.
|
||||||
|
4. Correct the odd `em` font sizing in all browsers.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
code,
|
code,
|
||||||
|
|
@ -131,8 +137,12 @@ samp,
|
||||||
pre {
|
pre {
|
||||||
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||||
/* 1 */
|
/* 1 */
|
||||||
font-size: 1em;
|
font-feature-settings: normal;
|
||||||
/* 2 */
|
/* 2 */
|
||||||
|
font-variation-settings: normal;
|
||||||
|
/* 3 */
|
||||||
|
font-size: 1em;
|
||||||
|
/* 4 */
|
||||||
}
|
}
|
||||||
|
|
||||||
/*
|
/*
|
||||||
|
|
@ -201,6 +211,8 @@ textarea {
|
||||||
/* 1 */
|
/* 1 */
|
||||||
line-height: inherit;
|
line-height: inherit;
|
||||||
/* 1 */
|
/* 1 */
|
||||||
|
letter-spacing: inherit;
|
||||||
|
/* 1 */
|
||||||
color: inherit;
|
color: inherit;
|
||||||
/* 1 */
|
/* 1 */
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
|
@ -224,9 +236,9 @@ select {
|
||||||
*/
|
*/
|
||||||
|
|
||||||
button,
|
button,
|
||||||
[type='button'],
|
input:where([type='button']),
|
||||||
[type='reset'],
|
input:where([type='reset']),
|
||||||
[type='submit'] {
|
input:where([type='submit']) {
|
||||||
-webkit-appearance: button;
|
-webkit-appearance: button;
|
||||||
/* 1 */
|
/* 1 */
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
|
|
@ -653,6 +665,10 @@ select {
|
||||||
--tw-backdrop-opacity: ;
|
--tw-backdrop-opacity: ;
|
||||||
--tw-backdrop-saturate: ;
|
--tw-backdrop-saturate: ;
|
||||||
--tw-backdrop-sepia: ;
|
--tw-backdrop-sepia: ;
|
||||||
|
--tw-contain-size: ;
|
||||||
|
--tw-contain-layout: ;
|
||||||
|
--tw-contain-paint: ;
|
||||||
|
--tw-contain-style: ;
|
||||||
}
|
}
|
||||||
|
|
||||||
::backdrop {
|
::backdrop {
|
||||||
|
|
@ -703,6 +719,10 @@ select {
|
||||||
--tw-backdrop-opacity: ;
|
--tw-backdrop-opacity: ;
|
||||||
--tw-backdrop-saturate: ;
|
--tw-backdrop-saturate: ;
|
||||||
--tw-backdrop-sepia: ;
|
--tw-backdrop-sepia: ;
|
||||||
|
--tw-contain-size: ;
|
||||||
|
--tw-contain-layout: ;
|
||||||
|
--tw-contain-paint: ;
|
||||||
|
--tw-contain-style: ;
|
||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
|
|
@ -831,6 +851,10 @@ select {
|
||||||
top: 50%;
|
top: 50%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.top-28 {
|
||||||
|
top: 7rem;
|
||||||
|
}
|
||||||
|
|
||||||
.top-\[70\%\] {
|
.top-\[70\%\] {
|
||||||
top: 70%;
|
top: 70%;
|
||||||
}
|
}
|
||||||
|
|
@ -940,6 +964,11 @@ select {
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.my-12 {
|
||||||
|
margin-top: 3rem;
|
||||||
|
margin-bottom: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
.mb-1 {
|
.mb-1 {
|
||||||
margin-bottom: 0.25rem;
|
margin-bottom: 0.25rem;
|
||||||
}
|
}
|
||||||
|
|
@ -1056,6 +1085,10 @@ select {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.inline-flex {
|
||||||
|
display: inline-flex;
|
||||||
|
}
|
||||||
|
|
||||||
.table {
|
.table {
|
||||||
display: table;
|
display: table;
|
||||||
}
|
}
|
||||||
|
|
@ -1076,6 +1109,10 @@ select {
|
||||||
aspect-ratio: 342/513;
|
aspect-ratio: 342/513;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.h-10 {
|
||||||
|
height: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
.h-12 {
|
.h-12 {
|
||||||
height: 3rem;
|
height: 3rem;
|
||||||
}
|
}
|
||||||
|
|
@ -1084,6 +1121,10 @@ select {
|
||||||
height: 6rem;
|
height: 6rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.h-4 {
|
||||||
|
height: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
.h-40 {
|
.h-40 {
|
||||||
height: 10rem;
|
height: 10rem;
|
||||||
}
|
}
|
||||||
|
|
@ -1148,6 +1189,10 @@ select {
|
||||||
width: 16.666667%;
|
width: 16.666667%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.w-10 {
|
||||||
|
width: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
.w-12 {
|
.w-12 {
|
||||||
width: 3rem;
|
width: 3rem;
|
||||||
}
|
}
|
||||||
|
|
@ -1168,6 +1213,10 @@ select {
|
||||||
width: 8rem;
|
width: 8rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.w-4 {
|
||||||
|
width: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
.w-40 {
|
.w-40 {
|
||||||
width: 10rem;
|
width: 10rem;
|
||||||
}
|
}
|
||||||
|
|
@ -1398,6 +1447,10 @@ select {
|
||||||
margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
|
margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.overflow-hidden {
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
.overflow-y-auto {
|
.overflow-y-auto {
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
|
|
@ -1892,6 +1945,11 @@ select {
|
||||||
color: rgb(75 85 99 / var(--tw-text-opacity));
|
color: rgb(75 85 99 / var(--tw-text-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.text-gray-800 {
|
||||||
|
--tw-text-opacity: 1;
|
||||||
|
color: rgb(31 41 55 / var(--tw-text-opacity));
|
||||||
|
}
|
||||||
|
|
||||||
.text-gray-900 {
|
.text-gray-900 {
|
||||||
--tw-text-opacity: 1;
|
--tw-text-opacity: 1;
|
||||||
color: rgb(17 24 39 / var(--tw-text-opacity));
|
color: rgb(17 24 39 / var(--tw-text-opacity));
|
||||||
|
|
@ -2277,6 +2335,11 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: 640px) {
|
@media (min-width: 640px) {
|
||||||
|
.sm\:my-20 {
|
||||||
|
margin-top: 5rem;
|
||||||
|
margin-bottom: 5rem;
|
||||||
|
}
|
||||||
|
|
||||||
.sm\:flex {
|
.sm\:flex {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
@ -2297,6 +2360,11 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
||||||
margin-bottom: 6rem;
|
margin-bottom: 6rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.md\:my-20 {
|
||||||
|
margin-top: 5rem;
|
||||||
|
margin-bottom: 5rem;
|
||||||
|
}
|
||||||
|
|
||||||
.md\:mt-0 {
|
.md\:mt-0 {
|
||||||
margin-top: 0px;
|
margin-top: 0px;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -23,7 +23,7 @@
|
||||||
* International Registered Trademark & Property of PrestaShop SA
|
* International Registered Trademark & Property of PrestaShop SA
|
||||||
*}
|
*}
|
||||||
|
|
||||||
<section class="featured-products flex flex-col gap-8">
|
<section class="featured-products flex flex-col gap-8 mt-20">
|
||||||
<h2 class="products-section-title text-2xl font-bold">
|
<h2 class="products-section-title text-2xl font-bold">
|
||||||
{l s='Popular Products' d='Shop.Theme.Catalog'}
|
{l s='Popular Products' d='Shop.Theme.Catalog'}
|
||||||
</h2>
|
</h2>
|
||||||
|
|
@ -32,9 +32,47 @@
|
||||||
{include file="catalog/_partials/miniatures/product.tpl" product=$product}
|
{include file="catalog/_partials/miniatures/product.tpl" product=$product}
|
||||||
{/foreach}
|
{/foreach}
|
||||||
</div>
|
</div>
|
||||||
<a class="all-product-link text-2xl font-bold w-full flex items-center justify-end mb-24" href="{$allProductsLink}">
|
<a class="all-product-link text-2xl font-bold w-full flex items-center justify-end mb-8" href="{$allProductsLink}">
|
||||||
{l s='All products' d='Shop.Theme.Catalog'}
|
{l s='All products' 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>
|
<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>
|
</a>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
{if $page.page_name == "index"}
|
||||||
|
<div class="mx-4 my-12 sm:my-20">
|
||||||
|
<h1 class="font-bold lg:text-3xl md:text-xl text-lg">What makes us unique?</h1>
|
||||||
|
<p class=" font-medium lg:text-lg md:text-md text-sm pt-9">Are you one of the millions of men that off the rack clothing just doesn't work for you?
|
||||||
|
A generic size built for the generic man? Brooks Bingham Clothing started exactly for this reason.
|
||||||
|
We are athletes, surrounded by athletes and strive to work with those that search for perfection.
|
||||||
|
And we were sick and tired of spending thousands on garments just to spend hundreds or thousands more
|
||||||
|
for a tailor to sort of make it fit. We strive to be a luxury solution in the clothing industry while providing
|
||||||
|
custom garments built and des gned by you for you. We give you all the power to be as creative as possible
|
||||||
|
while designing your clothing followed by the implementation of photo technology to collect all needed measurements.
|
||||||
|
Through our 3D tocits you have the ability to see and explore millions of options to complete your one of a kind piece.
|
||||||
|
We thank you for taking the time to explore Brooks Bingham Clothing and we look forward to helping you explore the
|
||||||
|
world of custom garments.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mt-12 md:mt-24 flex relative items-center left-0 right-0 mb-12 ">
|
||||||
|
<img class="w-full lg:h-[400px] md:h-[300px] h-full object-cover"
|
||||||
|
src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/homepage/seo-img6.png">
|
||||||
|
<div class="absolute text-white lg:pl-24 md:pl-12 pl-4">
|
||||||
|
<h1 class="md:font-bold font-semibold lg:text-4xl md:text-2xl text-sm">Step into Style with a Custom Touch</h1>
|
||||||
|
<p class="lg:font-semibold md:font-medium font-base lg:text-2xl md:text-lg text-xs md:w-8/12 lg:pt-9 md:pt-6 pt-4">
|
||||||
|
Our perfect fit guarantee ensures that every plece you order is tailored to your exact specifications,
|
||||||
|
delivering a perfect fit every time.
|
||||||
|
</p>
|
||||||
|
<div class="lg:w-52 md:w-42 w-38 flex justify-start pt-4">
|
||||||
|
<a class="all-product-link lg:text-xl md:text-md text-xs md:font-semibold font-base
|
||||||
|
flex border border-2 border-white md:p-2 p-1 md:px-4 px-2 hover:text-white"
|
||||||
|
href="https://brooksbingham.com/17-custom-made-clothing">
|
||||||
|
Start Customization
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
{/if}
|
||||||
|
|
@ -24,7 +24,12 @@
|
||||||
*}
|
*}
|
||||||
|
|
||||||
{if $page.meta.title == 'Custom made' || $page.meta.title == 'custom made' || $page.meta.title == 'Custom Made' || $page.meta.title == 'custom'}
|
{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=" mx-auto h-[50vh] flex flex-col justify-center ">
|
<div class=" mx-auto h-[50vh] flex flex-col justify-center ">
|
||||||
<h1 class="lg:font-semibold
|
<h1 class="lg:font-semibold
|
||||||
font-bold
|
font-bold
|
||||||
|
|
@ -72,12 +77,7 @@
|
||||||
|
|
||||||
|
|
||||||
{if $page.meta.title == 'Custom made' || $page.meta.title == 'custom made' || $page.meta.title == 'Custom Made' || $page.meta.title == 'custom'}
|
{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="flex flex-col-reverse md:flex-row items-center md:mt-24 mt-16 mx-auto">
|
||||||
|
|
@ -193,7 +193,6 @@
|
||||||
<h4 class="text-xl
|
<h4 class="text-xl
|
||||||
leading-6
|
leading-6
|
||||||
font-bold
|
font-bold
|
||||||
text-gray-900
|
|
||||||
pb-2">
|
pb-2">
|
||||||
Select the Fabric </h4>
|
Select the Fabric </h4>
|
||||||
<p class="mt-3
|
<p class="mt-3
|
||||||
|
|
@ -229,7 +228,6 @@
|
||||||
<h4 class="text-xl
|
<h4 class="text-xl
|
||||||
leading-6
|
leading-6
|
||||||
font-bold
|
font-bold
|
||||||
text-gray-900
|
|
||||||
pb-2">
|
pb-2">
|
||||||
Finalize the Design </h4>
|
Finalize the Design </h4>
|
||||||
<p class="mt-3
|
<p class="mt-3
|
||||||
|
|
@ -264,7 +262,6 @@
|
||||||
<h4 class="text-xl
|
<h4 class="text-xl
|
||||||
leading-6
|
leading-6
|
||||||
font-bold
|
font-bold
|
||||||
text-gray-900
|
|
||||||
pb-2">
|
pb-2">
|
||||||
Get Measured </h4>
|
Get Measured </h4>
|
||||||
<p class="mt-3
|
<p class="mt-3
|
||||||
|
|
@ -280,115 +277,42 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="mx-auto mb-20 flex flex-col">
|
<div class="mx-auto mb-20 flex flex-col">
|
||||||
<h1 class="font-bold text-xl md:text-2xl lg:text-3xl text-center">
|
<h1 class="font-bold text-xl md:text-2xl lg:text-3xl text-center">How Can You Get Measured?</h1>
|
||||||
How Can You Get Measured?
|
<div class="md:pt-12 pt-9 lg:px-20 md:px-12 px-0">
|
||||||
</h1>
|
<ul class="md:grid md:grid-cols-2 md:gap-10 gap-x-20">
|
||||||
|
<li class="border-2 p-5 pb-10">
|
||||||
<div class="md:pt-12 pt-9 lg:px-20 md:px-12 px-0">
|
<div class="flex flex-col items-center">
|
||||||
<ul class="md:grid
|
<div class="mt-4">
|
||||||
md:grid-cols-2
|
<h4 class="md:text-xl text-lg text-center leading-6 font-bold pb-2">Manual Measurement</h4>
|
||||||
md:gap-10
|
<div class="md:pt-5 pt-3 font-medium text-lg">
|
||||||
gap-x-20">
|
<ul class="space-y-2 list-disc lg:text-lg md:text-md text-sm">
|
||||||
<li class="border-2
|
<li>Follow clear step-by-step instructions for accurate results.</li>
|
||||||
p-5
|
<li>Simple form to fill for each measurement.</li>
|
||||||
pb-10
|
<li>Ensure precision with detailed guidance for each body part.</li>
|
||||||
">
|
</ul>
|
||||||
<div class="flex
|
</div>
|
||||||
flex-col
|
<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 </a></div>
|
||||||
items-center">
|
</div>
|
||||||
<div class="mt-4">
|
</div>
|
||||||
<h4 class="md:text-xl
|
</li>
|
||||||
text-lg
|
<li class="border-2 p-5">
|
||||||
text-center
|
<div class="flex flex-col items-center">
|
||||||
leading-6
|
<div class="mt-4">
|
||||||
font-bold
|
<h4 class="md:text-xl text-lg text-center leading-6 font-bold pb-2">Automated Measurement</h4>
|
||||||
text-gray-900
|
<div class="md:pt-5 pt-3 font-medium text-lg">
|
||||||
pb-2">
|
<ul class="space-y-2 list-disc lg:text-lg md:text-md text-sm">
|
||||||
Manual Measurement</h4>
|
<li>Utilize advanced 3D scanning via a smartphone app.</li>
|
||||||
<div class="md:pt-5 pt-3 font-medium text-lg">
|
<li>Quick and convenient measurement process.</li>
|
||||||
<ul class="space-y-2 list-disc lg:text-lg md:text-md text-sm">
|
<li>Secure and private data storage for continuous updates.</li>
|
||||||
<li>Choose from a wide range of trendy fabrics updated every seasons</li>
|
</ul>
|
||||||
<li>Choose from a wide range of trendy fabrics updated every seasons</li>
|
</div>
|
||||||
<li>Choose from a wide range of trendy fabrics updated every seasons</li>
|
<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 </a></div>
|
||||||
</ul>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</li>
|
||||||
<div class="flex justify-end md:pt-11 pt-7">
|
</ul>
|
||||||
<a class="all-product-link lg:text-lg text-md font-bold flex items-center "
|
</div>
|
||||||
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>
|
</div>
|
||||||
|
|
||||||
{/if}
|
{/if}
|
||||||
|
|
|
||||||
|
|
@ -95,301 +95,22 @@
|
||||||
|
|
||||||
{if $page.page_name == 'index'}
|
{if $page.page_name == 'index'}
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const slides = document.querySelectorAll('.slide');
|
||||||
|
let currentSlide = 0;
|
||||||
|
|
||||||
<div class="lg:my-32 my-20" >
|
document.querySelector('[data-carousel-next]').addEventListener('click', () => {
|
||||||
<h1 class="lg:text-2xl md:text-xl text-lg font-bold text-center">Design and Visualize what you need</h1>
|
slides[currentSlide].classList.add('hidden');
|
||||||
<h3 class="lg:text-lg md:text-md text-sm font-semibold text-center mb-12">Choose what looks good on you </h3>
|
currentSlide = (currentSlide + 1) % slides.length;
|
||||||
<a href="https://brooksbingham.com/module/thob/configurator?id_product=77">
|
slides[currentSlide].classList.remove('hidden');
|
||||||
<img src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/widget-screenshot.png"/>
|
});
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
document.querySelector('[data-carousel-prev]').addEventListener('click', () => {
|
||||||
<div class="flex flex-col-reverse md:flex-row items-center md:mt-24 mt-20 mx-4">
|
slides[currentSlide].classList.add('hidden');
|
||||||
<div class="mx-3 w-full md:w-[50%] text-center md:text-left md:pt-0 pt-2">
|
currentSlide = (currentSlide - 1 + slides.length) % slides.length;
|
||||||
<h1 class="font-bold lg:text-3xl md:text-xl text-lg">
|
slides[currentSlide].classList.remove('hidden');
|
||||||
The Art of Custom Clothing
|
});
|
||||||
</h1>
|
</script>
|
||||||
<p class="xl:text-xl lg:text-lg md:text-md text-sm font-medium pt-5 lg:w-11/12 w-full">
|
|
||||||
Personalize your handcrafted look with our exclusive collection of Made-to-Measure men's clothing.
|
|
||||||
</p>
|
|
||||||
<p class="xl:text-xl lg:text-lg md:text-md text-sm font-medium pt-1 lg:w-11/12 w-full">
|
|
||||||
Take control and feel confident with our Perfect Fit Guarantee
|
|
||||||
</p>
|
|
||||||
<div class="xl:w-52 lg:w-42 md:w-42 w-38 flex md:justify-start justify-center">
|
|
||||||
<a class="all-product-link xl:text-xl lg:text-lg md:text-md text-sm font-bold mt-9 flex border border-2 border-black p-2 px-4"
|
|
||||||
href="https://brooksbingham.com/module/thob/configurator?id_product=75">
|
|
||||||
Start Customization
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full md:w-[50%]">
|
|
||||||
<img src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/homepage/seo-img1.png">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="flex md:flex-row flex-col items-center mx-4 lg:mt-32 md:mt-24 mt-20">
|
|
||||||
<div class="w-full md:w-[60%] h-full">
|
|
||||||
<img src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/homepage/seo-img2.png">
|
|
||||||
</div>
|
|
||||||
<div class="mx-3 w-full md:w-[40%] text-center md:text-left md:pl-5 pl-0 ">
|
|
||||||
<h1 class="font-bold lg:text-3xl md:text-md text-lg md:pt-0 pt-2">
|
|
||||||
Tailored Perfection for a Flawless Fit
|
|
||||||
</h1>
|
|
||||||
<p class="xl:text-xl lg:text-md md:text-xs text-sm font-medium pt-5 md:pt-3 lg:pt-9">
|
|
||||||
Craft your signature style down to the finest details - from quality fabrics and distinctive
|
|
||||||
buttons to unique pocket hues and lining designs.
|
|
||||||
</p>
|
|
||||||
<p class="xl:text-xl lg:text-md md:text-xs text-sm font-medium pt-1">
|
|
||||||
Our Perfect Fit Guarantee ensures a tailored look that exudes your confident individuality
|
|
||||||
</p>
|
|
||||||
<div class="lg:w-52 md:w-42 w-38 flex md:justify-start justify-center">
|
|
||||||
<a class="all-product-link xl:text-xl lg:text-lg md:text-sm text-sm font-bold mt-9 md:mt-4 lg:mt-9 flex border border-2 border-black p-2 px-4"
|
|
||||||
href="https://stage.brooksbingham.com/content/10-how-to-measure">
|
|
||||||
How to measure
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="mx-4 lg:mt-32 md:mt-24 mt-20">
|
|
||||||
<h1 class="lg:text-3xl md:text-2xl text-lg font-bold text-center">Curated Custom Collection</h1>
|
|
||||||
<p class="lg:text-xl md:text-md text-sm text-center pt-4 font-medium">Experience luxury with personalized jackets and custom collections crafted just for you</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="container mt-16">
|
|
||||||
<div class=" flex md:flex-row flex-col gap-8 lg:mb-32 mb-20">
|
|
||||||
<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"> 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"> Suits</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</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"> Tuxedos</h3>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="flex md:flex-row flex-col mx-4 items-center lg:my-32 md:my-24 my-20">
|
|
||||||
<div class="w-full md:w-[50%] h-full">
|
|
||||||
<img src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/homepage/seo-img3.png">
|
|
||||||
</div>
|
|
||||||
<div class="w-full md:w-[50%] md:text-left md:pl-10 pl-0 md:pt-0 pt-3 ">
|
|
||||||
<h1 class="font-bold lg:text-3xl md:text-xl text-lg md:pt-0 pt-2 text-center md:text-left">
|
|
||||||
About Brooks Bingham
|
|
||||||
</h1>
|
|
||||||
<div class="xl:pt-10 lg:pt-6 md:pt-6 pt-4 xl:text-xl lg:text-md md:text-md text-sm font-medium space-y-2 text-left">
|
|
||||||
<li>Individuality and precision tailoring is what we celebrate.</li>
|
|
||||||
<li>We are on a mission to provide high-quality, custom-fit clothing that embodies YOU.</li>
|
|
||||||
<li>Modern with the technology, but we never forget the importance of classic traditional tailoring.</li>
|
|
||||||
<li>We are all about creating timeless, personalized pieces.</li>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="flex flex-col-reverse md:flex-row md:mt-24 mt-20 mx-4">
|
|
||||||
<div class="w-full md:w-[60%] text-center md:text-left md:pt-0 pt-4">
|
|
||||||
<h1 class="font-bold lg:text-4xl md:text-2xl text-lg xl:pt-16 lg:pt-5 md:pt-3 pt-0">
|
|
||||||
Why Choose Brooks Bingham?
|
|
||||||
</h1>
|
|
||||||
<div class="flex md:flex-row flex-col xl:pt-20 lg:pt-12 md:pt-7 pt-7">
|
|
||||||
<div class="flex-col 2xl:pr-16 xl:pr-12 lg:pr-6 md:pr-5 pr-0">
|
|
||||||
<h1 class="md:text-xl xl:text-5xl lg:text-3xl text-5xl font-semibold text-gray-300 pb-4">1.</h1>
|
|
||||||
<h1 class="xl:text-xl lg:text-lg md:text-xs text-xl font-semibold">Expert</h1>
|
|
||||||
<h1 class="xl:text-xl lg:text-lg md:text-xs text-xl font-semibold">Craftmanship</h1>
|
|
||||||
</div>
|
|
||||||
<div class="flex-col 2xl:pr-16 xl:pr-12 lg:pr-6 md:pr-5 pr-0 md:pt-0 pt-4">
|
|
||||||
<h1 class="md:text-xl xl:text-5xl lg:text-3xl text-5xl font-semibold text-gray-300 pb-4">2.</h1>
|
|
||||||
<h1 class="xl:text-xl lg:text-lg md:text-xs text-xl font-semibold">Innovative</h1>
|
|
||||||
<h1 class="xl:text-xl lg:text-lg md:text-xs text-xl font-semibold">Customization</h1>
|
|
||||||
</div>
|
|
||||||
<div class="flex-col 2xl:pr-16 xl:pr-12 lg:pr-6 md:pr-5 pr-0 md:pt-0 pt-4">
|
|
||||||
<h1 class="md:text-xl xl:text-5xl lg:text-3xl text-5xl font-semibold text-gray-300 pb-4">3.</h1>
|
|
||||||
<h1 class="xl:text-xl lg:text-lg md:text-xs text-xl font-semibold">Quality</h1>
|
|
||||||
<h1 class="xl:text-xl lg:text-lg md:text-xs text-xl font-semibold">Materials</h1>
|
|
||||||
</div>
|
|
||||||
<div class="flex-col 2xl:pr-16 xl:pr-12 lg:pr-6 md:pr-5 pr-0 md:pt-0 pt-4">
|
|
||||||
<h1 class="md:text-xl xl:text-5xl lg:text-3xl text-5xl font-semibold text-gray-300 pb-4">4.</h1>
|
|
||||||
<h1 class="xl:text-xl lg:text-lg md:text-xs text-xl font-semibold">Sustainable</h1>
|
|
||||||
<h1 class="xl:text-xl lg:text-lg md:text-xs text-xl font-semibold">Practices</h1>
|
|
||||||
</div>
|
|
||||||
<div class="flex-col md:pt-0 pt-4">
|
|
||||||
<h1 class="md:text-xl xl:text-5xl lg:text-3xl text-5xl font-semibold text-gray-300 pb-4">5.</h1>
|
|
||||||
<h1 class="xl:text-xl lg:text-lg md:text-xs text-xl font-semibold">Exceptional</h1>
|
|
||||||
<h1 class="xl:text-xl lg:text-lg md:text-xs text-xl font-semibold">Support</h1>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full md:w-[40%]">
|
|
||||||
<img src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/homepage/seo-img4.png">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="flex flex-col-reverse md:flex-row items-center justify-center md:mt-32 mt-16 mx-4">
|
|
||||||
<div class="w-full md:w-[60%] text-center md:text-left md:pt-0 pt-5 md:pr-5 pr-0">
|
|
||||||
<div class="flex justify-center lg:pb-6 pb-3">
|
|
||||||
<img class="lg:w-[60px] lg:h-[60px] md:w-[40px] md:h-[40px] w-[50px] h-[50px]"
|
|
||||||
src="https://brooksbingham.com/img/logo-1715173509.jpg">
|
|
||||||
</div>
|
|
||||||
<h1 class="font-bold lg:text-3xl md:text-2xl text-xl text-center">
|
|
||||||
See What They Think
|
|
||||||
</h1>
|
|
||||||
<p class="lg:text-xl text-sm font-medium lg:pt-10 pt-6 text-center">
|
|
||||||
The quality of my bespoke shirts from Brooks Bingham Clothing has been exceptional!
|
|
||||||
</p>
|
|
||||||
<p class="lg:text-xl text-sm font-medium text-center">
|
|
||||||
The fabrics, buttons, and stitching are of the highest quality.
|
|
||||||
</p>
|
|
||||||
<h1 class="font-bold text-center lg:text-xl md:text-lg text-md lg:pt-8 pt-6">Matt K </h1>
|
|
||||||
<div class="flex justify-center lg:pt-10 md:pt-6 pt-8">
|
|
||||||
<svg class="w-[20px] h-[20px] mx-1" viewBox="0 0 24 24" fill="gold" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<path d="M12 0l3.09 6.26L22 9.27l-5 4.87L18.18 22 12 18.27 5.82 22 7 14.14l-5-4.87 6.91-3.01L12 0z"/>
|
|
||||||
</svg>
|
|
||||||
<svg class="w-[20px] h-[20px] mx-1" viewBox="0 0 24 24" fill="gold" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<path d="M12 0l3.09 6.26L22 9.27l-5 4.87L18.18 22 12 18.27 5.82 22 7 14.14l-5-4.87 6.91-3.01L12 0z"/>
|
|
||||||
</svg>
|
|
||||||
<svg class="w-[20px] h-[20px] mx-1" viewBox="0 0 24 24" fill="gold" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<path d="M12 0l3.09 6.26L22 9.27l-5 4.87L18.18 22 12 18.27 5.82 22 7 14.14l-5-4.87 6.91-3.01L12 0z"/>
|
|
||||||
</svg>
|
|
||||||
<svg class="w-[20px] h-[20px] mx-1" viewBox="0 0 24 24" fill="gold" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<path d="M12 0l3.09 6.26L22 9.27l-5 4.87L18.18 22 12 18.27 5.82 22 7 14.14l-5-4.87 6.91-3.01L12 0z"/>
|
|
||||||
</svg>
|
|
||||||
<svg class="w-[20px] h-[20px] mx-1" viewBox="0 0 24 24" fill="gold" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<path d="M12 0l3.09 6.26L22 9.27l-5 4.87L18.18 22 12 18.27 5.82 22 7 14.14l-5-4.87 6.91-3.01L12 0z"/>
|
|
||||||
</svg>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="w-full md:w-[40%] h-full">
|
|
||||||
<img src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/homepage/seo-img5.png">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mt-32 flex relative items-center left-0 right-0">
|
|
||||||
<img class="w-full lg:h-[400px] md:h-[300px] h-full object-cover"
|
|
||||||
src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/homepage/seo-img6.png">
|
|
||||||
<div class="absolute text-white lg:pl-24 md:pl-12 pl-4">
|
|
||||||
<h1 class="md:font-bold font-semibold lg:text-4xl md:text-2xl text-sm">Step into Style with a Custom Touch</h1>
|
|
||||||
<p class="lg:font-semibold md:font-medium font-base lg:text-2xl md:text-lg text-xs md:w-8/12 lg:pt-9 md:pt-6 pt-4">
|
|
||||||
Our perfect fit guarantee ensures that every plece you order is tailored to your exact specifications,
|
|
||||||
delivering a perfect fit every time.
|
|
||||||
</p>
|
|
||||||
<div class="lg:w-52 md:w-42 w-38 flex justify-start pt-4">
|
|
||||||
<a class="all-product-link lg:text-xl md:text-md text-xs md:font-semibold font-base
|
|
||||||
flex border border-2 border-white md:p-2 p-1 md:px-4 px-2 hover:text-white"
|
|
||||||
href="https://brooksbingham.com/17-custom-made-clothing">
|
|
||||||
Start Customization
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="mx-4 my-32">
|
|
||||||
<h1 class="font-bold lg:text-3xl md:text-xl text-lg">BROOKSBINGHAM</h1>
|
|
||||||
<p class=" font-medium lg:text-lg md:text-md text-sm pt-9">Are you one of the millions of men that off the rack clothing just doesn't work for you?
|
|
||||||
A generic size built for the generic man? Brooks Bingham Clothing started exactly for this reason.
|
|
||||||
We are athletes, surrounded by athletes and strive to work with those that search for perfection.
|
|
||||||
And we were sick and tired of spending thousands on garments just to spend hundreds or thousands more
|
|
||||||
for a tailor to sort of make it fit. We strive to be a luxury solution in the clothing industry while providing
|
|
||||||
custom garments built and des gned by you for you. We give you all the power to be as creative as possible
|
|
||||||
while designing your clothing followed by the implementation of photo technology to collect all needed measurements.
|
|
||||||
Through our 3D tocits you have the ability to see and explore millions of options to complete your one of a kind piece.
|
|
||||||
We thank you for taking the time to explore Brooks Bingham Clothing and we look forward to helping you explore the
|
|
||||||
world of custom garments.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!--
|
|
||||||
|
|
||||||
<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}
|
{/if}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue