UNPKG

4.99 kBSCSSView Raw
1@charset "UTF-8";
2
3////
4/// @module menu: 菜单
5/// @tag Menu
6/// @category component
7/// @family data-display
8/// @varPrefix $menu-
9/// @classPrefix {prefix}-menu
10/// @order {"size/bounding":10,"size/item":11,"size/sub menu":12,"size/group title":13,"size/divider":14,"size/selected icon":15,"size/arrow":16,"size/checkbox & radio":17,"statement/normal":10,"statement/normal/bounding":100,"statement/normal/text":101,"statement/normal/divider":102,"statement/normal/item":103,"statement/normal/arrow":104,"statement/selected":11,"statement/selected/item":110,"statement/selected/text":111,"statement/selected/selected icon":112,"statement/hover":12,"statement/hover/item":120,"statement/hover/text":121,"statement/hover/arrow":122,"statement/hover/selected icon":123,"statement/disabled":13,"statement/disabled/text":130}
11////
12
13$menu-prefix: '.#{$css-prefix}menu';
14
15// Size
16// ----------------------------------------
17
18
19$menu-padding-vertical: $s-2 !default;
20$menu-padding-horizontal: $s-5 !default;
21
22/// padding (l, r)
23/// @namespace size/bounding
24$menu-padding-ver-padding-lr: $s-zero !default;
25/// padding (t, b)
26/// @namespace size/bounding
27$menu-padding-ver-padding-tb: $s-2 !default;
28/// padding (l, r)
29/// @namespace size/bounding
30$menu-padding-hoz-padding-lr: $s-zero !default;
31/// padding (t, b)
32/// @namespace size/bounding
33$menu-padding-hoz-padding-tb: $s-2 !default;
34
35/// padding (l)
36/// @namespace size/item
37$menu-item-padding-ver-padding-l: $s-5 !default;
38/// padding (r)
39/// @namespace size/item
40$menu-item-padding-ver-padding-r: $s-5 !default;
41/// padding (l, r)
42/// @namespace size/item
43$menu-item-padding-hoz-padding-lr: $s-5 !default;
44
45
46/// item height
47/// @namespace size/item
48$menu-line-height: $s-8 !default;
49
50/// text
51/// @namespace size/item
52$menu-font-size: $font-size-body-1 !default;
53
54/// text
55/// @namespace size/sub menu
56$menu-submenu-title-size: $font-size-body-1 !default;
57
58/// padding (l, r)
59/// @namespace size/group title
60$menu-padding-title-horizontal: $s-3 !default;
61
62/// width
63/// @namespace size/divider
64$menu-divider-width: $line-1 !default;
65
66/// margin (t, b)
67/// @namespace size/divider
68$menu-divider-margin-ver: $s-2 !default;
69
70/// margin (l, r)
71/// @namespace size/divider
72$menu-divider-margin-hoz: $s-3 !default;
73
74/// size
75/// @namespace size/selected icon
76$menu-icon-selected-size: $icon-xs !default;
77
78/// space to frame
79/// @namespace size/selected icon
80$menu-icon-selected-right: $s-1 !default;
81
82/// size
83/// @namespace size/arrow
84$menu-icon-size: $icon-xxs !default;
85
86/// size
87/// @namespace size/arrow
88$menu-hoz-icon-size: $icon-xs !default;
89
90/// margin (r)
91/// @namespace size/checkbox & radio
92$menu-icon-margin: $s-1 !default;
93
94// Statement:Normal
95// ----------------------------------------
96
97/// shadow
98/// @namespace statement/normal/bounding
99$menu-shadow: $shadow-1-down !default;
100
101/// color
102/// @namespace statement/normal/text
103$menu-color: $color-text1-4 !default;
104
105/// style
106/// @namespace statement/normal/divider
107$menu-divider-style: $line-solid !default;
108
109/// color
110/// @namespace statement/normal/divider
111$menu-divider-color: $color-line1-1 !default;
112
113/// background
114/// @namespace statement/normal/item
115$menu-background: $color-white !default;
116
117/// color
118/// @namespace statement/normal/text
119$menu-color: $color-text1-4 !default;
120
121/// color
122/// @namespace statement/normal/arrow
123$menu-arrow-color: $color-text1-3 !default;
124
125// Statement:Selected
126// ----------------------------------------
127
128/// background
129/// @namespace statement/selected/item
130$menu-background-selected: $color-white !default;
131
132/// color
133/// @namespace statement/selected/text
134$menu-color-selected: $color-text1-4 !default;
135
136/// color
137/// @namespace statement/selected/selected icon
138$menu-icon-selected-color: $color-brand1-6 !default;
139
140// Statement:Hover & Focused
141// ----------------------------------------
142
143/// background
144/// @namespace statement/hover/item
145$menu-background-hover: $color-fill1-2 !default;
146
147/// color
148/// @namespace statement/hover/text
149$menu-color-hover: $color-text1-4 !default;
150
151/// color
152/// @namespace statement/hover/arrow
153$menu-arrow-color-hover: $color-text1-4 !default;
154
155/// right
156/// @type number
157/// @namespace size/arrow
158$menu-arrow-right: 10px !default;
159
160/// color
161/// @namespace statement/hover/selected icon
162$menu-icon-selected-hover-color: $color-brand1-6 !default;
163
164// Statement:Disabled
165// ----------------------------------------
166
167/// color
168/// @namespace statement/disabled/text
169$menu-color-disabled: $color-text1-1 !default;
170
171
172/// select icon
173/// @namespace statement/normal
174/// @type icon
175$menu-select-icon-content: $icon-content-select !default;
176
177/// fold icon
178/// @namespace statement/normal
179/// @type icon
180$menu-fold-icon-content: $icon-content-arrow-down !default;
181
182/// unfold icon
183/// @namespace statement/normal
184/// @type icon
185$menu-unfold-icon-content: $icon-reset !default;
186
187/// popup fold icon
188/// @namespace statement/normal
189/// @type icon
190$menu-popupfold-icon-content: $icon-content-arrow-right !default;