first commit
This commit is contained in:
@@ -0,0 +1,393 @@
|
||||
/* ------------------------------------------------------------------------------
|
||||
*
|
||||
* # Alpaca forms
|
||||
*
|
||||
* Alpaca provides the easiest way to generate interactive HTML5 forms for web applications
|
||||
*
|
||||
* Version: 1.1
|
||||
* Latest update: Jul 4, 2016
|
||||
*
|
||||
* ---------------------------------------------------------------------------- */
|
||||
|
||||
|
||||
// Core
|
||||
// ------------------------------
|
||||
|
||||
// Added to outer field elements to hide them
|
||||
.alpaca-hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// Make multiselect full width
|
||||
.alpaca-field-select .multiselect-container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// If input has error
|
||||
.has-error {
|
||||
|
||||
// Override text color if menu has error
|
||||
.multiselect-container > .active .checkbox {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
// Change background color in active items
|
||||
.btn-group.open .multiselect.btn,
|
||||
.multiselect.btn-default:active {
|
||||
color: @color-warning-800;
|
||||
border-color: @color-warning-800;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Disabled fields
|
||||
.alpaca-disabled {
|
||||
.checkbox label,
|
||||
.checkbox .switchery,
|
||||
.radio label,
|
||||
.radio .switchery {
|
||||
cursor: @cursor-disabled;
|
||||
color: @text-muted;
|
||||
}
|
||||
}
|
||||
|
||||
// Added to fields that have run through validation and are invalid
|
||||
.alpaca-invalid {
|
||||
.form-control {
|
||||
color: @color-warning-800;
|
||||
}
|
||||
}
|
||||
|
||||
// General purpose HTML clear
|
||||
.alpaca-clear {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
// Right alignment
|
||||
.alpaca-float-right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
|
||||
// Icons
|
||||
// ------------------------------
|
||||
|
||||
// Override glyphicon icons
|
||||
.alpaca-field {
|
||||
.glyphicon {
|
||||
font-family: 'icomoon';
|
||||
font-size: @icon-font-size;
|
||||
vertical-align: middle;
|
||||
top: -1px;
|
||||
display: inline-block;
|
||||
margin-right: @element-horizontal-spacing
|
||||
}
|
||||
|
||||
// Info icon
|
||||
.glyphicon-info-sign:before {
|
||||
content: '\e9ba';
|
||||
}
|
||||
|
||||
// Error icon
|
||||
&.has-error .glyphicon-info-sign:before,
|
||||
.glyphicon-exclamation-sign:before {
|
||||
content: '\ed63';
|
||||
}
|
||||
}
|
||||
|
||||
// Required asterisk
|
||||
.alpaca-icon-required {
|
||||
font-family: @font-family-base;
|
||||
float: right;
|
||||
margin-right: 0;
|
||||
margin-left: 5px;
|
||||
|
||||
&:before {
|
||||
content: '*';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Editor fields
|
||||
// ------------------------------
|
||||
|
||||
// Base
|
||||
.alpaca-controlfield-editor {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
border: 1px #ccc solid;
|
||||
|
||||
// Element
|
||||
.control-field-editor-el {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Ace editor
|
||||
// ------------------------------
|
||||
|
||||
.ace_editor {
|
||||
border: 1px solid rgb(204, 204, 204);
|
||||
}
|
||||
|
||||
|
||||
// CKEditor
|
||||
// ------------------------------
|
||||
|
||||
.alpaca-field-ckeditor.alpaca-invalid > .cke {
|
||||
border-color: @color-warning-800;
|
||||
}
|
||||
|
||||
|
||||
// Option tree
|
||||
// ------------------------------
|
||||
|
||||
.alpaca-field-optiontree {
|
||||
|
||||
// Add left spacing to input field
|
||||
.optiontree + .form-control {
|
||||
margin-left: @content-padding-small;
|
||||
}
|
||||
|
||||
// Horizontal layout
|
||||
&.optiontree-horizontal {
|
||||
|
||||
// Tree
|
||||
.optiontree {
|
||||
display: inline-block;
|
||||
|
||||
// Selector
|
||||
.optiontree-selector {
|
||||
display: inline-block;
|
||||
margin-top: 2px;
|
||||
margin-bottom: 2px;
|
||||
|
||||
// Hide empty container
|
||||
&:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// Extra horizontal spacing
|
||||
+ .optiontree-selector {
|
||||
margin-left: @content-padding-small;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Input
|
||||
input {
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
// Label
|
||||
label {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Controls
|
||||
// ------------------------------
|
||||
|
||||
// Disabled mode
|
||||
.alpaca-field-radio {
|
||||
&.disabled {
|
||||
.alpaca-control.radio {
|
||||
color: grey;
|
||||
|
||||
label {
|
||||
cursor: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Controls
|
||||
.alpaca-control {
|
||||
&.radio {
|
||||
min-height: inherit;
|
||||
height: inherit;
|
||||
padding-top: 0px;
|
||||
padding-bottom: 0px;
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Multiselect
|
||||
//
|
||||
|
||||
// If error
|
||||
.has-error .multiselect {
|
||||
border-color: @color-warning-800;
|
||||
color: @color-warning-800;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Labels
|
||||
//
|
||||
.alpaca-container-label {
|
||||
margin-top: @line-height-computed;
|
||||
|
||||
legend& {
|
||||
margin-top: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Toolbar
|
||||
//
|
||||
|
||||
// Base
|
||||
.alpaca-array-toolbar {
|
||||
margin-bottom: (@line-height-computed / 2);
|
||||
}
|
||||
|
||||
// Action bar
|
||||
.alpaca-array-actionbar {
|
||||
overflow: hidden;
|
||||
|
||||
// Top
|
||||
&.alpaca-array-actionbar-top {
|
||||
padding-bottom: (@line-height-computed / 2);
|
||||
}
|
||||
|
||||
// Bottom
|
||||
&.alpaca-array-actionbar-bottom {
|
||||
padding-top: (@line-height-computed / 2);
|
||||
}
|
||||
|
||||
// Stretch
|
||||
&,
|
||||
&.btn-group {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
// Field objects
|
||||
.alpaca-field-object,
|
||||
.alpaca-field-array {
|
||||
border: 1px #eee solid;
|
||||
border-radius: @border-radius-base;
|
||||
padding: @content-padding-small;
|
||||
|
||||
// Remove border
|
||||
.alpaca-top,
|
||||
.alpaca-top .alpaca-container {
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
.alpaca-container {
|
||||
border: 0px;
|
||||
}
|
||||
|
||||
// Heading
|
||||
.alpaca-display h3 {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Containers
|
||||
//
|
||||
|
||||
// Add top spacing
|
||||
.alpaca-control-buttons-container {
|
||||
margin-top: (@line-height-computed / 2);
|
||||
}
|
||||
|
||||
// Remove border from field object
|
||||
.alpaca-container-item > .alpaca-container > .alpaca-field-object {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
// Buttons container in form
|
||||
.alpaca-form-buttons-container {
|
||||
margin-top: @line-height-computed;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
// Remove horizontal spacing from form group
|
||||
.alpaca-container > .form-group {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
// Hidden field
|
||||
.alpaca-field-hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// First item
|
||||
.alpaca-container-item:not(:first-child) {
|
||||
margin-top: (@line-height-computed / 2);
|
||||
}
|
||||
|
||||
// Last item
|
||||
.alpaca-container .alpaca-container-item:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
// Select
|
||||
.alpaca-field-select .btn-group {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Fields
|
||||
//
|
||||
|
||||
.alpaca-field {
|
||||
|
||||
// Upload field
|
||||
&.alpaca-field-upload {
|
||||
|
||||
// Active zone
|
||||
.fileupload-active-zone {
|
||||
margin-top: 50px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
// Download
|
||||
.template-download TD.error,
|
||||
.template-upload TD.error {
|
||||
color: @color-warning-800;
|
||||
word-break: break-all;
|
||||
}
|
||||
}
|
||||
|
||||
// Address
|
||||
&.alpaca-field-address .alpaca-field-address-mapcanvas {
|
||||
height: 250px;
|
||||
}
|
||||
|
||||
// Image
|
||||
&.alpaca-field-image .alpaca-image-display {
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Max length
|
||||
//
|
||||
|
||||
.alpaca-field-text-max-length-indicator {
|
||||
font-size: @font-size-small;
|
||||
margin-top: @padding-base-vertical;
|
||||
margin-bottom: @padding-base-vertical;
|
||||
}
|
||||
@@ -0,0 +1,328 @@
|
||||
/* ------------------------------------------------------------------------------
|
||||
*
|
||||
* # X-editable
|
||||
*
|
||||
* In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
|
||||
*
|
||||
* Version: 1.1
|
||||
* Latest update: Mar 10, 2016
|
||||
*
|
||||
* ---------------------------------------------------------------------------- */
|
||||
|
||||
|
||||
// Core
|
||||
// ------------------------------
|
||||
|
||||
// Base
|
||||
.editable {
|
||||
background-color: transparent;
|
||||
|
||||
.form-horizontal & {
|
||||
padding-top: (@padding-base-vertical + 1);
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
// Pre wrapped content
|
||||
.editable-pre-wrapped {
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
|
||||
// Layout
|
||||
// ------------------------------
|
||||
|
||||
// Form
|
||||
.editableform {
|
||||
|
||||
// Remove bottom spacing
|
||||
.form-group:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
// Set min width to the input field
|
||||
.form-control {
|
||||
min-width: 200px;
|
||||
}
|
||||
|
||||
// Checkbox, radio
|
||||
.checkbox,
|
||||
.radio {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
|
||||
> div {
|
||||
margin-top: (@padding-base-vertical + 1);
|
||||
margin-bottom: (@padding-base-vertical + 1);
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Buttons
|
||||
.editable-buttons {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
margin-left: @element-horizontal-spacing;
|
||||
|
||||
&.editable-buttons-bottom {
|
||||
display: block;
|
||||
margin-top: @line-height-computed;
|
||||
margin-left: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.editable-cancel {
|
||||
margin-left: @element-horizontal-spacing;
|
||||
}
|
||||
}
|
||||
|
||||
// Editable inputs
|
||||
.editable-input {
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
white-space: normal;
|
||||
|
||||
// Remove bottom margin from help block
|
||||
.help-block {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
// Set fixed width to input group
|
||||
.input-group {
|
||||
width: 250px;
|
||||
}
|
||||
|
||||
// Elastic textarea
|
||||
.elastic {
|
||||
height: 100px;
|
||||
}
|
||||
}
|
||||
|
||||
// Loading icon
|
||||
.editableform-loading {
|
||||
width: @icon-font-size;
|
||||
height: @icon-font-size;
|
||||
margin: auto;
|
||||
|
||||
// Icon
|
||||
&:after {
|
||||
content: '\eb55';
|
||||
font-family: 'icomoon';
|
||||
font-size: @icon-font-size;
|
||||
display: block;
|
||||
line-height: 1;
|
||||
margin: auto;
|
||||
width: @icon-font-size;
|
||||
height: @icon-font-size;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
.animation(rotation 1s ease infinite);
|
||||
}
|
||||
}
|
||||
|
||||
// Errors
|
||||
.editable-error {
|
||||
color: @brand-danger;
|
||||
}
|
||||
.editable-error-block {
|
||||
max-width: 300px;
|
||||
margin: @padding-base-vertical 0 0 0;
|
||||
width: auto;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
// Transition
|
||||
.editable-bg-transition {
|
||||
color: inherit;
|
||||
background-color: transparent;
|
||||
.transition(background-color 0.2s ease-out);
|
||||
}
|
||||
|
||||
|
||||
// Clear buttons
|
||||
// ------------------------------
|
||||
|
||||
// Date inputs clear button
|
||||
.editable-clear {
|
||||
clear: both;
|
||||
text-decoration: none;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
// Clear input button
|
||||
.editable-clear-x {
|
||||
position: absolute;
|
||||
right: @padding-base-horizontal - 3;
|
||||
top: ((@input-height-base - @icon-font-size) / 2);
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
z-index: 100;
|
||||
.opacity(0.6);
|
||||
|
||||
&:hover {
|
||||
.opacity(1);
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: '\ed6b';
|
||||
font-family: 'icomoon';
|
||||
display: block;
|
||||
font-size: @icon-font-size;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Links
|
||||
// ------------------------------
|
||||
|
||||
// Link
|
||||
.editable-click {
|
||||
&,
|
||||
a& {
|
||||
&,
|
||||
&:hover {
|
||||
border-bottom: 1px dashed @link-color;
|
||||
}
|
||||
}
|
||||
|
||||
&.editable-disabled {
|
||||
&,
|
||||
a& {
|
||||
&,
|
||||
&:hover {
|
||||
color: @text-muted;
|
||||
cursor: default;
|
||||
border-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.label {
|
||||
margin-top: 1px;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
// Empty link
|
||||
.editable-empty {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
font-style: italic;
|
||||
color: @brand-danger;
|
||||
}
|
||||
|
||||
a& {
|
||||
&,
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-bottom-color: @brand-danger;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Input types
|
||||
// ------------------------------
|
||||
|
||||
// Combodate
|
||||
.combodate {
|
||||
white-space: nowrap;
|
||||
|
||||
.day,
|
||||
.year,
|
||||
.hour,
|
||||
.minute {
|
||||
min-width: 80px;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
||||
// Daterange
|
||||
.input-daterange {
|
||||
input {
|
||||
text-align: center;
|
||||
|
||||
&:first-child {
|
||||
.border-left-radius(@border-radius-base);
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
.border-right-radius(@border-radius-base);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Address
|
||||
.editable-address {
|
||||
display: block;
|
||||
|
||||
> label > span {
|
||||
width: 70px;
|
||||
display: inline-block;
|
||||
margin-bottom: @padding-base-vertical;
|
||||
}
|
||||
}
|
||||
|
||||
// Date
|
||||
.editable-date {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
float: left;
|
||||
}
|
||||
|
||||
// Checklist
|
||||
.editable-checklist label {
|
||||
white-space: nowrap;
|
||||
|
||||
> input[type="checkbox"] {
|
||||
vertical-align: middle;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// WYSIHTML5 editor
|
||||
.editable-wysihtml5 {
|
||||
width: 566px;
|
||||
height: 250px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// Editable modes
|
||||
// ------------------------------
|
||||
|
||||
// Editable modes
|
||||
.editable-container {
|
||||
&.editable-popup {
|
||||
max-width: none !important;
|
||||
}
|
||||
|
||||
&.editable-inline {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
width: auto;
|
||||
|
||||
.editableform-loading {
|
||||
background-position: left 5px;
|
||||
}
|
||||
|
||||
.add-on .icon-th {
|
||||
margin-top: 3px;
|
||||
margin-left: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
&.popover {
|
||||
width: auto;
|
||||
min-width: 200px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,44 @@
|
||||
/* ------------------------------------------------------------------------------
|
||||
*
|
||||
* # Passy
|
||||
*
|
||||
* Styles for passy.min.js - password length checker and password generator
|
||||
*
|
||||
* Version: 1.1
|
||||
* Latest update: Mar 10, 2016
|
||||
*
|
||||
* ---------------------------------------------------------------------------- */
|
||||
|
||||
|
||||
// Base
|
||||
.visual-password-indicator {
|
||||
display: inline-block;
|
||||
background-color: @gray-light;
|
||||
width: 40px;
|
||||
height: 4px;
|
||||
}
|
||||
|
||||
// Inside input group addon
|
||||
.password-indicator-group {
|
||||
min-width: 80px;
|
||||
.transition(all 0.2s ease-in-out);
|
||||
}
|
||||
|
||||
// Absolute positioned label
|
||||
.label-indicator-absolute {
|
||||
position: relative;
|
||||
|
||||
.password-indicator-label-absolute {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -(@line-height-computed / 2);
|
||||
right: @padding-base-vertical;
|
||||
.transition(all 0.2s ease-in-out);
|
||||
}
|
||||
|
||||
.form-horizontal & {
|
||||
.label {
|
||||
right: (@grid-gutter-width + @padding-base-vertical);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,93 @@
|
||||
/* ------------------------------------------------------------------------------
|
||||
*
|
||||
* # Twiter Typeahead
|
||||
*
|
||||
* Styles for typeahead.bundle.min.js - input suggestion engine
|
||||
*
|
||||
* Version: 1.3
|
||||
* Latest update: Jul 4, 2016
|
||||
*
|
||||
* ---------------------------------------------------------------------------- */
|
||||
|
||||
|
||||
// Core
|
||||
// ------------------------------
|
||||
|
||||
.twitter-typeahead {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.typeahead,
|
||||
.tt-query,
|
||||
.tt-hint {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
// Input field hint
|
||||
.tt-hint {
|
||||
color: @input-color-placeholder;
|
||||
}
|
||||
|
||||
|
||||
// Menu
|
||||
// ------------------------------
|
||||
|
||||
// Dropdown menu
|
||||
.tt-menu {
|
||||
width: 100%;
|
||||
margin-top: 1px;
|
||||
min-width: 180px;
|
||||
padding: @list-spacing 0;
|
||||
background-color: @dropdown-bg;
|
||||
border: 1px solid @dropdown-border;
|
||||
border-radius: @border-radius-base;
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
.box-shadow(0 1px 3px fade(#000, 10%));
|
||||
|
||||
.typeahead-scrollable & {
|
||||
max-height: 250px;
|
||||
}
|
||||
|
||||
// RTL
|
||||
.typeahead-rtl & {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
// Menu item
|
||||
.tt-suggestion {
|
||||
padding: (@padding-base-vertical + 1) @content-padding-base;
|
||||
cursor: pointer;
|
||||
|
||||
// Hover state bg color
|
||||
&:hover,
|
||||
&:focus,
|
||||
&.tt-cursor {
|
||||
background-color: @dropdown-link-hover-bg;
|
||||
}
|
||||
|
||||
// Double side padding in groups
|
||||
.tt-dataset-group & {
|
||||
padding-left: (@padding-base-horizontal * 2);
|
||||
padding-right: (@padding-base-horizontal * 2);
|
||||
}
|
||||
}
|
||||
|
||||
// Heading
|
||||
.tt-heading {
|
||||
font-size: @font-size-mini;
|
||||
line-height: @line-height-mini;
|
||||
padding: (@padding-base-vertical + 1) @content-padding-base;
|
||||
text-transform: uppercase;
|
||||
display: block;
|
||||
font-weight: 700;
|
||||
margin-top: 2px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
// Add padding for empty message
|
||||
.typeahead-template .empty-message {
|
||||
padding: (@padding-base-vertical + 1) @content-padding-base;
|
||||
text-align: center;
|
||||
}
|
||||
@@ -0,0 +1,65 @@
|
||||
/* ------------------------------------------------------------------------------
|
||||
*
|
||||
* # Form Validation
|
||||
*
|
||||
* jQuery plugin for simple clientside form validation
|
||||
*
|
||||
* Version: 1.0
|
||||
* Latest update: May 25, 2015
|
||||
*
|
||||
* ---------------------------------------------------------------------------- */
|
||||
|
||||
|
||||
// Core
|
||||
// ------------------------------
|
||||
|
||||
// Error
|
||||
.validation-error-label,
|
||||
.validation-valid-label {
|
||||
margin-top: @padding-base-vertical;
|
||||
margin-bottom: @padding-base-vertical;
|
||||
display: block;
|
||||
color: @brand-danger;
|
||||
position: relative;
|
||||
padding-left: (@icon-font-size + 10);
|
||||
}
|
||||
|
||||
// Success
|
||||
.validation-valid-label {
|
||||
color: @brand-success;
|
||||
}
|
||||
|
||||
|
||||
// Labels
|
||||
// ------------------------------
|
||||
|
||||
// Icon container
|
||||
.validation-error-label,
|
||||
.validation-valid-label {
|
||||
&:before {
|
||||
font-family: 'icomoon';
|
||||
position: absolute;
|
||||
top: ((@line-height-computed - @icon-font-size) / 2);
|
||||
left: 0;
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
font-size: @icon-font-size;
|
||||
}
|
||||
|
||||
// Hide if empty
|
||||
&:empty {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Error icon
|
||||
.validation-error-label:before {
|
||||
content: '\ed63';
|
||||
}
|
||||
|
||||
// Valid icon
|
||||
.validation-valid-label:before {
|
||||
content: '\ee73';
|
||||
}
|
||||
Reference in New Issue
Block a user