forked from brooksbingham/theme-elegance
refactor: add some basic styling for the form fields and errors
parent
8a849a7941
commit
440be0218e
|
@ -23,11 +23,11 @@
|
|||
* International Registered Trademark & Property of PrestaShop SA
|
||||
*}
|
||||
{if $errors|count}
|
||||
<div class="help-block">
|
||||
<div class="help-block mb-4">
|
||||
{block name='form_errors'}
|
||||
<ul>
|
||||
{foreach $errors as $error}
|
||||
<li class="alert alert-danger">{$error|nl2br nofilter}</li>
|
||||
<li class="alert alert-danger px-4 py-2 border border-red-100 bg-red-50 text-red-900">{$error|nl2br nofilter}</li>
|
||||
{/foreach}
|
||||
</ul>
|
||||
{/block}
|
||||
|
|
|
@ -30,8 +30,8 @@
|
|||
|
||||
{else}
|
||||
|
||||
<div class="form-group row {if !empty($field.errors)}has-error{/if}">
|
||||
<label class="col-md-3 form-control-label{if $field.required} required{/if}">
|
||||
<div class="form-group row {if !empty($field.errors)}has-error{/if} flex flex-col">
|
||||
<label class="font-medium form-control-label{if $field.required} required{/if} mb-1">
|
||||
{if $field.type !== 'checkbox'}
|
||||
{$field.label}
|
||||
{/if}
|
||||
|
@ -88,9 +88,8 @@
|
|||
|
||||
{block name='form_field_item_checkbox'}
|
||||
<span class="custom-checkbox">
|
||||
<label>
|
||||
<label class="font-light text-sm">
|
||||
<input name="{$field.name}" type="checkbox" value="1" {if $field.value}checked="checked"{/if} {if $field.required}required{/if}>
|
||||
<span><i class="material-icons rtl-no-flip checkbox-checked"></i></span>
|
||||
{$field.label nofilter}
|
||||
</label>
|
||||
</span>
|
||||
|
@ -132,9 +131,9 @@
|
|||
{elseif $field.type === 'password'}
|
||||
|
||||
{block name='form_field_item_password'}
|
||||
<div class="input-group js-parent-focus">
|
||||
<div class="input-group js-parent-focus relative">
|
||||
<input
|
||||
class="form-control js-child-focus js-visible-password"
|
||||
class="form-control js-child-focus js-visible-password px-2 py-1 border border-gray-300 w-full"
|
||||
name="{$field.name}"
|
||||
title="{l s='At least 5 characters long' d='Shop.Forms.Help'}"
|
||||
type="password"
|
||||
|
@ -142,17 +141,6 @@
|
|||
pattern=".{literal}{{/literal}5,{literal}}{/literal}"
|
||||
{if $field.required}required{/if}
|
||||
>
|
||||
<span class="input-group-btn">
|
||||
<button
|
||||
class="btn"
|
||||
type="button"
|
||||
data-action="show-password"
|
||||
data-text-show="{l s='Show' d='Shop.Theme.Actions'}"
|
||||
data-text-hide="{l s='Hide' d='Shop.Theme.Actions'}"
|
||||
>
|
||||
{l s='Show' d='Shop.Theme.Actions'}
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
{/block}
|
||||
|
||||
|
@ -160,7 +148,7 @@
|
|||
|
||||
{block name='form_field_item_other'}
|
||||
<input
|
||||
class="form-control"
|
||||
class="form-control px-2 py-1 border border-gray-300 w-full"
|
||||
name="{$field.name}"
|
||||
type="{$field.type}"
|
||||
value="{$field.value}"
|
||||
|
|
Loading…
Reference in New Issue