/******************************* Form *******************************/ /*------------------- Elements --------------------*/ /* Text */ @paragraphMargin: 1em 0em; /* Field */ @fieldMargin: 0em 0em 1em; /* Form Label */ @labelFontSize: 0.9em; @labelFontWeight: bold; @labelMargin: 0.3em; @labelColor: @textColor; /* Input */ @inputWidth: 100%; @inputFontSize: 1em; @inputVerticalPadding: 0.8em; @inputHorizontalPadding: 1em; @inputLineHeight: 1.2; @inputPadding: (@inputVerticalPadding + ((1em - @inputLineHeight) / 2)) @inputHorizontalPadding; @inputBackground: #FFFFFF; @inputBorder: 1px solid @borderColor; @inputBorderRadius: 0.3125em; @inputColor: @textColor; @inputTransition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease ; @inputBoxShadow: 0em 0em 0em 0em transparent inset; @textAreaFontSize: @inputFontSize; @textAreaHeight: 12em; @textAreaResize: vertical; @textAreaLineHeight: 1.33; @textAreaMinHeight: 8em; @textAreaMaxHeight: 24em; /* Checkbox */ @checkboxVerticalAlign: top; /* Divider */ @dividerMargin: 1em 0em; /* Validation Prompt */ @validationMargin: 0em 0em 0em 1em; @validationArrowOffset: -0.3em; /*------------------- States --------------------*/ /* Disabled */ /* Focus */ @inputFocusPointerSize: 1px; /* Input Focus */ @inputFocusBackground: #FFFFFF; @inputFocusBorderColor: @selectedBorderColor; @inputFocusColor: rgba(0, 0, 0, 0.85); @inputFocusBoxShadow: @inputFocusPointerSize 0em 0em 0em @selectedBorderColor inset; @inputFocusBorderRadius: 0em @inputBorderRadius @inputBorderRadius 0em; /* Error */ @formErrorColor: @negativeColor; @formErrorBorder: @negativeBorderColor; @formErrorBackground: @negativeBackgroundColor; /* Input Error */ @inputErrorPointerSize: 3px; @inputErrorBorderRadius: 0em @inputBorderRadius @inputBorderRadius 0em; @inputErrorBoxShadow: @inputErrorPointerSize 0em 0em 0em @formErrorColor inset; /* Dropdown Error */ @dropdownErrorHoverBackground: #FFF2F2; @dropdownErrorActiveBackground: #FDCFCF; /* Focused Error */ @inputErrorFocusBackground: @negativeBackgroundColor; @inputErrorFocusColor: @negativeColorHover; @inputErrorFocusBorder: @negativeBorderColor; @inputErrorFocusBoxShadow: @inputErrorPointerSize 0em 0em 0em @negativeColorHover inset; /* Placeholder */ @inputPlaceholderColor: lighten(@inputColor, 55); @inputPlaceholderFocusColor: lighten(@inputColor, 35); @inputErrorPlaceholderColor: lighten(@formErrorColor, 10); @inputErrorPlaceholderFocusColor: lighten(@formErrorColor, 5); /* Loading */ @formLoaderDimmerColor: rgba(255, 255, 255, 0.6); @formLoaderPath: "@{imagePath}/loader-large.gif"; @formLoaderPosition: 50% 50%; /*------------------- Types --------------------*/ /* Required */ @requiredColor: @negativeColor; @requiredVerticalOffset: -0.2em; /* Inverted */ @invertedLabelColor: @invertedTextColor; @formInvertedLoaderPath: "@{imagePath}/loader-large-inverted.gif"; @formInvertedLoaderDimmerColor: rgba(0, 0, 0, 0.8); /*------------------- Variations --------------------*/ /* Grouped Fields */ @groupedMargin: @fieldMargin; @groupedFieldMargin: 0.5em 0em; /* Inline */ @inlineLabelFontSize: 1em; @inlineLabelVerticalAlign: middle; /* (x) Wide Field */ @gutterWidth: 1%; /* Sizes */ @small: 0.875em; @medium: auto; @large: 1.125em; @huge: 1.2em; /*------------------- Groups --------------------*/ @inlineFieldsMargin: 0em 1em 0em 0em;