less-rails-semantic_ui 1.12.3.0 → 2.0.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (197) hide show
  1. checksums.yaml +4 -4
  2. data/assets/javascripts/semantic_ui/definitions/behaviors/api.js +394 -188
  3. data/assets/javascripts/semantic_ui/definitions/behaviors/colorize.js +4 -2
  4. data/assets/javascripts/semantic_ui/definitions/behaviors/form.js +263 -125
  5. data/assets/javascripts/semantic_ui/definitions/behaviors/state.js +3 -3
  6. data/assets/javascripts/semantic_ui/definitions/behaviors/visibility.js +213 -96
  7. data/assets/javascripts/semantic_ui/definitions/behaviors/visit.js +6 -4
  8. data/assets/javascripts/semantic_ui/definitions/globals/site.js +4 -4
  9. data/assets/javascripts/semantic_ui/definitions/modules/accordion.js +66 -52
  10. data/assets/javascripts/semantic_ui/definitions/modules/checkbox.js +309 -112
  11. data/assets/javascripts/semantic_ui/definitions/modules/dimmer.js +24 -26
  12. data/assets/javascripts/semantic_ui/definitions/modules/dropdown.js +2005 -590
  13. data/assets/javascripts/semantic_ui/definitions/modules/embed.js +662 -0
  14. data/assets/javascripts/semantic_ui/definitions/modules/modal.js +106 -79
  15. data/assets/javascripts/semantic_ui/definitions/modules/nag.js +7 -8
  16. data/assets/javascripts/semantic_ui/definitions/modules/popup.js +323 -194
  17. data/assets/javascripts/semantic_ui/definitions/modules/progress.js +111 -103
  18. data/assets/javascripts/semantic_ui/definitions/modules/rating.js +78 -54
  19. data/assets/javascripts/semantic_ui/definitions/modules/search.js +304 -122
  20. data/assets/javascripts/semantic_ui/definitions/modules/shape.js +93 -47
  21. data/assets/javascripts/semantic_ui/definitions/modules/sidebar.js +83 -149
  22. data/assets/javascripts/semantic_ui/definitions/modules/sticky.js +99 -29
  23. data/assets/javascripts/semantic_ui/definitions/modules/tab.js +219 -124
  24. data/assets/javascripts/semantic_ui/definitions/modules/transition.js +202 -171
  25. data/assets/stylesheets/semantic_ui/definitions/collections/breadcrumb.less +2 -1
  26. data/assets/stylesheets/semantic_ui/definitions/collections/form.less +135 -58
  27. data/assets/stylesheets/semantic_ui/definitions/collections/grid.less +366 -383
  28. data/assets/stylesheets/semantic_ui/definitions/collections/menu.less +838 -631
  29. data/assets/stylesheets/semantic_ui/definitions/collections/message.less +89 -71
  30. data/assets/stylesheets/semantic_ui/definitions/collections/table.less +183 -131
  31. data/assets/stylesheets/semantic_ui/definitions/elements/button.less +1097 -300
  32. data/assets/stylesheets/semantic_ui/definitions/elements/container.less +135 -0
  33. data/assets/stylesheets/semantic_ui/definitions/elements/divider.less +31 -30
  34. data/assets/stylesheets/semantic_ui/definitions/elements/flag.less +1 -1
  35. data/assets/stylesheets/semantic_ui/definitions/elements/header.less +209 -121
  36. data/assets/stylesheets/semantic_ui/definitions/elements/icon.less +201 -96
  37. data/assets/stylesheets/semantic_ui/definitions/elements/image.less +26 -11
  38. data/assets/stylesheets/semantic_ui/definitions/elements/input.less +49 -14
  39. data/assets/stylesheets/semantic_ui/definitions/elements/label.less +391 -221
  40. data/assets/stylesheets/semantic_ui/definitions/elements/list.less +107 -68
  41. data/assets/stylesheets/semantic_ui/definitions/elements/loader.less +3 -1
  42. data/assets/stylesheets/semantic_ui/definitions/elements/rail.less +34 -25
  43. data/assets/stylesheets/semantic_ui/definitions/elements/reveal.less +25 -10
  44. data/assets/stylesheets/semantic_ui/definitions/elements/segment.less +261 -173
  45. data/assets/stylesheets/semantic_ui/definitions/elements/step.less +169 -70
  46. data/assets/stylesheets/semantic_ui/definitions/globals/reset.less +1 -1
  47. data/assets/stylesheets/semantic_ui/definitions/globals/site.less +3 -1
  48. data/assets/stylesheets/semantic_ui/definitions/modules/accordion.less +1 -2
  49. data/assets/stylesheets/semantic_ui/definitions/modules/checkbox.less +175 -103
  50. data/assets/stylesheets/semantic_ui/definitions/modules/dimmer.less +26 -15
  51. data/assets/stylesheets/semantic_ui/definitions/modules/dropdown.less +349 -80
  52. data/assets/stylesheets/semantic_ui/definitions/modules/embed.less +174 -0
  53. data/assets/stylesheets/semantic_ui/definitions/modules/modal.less +83 -36
  54. data/assets/stylesheets/semantic_ui/definitions/modules/nag.less +1 -1
  55. data/assets/stylesheets/semantic_ui/definitions/modules/popup.less +48 -7
  56. data/assets/stylesheets/semantic_ui/definitions/modules/progress.less +160 -107
  57. data/assets/stylesheets/semantic_ui/definitions/modules/rating.less +57 -54
  58. data/assets/stylesheets/semantic_ui/definitions/modules/search.less +55 -10
  59. data/assets/stylesheets/semantic_ui/definitions/modules/shape.less +5 -6
  60. data/assets/stylesheets/semantic_ui/definitions/modules/sidebar.less +9 -5
  61. data/assets/stylesheets/semantic_ui/definitions/modules/sticky.less +1 -1
  62. data/assets/stylesheets/semantic_ui/definitions/modules/tab.less +1 -1
  63. data/assets/stylesheets/semantic_ui/definitions/modules/transition.less +3 -4
  64. data/assets/stylesheets/semantic_ui/definitions/views/card.less +240 -130
  65. data/assets/stylesheets/semantic_ui/definitions/views/comment.less +1 -1
  66. data/assets/stylesheets/semantic_ui/definitions/views/feed.less +15 -8
  67. data/assets/stylesheets/semantic_ui/definitions/views/item.less +13 -13
  68. data/assets/stylesheets/semantic_ui/definitions/views/statistic.less +230 -86
  69. data/assets/stylesheets/semantic_ui/theme.less +22 -15
  70. data/assets/stylesheets/semantic_ui/themes/amazon/elements/button.overrides +5 -5
  71. data/assets/stylesheets/semantic_ui/themes/amazon/elements/button.variables +5 -4
  72. data/assets/stylesheets/semantic_ui/themes/basic/collections/table.variables +1 -0
  73. data/assets/stylesheets/semantic_ui/themes/basic/views/card.variables +6 -4
  74. data/assets/stylesheets/semantic_ui/themes/bookish/elements/header.variables +4 -4
  75. data/assets/stylesheets/semantic_ui/themes/bootstrap3/elements/button.variables +1 -1
  76. data/assets/stylesheets/semantic_ui/themes/chubby/collections/form.overrides +8 -0
  77. data/assets/stylesheets/semantic_ui/themes/chubby/collections/menu.overrides +0 -0
  78. data/assets/stylesheets/semantic_ui/themes/chubby/collections/menu.variables +40 -0
  79. data/assets/stylesheets/semantic_ui/themes/classic/modules/progress.variables +1 -0
  80. data/assets/stylesheets/semantic_ui/themes/classic/views/card.overrides +1 -1
  81. data/assets/stylesheets/semantic_ui/themes/colored/modules/checkbox.overrides +0 -0
  82. data/assets/stylesheets/semantic_ui/themes/colored/modules/checkbox.variables +17 -0
  83. data/assets/stylesheets/semantic_ui/themes/default/collections/breadcrumb.overrides +0 -0
  84. data/assets/stylesheets/semantic_ui/themes/default/collections/breadcrumb.variables +5 -15
  85. data/assets/stylesheets/semantic_ui/themes/default/collections/form.overrides +0 -0
  86. data/assets/stylesheets/semantic_ui/themes/default/collections/form.variables +31 -35
  87. data/assets/stylesheets/semantic_ui/themes/default/collections/grid.overrides +0 -0
  88. data/assets/stylesheets/semantic_ui/themes/default/collections/grid.variables +34 -28
  89. data/assets/stylesheets/semantic_ui/themes/default/collections/menu.overrides +0 -0
  90. data/assets/stylesheets/semantic_ui/themes/default/collections/menu.variables +259 -163
  91. data/assets/stylesheets/semantic_ui/themes/default/collections/message.overrides +0 -0
  92. data/assets/stylesheets/semantic_ui/themes/default/collections/message.variables +42 -19
  93. data/assets/stylesheets/semantic_ui/themes/default/collections/table.overrides +0 -3
  94. data/assets/stylesheets/semantic_ui/themes/default/collections/table.variables +63 -59
  95. data/assets/stylesheets/semantic_ui/themes/default/elements/button.overrides +0 -0
  96. data/assets/stylesheets/semantic_ui/themes/default/elements/button.variables +90 -50
  97. data/assets/stylesheets/semantic_ui/themes/default/elements/container.overrides +3 -0
  98. data/assets/stylesheets/semantic_ui/themes/default/elements/container.variables +45 -0
  99. data/assets/stylesheets/semantic_ui/themes/default/elements/divider.overrides +15 -0
  100. data/assets/stylesheets/semantic_ui/themes/default/elements/divider.variables +3 -4
  101. data/assets/stylesheets/semantic_ui/themes/default/elements/flag.overrides +0 -0
  102. data/assets/stylesheets/semantic_ui/themes/default/elements/header.overrides +0 -0
  103. data/assets/stylesheets/semantic_ui/themes/default/elements/header.variables +40 -36
  104. data/assets/stylesheets/semantic_ui/themes/default/elements/icon.overrides +4 -3
  105. data/assets/stylesheets/semantic_ui/themes/default/elements/icon.variables +29 -12
  106. data/assets/stylesheets/semantic_ui/themes/default/elements/image.overrides +0 -0
  107. data/assets/stylesheets/semantic_ui/themes/default/elements/image.variables +5 -3
  108. data/assets/stylesheets/semantic_ui/themes/default/elements/input.overrides +0 -0
  109. data/assets/stylesheets/semantic_ui/themes/default/elements/input.variables +10 -24
  110. data/assets/stylesheets/semantic_ui/themes/default/elements/label.overrides +0 -0
  111. data/assets/stylesheets/semantic_ui/themes/default/elements/label.variables +88 -35
  112. data/assets/stylesheets/semantic_ui/themes/default/elements/list.overrides +0 -0
  113. data/assets/stylesheets/semantic_ui/themes/default/elements/list.variables +53 -34
  114. data/assets/stylesheets/semantic_ui/themes/default/elements/loader.overrides +0 -0
  115. data/assets/stylesheets/semantic_ui/themes/default/elements/loader.variables +9 -10
  116. data/assets/stylesheets/semantic_ui/themes/default/elements/rail.overrides +0 -0
  117. data/assets/stylesheets/semantic_ui/themes/default/elements/rail.variables +13 -5
  118. data/assets/stylesheets/semantic_ui/themes/default/elements/reveal.overrides +0 -0
  119. data/assets/stylesheets/semantic_ui/themes/default/elements/reveal.variables +6 -4
  120. data/assets/stylesheets/semantic_ui/themes/default/elements/segment.overrides +0 -0
  121. data/assets/stylesheets/semantic_ui/themes/default/elements/segment.variables +66 -28
  122. data/assets/stylesheets/semantic_ui/themes/default/elements/step.overrides +0 -0
  123. data/assets/stylesheets/semantic_ui/themes/default/elements/step.variables +60 -31
  124. data/assets/stylesheets/semantic_ui/themes/default/globals/reset.overrides +0 -0
  125. data/assets/stylesheets/semantic_ui/themes/default/globals/site.variables +477 -303
  126. data/assets/stylesheets/semantic_ui/themes/default/modules/accordion.overrides +0 -0
  127. data/assets/stylesheets/semantic_ui/themes/default/modules/accordion.variables +6 -7
  128. data/assets/stylesheets/semantic_ui/themes/default/modules/chatroom.overrides +0 -0
  129. data/assets/stylesheets/semantic_ui/themes/default/modules/checkbox.overrides +19 -16
  130. data/assets/stylesheets/semantic_ui/themes/default/modules/checkbox.variables +71 -43
  131. data/assets/stylesheets/semantic_ui/themes/default/modules/dimmer.overrides +0 -0
  132. data/assets/stylesheets/semantic_ui/themes/default/modules/dimmer.variables +12 -9
  133. data/assets/stylesheets/semantic_ui/themes/default/modules/dropdown.overrides +0 -5
  134. data/assets/stylesheets/semantic_ui/themes/default/modules/dropdown.variables +146 -64
  135. data/assets/stylesheets/semantic_ui/themes/default/modules/{video.overrides → embed.overrides} +0 -0
  136. data/assets/stylesheets/semantic_ui/themes/default/modules/embed.variables +53 -0
  137. data/assets/stylesheets/semantic_ui/themes/default/modules/modal.overrides +0 -0
  138. data/assets/stylesheets/semantic_ui/themes/default/modules/modal.variables +24 -18
  139. data/assets/stylesheets/semantic_ui/themes/default/modules/nag.overrides +0 -0
  140. data/assets/stylesheets/semantic_ui/themes/default/modules/popup.overrides +0 -0
  141. data/assets/stylesheets/semantic_ui/themes/default/modules/popup.variables +3 -9
  142. data/assets/stylesheets/semantic_ui/themes/default/modules/progress.variables +13 -7
  143. data/assets/stylesheets/semantic_ui/themes/default/modules/rating.overrides +0 -0
  144. data/assets/stylesheets/semantic_ui/themes/default/modules/rating.variables +71 -33
  145. data/assets/stylesheets/semantic_ui/themes/default/modules/search.overrides +0 -0
  146. data/assets/stylesheets/semantic_ui/themes/default/modules/search.variables +36 -34
  147. data/assets/stylesheets/semantic_ui/themes/default/modules/shape.overrides +0 -0
  148. data/assets/stylesheets/semantic_ui/themes/default/modules/shape.variables +7 -2
  149. data/assets/stylesheets/semantic_ui/themes/default/modules/sidebar.overrides +0 -0
  150. data/assets/stylesheets/semantic_ui/themes/default/modules/sidebar.variables +2 -5
  151. data/assets/stylesheets/semantic_ui/themes/default/modules/sticky.overrides +0 -0
  152. data/assets/stylesheets/semantic_ui/themes/default/modules/sticky.variables +2 -7
  153. data/assets/stylesheets/semantic_ui/themes/default/modules/tab.variables +1 -3
  154. data/assets/stylesheets/semantic_ui/themes/default/modules/transition.overrides +8 -9
  155. data/assets/stylesheets/semantic_ui/themes/default/views/ad.variables +2 -2
  156. data/assets/stylesheets/semantic_ui/themes/default/views/card.variables +33 -23
  157. data/assets/stylesheets/semantic_ui/themes/default/views/comment.overrides +0 -0
  158. data/assets/stylesheets/semantic_ui/themes/default/views/feed.overrides +0 -0
  159. data/assets/stylesheets/semantic_ui/themes/default/views/feed.variables +15 -23
  160. data/assets/stylesheets/semantic_ui/themes/default/views/item.overrides +0 -0
  161. data/assets/stylesheets/semantic_ui/themes/default/views/item.variables +12 -11
  162. data/assets/stylesheets/semantic_ui/themes/default/views/statistic.overrides +0 -0
  163. data/assets/stylesheets/semantic_ui/themes/default/views/statistic.variables +25 -24
  164. data/assets/stylesheets/semantic_ui/themes/flat/collections/form.overrides +4 -0
  165. data/assets/stylesheets/semantic_ui/themes/flat/collections/form.variables +1 -2
  166. data/assets/stylesheets/semantic_ui/themes/flat/globals/site.variables +1 -0
  167. data/assets/stylesheets/semantic_ui/themes/github/collections/form.variables +1 -1
  168. data/assets/stylesheets/semantic_ui/themes/github/collections/menu.variables +10 -15
  169. data/assets/stylesheets/semantic_ui/themes/github/elements/button.variables +2 -2
  170. data/assets/stylesheets/semantic_ui/themes/github/elements/step.variables +2 -2
  171. data/assets/stylesheets/semantic_ui/themes/instagram/views/card.overrides +12 -0
  172. data/assets/stylesheets/semantic_ui/themes/instagram/views/card.variables +23 -0
  173. data/assets/stylesheets/semantic_ui/themes/material/collections/menu.overrides +1 -0
  174. data/assets/stylesheets/semantic_ui/themes/material/collections/menu.variables +10 -0
  175. data/assets/stylesheets/semantic_ui/themes/material/elements/button.overrides +1 -0
  176. data/assets/stylesheets/semantic_ui/themes/material/elements/button.variables +14 -6
  177. data/assets/stylesheets/semantic_ui/themes/material/globals/site.variables +3 -2
  178. data/assets/stylesheets/semantic_ui/themes/material/modules/dropdown.overrides +5 -0
  179. data/assets/stylesheets/semantic_ui/themes/material/modules/dropdown.variables +20 -0
  180. data/assets/stylesheets/semantic_ui/themes/raised/elements/button.variables +5 -5
  181. data/assets/stylesheets/semantic_ui/themes/round/elements/button.variables +1 -1
  182. data/assets/stylesheets/semantic_ui/themes/timeline/views/feed.overrides +4 -12
  183. data/assets/stylesheets/semantic_ui/themes/timeline/views/feed.variables +3 -7
  184. data/lib/generators/semantic_ui/install/templates/config/elements/container.overrides +3 -0
  185. data/lib/generators/semantic_ui/install/templates/config/elements/container.variables +3 -0
  186. data/lib/generators/semantic_ui/install/templates/config/modules/embed.overrides +3 -0
  187. data/lib/generators/semantic_ui/install/templates/config/modules/embed.variables +0 -0
  188. data/lib/generators/semantic_ui/install/templates/semantic_ui.css +2 -1
  189. data/lib/generators/semantic_ui/install/templates/semantic_ui.js +1 -1
  190. data/lib/generators/semantic_ui/install/templates/theme.config +5 -3
  191. data/lib/less/rails/semantic_ui/version.rb +1 -1
  192. data/tasks/update.rake +21 -6
  193. metadata +23 -7
  194. data/assets/fonts/semantic_ui/themes/default/assets/fonts/icons.otf +0 -0
  195. data/assets/javascripts/semantic_ui/definitions/modules/video.js +0 -540
  196. data/assets/stylesheets/semantic_ui/definitions/modules/video.less +0 -135
  197. data/assets/stylesheets/semantic_ui/themes/default/modules/video.variables +0 -16
