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.

104 lines
2.1 KiB

10 years ago
10 years ago
10 years ago
10 years ago
  1. /*******************************
  2. Input
  3. *******************************/
  4. /*-------------------
  5. Element
  6. --------------------*/
  7. @pageFont: "Helvetica Neue", "Helvetica", Arial;
  8. @verticalPadding: 0.8em;
  9. @horizontalPadding: 1em;
  10. @lineHeight: 1.2em;
  11. @padding: (@verticalPadding - @lineHeightOffset) @horizontalPadding;
  12. @textAlign: left;
  13. @background: #FFFFFF;
  14. @borderWidth: 1px;
  15. @border: @borderWidth solid rgba(0, 0, 0, 0.15);
  16. @boxShadow: none;
  17. @borderRadius: 0.325em;
  18. @transition:
  19. background-color 0.3s ease-out,
  20. box-shadow 0.2s ease,
  21. border-color 0.2s ease
  22. ;
  23. @inputColor: @textColor;
  24. /*-------------------
  25. Types
  26. --------------------*/
  27. /* Icon Input */
  28. @glyphWidth: 1.25em;
  29. @iconWidth: (@verticalPadding * 2) + @glyphWidth;
  30. @iconOpacity: 0.5;
  31. @iconFocusOpacity: 1;
  32. @iconSpacing: 0em;
  33. @iconMargin: @iconWidth + @iconSpacing;
  34. @iconTransition: opacity 0.3s @defaultEasing;
  35. @transparentIconWidth: @glyphWidth;
  36. @transparentIconMargin: 1.75em;
  37. /* Circular Icon Input */
  38. @circularIconVerticalOffset: 0.35em;
  39. @circularIconHorizontalOffset: 0.5em;
  40. /* Labeled Input */
  41. @labelTop: @borderWidth;
  42. @labelRight: @borderWidth;
  43. @labelSize: 0.75em;
  44. @labeledMargin: 2.5em;
  45. @labeledIconInputMargin: 3.25em;
  46. @labeledIconMargin: 1.25em;
  47. /*-------------------
  48. States
  49. --------------------*/
  50. /* Placeholder */
  51. @placeholderColor: @unselectedTextColor;
  52. @placeholderFocusColor: @textColor;
  53. @placeholderErrorColor: rgba(255, 80, 80, 0.4);
  54. @placeholderErrorFocusColor: rgba(255, 80, 80, 0.7);
  55. /* Down */
  56. @downBorderColor: rgba(0, 0, 0, 0.3);
  57. @downBackground: #FAFAFA;
  58. @downColor: @textColor;
  59. @downBoxShadow: none;
  60. /* Focus */
  61. @focusBorderColor: @selectedBorderColor;
  62. @focusBackground: '';
  63. @focusColor: @hoveredTextColor;
  64. @focusBoxShadow: none;
  65. /* Error */
  66. @errorBackground: #FFFAFA;
  67. @errorBorder: #E7BEBE;
  68. @errorColor: #D95C5C;
  69. @errorBoxShadow: none;
  70. /* Loading */
  71. @loadingImage: "@{imagePath}/loader-mini.gif";
  72. /*-------------------
  73. Variations
  74. --------------------*/
  75. /* Sizing */
  76. @mini: 0.8125rem;
  77. @small: 0.875rem;
  78. @medium: 1rem;
  79. @large: 1.125rem;
  80. @big: 1.25rem;
  81. @huge: 1.375rem;
  82. @massive: 1.5rem;