theme-elegance/templates/layouts/layout-both-columns.tpl

277 lines
13 KiB
Smarty

{**
* 2007-2019 PrestaShop and Contributors
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License 3.0 (AFL-3.0)
* that is bundled with this package in the file LICENSE.txt.
* 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.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to https://www.prestashop.com for more information.
*
* @author PrestaShop SA <contact@prestashop.com>
* @copyright 2007-2019 PrestaShop SA and Contributors
* @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
* International Registered Trademark & Property of PrestaShop SA
*}
<!doctype html>
<html lang="{$language.iso_code}">
<head>
{block name='head'}
{include file='_partials/head.tpl'}
{/block}
</head>
<body id="{$page.page_name}" class="{$page.body_classes|classnames}">
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5RQJPSV4"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
{block name='hook_after_body_opening_tag'}
{hook h='displayAfterBodyOpeningTag'}
{/block}
{block name='product_activation'}
{include file='catalog/_partials/product-activation.tpl'}
{/block}
<header class="relative flex items-center w-full">
{block name='header'}
{include file='_partials/header.tpl'}
{/block}
</header>
{block name='displayBeforeWrapper'}
{hook h='displayBeforeWrapper'}
{/block}
<section class="container mx-auto">
{block name='breadcrumb'}
{include file='_partials/breadcrumb.tpl'}
{/block}
{block name='notifications'}
{include file='_partials/notifications.tpl'}
{/block}
{block name='wrapperTop'}
{hook h="displayWrapperTop"}
{/block}
{if $page.page_name == 'index'}
<div class="relative flex items-center">
<a href="https://brooksbingham.com/3d-configurator?id_product=76">
<img
src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/homepage/bb_cyber_monday_sale_banner_compressed.png"
alt="banner.png" />
</a>
<div class="hidden flex flex-col left-8 w-[40%] absolute">
<h3 class="lg:text-lg md:text-3xl text-sm lg:font-bold font-semibold">Brooks Bingham</h3>
<h3 class="lg:text-5xl md:text-3xl text-2xl lg:font-bold font-semibold">Black Friday Sale</h3>
</div>
</div>
<div class="container">
<h2 class="products-section-title text-2xl font-bold mt-20 text-center">Design in 3D - Choose a product to
Start Customization</h2>
<h3 class="text-lg font-semibold text-center mb-12">Tailored to you, at no extra cost.</h3>
<div class="flex md:flex-row flex-col gap-8 lg:mb-32 mb-20">
<div>
<a class="hover:no-underline hover:text-blue-900" href="https://brooksbingham.com/module/thob/configurator?id_product=74">
<img id="shirtImage" class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100" src="https://brooksbingham.com/111-home_default/business-shirt.jpg" alt="business-shirt.jpg" />
<div class="flex flex-col pt-4 items-start">
<div class="flex flex-col items-start">
<h3 class="text-center text-lg font-bold">$66.33</h3>
<h3 class="text-center line-through text-sm font-medium">$99.00</h3>
</div>
<h3 class="text-center text-lg font-light">Shirts</h3>
</div>
</a>
</div>
<div>
<a class="hover:no-underline hover:text-blue-900" href="https://brooksbingham.com/module/thob/configurator?id_product=75">
<img id="suitImage"
class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100"
src="https://brooksbingham.com/107-home_default/business-suit.jpg" alt="business-suit.jpg" />
<div class="flex flex-col pt-4 items-start">
<div class="flex flex-col items-start">
<h3 class="text-center text-lg font-bold">$532.65</h3>
<h3 class="text-center line-through text-sm font-medium">$795.00</h3>
</div>
<h3 class="text-center text-lg font-light">Suits</h3>
</div>
</a>
</div>
<div>
<a class="hover:no-underline hover:text-blue-900" href="https://brooksbingham.com/module/thob/configurator?id_product=76">
<img id="sportsjacketImage"
class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100"
src="https://brooksbingham.com/108-home_default/sports-jacket.jpg" alt="sports-jacket.jpg" />
<div class="flex flex-col pt-4 items-start">
<div class="flex flex-col items-start">
<h3 class="text-center text-lg font-bold">$331.65</h3>
<h3 class="text-center line-through text-sm font-medium">$495.00</h3>
</div>
<h3 class="text-center text-lg font-light">Sports Jackets</h3>
</div>
</a>
</div>
<div>
<a class="hover:no-underline hover:text-blue-900" href="https://brooksbingham.com/module/thob/configurator?id_product=77">
<img id="tuxImage" class="thumbnail product-thumbnail w-full aspect-[342/513] bg-gray-100" src="https://brooksbingham.com/112-home_default/tuxedo.jpg" alt="tuxedo.jpg" />
<div class="flex flex-col pt-4 items-start">
<div class="flex flex-col items-start">
<h3 class="text-center text-lg font-bold">$666.65</h3>
<h3 class="text-center line-through text-sm font-medium">$995.00</h3>
</div>
<h3 class="text-center text-lg font-light">Tuxedos</h3>
</div>
</a>
</div>
</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>
<a href="https://brooksbingham.com/module/thob/configurator?id_product=75">
<video autoplay="autoplay" muted loop width="100%" height="auto">
<source src="https://brooksbingham-season5.sfo2.cdn.digitaloceanspaces.com/site-static-assets/homepage/brooksbingham_configurator_demo_video_compressed.mp4" />
</video>
</a>
</div>
<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"
alt="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">Discover your perfect fit in minutes</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." />
</div>
</div>
<div class="text-white grid grid-cols-2 grid-rows-* gap-y-1 gap-x-1 mb-12">
<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"
alt="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"
alt="Left-small-img2.png" />
</div>
</div>
{/if}
{block name="left_column"}
<div id="left-column" class="col-xs-12 col-sm-4 col-md-3">
{if $page.page_name == 'product'}
{hook h='displayLeftColumnProduct'}
{else}
{hook h="displayLeftColumn"}
{/if}
</div>
{/block}
{block name="content_wrapper"}
<div id="content-wrapper" class="flex w-full">
{hook h="displayContentWrapperTop"}
{block name="content"}
<p>Hello world! This is HTML5 Boilerplate.</p>
{/block}
{hook h="displayContentWrapperBottom"}
</div>
{/block}
{block name="right_column"}
<div id="right-column" class="col-xs-12 col-sm-4 col-md-3">
{if $page.page_name == 'product'}
{hook h='displayRightColumnProduct'}
{else}
{hook h="displayRightColumn"}
{/if}
</div>
{/block}
{block name='wrapperBottom'}
{hook h="displayWrapperBottom"}
{/block}
</section>
{block name='displayAfterWrapper'}
{hook h='displayAfterWrapper'}
{/block}
<footer id="footer" class="relative pt-20 lg:pt-24">
{block name="footer"}
{include file="_partials/footer.tpl"}
{/block}
</footer>
{block name='javascript_bottom'}
{include file="_partials/javascript.tpl" javascript=$javascript.bottom}
{/block}
{block name='hook_before_body_closing_tag'}
{hook h='displayBeforeBodyClosingTag'}
{/block}
</body>
</html>