@@ -15,55 +15,46 @@
15
15
  Collection
16
16
  --------------------*/
17
17
 
18
- @margin: 1rem 0rem;
19
- @verticalPadding: 0.78571em;
20
- @horizontalPadding: 0.95em;
21
-
18
+ /* Menu */
19
+ @margin: 1em 0rem;
22
20
  @background: #FFFFFF;
21
+ @fontFamily: @pageFont;
23
22
  @itemBackground: none;
24
-
25
23
  @fontWeight: normal;
26
- @boxShadow:
27
- 0px 0px 0px 1px @borderColor,
28
- @subtleShadow
29
- ;
30
-
31
- @borderSize: 0em;
32
-
33
- @transition:
34
- opacity 0.2s ease,
35
- background 0.2s ease,
36
- box-shadow 0.2s ease
37
- ;
24
+ @borderWidth: 1px;
25
+ @border: @borderWidth solid @borderColor;
26
+ @boxShadow: @subtleShadow;
38
27
  @borderRadius: @defaultBorderRadius;
39
-
40
- @dividerSize: 1px;
41
- @dividerBackground: linear-gradient(
42
- rgba(0, 0, 0, 0.05) 0%,
43
- rgba(0, 0, 0, 0.1) 50%,
44
- rgba(0, 0, 0, 0.05) 100%)
45
- ;
46
-
47
- @headerBackground: rgba(0, 0, 0, 0.04);
48
- @headerWeight: bold;
49
-
50
- @textLineHeight: 1.3;
51
-
52
- @transition:
53
- opacity 0.2s ease,
54
- background 0.2s ease,
55
- box-shadow 0.2s ease
28
+ @minHeight: (@itemVerticalPadding * 2) + 1em;
29
+
30
+ /* Menu Item */
31
+ @itemVerticalPadding: @relativeSmall;
32
+ @itemHorizontalPadding: @relativeLarge;
33
+ @itemTextTransform: none;
34
+ @itemTransition:
35
+ background @defaultDuration @defaultEasing,
36
+ box-shadow @defaultDuration @defaultEasing,
37
+ color @defaultDuration @defaultEasing
56
38
  ;
39
+ @itemFontWeight: normal;
40
+ @itemTextColor: @textColor;
57
41
 
58
- @menuTextColor: @textColor;
42
+ /* Divider */
43
+ @dividerSize: 1px;
44
+ @dividerBackground: @internalBorderColor;
59
45
 
60
46
  /* Sub Menu */
61
- @subMenuMargin: 0.5em;
62
- @subMenuFontSize: 0.875rem;
47
+ @subMenuDistance: 0.5em;
48
+ @subMenuMargin: @subMenuDistance -@itemHorizontalPadding 0em;
49
+ @subMenuFontSize: @relativeTiny;
63
50
  @subMenuTextColor: rgba(0, 0, 0, 0.5);
64
51
 
65
- @subMenuHorizontalPadding: 0.5rem;
66
- @subMenuVerticalPadding: 1.5rem;
52
+ @subMenuIndent: 0em;
53
+ @subMenuHorizontalPadding: (@itemHorizontalPadding / @tinySize) + @subMenuIndent;
54
+ @subMenuVerticalPadding: 0.5em;
55
+
56
+ /* Text Item */
57
+ @textLineHeight: 1.3;
67
58
 
68
59
  /*--------------
69
60
  Elements
@@ -71,102 +62,141 @@
71
62
 
72
63
  /* Icon */
73
64
  @iconFloat: none;
74
- @iconMargin: 0em 0.25em 0em 0em;
75
- @iconOpacity: 0.75;
65
+ @iconMargin: 0em @relative5px 0em 0em;
66
+ @iconOpacity: 0.9;
76
67
 
68
+ /* Dropdown Icon */
77
69
  @dropdownIconFloat: right;
78
70
  @dropdownIconDistance: 1em;
79
71
 
80
- @verticalIconFloat: right;
81
- @verticalIconMargin: 0em 0em 0em 0.5em;
82
-
83
72
  /* Header */
84
- @headerBackground: rgba(0, 0, 0, 0.04);
73
+ @headerBackground: '';
85
74
  @headerWeight: bold;
86
75
  @headerTextTransform: normal;
87
76
 
77
+ /* Vertical Icon */
78
+ @verticalIconFloat: right;
79
+ @verticalIconMargin: 0em 0em 0em 0.5em;
80
+
81
+ /* Vertical Header */
82
+ @verticalHeaderMargin: 0em 0em 0.5em;
83
+ @verticalHeaderFontSize: @relativeMedium;
84
+ @verticalHeaderFontWeight: bold;
85
+
86
+ /* Pointing Arrow */
87
+ @arrowSize: @relative8px;
88
+ @arrowBorderWidth: 1px;
89
+ @arrowBorder: @arrowBorderWidth solid @solidBorderColor;
90
+ @arrowTransition: background @defaultDuration @defaultEasing;
91
+ @arrowZIndex: 2;
92
+
93
+ @arrowHoverColor: #F4F4F4;
94
+ @arrowActiveColor: #F4F4F4;
95
+ @arrowActiveHoverColor: @arrowActiveColor;
96
+
97
+ @arrowVerticalHoverColor: @arrowHoverColor;
98
+ @arrowVerticalActiveColor: @arrowActiveColor;
99
+ @arrowVerticalSubMenuColor: @white;
100
+
88
101
  /*--------------
89
102
  Couplings
90
103
  ---------------*/
