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

Merge pull request 'refactor: minor styling changes and fixes' (#16) from abhisheks/theme-elegance:main into main 

Reviewed-on: brooksbingham/theme-elegance#16
pagebuilder
abhisheks 2023-12-11 10:59:16 +00:00
parent 4f7eb431b9 c4a72e0bb7
commit 624d3c9d4f
10 changed files with 186 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
_dev/js/theme.js
View File

@ -24,12 +24,12 @@
*/
/* eslint-disable */
// import 'bootstrap/dist/js/bootstrap.min';
import 'jquery-modal'
import "jquery-modal";
import "jquery-offcanvas/dist/jquery.offcanvas.min.css";
import touchspin from "bootstrap-touchspin";
import "jquery-touchswipe";
import "./selectors";
import './tabs.js';
import "./tabs.js";
import "./responsive";
import "./checkout";
@ -165,4 +165,7 @@ $(function () {
$(".th-accordion").thaccordion();
$(".toggle-main-menu").on("click", function () {
$(".mobile-main-menu").toggle();
});
});

173
assets/css/theme.css
View File

@ -823,6 +823,26 @@ select {
top: 100%;
}
.top-12 {
top: 3rem;
}
.left-2\/3 {
left: 66.666667%;
}
.left-\[40\%\] {
left: 40%;
}
.left-\[45\%\] {
left: 45%;
}
.left-1\/2 {
left: 50%;
}
.z-10 {
z-index: 10;
}
@ -1029,10 +1049,6 @@ select {
width: 33.333333%;
}
.w-1\/4 {
width: 25%;
}
.w-1\/6 {
width: 16.666667%;
}
@ -1049,6 +1065,10 @@ select {
width: 6rem;
}
.w-3\/4 {
width: 75%;
}
.w-40 {
width: 10rem;
}
@ -1102,14 +1122,14 @@ select {
max-width: 240px;
}
.max-w-\[250px\] {
max-width: 250px;
}
.max-w-full {
max-width: 100%;
}
.max-w-\[180px\] {
max-width: 180px;
}
.flex-1 {
flex: 1 1 0%;
}
@ -1291,6 +1311,27 @@ select {
border-color: rgb(252 165 165 / var(--tw-border-opacity));
}
.border-gray-100 {
--tw-border-opacity: 1;
border-color: rgb(243 244 246 / var(--tw-border-opacity));
}
.border-gray-200\/50 {
border-color: rgb(229 231 235 / 0.5);
}
.border-gray-500\/50 {
border-color: rgb(107 114 128 / 0.5);
}
.border-gray-300\/50 {
border-color: rgb(209 213 219 / 0.5);
}
.border-gray-200\/70 {
border-color: rgb(229 231 235 / 0.7);
}
.bg-black\/70 {
background-color: rgb(0 0 0 / 0.7);
}
@ -1335,6 +1376,30 @@ select {
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.stroke-red-200 {
stroke: #fecaca;
}
.stroke-gray-800 {
stroke: #1f2937;
}
.stroke-gray-600 {
stroke: #4b5563;
}
.stroke-\[4px\] {
stroke-width: 4px;
}
.stroke-\[6px\] {
stroke-width: 6px;
}
.stroke-\[3px\] {
stroke-width: 3px;
}
.object-contain {
-o-object-fit: contain;
object-fit: contain;
@ -1497,6 +1562,16 @@ select {
line-height: 1rem;
}
.text-5xl {
font-size: 3rem;
line-height: 1;
}
.text-3xl {
font-size: 1.875rem;
line-height: 2.25rem;
}
.font-bold {
font-weight: 700;
}
@ -1605,6 +1680,33 @@ select {
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-md {
--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-inner {
--tw-shadow: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
--tw-shadow-colored: inset 0 2px 4px 0 var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.drop-shadow-md {
--tw-drop-shadow: drop-shadow(0 4px 3px rgb(0 0 0 / 0.07)) drop-shadow(0 2px 2px rgb(0 0 0 / 0.06));
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow-sm {
--tw-drop-shadow: drop-shadow(0 1px 1px rgb(0 0 0 / 0.05));
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.drop-shadow-lg {
--tw-drop-shadow: drop-shadow(0 10px 8px rgb(0 0 0 / 0.04)) drop-shadow(0 4px 3px rgb(0 0 0 / 0.1));
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.filter {
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
@ -1732,20 +1834,51 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
}
@media not all and (min-width: 768px) {
.max-md\:right-4 {
right: 1rem;
}
.max-md\:right-8 {
right: 2rem;
}
.max-md\:right-6 {
right: 1.5rem;
}
.max-md\:hidden {
display: none;
}
.max-md\:w-max {
width: -moz-max-content;
width: max-content;
}
.max-md\:max-w-\[70\%\] {
max-width: 70%;
}
.max-md\:flex-col {
flex-direction: column;
}
.max-md\:items-end {
align-items: flex-end;
}
.max-md\:px-2 {
padding-left: 0.5rem;
padding-right: 0.5rem;
}
}
@media not all and (min-width: 640px) {
.max-sm\:max-w-\[70\%\] {
max-width: 70%;
}
}
@media (min-width: 640px) {
.sm\:flex {
display: flex;
@ -1773,6 +1906,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
display: none;
}
.md\:h-screen {
height: 100vh;
}
.md\:w-1\/2 {
width: 50%;
}
@ -1797,6 +1934,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
width: 50%;
}
.md\:max-w-\[350px\] {
max-width: 350px;
}
.md\:flex-row {
flex-direction: row;
}
@ -1863,6 +2004,14 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
right: 0px;
}
.lg\:left-16 {
left: 4rem;
}
.lg\:right-16 {
right: 4rem;
}
.lg\:flex {
display: flex;
}
@ -1871,6 +2020,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
display: none;
}
.lg\:h-screen {
height: 100vh;
}
.lg\:w-1\/3 {
width: 33.333333%;
}
@ -1911,6 +2064,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus {
flex-wrap: nowrap;
}
.lg\:border-none {
border-style: none;
}
.lg\:bg-transparent {
background-color: transparent;
}

5
assets/js/theme.js
View File

File diff suppressed because one or more lines are too long

2
modules/ps_customersignin/ps_customersignin.tpl
View File

@ -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 id="_desktop_user_info" class="relative">
<div id="_desktop_user_info" class="relative max-md:hidden">
<div class="flex max-w-[200px] justify-end mx-4">
{if $logged}
<a

3
modules/ps_featuredproducts/views/templates/hook/ps_featuredproducts.tpl
View File

@ -31,7 +31,8 @@
{include file="catalog/_partials/miniatures/product.tpl" product=$product}
{/foreach}
</div>
<a class="all-product-link text-2xl font-bold" href="{$allProductsLink}">
<a class="all-product-link text-2xl font-bold w-full flex items-center justify-end" href="{$allProductsLink}">
{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>
</a>
</section>

6
modules/ps_imageslider/views/templates/hook/slider.tpl
View File

@ -29,11 +29,11 @@
{foreach from=$homeslider.slides item=slide name='homeslider'}
<li class="carousel-item {if $smarty.foreach.homeslider.first}active{/if}" role="option" aria-hidden="{if $smarty.foreach.homeslider.first}false{else}true{/if}">
<a href="{$slide.url}">
<figure class="relative h-screen bg-gray-50">
<figure class="relative h-auto lg:h-screen bg-gray-50">
<img class="w-full h-full object-contain md:object-cover" src="{$slide.image_url}" alt="{$slide.legend|escape}">
{if $slide.title || $slide.description}
<figcaption class="caption absolute left-16 md:left-1/2 bottom-0 top-0 right-16 flex flex-col justify-center">
<h2 class="text-xl md:text-2xl lg:text-4xl xl:text-6xl font-bold mb-4">{$slide.title}</h2>
<figcaption class="caption absolute max-md:w-max left-1/2 md:left-1/2 bottom-0 top-0 right-1/5 flex flex-col justify-center">
<h2 class="text-xl max-sm:max-w-[70%] md:text-2xl lg:text-4xl xl:text-6xl font-bold mb-4">{$slide.title}</h2>
<div class="text-sm md:text-base font-medium">{$slide.description nofilter}</div>
</figcaption>
{/if}

6
modules/ps_mainmenu/ps_mainmenu.tpl
View File

@ -1,7 +1,7 @@
{assign var=_counter value=0}
{function name="menu" nodes=[] depth=0 parent=null}
{if $nodes|count}
<ul class="flex flex-1 items-center justify-center top-menu" {if $depth == 0}id="top-menu"{/if} data-depth="{$depth}">
<ul class="flex flex-1 items-center justify-center top-menu max-md:flex-col max-md:items-end" {if $depth == 0}id="top-menu"{/if} data-depth="{$depth}">
{foreach from=$nodes item=node}
<li class="{$node.type}{if $node.current} current {/if} px-2 py-2 font-medium hover:text-gray-950" id="{$node.page_identifier}">
{assign var=_counter value=$_counter+1}
@ -18,7 +18,7 @@
{/if}
{/function}
<button class="absolute right-4 top-1/2 block -translate-y-1/2 p-3 ring-primary focus:ring-2 lg:hidden">
<button class="toggle-main-menu absolute right-4 top-1/2 block -translate-y-1/2 p-3 ring-primary focus:ring-2 lg:hidden">
<svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-menu-2" width="24" height="24" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
<path d="M4 6l16 0"></path>
@ -26,6 +26,6 @@
<path d="M4 18l16 0"></path>
</svg>
</button>
<nav class="absolute right-4 top-full w-full max-w-[250px] justify-center rounded-lg bg-white py-5 px-6 shadow lg:static lg:flex lg:w-full lg:max-w-full lg:bg-transparent lg:py-0 lg:shadow-none hidden" id="_desktop_top_menu">
<nav class="mobile-main-menu absolute z-10 right-4 top-full w-full max-w-[180px] md:max-w-[350px] border border-gray-100 justify-center rounded-lg bg-white py-5 px-6 drop-shadow-lg lg:static lg:border-none lg:flex lg:w-full lg:max-w-full lg:bg-transparent lg:py-0 lg:shadow-none hidden" id="_desktop_top_menu">
{menu nodes=$menu.children}
</nav>

2
templates/_partials/header.tpl
View File

@ -35,7 +35,7 @@
<div class="w-full">
{hook h='displayMainMenu'}
</div>
<div class="relative right-16 hidden items-center justify-end sm:flex lg:right-0">
<div class="relative right-16 items-center justify-end sm:flex lg:right-0">
{hook h='displayTop'}
</div>
</div>

2
templates/customer/_partials/login-form.tpl
View File

@ -48,7 +48,7 @@
<footer class="form-footer w-full mt-8">
<input type="hidden" name="submitLogin" value="1">
{block name='form_buttons'}
<button id="submit-login" class="uppercase font-medium py-2 text-center w-full bg-blue-950 text-gray-50" data-link-action="sign-in" type="submit" >
<button id="submit-login" class="uppercase font-medium py-2 text-center w-full bg-blue-950 hover:bg-blue-900 text-gray-50" data-link-action="sign-in" type="submit" >
{l s='Sign in' d='Shop.Theme.Actions'}
</button>
{/block}

2
templates/customer/authentication.tpl
View File

@ -31,7 +31,7 @@
</span>
{/block}
{block name='login_form_container'}
<section class="login-form w-1/4">
<section class="login-form w-3/4 md:w-1/2 lg:w-1/4">
{render file='customer/_partials/login-form.tpl' ui=$login_form}
</section>
<hr/>