forked from brooksbingham/theme-elegance
Merge pull request 'refactor: remove styling from layouts and add it on featured products' (#43) from apurvab/theme-elegance:staging into staging
Reviewed-on: brooksbingham/theme-elegance#43staging
commit
93d08c039e
|
|
@ -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 {
|
||||||
|
|
@ -944,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;
|
||||||
}
|
}
|
||||||
|
|
@ -1124,8 +1149,12 @@ select {
|
||||||
height: 20px;
|
height: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-\[30px\] {
|
.h-\[30vh\] {
|
||||||
height: 30px;
|
height: 30vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.h-\[40vh\] {
|
||||||
|
height: 40vh;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-\[50px\] {
|
.h-\[50px\] {
|
||||||
|
|
@ -1144,14 +1173,6 @@ select {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-\[30vh\] {
|
|
||||||
height: 30vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.h-\[40vh\] {
|
|
||||||
height: 40vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
.max-h-\[40px\] {
|
.max-h-\[40px\] {
|
||||||
max-height: 40px;
|
max-height: 40px;
|
||||||
}
|
}
|
||||||
|
|
@ -1444,10 +1465,6 @@ select {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
.rounded-full {
|
|
||||||
border-radius: 9999px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.rounded-lg {
|
.rounded-lg {
|
||||||
border-radius: 0.5rem;
|
border-radius: 0.5rem;
|
||||||
}
|
}
|
||||||
|
|
@ -1533,6 +1550,11 @@ select {
|
||||||
border-color: rgb(255 255 255 / var(--tw-border-opacity));
|
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 {
|
.bg-black\/70 {
|
||||||
background-color: rgb(0 0 0 / 0.7);
|
background-color: rgb(0 0 0 / 0.7);
|
||||||
}
|
}
|
||||||
|
|
@ -1572,11 +1594,6 @@ select {
|
||||||
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
|
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
.bg-\[\#E6DFD4\] {
|
|
||||||
--tw-bg-opacity: 1;
|
|
||||||
background-color: rgb(230 223 212 / var(--tw-bg-opacity));
|
|
||||||
}
|
|
||||||
|
|
||||||
.stroke-black {
|
.stroke-black {
|
||||||
stroke: #000;
|
stroke: #000;
|
||||||
}
|
}
|
||||||
|
|
@ -1928,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));
|
||||||
|
|
@ -1963,11 +1985,6 @@ select {
|
||||||
color: rgb(255 255 255 / var(--tw-text-opacity));
|
color: rgb(255 255 255 / var(--tw-text-opacity));
|
||||||
}
|
}
|
||||||
|
|
||||||
.text-gray-800 {
|
|
||||||
--tw-text-opacity: 1;
|
|
||||||
color: rgb(31 41 55 / var(--tw-text-opacity));
|
|
||||||
}
|
|
||||||
|
|
||||||
.underline {
|
.underline {
|
||||||
text-decoration-line: underline;
|
text-decoration-line: underline;
|
||||||
}
|
}
|
||||||
|
|
@ -2262,13 +2279,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
|
||||||
.dark\:text-gray-800 {
|
|
||||||
--tw-text-opacity: 1;
|
|
||||||
color: rgb(31 41 55 / var(--tw-text-opacity));
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media not all and (min-width: 1024px) {
|
@media not all and (min-width: 1024px) {
|
||||||
.max-lg\:flex-col {
|
.max-lg\:flex-col {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
@ -2325,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;
|
||||||
}
|
}
|
||||||
|
|
@ -2345,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;
|
||||||
}
|
}
|
||||||
|
|
@ -2377,10 +2397,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.md\:h-\[200px\] {
|
|
||||||
height: 200px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.md\:h-\[300px\] {
|
.md\:h-\[300px\] {
|
||||||
height: 300px;
|
height: 300px;
|
||||||
}
|
}
|
||||||
|
|
@ -2683,10 +2699,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.lg\:h-\[300px\] {
|
|
||||||
height: 300px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.lg\:h-\[400px\] {
|
.lg\:h-\[400px\] {
|
||||||
height: 400px;
|
height: 400px;
|
||||||
}
|
}
|
||||||
|
|
@ -2884,10 +2896,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: 1280px) {
|
@media (min-width: 1280px) {
|
||||||
.xl\:h-\[460px\] {
|
|
||||||
height: 460px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.xl\:w-1\/4 {
|
.xl\:w-1\/4 {
|
||||||
width: 25%;
|
width: 25%;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -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,262 +95,6 @@
|
||||||
|
|
||||||
{if $page.page_name == 'index'}
|
{if $page.page_name == 'index'}
|
||||||
|
|
||||||
|
|
||||||
<div class="lg:my-32 my-20" >
|
|
||||||
<h1 class="lg:text-2xl md:text-xl text-lg font-bold text-center">Design and Visualize what you need</h1>
|
|
||||||
<h3 class="lg:text-lg md:text-md text-sm font-semibold text-center mb-12">Choose what looks good on you </h3>
|
|
||||||
<a href="https://brooksbingham.com/module/thob/configurator?id_product=77">
|
|
||||||
<img src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/widget-screenshot.png"/>
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="flex flex-col-reverse md:flex-row items-center md:mt-24 mt-20 mx-4">
|
|
||||||
<div class="mx-3 w-full md:w-[50%] text-center md:text-left md:pt-0 pt-2">
|
|
||||||
<h1 class="font-bold lg:text-3xl md:text-xl text-lg">
|
|
||||||
The Art of Custom Clothing
|
|
||||||
</h1>
|
|
||||||
<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 relative">
|
|
||||||
<div id="slider" class="relative overflow-hidden">
|
|
||||||
<div class="slide">
|
|
||||||
<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 relative z-10">
|
|
||||||
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 relative z-10">
|
|
||||||
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="slide hidden">
|
|
||||||
<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 relative z-10">
|
|
||||||
Magical, is how I can describe my experience and the suits Brooks helped with my wedding! The men are still wearing their suit jackets and suits for other events! The fit was sharp and the fabrics were fantastic! There were so many options it was tough to choose from! Highly recommend Brooks for custom suits for any occasion!
|
|
||||||
</p>
|
|
||||||
<h1 class="font-bold text-center lg:text-xl md:text-lg text-md lg:pt-8 pt-6">Stephanie H</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>
|
|
||||||
|
|
||||||
<button type="button"
|
|
||||||
class="absolute left-0 top-28 flex items-center justify-center h-full cursor-pointer"
|
|
||||||
data-carousel-prev>
|
|
||||||
<span class="inline-flex items-center justify-center w-10 h-10">
|
|
||||||
<svg class="w-4 h-4 text-gray-800"
|
|
||||||
aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 6 10">
|
|
||||||
<path stroke="currentColor"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
stroke-width="2"
|
|
||||||
d="M5 1 1 5l4 4"/>
|
|
||||||
</svg>
|
|
||||||
<span class="sr-only">Previous</span>
|
|
||||||
</span>
|
|
||||||
</button>
|
|
||||||
<button type="button"
|
|
||||||
class="absolute right-0 top-28 flex items-center justify-center h-full cursor-pointer"
|
|
||||||
data-carousel-next>
|
|
||||||
<span class="inline-flex items-center justify-center w-10 h-10">
|
|
||||||
<svg class="w-4 h-4 text-gray-800"
|
|
||||||
aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 6 10">
|
|
||||||
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 9 4-4-4-4"/>
|
|
||||||
</svg>
|
|
||||||
<span class="sr-only">Next</span>
|
|
||||||
</span>
|
|
||||||
</button>
|
|
||||||
</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>
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
const slides = document.querySelectorAll('.slide');
|
const slides = document.querySelectorAll('.slide');
|
||||||
let currentSlide = 0;
|
let currentSlide = 0;
|
||||||
|
|
@ -368,109 +112,6 @@
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
<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}
|
||||||
|
|
||||||
{block name="right_column"}
|
{block name="right_column"}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue