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.

147 lines
3.4 KiB

10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
  1. /*******************************
  2. Dropdown
  3. *******************************/
  4. /*-------------------
  5. Element
  6. --------------------*/
  7. @lineHeight: 1;
  8. @transition:
  9. border-radius 0.1s ease,
  10. width 0.2s ease
  11. ;
  12. @borderRadius: 0.325em;
  13. /*-------------------
  14. Content
  15. --------------------*/
  16. /* Icon */
  17. @dropdownIconMargin: 0em 0em 0em 1em;
  18. /* Sub Menu Pointer Icon */
  19. @dropdownSubMenuIconFloat: right;
  20. @dropdownSubMenuIconMargin: 0em 0em 0em 0.5em;
  21. /* Current Text */
  22. @textTransition: color 0.2s @defaultEasing;
  23. /* Menu */
  24. @menuBackground: #FFFFFF;
  25. @menuMargin: 0em;
  26. @menuPadding: 0em;
  27. @menuTop: 100%;
  28. @menuWrap: nowrap;
  29. @menuBorderShadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
  30. @menuShadow: 0 1px 4px 0 rgba(0, 0, 0, 0.15);
  31. @menuBoxShadow:
  32. @menuBorderShadow,
  33. @menuShadow
  34. ;
  35. @menuBorderRadius: 0em 0em @borderRadius @borderRadius;
  36. @menuTransition: opacity 0.2s ease;
  37. @menuZIndex: 11;
  38. /* Menu Item */
  39. @itemFontSize: 1rem;
  40. @itemBorder: none;
  41. @itemHeight: auto;
  42. @itemDivider: none;
  43. @itemColor: @textColor;
  44. @itemVerticalPadding: 0.85em;
  45. @itemHorizontalPadding: 1em;
  46. @itemFontWeight: normal;
  47. @itemTextAlign: left;
  48. @itemTextTransform: none;
  49. @itemBoxShadow: none;
  50. /* Menu Item Icon */
  51. @itemIconMargin: 0em 0.75em 0em 0em;
  52. /* Sub Menu */
  53. @subMenuTop: 0%;
  54. @subMenuLeft: 100%;
  55. @subMenuRight: auto;
  56. @subMenuMargin: 0em;
  57. @subMenuBorderRadius: 0em @borderRadius @borderRadius 0em;
  58. /*-------------------
  59. Types
  60. --------------------*/
  61. /* Selection */
  62. @selectionBackground: @white;
  63. @selectionDisplay: inline-block;
  64. @selectionVerticalPadding: 0.8em;
  65. @selectionHorizontalPadding: 1.1em;
  66. @selectionTextColor: @textColor;
  67. @selectionBoxShadow: 0px 0px 0px 1px @borderColor;
  68. @selectionBorderRadius: @borderRadius;
  69. @selectionIconOpacity: 0.8;
  70. @selectionIconTransition: opacity 0.2s ease;
  71. @selectionIconMargin: 0em 0em 0em 1em;
  72. @selectionMenuMaxHeight: 312px;
  73. @selectionMenuBoxShadow: 0px 1px 0px 1px #E0E0E0;
  74. @selectionMenuItemBoxShadow: none;
  75. /* Selection Hover */
  76. @selectionHoverBoxShadow: 0px 0px 0px 1px @selectedBorderColor;
  77. @selectionHoverMenuBoxShadow: 0px 1px 0px 1px #D3D3D3;
  78. @selectionHoverIconOpacity: 1;
  79. @selectionVisibleConnectingBorder: 0em;
  80. @selectionActiveIconOpacity: 1;
  81. /* Inline */
  82. @inlineIconMargin: 0em 0.5em 0em 0.25em;
  83. @inlineTextColor: inherit;
  84. @inlineTextFontWeight: bold;
  85. @inlineMenuDistance: 0.25em;
  86. @inlineMenuBorderRadius: @borderRadius;
  87. /*-------------------
  88. States
  89. --------------------*/
  90. /* Default Text */
  91. @defaultTextColor: rgba(179, 179, 179, 0.7);
  92. @defaultTextHoverColor: rgba(140, 140, 140, 0.7);
  93. /* Active Menu Item */
  94. @activeItemBackground: @transparentBlack;
  95. @activeItemZIndex: @menuZIndex + 1;
  96. @activeItemBoxShadow: none;
  97. @activeItemFontWeight: bold;
  98. @activeItemColor: @selectedTextColor;
  99. /* Menu Error */
  100. /*-------------------
  101. Variations
  102. --------------------*/
  103. /* Simple */
  104. @simpleTransitionDuration: 0.2s;
  105. @simpleTransition: opacity @simpleTransitionDuration @defaultEasing;
  106. /* Floating */
  107. @floatingMenuDistance: 0.5em;
  108. @floatingMenuBoxShadow:
  109. 0px 0px 0px 1px rgba(0, 0, 0, 0.2) inset,
  110. 0px 2px 5px 0px rgba(0, 0, 0, 0.15)
  111. ;
  112. @floatingMenuBorderRadius: @borderRadius;
  113. /* Pointing */
  114. @pointingArrowOffset: -0.25em;
  115. @pointingArrowDistanceFromEdge: 1em;
  116. @pointingArrowBackground: @white;
  117. @pointingArrowZIndex: 2;
  118. @pointingArrowBoxShadow: -1px -1px 0px 1px rgba(0, 0, 0, 0.1);
  119. @pointingArrowSize: 0.5em;
  120. @pointingMenuDistance: 0.75em;
  121. @pointingMenuBorderRadius: @borderRadius;