91
104
 
92
105
  /* Button */
93
- @buttonOffset: -0.05em;
94
- @buttonVerticalPadding: 0.55em;
95
- @buttonSize: 0.875em;
106
+ @buttonSize: @relativeMedium;
107
+ @buttonOffset: 0em;
108
+ @buttonMargin: -0.5em 0em;
109
+ @buttonVerticalPadding: @relativeMini;
96
110
 
97
111
  /* Input */
98
- @inputSize: 1em;
99
- @inputVerticalMargin: -0.6em;
112
+ @inputSize: @relativeMedium;
113
+ @inputVerticalMargin: -0.5em;
100
114
  @inputOffset: 0em;
101
- @inputVerticalPadding: 0.4em;
115
+ @inputVerticalPadding: @relative8px;
102
116
 
103
- @smallInputOffset: 0em;
104
- @smallInputVerticalPadding: 0.4em;
105
-
106
- @largeInputOffset: -0.125em;
107
- @largeInputVerticalPadding: 0.6em;
117
+ /* Image */
118
+ @imageMargin: -0.3em 0em;
119
+ @imageWidth: 2.5em;
120
+ @verticalImageWidth: auto;
108
121
 
109
122
  /* Label */
110
123
  @labelOffset: -0.15em;
111
- @labelBackground: rgba(0, 0, 0, 0.35);
112
- @labelTextColor: #FFFFFF;
124
+ @labelBackground: #999999;
125
+ @labelTextColor: @white;
113
126
 
114
- @labelTextMargin: 0.5em;
127
+ @labelTextMargin: 1em;
115
128
  @labelVerticalPadding: 0.3em;
116
- @labelHorizontalPadding: 0.8em;
129
+ @labelHorizontalPadding: @relativeMini;
117
130
 
118
131
  @labelAndIconFloat: none;
119
132
  @labelAndIconMargin: 0em 0.5em 0em 0em;
120
133
 
121
- /* Dropdown */
122
- @dropdownBackground: #FFFFFF;
123
- @dropdownMenuOffset: 0px;
124
- @dropdownPointingDistance: 0px;
125
-
126
- @dropdownTextColor: @textColor;
127
- @dropdownBackgroundHover: @transparentBlack;
128
- @dropdownTextColorHover: @darkTextColor;
129
- @dropdownIconMargin: 0em 0em 0em 1em;
130
-
131
- @dropdownBoxShadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.08);
132
- @dropdownVerticalBoxShadow: 0 1px 3px 0px rgba(0, 0, 0, 0.08);
133
-
134
- /* Pointing Arrow */
135
- @arrowSize: 0.6em;
136
- @arrowBorderSize: 1px;
137
- @arrowBorder: @arrowBorderSize solid @solidBorderColor;
138
- @arrowTransition: background @transitionDuration @transitionEasing;
139
- @arrowZIndex: 11;
140
-
141
- @arrowHoverColor: #FAFAFA;
142
- @arrowActiveColor: #F7F7F7;
134
+ /* Dropdown in Menu */
135
+ @dropdownMenuBoxShadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.08);
143
136
 
144
- @arrowVerticalHoverColor: @arrowHoverColor;
145
- @arrowVerticalActiveColor: @arrowActiveColor;
146
- @arrowVerticalSubMenuColor: @white;
137
+ @dropdownBackground: #FFFFFF;
138
+ @dropdownMenuDistance: 0em;
139
+ @dropdownMenuBorderRadius: @borderRadius;
140
+
141
+ @dropdownItemFontSize: @relativeMedium;
142
+ @dropdownItemPadding: @relativeMini @relativeLarge;
143
+ @dropdownItemBackground: transparent;
144
+ @dropdownItemColor: @textColor;
145
+ @dropdownItemTextTransform: none;
146
+ @dropdownItemFontWeight: normal;
147
+ @dropdownItemBoxShadow: none;
148
+ @dropdownItemTransition: none;
149
+
150
+ @dropdownItemIconFloat: none;
151
+ @dropdownItemIconFontSize: @relativeMedium;
152
+ @dropdownItemIconMargin: 0em 0.75em 0em 0em;
153
+
154
+ @dropdownHoveredItemBackground: @transparentBlack;
155
+ @dropdownHoveredItemColor: @selectedTextColor;
156
+
157
+ /* Dropdown Variations */
158
+ @dropdownVerticalMenuBoxShadow: 0 1px 3px 0px rgba(0, 0, 0, 0.08);
159
+ @secondaryDropdownMenuDistance: @relative5px;
160
+ @pointingDropdownMenuDistance: 0.75em;
161
+ @invertedSelectionDropdownColor: @invertedTextColor;
147
162
 
