forked from brooksbingham/theme-elegance
Compare commits
6 Commits
Author | SHA1 | Date |
---|---|---|
|
5a26acca4e | |
|
d15bdaaa6f | |
|
e8f84e4cc0 | |
|
b7919f182d | |
|
7bb502d306 | |
|
e5049a469f |
|
@ -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.
|
||||
5. Use the user's configured `sans` font-feature-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;
|
||||
/* 1 */
|
||||
-webkit-text-size-adjust: 100%;
|
||||
|
@ -50,6 +52,8 @@ html {
|
|||
/* 5 */
|
||||
font-variation-settings: normal;
|
||||
/* 6 */
|
||||
-webkit-tap-highlight-color: transparent;
|
||||
/* 7 */
|
||||
}
|
||||
|
||||
/*
|
||||
|
@ -121,8 +125,10 @@ strong {
|
|||
}
|
||||
|
||||
/*
|
||||
1. Use the user's configured `mono` font family by default.
|
||||
2. Correct the odd `em` font sizing in all browsers.
|
||||
1. Use the user's configured `mono` font-family by default.
|
||||
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,
|
||||
|
@ -131,8 +137,12 @@ samp,
|
|||
pre {
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
/* 1 */
|
||||
font-size: 1em;
|
||||
font-feature-settings: normal;
|
||||
/* 2 */
|
||||
font-variation-settings: normal;
|
||||
/* 3 */
|
||||
font-size: 1em;
|
||||
/* 4 */
|
||||
}
|
||||
|
||||
/*
|
||||
|
@ -201,6 +211,8 @@ textarea {
|
|||
/* 1 */
|
||||
line-height: inherit;
|
||||
/* 1 */
|
||||
letter-spacing: inherit;
|
||||
/* 1 */
|
||||
color: inherit;
|
||||
/* 1 */
|
||||
margin: 0;
|
||||
|
@ -224,9 +236,9 @@ select {
|
|||
*/
|
||||
|
||||
button,
|
||||
[type='button'],
|
||||
[type='reset'],
|
||||
[type='submit'] {
|
||||
input:where([type='button']),
|
||||
input:where([type='reset']),
|
||||
input:where([type='submit']) {
|
||||
-webkit-appearance: button;
|
||||
/* 1 */
|
||||
background-color: transparent;
|
||||
|
@ -653,6 +665,10 @@ select {
|
|||
--tw-backdrop-opacity: ;
|
||||
--tw-backdrop-saturate: ;
|
||||
--tw-backdrop-sepia: ;
|
||||
--tw-contain-size: ;
|
||||
--tw-contain-layout: ;
|
||||
--tw-contain-paint: ;
|
||||
--tw-contain-style: ;
|
||||
}
|
||||
|
||||
::backdrop {
|
||||
|
@ -703,6 +719,10 @@ select {
|
|||
--tw-backdrop-opacity: ;
|
||||
--tw-backdrop-saturate: ;
|
||||
--tw-backdrop-sepia: ;
|
||||
--tw-contain-size: ;
|
||||
--tw-contain-layout: ;
|
||||
--tw-contain-paint: ;
|
||||
--tw-contain-style: ;
|
||||
}
|
||||
|
||||
.container {
|
||||
|
@ -847,10 +867,6 @@ select {
|
|||
grid-column: span 1 / span 1;
|
||||
}
|
||||
|
||||
.col-span-3 {
|
||||
grid-column: span 3 / span 3;
|
||||
}
|
||||
|
||||
.col-start-1 {
|
||||
grid-column-start: 1;
|
||||
}
|
||||
|
@ -875,18 +891,10 @@ select {
|
|||
grid-row-start: 1;
|
||||
}
|
||||
|
||||
.row-start-2 {
|
||||
grid-row-start: 2;
|
||||
}
|
||||
|
||||
.row-end-2 {
|
||||
grid-row-end: 2;
|
||||
}
|
||||
|
||||
.row-end-3 {
|
||||
grid-row-end: 3;
|
||||
}
|
||||
|
||||
.-mx-2 {
|
||||
margin-left: -0.5rem;
|
||||
margin-right: -0.5rem;
|
||||
|
@ -902,11 +910,6 @@ select {
|
|||
margin-bottom: -0.75rem;
|
||||
}
|
||||
|
||||
.mx-1 {
|
||||
margin-left: 0.25rem;
|
||||
margin-right: 0.25rem;
|
||||
}
|
||||
|
||||
.mx-3 {
|
||||
margin-left: 0.75rem;
|
||||
margin-right: 0.75rem;
|
||||
|
@ -932,26 +935,21 @@ select {
|
|||
margin-bottom: 0.125rem;
|
||||
}
|
||||
|
||||
.my-12 {
|
||||
margin-top: 3rem;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.my-2 {
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.my-20 {
|
||||
margin-top: 5rem;
|
||||
margin-bottom: 5rem;
|
||||
}
|
||||
|
||||
.my-8 {
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.my-32 {
|
||||
margin-top: 8rem;
|
||||
margin-bottom: 8rem;
|
||||
}
|
||||
|
||||
.mb-1 {
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
@ -960,6 +958,10 @@ select {
|
|||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.mb-16 {
|
||||
margin-bottom: 4rem;
|
||||
}
|
||||
|
||||
.mb-2 {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
@ -1032,18 +1034,10 @@ select {
|
|||
margin-top: 0.75rem;
|
||||
}
|
||||
|
||||
.mt-32 {
|
||||
margin-top: 8rem;
|
||||
}
|
||||
|
||||
.mt-4 {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.mt-48 {
|
||||
margin-top: 12rem;
|
||||
}
|
||||
|
||||
.mt-6 {
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
@ -1052,10 +1046,6 @@ select {
|
|||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.mt-9 {
|
||||
margin-top: 2.25rem;
|
||||
}
|
||||
|
||||
.block {
|
||||
display: block;
|
||||
}
|
||||
|
@ -1088,10 +1078,6 @@ select {
|
|||
aspect-ratio: 342/513;
|
||||
}
|
||||
|
||||
.h-1\/2 {
|
||||
height: 50%;
|
||||
}
|
||||
|
||||
.h-12 {
|
||||
height: 3rem;
|
||||
}
|
||||
|
@ -1112,28 +1098,16 @@ select {
|
|||
height: 1.5rem;
|
||||
}
|
||||
|
||||
.h-72 {
|
||||
height: 18rem;
|
||||
}
|
||||
|
||||
.h-8 {
|
||||
height: 2rem;
|
||||
}
|
||||
|
||||
.h-\[100px\] {
|
||||
height: 100px;
|
||||
.h-\[350px\] {
|
||||
height: 350px;
|
||||
}
|
||||
|
||||
.h-\[20px\] {
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.h-\[50px\] {
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.h-\[50vh\] {
|
||||
height: 50vh;
|
||||
.h-\[380px\] {
|
||||
height: 380px;
|
||||
}
|
||||
|
||||
.h-auto {
|
||||
|
@ -1208,14 +1182,6 @@ select {
|
|||
width: 160px;
|
||||
}
|
||||
|
||||
.w-\[20px\] {
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
.w-\[50px\] {
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
.w-full {
|
||||
width: 100%;
|
||||
}
|
||||
|
@ -1292,22 +1258,10 @@ select {
|
|||
list-style-type: square;
|
||||
}
|
||||
|
||||
.grid-flow-col {
|
||||
grid-auto-flow: column;
|
||||
}
|
||||
|
||||
.grid-cols-2 {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.grid-cols-3 {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.grid-rows-3 {
|
||||
grid-template-rows: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
@ -1340,10 +1294,6 @@ select {
|
|||
align-items: baseline;
|
||||
}
|
||||
|
||||
.justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.justify-end {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
@ -1397,31 +1347,16 @@ select {
|
|||
column-gap: 0.25rem;
|
||||
}
|
||||
|
||||
.gap-x-2 {
|
||||
-moz-column-gap: 0.5rem;
|
||||
column-gap: 0.5rem;
|
||||
}
|
||||
|
||||
.gap-y-1 {
|
||||
row-gap: 0.25rem;
|
||||
}
|
||||
|
||||
.gap-y-2 {
|
||||
row-gap: 0.5rem;
|
||||
}
|
||||
|
||||
.space-x-2 > :not([hidden]) ~ :not([hidden]) {
|
||||
--tw-space-x-reverse: 0;
|
||||
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
||||
margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
|
||||
}
|
||||
|
||||
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
|
||||
--tw-space-y-reverse: 0;
|
||||
margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
|
||||
margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
|
||||
}
|
||||
|
||||
.overflow-y-auto {
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
@ -1444,10 +1379,6 @@ select {
|
|||
border-width: 1px;
|
||||
}
|
||||
|
||||
.border-2 {
|
||||
border-width: 2px;
|
||||
}
|
||||
|
||||
.border-t {
|
||||
border-top-width: 1px;
|
||||
}
|
||||
|
@ -1456,11 +1387,6 @@ select {
|
|||
border-style: none;
|
||||
}
|
||||
|
||||
.border-black {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(0 0 0 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.border-blue-300 {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(147 197 253 / var(--tw-border-opacity));
|
||||
|
@ -1516,11 +1442,6 @@ select {
|
|||
border-color: rgb(252 165 165 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.border-white {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(255 255 255 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.bg-black\/70 {
|
||||
background-color: rgb(0 0 0 / 0.7);
|
||||
}
|
||||
|
@ -1589,15 +1510,6 @@ select {
|
|||
object-fit: cover;
|
||||
}
|
||||
|
||||
.object-scale-down {
|
||||
-o-object-fit: scale-down;
|
||||
object-fit: scale-down;
|
||||
}
|
||||
|
||||
.p-1 {
|
||||
padding: 0.25rem;
|
||||
}
|
||||
|
||||
.p-2 {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
@ -1632,11 +1544,6 @@ select {
|
|||
padding-right: 1rem;
|
||||
}
|
||||
|
||||
.px-5 {
|
||||
padding-left: 1.25rem;
|
||||
padding-right: 1.25rem;
|
||||
}
|
||||
|
||||
.px-6 {
|
||||
padding-left: 1.5rem;
|
||||
padding-right: 1.5rem;
|
||||
|
@ -1672,6 +1579,11 @@ select {
|
|||
padding-bottom: 2rem;
|
||||
}
|
||||
|
||||
.px-5 {
|
||||
padding-left: 1.25rem;
|
||||
padding-right: 1.25rem;
|
||||
}
|
||||
|
||||
.pb-10 {
|
||||
padding-bottom: 2.5rem;
|
||||
}
|
||||
|
@ -1688,18 +1600,10 @@ select {
|
|||
padding-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
.pb-4 {
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
|
||||
.pb-6 {
|
||||
padding-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.pl-0 {
|
||||
padding-left: 0px;
|
||||
}
|
||||
|
||||
.pl-12 {
|
||||
padding-left: 3rem;
|
||||
}
|
||||
|
@ -1708,10 +1612,6 @@ select {
|
|||
padding-left: 0.5rem;
|
||||
}
|
||||
|
||||
.pl-4 {
|
||||
padding-left: 1rem;
|
||||
}
|
||||
|
||||
.pl-6 {
|
||||
padding-left: 1.5rem;
|
||||
}
|
||||
|
@ -1744,26 +1644,14 @@ select {
|
|||
padding-right: 2rem;
|
||||
}
|
||||
|
||||
.pt-0 {
|
||||
padding-top: 0px;
|
||||
}
|
||||
|
||||
.pt-1 {
|
||||
padding-top: 0.25rem;
|
||||
}
|
||||
|
||||
.pt-2 {
|
||||
padding-top: 0.5rem;
|
||||
}
|
||||
|
||||
.pt-20 {
|
||||
padding-top: 5rem;
|
||||
}
|
||||
|
||||
.pt-3 {
|
||||
padding-top: 0.75rem;
|
||||
}
|
||||
|
||||
.pt-4 {
|
||||
padding-top: 1rem;
|
||||
}
|
||||
|
@ -1776,14 +1664,6 @@ select {
|
|||
padding-top: 1.5rem;
|
||||
}
|
||||
|
||||
.pt-7 {
|
||||
padding-top: 1.75rem;
|
||||
}
|
||||
|
||||
.pt-8 {
|
||||
padding-top: 2rem;
|
||||
}
|
||||
|
||||
.pt-9 {
|
||||
padding-top: 2.25rem;
|
||||
}
|
||||
|
@ -1814,11 +1694,6 @@ select {
|
|||
line-height: 2.5rem;
|
||||
}
|
||||
|
||||
.text-5xl {
|
||||
font-size: 3rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.text-base {
|
||||
font-size: 1rem;
|
||||
line-height: 1.5rem;
|
||||
|
@ -1891,11 +1766,6 @@ select {
|
|||
color: rgb(23 37 84 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.text-gray-300 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(209 213 219 / var(--tw-text-opacity));
|
||||
}
|
||||
|
||||
.text-gray-400 {
|
||||
--tw-text-opacity: 1;
|
||||
color: rgb(156 163 175 / var(--tw-text-opacity));
|
||||
|
@ -2046,7 +1916,7 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
}
|
||||
|
||||
.group{
|
||||
&:before,
|
||||
&:before,
|
||||
&:after {
|
||||
content: "";
|
||||
display: table;
|
||||
|
@ -2301,6 +2171,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
.sm\:mb-1 {
|
||||
margin-bottom: 0.25rem;
|
||||
}
|
||||
|
||||
.sm\:flex {
|
||||
display: flex;
|
||||
}
|
||||
|
@ -2316,19 +2190,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;
|
||||
}
|
||||
|
||||
.md\:mt-0 {
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
@ -2337,10 +2198,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
margin-top: 6rem;
|
||||
}
|
||||
|
||||
.md\:mt-32 {
|
||||
margin-top: 8rem;
|
||||
}
|
||||
|
||||
.md\:block {
|
||||
display: block;
|
||||
}
|
||||
|
@ -2357,30 +2214,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
display: none;
|
||||
}
|
||||
|
||||
.md\:h-\[200px\] {
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.md\:h-\[300px\] {
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.md\:h-\[3rem\] {
|
||||
height: 3rem;
|
||||
}
|
||||
|
||||
.md\:h-\[400px\] {
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.md\:h-\[40px\] {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.md\:h-\[410px\] {
|
||||
height: 410px;
|
||||
}
|
||||
|
||||
.md\:w-1\/2 {
|
||||
width: 50%;
|
||||
}
|
||||
|
@ -2409,34 +2246,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
width: 50%;
|
||||
}
|
||||
|
||||
.md\:w-8\/12 {
|
||||
width: 66.666667%;
|
||||
}
|
||||
|
||||
.md\:w-\[30\%\] {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.md\:w-\[40\%\] {
|
||||
width: 40%;
|
||||
}
|
||||
|
||||
.md\:w-\[40px\] {
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
.md\:w-\[50\%\] {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.md\:w-\[60\%\] {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
.md\:w-\[70\%\] {
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.md\:grid-cols-3 {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
|
@ -2453,10 +2262,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.md\:justify-start {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.md\:gap-0 {
|
||||
gap: 0px;
|
||||
}
|
||||
|
@ -2477,36 +2282,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
padding: 2rem;
|
||||
}
|
||||
|
||||
.md\:px-10 {
|
||||
padding-left: 2.5rem;
|
||||
padding-right: 2.5rem;
|
||||
}
|
||||
|
||||
.md\:px-4 {
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
}
|
||||
|
||||
.md\:pl-10 {
|
||||
padding-left: 2.5rem;
|
||||
}
|
||||
|
||||
.md\:pl-12 {
|
||||
padding-left: 3rem;
|
||||
}
|
||||
|
||||
.md\:pl-3 {
|
||||
padding-left: 0.75rem;
|
||||
}
|
||||
|
||||
.md\:pl-4 {
|
||||
padding-left: 1rem;
|
||||
}
|
||||
|
||||
.md\:pl-5 {
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
|
||||
.md\:pr-12 {
|
||||
padding-right: 3rem;
|
||||
}
|
||||
|
@ -2519,38 +2298,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
padding-right: 12rem;
|
||||
}
|
||||
|
||||
.md\:pr-5 {
|
||||
padding-right: 1.25rem;
|
||||
}
|
||||
|
||||
.md\:pt-0 {
|
||||
padding-top: 0px;
|
||||
}
|
||||
|
||||
.md\:pt-10 {
|
||||
padding-top: 2.5rem;
|
||||
}
|
||||
|
||||
.md\:pt-12 {
|
||||
padding-top: 3rem;
|
||||
}
|
||||
|
||||
.md\:pt-6 {
|
||||
padding-top: 1.5rem;
|
||||
}
|
||||
|
||||
.md\:pt-8 {
|
||||
padding-top: 2rem;
|
||||
}
|
||||
|
||||
.md\:pt-9 {
|
||||
padding-top: 2.25rem;
|
||||
}
|
||||
|
||||
.md\:text-left {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.md\:text-2xl {
|
||||
font-size: 1.5rem;
|
||||
line-height: 2rem;
|
||||
|
@ -2581,27 +2332,9 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
line-height: 1.25rem;
|
||||
}
|
||||
|
||||
.md\:text-xl {
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.75rem;
|
||||
}
|
||||
|
||||
.md\:text-xs {
|
||||
font-size: 0.75rem;
|
||||
line-height: 1rem;
|
||||
}
|
||||
|
||||
.md\:font-bold {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.md\:font-medium {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.md\:font-semibold {
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
|
@ -2621,20 +2354,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
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;
|
||||
}
|
||||
|
||||
.lg\:mb-2 {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
@ -2643,10 +2362,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
margin-bottom: 8rem;
|
||||
}
|
||||
|
||||
.lg\:mt-32 {
|
||||
margin-top: 8rem;
|
||||
}
|
||||
|
||||
.lg\:flex {
|
||||
display: flex;
|
||||
}
|
||||
|
@ -2655,20 +2370,8 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
display: none;
|
||||
}
|
||||
|
||||
.lg\:h-\[200px\] {
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.lg\:h-\[400px\] {
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.lg\:h-\[500px\] {
|
||||
height: 500px;
|
||||
}
|
||||
|
||||
.lg\:h-\[60px\] {
|
||||
height: 60px;
|
||||
.lg\:h-2\/3 {
|
||||
height: 66.666667%;
|
||||
}
|
||||
|
||||
.lg\:h-\[90vh\] {
|
||||
|
@ -2687,6 +2390,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
width: 20%;
|
||||
}
|
||||
|
||||
.lg\:w-11\/12 {
|
||||
width: 91.666667%;
|
||||
}
|
||||
|
||||
.lg\:w-2\/5 {
|
||||
width: 40%;
|
||||
}
|
||||
|
@ -2695,18 +2402,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
width: 60%;
|
||||
}
|
||||
|
||||
.lg\:w-52 {
|
||||
width: 13rem;
|
||||
}
|
||||
|
||||
.lg\:w-80 {
|
||||
width: 20rem;
|
||||
}
|
||||
|
||||
.lg\:w-\[60px\] {
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.lg\:w-full {
|
||||
width: 100%;
|
||||
}
|
||||
|
@ -2743,16 +2442,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
padding: 1rem;
|
||||
}
|
||||
|
||||
.lg\:px-20 {
|
||||
padding-left: 5rem;
|
||||
padding-right: 5rem;
|
||||
}
|
||||
|
||||
.lg\:px-36 {
|
||||
padding-left: 9rem;
|
||||
padding-right: 9rem;
|
||||
}
|
||||
|
||||
.lg\:px-8 {
|
||||
padding-left: 2rem;
|
||||
padding-right: 2rem;
|
||||
|
@ -2763,72 +2452,31 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
padding-bottom: 0px;
|
||||
}
|
||||
|
||||
.lg\:py-8 {
|
||||
padding-top: 2rem;
|
||||
padding-bottom: 2rem;
|
||||
.lg\:px-36 {
|
||||
padding-left: 9rem;
|
||||
padding-right: 9rem;
|
||||
}
|
||||
|
||||
.lg\:pb-6 {
|
||||
padding-bottom: 1.5rem;
|
||||
.lg\:pt-12 {
|
||||
padding-top: 3rem;
|
||||
}
|
||||
|
||||
.lg\:pl-2 {
|
||||
padding-left: 0.5rem;
|
||||
}
|
||||
|
||||
.lg\:pl-24 {
|
||||
padding-left: 6rem;
|
||||
}
|
||||
|
||||
.lg\:pl-5 {
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
|
||||
.lg\:pr-10 {
|
||||
padding-right: 2.5rem;
|
||||
}
|
||||
|
||||
.lg\:pr-6 {
|
||||
padding-right: 1.5rem;
|
||||
}
|
||||
|
||||
.lg\:pt-10 {
|
||||
padding-top: 2.5rem;
|
||||
}
|
||||
|
||||
.lg\:pt-16 {
|
||||
padding-top: 4rem;
|
||||
}
|
||||
|
||||
.lg\:pt-20 {
|
||||
padding-top: 5rem;
|
||||
.lg\:pt-14 {
|
||||
padding-top: 3.5rem;
|
||||
}
|
||||
|
||||
.lg\:pt-24 {
|
||||
padding-top: 6rem;
|
||||
}
|
||||
|
||||
.lg\:pt-8 {
|
||||
padding-top: 2rem;
|
||||
}
|
||||
|
||||
.lg\:pt-9 {
|
||||
padding-top: 2.25rem;
|
||||
}
|
||||
|
||||
.lg\:text-2xl {
|
||||
font-size: 1.5rem;
|
||||
line-height: 2rem;
|
||||
}
|
||||
|
||||
.lg\:text-3xl {
|
||||
font-size: 1.875rem;
|
||||
line-height: 2.25rem;
|
||||
}
|
||||
|
||||
.lg\:text-4xl {
|
||||
font-size: 2.25rem;
|
||||
line-height: 2.5rem;
|
||||
.lg\:text-5xl {
|
||||
font-size: 3rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.lg\:text-lg {
|
||||
|
@ -2841,6 +2489,11 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
line-height: 1.75rem;
|
||||
}
|
||||
|
||||
.lg\:text-4xl {
|
||||
font-size: 2.25rem;
|
||||
line-height: 2.5rem;
|
||||
}
|
||||
|
||||
.lg\:font-bold {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
@ -2868,29 +2521,5 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
|
|||
.xl\:w-9\/12 {
|
||||
width: 75%;
|
||||
}
|
||||
|
||||
.xl\:pl-12 {
|
||||
padding-left: 3rem;
|
||||
}
|
||||
|
||||
.xl\:pr-12 {
|
||||
padding-right: 3rem;
|
||||
}
|
||||
|
||||
.xl\:text-5xl {
|
||||
font-size: 3rem;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.xl\:text-xl {
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1536px) {
|
||||
.\32xl\:pr-16 {
|
||||
padding-right: 4rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -1,25 +0,0 @@
|
|||
{**
|
||||
* Copyright since 2007 PrestaShop SA and Contributors
|
||||
* PrestaShop is an International Registered Trademark & Property of PrestaShop SA
|
||||
*
|
||||
* NOTICE OF LICENSE
|
||||
*
|
||||
* This source file is subject to the Academic Free License version 3.0
|
||||
* that is bundled with this package in the file LICENSE.md.
|
||||
* It is also available through the world-wide-web at this URL:
|
||||
* https://opensource.org/licenses/AFL-3.0
|
||||
* If you did not receive a copy of the license and are unable to
|
||||
* obtain it through the world-wide-web, please send an email
|
||||
* to license@prestashop.com so we can send you a copy immediately.
|
||||
*
|
||||
* @author PrestaShop SA and Contributors <contact@prestashop.com>
|
||||
* @copyright Since 2007 PrestaShop SA and Contributors
|
||||
* @license https://opensource.org/licenses/AFL-3.0 Academic Free License version 3.0
|
||||
*}
|
||||
|
||||
<a class="w-full md:w-1/3 lg:w-1/4 flex flex-col p-4 border-gray-500" id="wishlist-link" disabled>
|
||||
<span class="flex flex-col items-center font-semibolds text-lg">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-ruler-measure" width="32" height="32" 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="M19.875 12c.621 0 1.125 .512 1.125 1.143v5.714c0 .631 -.504 1.143 -1.125 1.143h-15.875a1 1 0 0 1 -1 -1v-5.857c0 -.631 .504 -1.143 1.125 -1.143h15.75z" /><path d="M9 12v2" /><path d="M6 12v3" /><path d="M12 12v3" /><path d="M18 12v3" /><path d="M15 12v2" /><path d="M3 3v4" /><path d="M3 5h18" /><path d="M21 3v4" /></svg>
|
||||
Body Measurements
|
||||
</span>
|
||||
</a>
|
|
@ -22,7 +22,7 @@
|
|||
* @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
|
||||
* International Registered Trademark & Property of PrestaShop SA
|
||||
*}
|
||||
<div class="product-add-to-cart flex flex-col gap-3 mt-8 mb-4">
|
||||
<div class="product-add-to-cart flex flex-col gap-3 mb-4">
|
||||
{if !$configuration.is_catalog}
|
||||
|
||||
{block name='product_availability'}
|
||||
|
|
|
@ -69,24 +69,22 @@
|
|||
<div class="relative
|
||||
flex
|
||||
mt-16
|
||||
h-1/2
|
||||
lg:h-2/3
|
||||
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
|
||||
lg:bottom-48
|
||||
bottom-9
|
||||
text-[#000E2A]
|
||||
text-left
|
||||
lg:text-4xl
|
||||
lg:text-5xl
|
||||
md:text-2xl
|
||||
text-xs
|
||||
text-sm
|
||||
lg:font-semibold
|
||||
font-bold">
|
||||
<h1> Because You Are Unique. </h1>
|
||||
<h1> So Is Your Body… </h1>
|
||||
|
@ -96,11 +94,11 @@
|
|||
<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
|
||||
Custom Fit for teyour 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 shirts and tuxedos are tailored just for you, offering a fit like no other.
|
||||
Experience unmatched comfort and style with our tailored suits, celebrating 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">
|
||||
|
@ -163,6 +161,11 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="mx-auto">
|
||||
<div class="max-w-screen-lg
|
||||
mx-auto
|
||||
|
@ -207,7 +210,7 @@
|
|||
pb-2">
|
||||
Select the Fabric </h4>
|
||||
<p class="mt-3
|
||||
font-medium
|
||||
font-semibold
|
||||
text-lg
|
||||
leading-6
|
||||
text-gray-500">
|
||||
|
@ -243,7 +246,7 @@
|
|||
Finalize the Design </h4>
|
||||
<p class="mt-3
|
||||
text-lg
|
||||
font-medium
|
||||
font-semibold
|
||||
leading-6
|
||||
text-gray-500">
|
||||
Personalize details like lapels, pockets, and lining through online platform. </p>
|
||||
|
@ -277,7 +280,7 @@
|
|||
Get Measured </h4>
|
||||
<p class="mt-3
|
||||
text-lg
|
||||
font-medium
|
||||
font-semibold
|
||||
leading-6
|
||||
text-gray-500">
|
||||
Ensure your custom apparel fits you flawlessly by getting measured. </p>
|
||||
|
@ -288,41 +291,3 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="mx-auto lg:my-20 my-12 flex flex-col justify-center px-4 md:px-10 lg:px-20">
|
||||
<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>
|
||||
</div>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
{*
|
||||
{**
|
||||
* 2007-2019 PrestaShop and Contributors
|
||||
*
|
||||
* NOTICE OF LICENSE
|
||||
|
@ -54,6 +54,16 @@
|
|||
{block name='displayBeforeWrapper'}
|
||||
{hook h='displayBeforeWrapper'}
|
||||
{/block}
|
||||
|
||||
{if $page.page_name == 'index'}
|
||||
<a href="https://brooksbingham.com/17-custom-made" id="slider">
|
||||
<div class="mb-12 w-full lg:h-[90vh]" style="clip-path: inset(4px)" id="slider">
|
||||
<video autoplay muted loop class="w-full h-full 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>
|
||||
</a>
|
||||
{/if}
|
||||
|
||||
<section class="container mx-auto">
|
||||
{block name='breadcrumb'}
|
||||
|
@ -85,97 +95,9 @@
|
|||
{/block}
|
||||
|
||||
{if $page.page_name == 'index'}
|
||||
|
||||
|
||||
<div>
|
||||
<img src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/custom_page_banner_image.jpeg"
|
||||
</div>
|
||||
|
||||
|
||||
<div class="lg:my-32 my-20" >
|
||||
<h1 class="text-2xl font-bold text-center">Design and Visualize what you need</h1>
|
||||
<h3 class="text-lg font-semibold text-center mb-12">Choose what looks good on you </h3>
|
||||
<img src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/widget-screenshot.png"/>
|
||||
</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="lg:text-xl md:text-md text-sm font-medium pt-5">
|
||||
Personalize your handcrafted look with our exclusive collection of Made-to-Measure men's clothing.
|
||||
</p>
|
||||
<p class="lg:text-xl md:text-md text-sm font-medium pt-1">
|
||||
Take control and feel confident with our Perfect Fit Guarantee
|
||||
</p>
|
||||
<div class="lg:w-52 md:w-42 w-38 flex md:justify-start justify-center">
|
||||
<a class="all-product-link lg:text-xl md:text-md text-sm font-bold mt-9 flex border border-2 border-black p-2 px-4"
|
||||
href="https://brooksbingham.com/16-custom-made-clothing">
|
||||
Start Customization
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full md:w-[50%] grid grid-flow-col grid-rows-3 gap-x-2 lg:pl-5 md:pl-3 pl-0">
|
||||
<div class="row-end-3 row-span-2">
|
||||
<img class="object-cover md:h-[200px] h-full w-full" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
<div class="row-start-2 row-span-2">
|
||||
<img class="object-cover md:h-[200px] h-full w-full " src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
</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">
|
||||
<div class="grid grid-cols-3 gap-y-2 gap-x-2">
|
||||
<div class="">
|
||||
<img class="object-cover md:h-[200px] h-full" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
<div class="row-span-1">
|
||||
<img class="object-cover md:h-[200px] h-full" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
<div class="row-span-2 col-span-1 relative">
|
||||
<img class="object-cover md:h-[410px] h-full" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
<div>
|
||||
<img class="object-cover md:h-[200px] h-full" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
<div class="">
|
||||
<img class="object-cover md:h-[200px] h-full" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
</div>
|
||||
</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-xl text-lg md:pt-0 pt-2">
|
||||
Tailored Perfection for a Flawless Fit
|
||||
</h1>
|
||||
<p class="lg:text-xl md:text-md text-sm font-medium pt-5">
|
||||
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="lg:text-xl md:text-md 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 lg:text-xl md:text-md text-sm font-bold mt-9 flex border border-2 border-black p-2 px-4"
|
||||
href="https://brooksbingham.com/16-custom-made-clothing">
|
||||
Start Customization
|
||||
</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 class="container">
|
||||
<h2 class="products-section-title text-2xl font-bold mb-16 mt-20 text-center"> Custom design by you</h2>
|
||||
<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"/>
|
||||
|
@ -203,205 +125,17 @@
|
|||
<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">
|
||||
<div class="grid grid-rows-3 grid-flow-col gap-y-2 gap-x-2">
|
||||
<div class="row-span-2">
|
||||
<img class="h-full object-cover"
|
||||
src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
<div class="row-span-1">
|
||||
<img class="h-full object-cover"
|
||||
src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
<div class="row-span-1">
|
||||
<img class="h-full object-cover"
|
||||
src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
<div class="row-span-2">
|
||||
<img class="h-full object-cover"
|
||||
src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
<div class="row-span-3">
|
||||
<img class="h-full object-cover"
|
||||
src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
</div>
|
||||
</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="lg:pt-10 md:pt-6 pt-4 lg:text-xl 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 class="lg:mb-32 mb-20" >
|
||||
<h1 class="text-2xl font-bold text-center">Design and Visualize what you need</h1>
|
||||
<h3 class="text-lg font-semibold text-center mb-12">Choose what looks good on you </h3>
|
||||
<img src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/widget-screenshot.png"/>
|
||||
</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 lg:pt-20 md:pt-9 pt-0">
|
||||
Why Choose Brooks Bingham?
|
||||
</h1>
|
||||
<div class="flex md:flex-row flex-col lg:pt-20 md:pt-10 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%] grid grid-cols-3 gap-x-2 gap-y-2 lg:pl-2 md:pl-3 pl-0 md:pt-0 pt-4">
|
||||
<div class="col-span-3">
|
||||
<img class="object-cover lg:h-[200px] h-[100px] w-full" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
<div class="">
|
||||
<img class="object-cover lg:h-[200px] h-[100px] w-full " src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
<div class="">
|
||||
<img class="object-cover lg:h-[200px] h-[100px] w-full" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
<div class="">
|
||||
<img class="object-cover lg:h-[200px] h-[100px] w-full" src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
</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%]">
|
||||
<img class="image object-cover w-full h-full md:h-[400px]"
|
||||
src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/gallery/Left-small-img1.jpg">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="mt-32 mx-4 flex relative items-center">
|
||||
<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/gallery/Left-small-img1.jpg">
|
||||
|
||||
<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"
|
||||
href="https://brooksbingham.com/16-custom-made-clothing">
|
||||
Start Customization
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mx-4 mt-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>
|
||||
|
@ -441,7 +175,7 @@
|
|||
<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'}
|
||||
|
@ -449,7 +183,7 @@
|
|||
</a>
|
||||
|
||||
|
||||
<div class="flex">
|
||||
<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>
|
||||
|
|
Loading…
Reference in New Issue