You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
102 lines
1.9 KiB
102 lines
1.9 KiB
/*-------------------
|
|
Globals Used
|
|
--------------------*/
|
|
|
|
// (Color Variables)
|
|
// @transitionDuration
|
|
// @transitionEasing
|
|
// @iconWidth
|
|
// @borderColor
|
|
// @textColor, @invertedTextColor
|
|
|
|
/*-------------------
|
|
Element
|
|
--------------------*/
|
|
|
|
@pageFont: "Helvetica Neue", "Helvetica", Arial;
|
|
|
|
@verticalPadding: 0.65em;
|
|
@horizontalPadding: 1em;
|
|
@inputHeight: (@verticalPadding * 2) + 1.5;
|
|
|
|
@background: #FFFFFF;
|
|
@borderWidth: 1px;
|
|
@border: @borderWidth solid rgba(0, 0, 0, 0.15);
|
|
@boxShadow: none;
|
|
|
|
@borderRadius: 0.3125em;
|
|
@transition:
|
|
background-color 0.3s ease-out,
|
|
box-shadow 0.2s ease,
|
|
border-color 0.2s ease
|
|
;
|
|
|
|
@inputColor: @textColor;
|
|
|
|
/*-------------------
|
|
Types
|
|
--------------------*/
|
|
|
|
/* Icon */
|
|
@iconOpacity: 0.5;
|
|
@iconOffset: 0.82em;
|
|
@iconFocusOpacity: 1;
|
|
@iconMargin: 2.75em;
|
|
@iconTransition: opacity 0.3s ease-out;
|
|
|
|
/* Circular Icon Input */
|
|
@circularIconVerticalOffset: 0.35em;
|
|
@circularIconHorizontalOffset: 0.5em;
|
|
|
|
/* Labeled */
|
|
@labelSize: 0.7em;
|
|
|
|
@labeledMargin: 2.5em;
|
|
@labeledIconInputMargin: 3.25em;
|
|
@labeledIconMargin: 1.25em;
|
|
|
|
/*-------------------
|
|
States
|
|
--------------------*/
|
|
|
|
/* Placeholder */
|
|
@placeholderColor: @unselectedTextColor;
|
|
@placeholderFocusColor: @textColor;
|
|
|
|
@placeholderErrorColor: rgba(255, 80, 80, 0.4);
|
|
@placeholderErrorFocusColor: rgba(255, 80, 80, 0.7);
|
|
|
|
/* Down */
|
|
@downBorderColor: rgba(0, 0, 0, 0.3);
|
|
@downBackground: #FAFAFA;
|
|
@downColor: @textColor;
|
|
@downBoxShadow: none;
|
|
|
|
/* Focus */
|
|
@focusBorderColor: @selectedBorderColor;
|
|
@focusBackground: '';
|
|
@focusColor: @selectedTextColor;
|
|
@focusBoxShadow: none;
|
|
|
|
/* Error */
|
|
@errorBackground: #FFFAFA;
|
|
@errorBorder: #E7BEBE;
|
|
@errorColor: #D95C5C;
|
|
@errorBoxShadow: none;
|
|
|
|
/* Loading */
|
|
@loadingImage: "@{imagePath}/loader-mini.gif";
|
|
|
|
/*-------------------
|
|
Variations
|
|
--------------------*/
|
|
|
|
/* Sizing */
|
|
@mini: 0.8125rem;
|
|
@small: 0.875rem;
|
|
@medium: 1rem;
|
|
@large: 1.125rem;
|
|
@big: 1.25rem;
|
|
@huge: 1.375rem;
|
|
@massive: 1.5rem;
|
|
|