148
163
  /*--------------
149
164
  States
150
165
  ---------------*/
151
166
 
152
- @hoverBackground: @subtleTransparentBlack;
153
- @hoverColor: @textColor;
167
+ /* Hovered Item */
168
+ @hoverItemBackground: @subtleTransparentBlack;
169
+ @hoverItemTextColor: @selectedTextColor;
154
170
 
155
- @pressedBackground: @subtleTransparentBlack;
156
- @pressedColor: @pressedTextColor;
171
+ /* Pressed Item */
172
+ @pressedItemBackground: @subtleTransparentBlack;
173
+ @pressedItemColor: @pressedTextColor;
157
174
 
158
- @activeBackground: @subtleTransparentBlack;
159
- @activeColor: @darkTextColor;
160
- @activeBorderSize: 2px;
161
- @activeFontWeight: normal;
175
+
176
+ /* Active Item */
177
+ @activeItemBackground: @transparentBlack;
178
+ @activeItemTextColor: @selectedTextColor;
179
+ @activeItemFontWeight: normal;
162
180
  @activeIconOpacity: 1;
181
+ @activeItemBoxShadow: none;
163
182
 
164
- @activeHoverBackground: @hoverBackground;
165
- @subMenuActiveBackground: transparent;
183
+ /* Active Hovered Item */
184
+ @activeHoverItemBackground: @transparentBlack;
185
+ @activeHoverItemColor: @selectedTextColor;
166
186
 
167
- @loadingBackgroundColor: rgba(255, 255, 255, 0.8);
168
- @loadingImage: "@{imagePath}/loader-large.gif";
169
- @loadingPosition: 50% 50%;
187
+ /* Selected Dropdown */
188
+ @dropdownSelectedItemBackground: @transparentBlack;
189
+ @dropdownSelectedItemColor: @selectedTextColor;
190
+
191
+ /* Active Dropdown */
192
+ @dropdownActiveItemBackground: @subtleTransparentBlack;
193
+ @dropdownActiveItemColor: @selectedTextColor;
194
+ @dropdownActiveItemFontWeight: bold;
195
+
196
+ /* Active Sub Menu */
197
+ @subMenuActiveBackground: transparent;
198
+ @subMenuActiveTextColor: @activeItemTextColor;
199
+ @subMenuActiveFontWeight: bold;
170
200
 
171
201
 
172
202
  /*--------------
@@ -174,49 +204,82 @@
174
204
  ---------------*/
175
205
 
176
206
  /* Vertical */
207
+ @verticalBoxShadow: @boxShadow;
208
+ @verticalPointerWidth: 2px;
177
209
  @verticalBackground: #FFFFFF;
178
210
  @verticalItemBackground: none;
179
- @verticalDividerBackground: linear-gradient(to right,
180
- rgba(0, 0, 0, 0.03) 0%,
181
- rgba(0, 0, 0, 0.1) 1.5em,
182
- rgba(0, 0, 0, 0.03) 100%)
183
- ;
211
+ @verticalDividerBackground: @dividerBackground;
212
+
213
+ @verticalActiveBoxShadow: none;
184
214
 
185
215
 
186
216
  /* Secondary */
187
217
  @secondaryBackground: none;
218
+ @secondaryMargin: 0em -@secondaryItemSpacing;
188
219
  @secondaryItemBackground: none;
220
+ @secondaryItemSpacing: @relative5px;
221
+ @secondaryItemMargin: 0em @secondaryItemSpacing;
222
+ @secondaryItemPadding: @relativeMini @relativeSmall;
223
+ @secondaryItemBorderRadius: @defaultBorderRadius;
224
+ @secondaryItemTransition: color @defaultDuration @defaultEasing;
225
+ @secondaryItemColor: @unselectedTextColor;
189
226
 
190
- @secondaryTransition: color 0.2s ease;
191
-
192
- @secondaryBorderRadius: @defaultBorderRadius;
227
+ @secondaryHoverItemBackground: @transparentBlack;
228
+ @secondaryHoverItemColor: @selectedTextColor;
193
229
 
194
- @secondaryMargin: 0.25em;
195
- @secondaryVerticalMargin: 0.3em;
196
- @secondaryVerticalPadding: 0.5em;
197
- @secondaryHorizontalPadding: 0.8em;
230
+ @secondaryActiveItemBackground: @transparentBlack;
231
+ @secondaryActiveItemColor: @selectedTextColor;
232
+ @secondaryActiveHoverItemBackground: @transparentBlack;
233
+ @secondaryActiveHoverItemColor: @selectedTextColor;
198
234
 
199
- @secondaryLinkOpacity: 0.8;
235
+ @secondaryActiveHoveredItemBackground: @transparentBlack;
236
+ @secondaryActiveHoveredItemColor: @selectedTextColor;
200
237
 
201
238
  @secondaryHeaderBackground: none transparent;
