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.

132 lines
3.1 KiB

  1. /*******************************
  2. Form
  3. *******************************/
  4. /*-------------------
  5. Elements
  6. --------------------*/
  7. /* Text */
  8. @paragraphMargin: 1em 0em;
  9. /* Field */
  10. @fieldMargin: 0em 0em 1em;
  11. /* Form Label */
  12. @labelFontSize: 0.875em;
  13. @labelFontWeight: normal;
  14. @labelMargin: 0.3em;
  15. @labelColor: @textColor;
  16. /* Input */
  17. @inputWidth: 100%;
  18. @inputFontSize: 1em;
  19. @inputColor: @textColor;
  20. @inputVerticalPadding: 0.65em;
  21. @inputHorizontalPadding: 1em;
  22. @inputBackground: #FFFFFF;
  23. @inputBorder: 1px solid @borderColor;
  24. @inputBorderRadius: 0.3125em;
  25. @inputColor: @textColor;
  26. @inputTransition:
  27. background-color 0.2s ease,
  28. color 0.2s ease,
  29. box-shadow 0.2s ease,
  30. border-color 0.2s ease
  31. ;
  32. @inputBoxShadow: 0em 0em 0em 0em transparent inset;
  33. @textAreaFontSize: @inputFontSize;
  34. @textAreaHeight: 12em;
  35. @textAreaResize: vertical;
  36. @textAreaLineHeight: 1.33;
  37. @textAreaMinHeight: 8em;
  38. @textAreaMaxHeight: 24em;
  39. /* Checkbox */
  40. @checkboxVerticalAlign: top;
  41. /* Divider */
  42. @dividerMargin: 1em 0em;
  43. /* Validation Prompt */
  44. @validationMargin: 0em 0em 0em 1em;
  45. @validationArrowOffset: -0.3em;
  46. /*-------------------
  47. States
  48. --------------------*/
  49. /* Disabled */
  50. /* Focus */
  51. @inputFocusPointerSize: 0.3em;
  52. /* Input Focus */
  53. @inputFocusBackground: #FFFFFF;
  54. @inputFocusBorderColor: @selectedBorderColor;
  55. @inputFocusColor: rgba(0, 0, 0, 0.85);
  56. @inputFocusBoxShadow: @inputFocusPointerSize 0em 0em 0em @selectedBorderColor inset;
  57. @inputFocusBorderRadius: 0em @inputBorderRadius @inputBorderRadius 0em;
  58. /* Error */
  59. @formErrorColor: @negativeColor;
  60. @formErrorBorder: @negativeBorderColor;
  61. @formErrorBackground: @negativeBackgroundColor;
  62. /* Input Error */
  63. @inputErrorPointerSize: 0.3em;
  64. @inputErrorBorderRadius: 0em @inputBorderRadius @inputBorderRadius 0em;
  65. @inputErrorBoxShadow: @inputErrorPointerSize 0em 0em 0em @formErrorColor inset;
  66. /* Dropdown Error */
  67. @dropdownErrorHoverBackground: #FFF2F2;
  68. @dropdownErrorActiveBackground: #FDCFCF;
  69. /* Focused Error */
  70. @formErrorFocusColor: @negativeColorHover;
  71. @formErrorFocusBorder: @negativeBorderColor;
  72. @formErrorFocusBackground: @negativeBackgroundColor;
  73. /* Input Focused Error */
  74. @inputErrorFocusBoxShadow: @inputFocusPointerSize 0em 0em 0em @negativeColorHover inset;
  75. /* Placeholder */
  76. @inputPlaceholderColor: lighten(@inputColor, 70);
  77. @inputPlaceholderFocusColor: lighten(@inputColor, 55);
  78. @inputErrorPlaceholderColor: lighten(@formErrorColor, 10);
  79. @inputErrorPlaceholderFocusColor: lighten(@formErrorColor, 5);
  80. /* Loading */
  81. @formLoaderDimmerColor: rgba(255, 255, 255, 0.6);
  82. @formLoaderPath: "@{imagePath}/loader-large.gif";
  83. @formLoaderPosition: 50% 50%;
  84. /*-------------------
  85. Types
  86. --------------------*/
  87. /* Required */
  88. @requiredColor: @negativeColor;
  89. @requiredVerticalOffset: -0.2em;
  90. /* Inverted */
  91. @invertedFormColor: @invertedTextColor;
  92. @formInvertedLoaderPath: "@{imagePath}/loader-large-inverted.gif";
  93. @formInvertedLoaderDimmerColor: rgba(0, 0, 0, 0.8);
  94. /*-------------------
  95. Variations
  96. --------------------*/
  97. @small: 0.875em;
  98. @large: 1.125em;
  99. /*-------------------
  100. Groups
  101. --------------------*/
  102. @inlineFieldsMargin: 0em 1em 0em 0em;