From 448196b73ff12f506a0a756e52bfa5ee728e3f72 Mon Sep 17 00:00:00 2001 From: abhisheks Date: Fri, 15 Dec 2023 20:44:34 +0530 Subject: [PATCH] refactor: style contact us page --- assets/css/theme.css | 116 ++++++++++++++++++ .../views/templates/widget/contactform.tpl | 104 ++++++++-------- .../ps_contactinfo/ps_contactinfo-rich.tpl | 57 ++++----- templates/contact.tpl | 2 +- 4 files changed, 189 insertions(+), 90 deletions(-) diff --git a/assets/css/theme.css b/assets/css/theme.css index d705163..5f89f1d 100644 --- a/assets/css/theme.css +++ b/assets/css/theme.css @@ -953,6 +953,10 @@ select { margin-top: 2rem; } +.mt-6 { + margin-top: 1.5rem; +} + .block { display: block; } @@ -1090,6 +1094,10 @@ select { width: max-content; } +.w-1\/5 { + width: 20%; +} + .max-w-\[100px\] { max-width: 100px; } @@ -1114,6 +1122,18 @@ select { max-width: 100%; } +.max-w-6xl { + max-width: 72rem; +} + +.max-w-2xl { + max-width: 42rem; +} + +.max-w-3xl { + max-width: 48rem; +} + .flex-1 { flex: 1 1 0%; } @@ -1624,6 +1644,15 @@ select { color: rgb(255 255 255 / var(--tw-text-opacity)); } +.text-slate-500 { + --tw-text-opacity: 1; + color: rgb(100 116 139 / var(--tw-text-opacity)); +} + +.underline { + text-decoration-line: underline; +} + .line-through { text-decoration-line: line-through; } @@ -1636,6 +1665,14 @@ select { text-underline-offset: 2px; } +.underline-offset-auto { + text-underline-offset: auto; +} + +.underline-offset-1 { + text-underline-offset: 1px; +} + .shadow-lg { --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); @@ -1697,6 +1734,70 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { --tw-ring-color: transparent; } +.file\:mr-4::file-selector-button { + margin-right: 1rem; +} + +.file\:w-full::file-selector-button { + width: 100%; +} + +.file\:rounded-full::file-selector-button { + border-radius: 9999px; +} + +.file\:border-0::file-selector-button { + border-width: 0px; +} + +.file\:bg-violet-50::file-selector-button { + --tw-bg-opacity: 1; + background-color: rgb(245 243 255 / var(--tw-bg-opacity)); +} + +.file\:bg-transparent::file-selector-button { + background-color: transparent; +} + +.file\:px-4::file-selector-button { + padding-left: 1rem; + padding-right: 1rem; +} + +.file\:py-2::file-selector-button { + padding-top: 0.5rem; + padding-bottom: 0.5rem; +} + +.file\:text-sm::file-selector-button { + font-size: 0.875rem; + line-height: 1.25rem; +} + +.file\:font-semibold::file-selector-button { + font-weight: 600; +} + +.file\:text-violet-700::file-selector-button { + --tw-text-opacity: 1; + color: rgb(109 40 217 / var(--tw-text-opacity)); +} + +.file\:text-blue-950::file-selector-button { + --tw-text-opacity: 1; + color: rgb(23 37 84 / var(--tw-text-opacity)); +} + +.placeholder\:text-gray-500::-moz-placeholder { + --tw-text-opacity: 1; + color: rgb(107 114 128 / var(--tw-text-opacity)); +} + +.placeholder\:text-gray-500::placeholder { + --tw-text-opacity: 1; + color: rgb(107 114 128 / var(--tw-text-opacity)); +} + .last\:hidden:last-child { display: none; } @@ -1762,6 +1863,21 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { text-decoration-line: none; } +.hover\:file\:bg-violet-100::file-selector-button:hover { + --tw-bg-opacity: 1; + background-color: rgb(237 233 254 / var(--tw-bg-opacity)); +} + +.hover\:file\:bg-blue-900::file-selector-button:hover { + --tw-bg-opacity: 1; + background-color: rgb(30 58 138 / var(--tw-bg-opacity)); +} + +.hover\:file\:text-blue-900::file-selector-button:hover { + --tw-text-opacity: 1; + color: rgb(30 58 138 / var(--tw-text-opacity)); +} + .focus\:border-0:focus { border-width: 0px; } diff --git a/modules/contactform/views/templates/widget/contactform.tpl b/modules/contactform/views/templates/widget/contactform.tpl index 18849f0..42f286e 100644 --- a/modules/contactform/views/templates/widget/contactform.tpl +++ b/modules/contactform/views/templates/widget/contactform.tpl @@ -22,93 +22,89 @@ * @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0) * International Registered Trademark & Property of PrestaShop SA *} -
-
- - {if $notifications} -
-
    - {foreach $notifications.messages as $notif} -
  • {$notif}
    • - {/foreach} -
-
- {/if} - +
+ {if !$notifications || $notifications.nw_error} -
- -
-
-

{l s='Contact us' d='Shop.Theme.Global'}

-
+
+
+

{l s='Contact us' d='Shop.Theme.Global'}

- -
- -
- {foreach from=$contact.contacts item=contact_elt} {/foreach} -
-
- -
+
+ -
{if $contact.orders} -
- -
- {foreach from=$contact.orders item=order} {/foreach}
- - {l s='optional' d='Shop.Forms.Help'} -
{/if} - {if $contact.allow_file_upload} -
- -
- -
- - {l s='optional' d='Shop.Forms.Help'} - -
- {/if} - -
- +
+
+ + {if $contact.allow_file_upload} +
+ +
+ +
+
+ {/if} + {if isset($id_module)}
@@ -127,7 +123,7 @@ - + {/if} diff --git a/modules/ps_contactinfo/ps_contactinfo-rich.tpl b/modules/ps_contactinfo/ps_contactinfo-rich.tpl index ae79bc0..58fe80f 100644 --- a/modules/ps_contactinfo/ps_contactinfo-rich.tpl +++ b/modules/ps_contactinfo/ps_contactinfo-rich.tpl @@ -24,39 +24,26 @@ *}
-

{l s='Store information' d='Shop.Theme.Global'}

-
-
-
{$contact_infos.address.formatted nofilter}
-
- {if $contact_infos.phone} -
-
-
-
- {l s='Call us:' d='Shop.Theme.Global'}
- {$contact_infos.phone} -
-
- {/if} - {if $contact_infos.fax} -
-
-
-
- {l s='Fax:' d='Shop.Theme.Global'}
- {$contact_infos.fax} -
-
- {/if} - {if $contact_infos.email} -
-
-
- - {$contact_infos.email} -
- {/if} +

{l s='Store information' d='Shop.Theme.Global'}

+
+

+ Our Stylists +

+

+ Our Stylists are here for you. We have helped dress some of the biggest names in Hollywood and Professional + sports. Our staff of highly experienced tailors and stylists understand the demands placed on you to always look + your very best. +

+

+ Your personal stylist is ready to assist you in all your clothing needs. +

+

Customer Service

+

Let us show you how custom works. + We will walk you through your first order. + Just drop us a line at + customerservice@brooksbingham.com + , and we will get in touch with you. +

+
+
diff --git a/templates/contact.tpl b/templates/contact.tpl index fc228c0..2c57899 100644 --- a/templates/contact.tpl +++ b/templates/contact.tpl @@ -27,7 +27,7 @@ {block name='page_header_container'}{/block} {block name='left_column'} -
+
{widget name="ps_contactinfo" hook='displayLeftColumn'}
{/block}