202
- @secondaryHeaderBorder: 0.1em solid rgba(0, 0, 0, 0.1);
203
-
204
- @secondaryActiveBackground: @transparentBlack;
205
- @secondaryInvertedActiveBackground: @transparentWhite;
239
+ @secondaryHeaderBorder: 1px solid @borderColor;
206
240
 
241
+ @secondaryItemVerticalSpacing: @secondaryItemSpacing;
242
+ @secondaryVerticalItemMargin: 0em 0em @secondaryItemVerticalSpacing;
243
+ @secondaryVerticalItemBorderRadius: @defaultBorderRadius;
207
244
 
208
245
  /* Pointing */
209
- @secondaryPointingBorderWidth: 3px;
210
- @secondaryPointingVerticalPadding: 0.6em;
211
- @secondaryPointingHorizontalPadding: 0.95em;
246
+ @secondaryPointingBorderWidth: 2px;
247
+ @secondaryPointingBorderColor: @borderColor;
248
+ @secondaryPointingItemVerticalPadding: @relativeTiny;
249
+ @secondaryPointingItemHorizontalPadding: @relativeLarge;
212
250
 
213
- @secondaryPointingBorderColor: rgba(0, 0, 0, 0.2);
214
251
  @secondaryPointingHoverTextColor: @textColor;
215
252
 
216
- @secondaryPointingActiveBorderColor: rgba(0, 0, 0, 0.4);
253
+ @secondaryPointingActiveBorderColor: @black;
217
254
  @secondaryPointingActiveTextColor: @selectedTextColor;
255
+ @secondaryPointingActiveFontWeight: bold;
256
+
257
+ @secondaryPointingActiveDropdownBorderColor: transparent;
258
+
259
+ @secondaryPointingActiveHoverBorderColor: @secondaryPointingActiveBorderColor;
260
+ @secondaryPointingActiveHoverTextColor: @secondaryPointingActiveTextColor;
218
261
 
219
262
  @secondaryPointingHeaderColor: @darkTextColor;
263
+ @secondaryVerticalPointingItemMargin: 0em -@secondaryPointingBorderWidth 0em 0em;
264
+
265
+
266
+ /* Inverted Secondary */
267
+ @secondaryInvertedColor: @invertedLightTextColor;
268
+
269
+ @secondaryInvertedHoverBackground: @transparentWhite;
270
+ @secondaryInvertedHoverColor: @invertedSelectedTextColor;
271
+
272
+ @secondaryInvertedActiveBackground: @strongTransparentWhite;
273
+ @secondaryInvertedActiveColor: @invertedSelectedTextColor;
274
+
275
+ /* Inverted Pointing */
276
+ @secondaryPointingInvertedBorderColor: @whiteBorderColor;
277
+ @secondaryPointingInvertedItemTextColor: @invertedTextColor;
278
+ @secondaryPointingInvertedItemHeaderColor: @white;
279
+ @secondaryPointingInvertedItemHoverTextColor: @selectedTextColor;
280
+ @secondaryPointingInvertedActiveBorderColor: @white;
281
+ @secondaryPointingInvertedActiveColor: @invertedSelectedTextColor;
282
+
220
283
 
221
284
  /* Tiered */
222
285
  @tieredActiveItemBackground: #FCFCFC;
@@ -235,38 +298,70 @@
235
298
 
236
299
  @tieredInvertedSubMenuBackground: rgba(0, 0, 0, 0.2);
237
300
 
301
+
238
302
  /* Icon */
239
303
  @iconMenuTextAlign: center;
240
- @iconMenuItemColor: rgba(0, 0, 0, 0.6);
304
+ @iconMenuItemColor: @black;
305
+ @iconMenuInvertedItemColor: @white;
306
+
241
307
 
242
308
  /* Tabular */
243
309
  @tabularBorderColor: @solidBorderColor;
244
310
  @tabularBackgroundColor: #FFFFFF;
245
311
  @tabularBorderWidth: 1px;
246
- @tabularHorizontalPadding: 1.4em;
247
- @tabularMenuTextColor: @menuTextColor;
312
+ @tabularOppositeBorderWidth: @tabularBorderWidth + 1px;
313
+ @tabularHorizontalPadding: @relativeHuge;
314
+ @tabularMenuTextColor: @itemTextColor;
248
315
 
249
316
  @tabularFluidOffset: 1px;
250
317
  @tabularFluidWidth: ~"calc(100% + "(@tabularFluidOffset * 2)~")";
251
-
252
318
  @tabularActiveColor: @selectedTextColor;
253
319
  @tabularActiveBoxShadow: none;
254
320
 
255
- @tabularMenuActiveBackground: #FFFFFF;
321
+ @tabularMenuActiveBackground: @white;
322
+ @tabularMenuActiveColor: @selectedTextColor;
323
+
256
324
  @tabularActiveWeight: bold;
257
- @tabularBorderRadius: 5px;
325
+ @tabularBorderRadius: @defaultBorderRadius;
326
+
258
327
 
259
328
  /* Pagination */
260
329
  @paginationMinWidth: 3em;
261
- @paginationActiveBackground: rgba(0, 0, 0, 0.03);
330
+ @paginationActiveBackground: @transparentBlack;
331
+ @paginationActiveTextColor: @selectedTextColor;
262
332
 
263
333
  /* Labeled Icon */
264
- @labeledIconSize: 1.5em;
334
+ @labeledIconItemHorizontalPadding: @relativeMassive;
335
+ @labeledIconSize: @relativeHuge;
265
336
  @labeledIconMinWidth: 6em;
266
- @labeledIconTextMargin: 0.5em;
337
+ @labeledIconTextMargin: 0.5rem;
338
+
267
339
 
268
340
  /* Text */
