Input fields can now use icons, added icons to datepicker inputs
This commit is contained in:
parent
c678c965ea
commit
fe611b8834
File diff suppressed because one or more lines are too long
Binary file not shown.
|
Before Width: | Height: | Size: 584 B After Width: | Height: | Size: 3.5 KiB |
|
|
@ -157,6 +157,10 @@ label {
|
|||
}
|
||||
}
|
||||
|
||||
&.field-indent {
|
||||
padding-left: 23px;
|
||||
}
|
||||
|
||||
&.input-sidebar-control {
|
||||
padding-right: 35px;
|
||||
|
||||
|
|
@ -198,6 +202,29 @@ label {
|
|||
}
|
||||
}
|
||||
|
||||
.input-with-icon {
|
||||
position: relative;
|
||||
|
||||
> .icon {
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
padding: 13px;
|
||||
pointer-events: none;
|
||||
color: @color-form-field-icon;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
&.right-align {
|
||||
> .icon { right: 0; }
|
||||
input { padding-right: 32px !important; }
|
||||
}
|
||||
|
||||
&.left-align {
|
||||
> .icon { left: 0; }
|
||||
input { padding-left: 32px !important; }
|
||||
}
|
||||
}
|
||||
|
||||
.field-textarea {
|
||||
resize: vertical;
|
||||
&.size-tiny { min-height: @size-tiny; }
|
||||
|
|
|
|||
|
|
@ -132,6 +132,7 @@
|
|||
@color-form-sidebar: #ecf0f1;
|
||||
@color-form-field-preview: #f6f6f6;
|
||||
@color-form-field-bg: #ffffff;
|
||||
@color-form-field-icon: #bdbdbd;
|
||||
|
||||
@color-panel-light: #ECF0F1;
|
||||
|
||||
|
|
|
|||
|
|
@ -10,13 +10,16 @@
|
|||
data-control="datepicker"
|
||||
data-min-date="<?= $minDate ?>"
|
||||
data-max-date="<?= $maxDate ?>">
|
||||
<input
|
||||
type="text"
|
||||
id="<?= $this->getId('input') ?>"
|
||||
name="<?= $name ?>"
|
||||
value="<?= $value ?>"
|
||||
class="form-control align-right"
|
||||
autocomplete="off" />
|
||||
<div class="input-with-icon right-align">
|
||||
<i class="icon icon-calendar-o"></i>
|
||||
<input
|
||||
type="text"
|
||||
id="<?= $this->getId('input') ?>"
|
||||
name="<?= $name ?>"
|
||||
value="<?= $value ?>"
|
||||
class="form-control align-right"
|
||||
autocomplete="off" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php elseif ($mode == 'datetime'): ?>
|
||||
|
|
@ -30,13 +33,16 @@
|
|||
data-control="datepicker"
|
||||
data-min-date="<?= $minDate ?>"
|
||||
data-max-date="<?= $maxDate ?>">
|
||||
<input
|
||||
type="text"
|
||||
id="<?= $this->getId('input') ?>"
|
||||
name="<?= $name ?>"
|
||||
value="<?= $value ?>"
|
||||
class="form-control align-right"
|
||||
autocomplete="off" />
|
||||
<div class="input-with-icon right-align">
|
||||
<i class="icon icon-calendar-o"></i>
|
||||
<input
|
||||
type="text"
|
||||
id="<?= $this->getId('input') ?>"
|
||||
name="<?= $name ?>"
|
||||
value="<?= $value ?>"
|
||||
class="form-control align-right"
|
||||
autocomplete="off" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
|
|
@ -45,16 +51,19 @@
|
|||
id="<?= $this->getId() ?>-time"
|
||||
data-control="timepicker"
|
||||
class="field-timepicker clockpicker">
|
||||
<input
|
||||
type="text"
|
||||
id="<?= $this->getId('input') ?>-time"
|
||||
name="<?= $timeName ?>"
|
||||
value="<?= $timeValue ?>"
|
||||
class="form-control align-right"
|
||||
autocomplete="off"
|
||||
data-autoclose="true"
|
||||
data-placement="bottom"
|
||||
data-align="right" />
|
||||
<div class="input-with-icon right-align">
|
||||
<i class="icon icon-clock-o"></i>
|
||||
<input
|
||||
type="text"
|
||||
id="<?= $this->getId('input') ?>-time"
|
||||
name="<?= $timeName ?>"
|
||||
value="<?= $timeValue ?>"
|
||||
class="form-control align-right"
|
||||
autocomplete="off"
|
||||
data-autoclose="true"
|
||||
data-placement="bottom"
|
||||
data-align="right" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -65,16 +74,19 @@
|
|||
id="<?= $this->getId() ?>"
|
||||
data-control="timepicker"
|
||||
class="field-timepicker clockpicker">
|
||||
<input
|
||||
type="text"
|
||||
id="<?= $this->getId('input') ?>"
|
||||
name="<?= $name ?>"
|
||||
value="<?= $value ?>"
|
||||
class="form-control align-right"
|
||||
autocomplete="off"
|
||||
data-autoclose="true"
|
||||
data-placement="bottom"
|
||||
data-align="right" />
|
||||
<div class="input-with-icon right-align">
|
||||
<i class="icon icon-clock-o"></i>
|
||||
<input
|
||||
type="text"
|
||||
id="<?= $this->getId('input') ?>"
|
||||
name="<?= $name ?>"
|
||||
value="<?= $value ?>"
|
||||
class="form-control align-right"
|
||||
autocomplete="off"
|
||||
data-autoclose="true"
|
||||
data-placement="bottom"
|
||||
data-align="right" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php endif ?>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
<?php namespace System\Traits;
|
||||
|
||||
use Yaml;
|
||||
use File;
|
||||
use Lang;
|
||||
use Event;
|
||||
use Yaml;
|
||||
use SystemException;
|
||||
use Backend\Classes\Controller;
|
||||
use stdClass;
|
||||
|
|
|
|||
Loading…
Reference in New Issue