269
- @textMenuTransition: opacity 0.2s ease;
341
+ @textMenuItemSpacing: 0.5em;
342
+ @textMenuMargin: @relativeLarge -@textMenuItemSpacing;
343
+ @textMenuItemColor: @mutedTextColor;
344
+ @textMenuItemFontWeight: normal;
345
+ @textMenuItemMargin: 0em @textMenuItemSpacing;
346
+ @textMenuItemTransition: opacity @defaultDuration @defaultEasing;
347
+
348
+ @textMenuSubMenuMargin: 0em;
349
+
350
+ @textMenuActiveItemFontWeight: normal;
351
+ @textMenuActiveItemColor: @selectedTextColor;
352
+
353
+ @textMenuHeaderSize: @relativeSmall;
354
+ @textMenuHeaderColor: @darkTextColor;
355
+ @textMenuHeaderFontWeight: bold;
356
+ @textMenuHeaderTextTransform: uppercase;
357
+
358
+ @textVerticalMenuMargin: @relativeMedium 0em;
359
+ @textVerticalMenuHeaderMargin: @relative8px 0em @relative10px;
360
+ @textVerticalMenuItemMargin: @relative8px 0em;
361
+
362
+ @textVerticalMenuIconFloat: none;
363
+ @textVerticalMenuIconMargin: @iconMargin;
364
+
270
365
 
271
366
  /*--------------
272
367
  Variations
@@ -275,59 +370,60 @@
275
370
  /* Inverted */
276
371
  @invertedBackground: @black;
277
372
  @invertedBoxShadow: none;
278
- @invertedHeaderBackground: rgba(0, 0, 0, 0.3);
373
+ @invertedBorder: 1px solid transparent;
374
+ @invertedHeaderBackground: transparent;
375
+
376
+ @invertedItemBackground: transparent;
377
+ @invertedItemTextColor: @invertedTextColor;
279
378
 
280
379
  /* Inverted Sub Menu */
281
380
  @invertedSubMenuBackground: transparent;
282
381
  @invertedSubMenuColor: @invertedUnselectedTextColor;
283
382
 
284
383
  /* Inverted Hover */
285
- @invertedHoverBackground: rgba(255, 255, 255, 0.1);
286
- @invertedHoverColor: @white;
384
+ @invertedHoverBackground: @transparentWhite;
385
+ @invertedHoverColor: @invertedSelectedTextColor;
386
+
287
387
  @invertedSubMenuHoverBackground: transparent;
288
- @invertedSubMenuHoverColor: @white;
388
+ @invertedSubMenuHoverColor: @invertedSelectedTextColor;
289
389
 
290
390
  /* Pressed */
291
- @invertedMenuPressedBackground: rgba(255, 255, 255, 0.15);
292
- @invertedMenuPressedColor: @white;
391
+ @invertedMenuPressedBackground: @transparentWhite;
392
+ @invertedMenuPressedColor: @invertedSelectedTextColor;
293
393
 
294
394
  /* Inverted Active */
295
- @invertedActiveBackground: rgba(255, 255, 255, 0.2);
296
- @invertedActiveColor: @white;
395
+ @invertedActiveBackground: @strongTransparentWhite;
396
+ @invertedActiveColor: @invertedSelectedTextColor;
397
+ @invertedArrowActiveColor: #3D3E3F;
398
+
399
+ /* Inverted Active Hover */
400
+ @invertedActiveHoverBackground: @invertedActiveBackground;
401
+ @invertedActiveHoverColor: @white;
402
+ @invertedArrowActiveHoverColor: @invertedArrowActiveColor;
403
+
297
404
  @invertedSubMenuActiveBackground: transparent;
298
405
  @invertedSubMenuActiveColor: @white;
299
406
 
300
- /* Inverted Secondary */
301
- @secondaryInvertedColor: @invertedLightTextColor;
302
- @secondaryInvertedHoverColor: @invertedSelectedTextColor;
303
-
304
407
  /* Inverted Menu Divider */
305
- @invertedDividerBackground: linear-gradient(
306
- rgba(255, 255, 255, 0.03) 0%,
307
- rgba(255, 255, 255, 0.1) 50%,
308
- rgba(255, 255, 255, 0.03) 100%)
309
- ;
310
- @invertedVerticalDividerBackground: linear-gradient(to right,
311
- rgba(255, 255, 255, 0.03) 0%,
312
- rgba(255, 255, 255, 0.1) 50%,
313
- rgba(255, 255, 255, 0.03) 100%)
314
- ;
408
+ @invertedDividerBackground: rgba(255, 255, 255, 0.08);
409
+ @invertedVerticalDividerBackground: @invertedDividerBackground;
410
+
411
+ /* Inverted Colored */
412
+ @invertedColoredDividerBackground: @dividerBackground;
413
+ @invertedColoredActiveBackground: @strongTransparentBlack;
315
414
 
316
415
  /* Fixed */
317
- @fixedGridMargin: 2.75rem;
416
+ @fixedPrecedingGridMargin: 2.75rem;
417
+
418
+ /* Floated */
419
+ @floatedDistance: 0.5rem;
318
420
 
319
421
  /* Attached */
320
- @attachedBoxShadow: 0px 0px 0px 1px #DDDDDD;
422
+ @attachedBoxShadow: none;
423
+ @attachedWidth: ~"calc(100% + "@borderWidth * 2~")";
321
424
 
322
425
  /* Sizes */
323
- @small: 0.875rem;
324
- @smallSubMenu: 0.875rem;
325
426
  @smallWidth: 13rem;
326
-
327
- @medium: 1rem;
328
427
  @mediumWidth: 15rem;
329
-
330
- @large: 1.125rem;
331
- @largeSubMenu: 0.875rem;
332
- @largeDropdown: 1rem;
333
- @largeWidth: 18rem;
428
+ @largeWidth: 18rem;
429
+ @hugeWidth: 20rem;