_button.scss.html
9.39 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>The source code</title>
<link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="../resources/prettify/prettify.js"></script>
<style type="text/css">
.highlight { display: block; background-color: #ddd; }
</style>
<script type="text/javascript">
function highlight() {
document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
}
</script>
</head>
<body onload="prettyPrint(); highlight();">
<pre class="prettyprint lang-js">$button-arrow-size: 12px !default;
$button-split-size: 14px !default;
$button-icon-spacing: 4px !default;
$button-small-border-radius: 3px !default;
$button-small-border-width: 1px !default;
$button-small-padding: 2px !default;
$button-small-text-padding: 4px;
$button-small-font-size: ceil($font-size * .9) !default; //11px
$button-small-font-size-over: $button-small-font-size !default;
$button-small-font-size-focus: $button-small-font-size-over !default;
$button-small-font-size-pressed: $button-small-font-size !default;
$button-small-font-size-disabled: $button-small-font-size !default;
$button-small-font-weight: normal !default;
$button-small-font-weight-over: $button-small-font-weight !default;
$button-small-font-weight-focus: $button-small-font-weight-over !default;
$button-small-font-weight-pressed: $button-small-font-weight !default;
$button-small-font-weight-disabled: $button-small-font-weight !default;
$button-small-font-family: $font-family !default;
$button-small-font-family-over: $button-small-font-family !default;
$button-small-font-family-focus: $button-small-font-family-over !default;
$button-small-font-family-pressed: $button-small-font-family !default;
$button-small-font-family-disabled: $button-small-font-family !default;
$button-small-icon-size: 16px !default;
$button-medium-border-radius: 3px !default;
$button-medium-border-width: 1px !default;
$button-medium-padding: 3px !default;
$button-medium-text-padding: 3px !default;
$button-medium-font-size: ceil($font-size * .9) !default; //11px
$button-medium-font-size-over: $button-medium-font-size !default;
$button-medium-font-size-focus: $button-medium-font-size-over !default;
$button-medium-font-size-pressed: $button-medium-font-size !default;
$button-medium-font-size-disabled: $button-medium-font-size !default;
$button-medium-font-weight: normal !default;
$button-medium-font-weight-over: $button-medium-font-weight !default;
$button-medium-font-weight-focus: $button-medium-font-weight-over !default;
$button-medium-font-weight-pressed: $button-medium-font-weight !default;
$button-medium-font-weight-disabled: $button-medium-font-weight !default;
$button-medium-font-family: $font-family !default;
$button-medium-font-family-over: $button-medium-font-family !default;
$button-medium-font-family-focus: $button-medium-font-family-over !default;
$button-medium-font-family-pressed: $button-medium-font-family !default;
$button-medium-font-family-disabled: $button-medium-font-family !default;
$button-medium-icon-size: 24px !default;
$button-large-border-radius: 3px !default;
$button-large-border-width: 1px !default;
$button-large-padding: 3px !default;
$button-large-text-padding: 3px !default;
$button-large-font-size: ceil($font-size * .9) !default; //11px
$button-large-font-size-over: $button-large-font-size !default;
$button-large-font-size-focus: $button-large-font-size-over !default;
$button-large-font-size-pressed: $button-large-font-size !default;
$button-large-font-size-disabled: $button-large-font-size !default;
$button-large-font-weight: normal !default;
$button-large-font-weight-over: $button-large-font-weight !default;
$button-large-font-weight-focus: $button-large-font-weight-over !default;
$button-large-font-weight-pressed: $button-large-font-weight !default;
$button-large-font-weight-disabled: $button-large-font-weight !default;
$button-large-font-family: $font-family !default;
$button-large-font-family-over: $button-large-font-family !default;
$button-large-font-family-focus: $button-large-font-family-over !default;
$button-large-font-family-pressed: $button-large-font-family !default;
$button-large-font-family-disabled: $button-large-font-family !default;
$button-large-icon-size: 32px !default;
//base colors for the default button
$button-default-base-color: adjust-color($neutral-color, $hue: 0deg, $saturation: -55.556%, $lightness: 12.745%) !default; //F7F7F7
$button-default-base-color-over: adjust-color($base-color, $hue: -6.667deg, $saturation: 44.444%, $lightness: 10.588%) !default; //E4F3FF
$button-default-base-color-focus: $button-default-base-color-over !default;
$button-default-base-color-pressed: adjust-color($base-color, $hue: -0.725deg, $saturation: -9.556%, $lightness: -3.725%) !default; //B6CBE4
$button-default-base-color-disabled: adjust-color($base-color, $hue: 0deg, $saturation: -55.556%, $lightness: 12.745%) !default; //F7F7F7
$button-default-border-color: adjust-color($button-default-base-color, $hue: 0deg, $saturation: 0%, $lightness: -18.039%) !default;
$button-default-border-color-over: adjust-color($button-default-base-color-over, $hue: 8.177deg, $saturation: -28.283%, $lightness: -12.745%) !default;
$button-default-border-color-focus: $button-default-border-color-over !default;
$button-default-border-color-pressed: adjust-color($button-default-base-color-pressed, $hue: 2.317deg, $saturation: 6.756%, $lightness: -5.294%) !default;
$button-default-border-color-disabled: adjust-color($button-default-base-color-disabled, $hue: 0deg, $saturation: 0%, $lightness: -8.627%) !default;
$button-default-background-color: $button-default-base-color !default;
$button-default-background-color-over: $button-default-base-color-over !default;
$button-default-background-color-focus: $button-default-background-color-over !default;
$button-default-background-color-pressed: $button-default-base-color-pressed !default;
$button-default-background-color-disabled: $button-default-base-color-disabled !default;
$button-default-background-gradient: 'glossy-button' !default;
$button-default-background-gradient-over: 'glossy-button-over' !default;
$button-default-background-gradient-focus: $button-default-background-gradient-over !default;
$button-default-background-gradient-pressed: 'glossy-button-pressed' !default;
$button-default-background-gradient-disabled: 'glossy-button-disabled' !default;
$button-default-background-gradient-color-stops: null !default;
$button-default-background-gradient-color-stops-over: $button-default-background-gradient-color-stops !default;
$button-default-background-gradient-color-stops-focus: $button-default-background-gradient-color-stops-over !default;
$button-default-background-gradient-color-stops-pressed: $button-default-background-gradient-color-stops !default;
$button-default-background-gradient-color-stops-disabled: $button-default-background-gradient-color-stops !default;
$button-default-color: #333 !default;
$button-default-color-over: $button-default-color !default;
$button-default-color-focus: $button-default-color-over !default;
$button-default-color-pressed: $button-default-color !default;
$button-default-color-disabled: lighten($button-default-color, 35) !default;
// Toolbar buttons
$button-toolbar-arrow-size: 12px !default;
$button-toolbar-split-size: 12px !default;
$button-toolbar-base-color: adjust-color($base-color, $hue: -213.333deg, $saturation: -55.556%, $lightness: 3.333%) !default;
$button-toolbar-border-color: transparent !default;
$button-toolbar-border-color-over: adjust-color($base-color, $hue: 0.084deg, $saturation: -9.891%, $lightness: -18.039%) !default;
$button-toolbar-border-color-focus: $button-toolbar-border-color-over !default;
$button-toolbar-border-color-pressed: adjust-color($base-color, $hue: 0.721deg, $saturation: -17.014%, $lightness: -21.765%) !default;
$button-toolbar-border-color-disabled: transparent !default;
$button-toolbar-background-color: transparent !default;
$button-toolbar-background-color-over: adjust-color($base-color, $hue: -5deg, $saturation: 44.444%, $lightness: 8.824%) !default;
$button-toolbar-background-color-focus: $button-toolbar-background-color-over !default;
$button-toolbar-background-color-pressed: adjust-color($base-color, $hue: -1.138deg, $saturation: -11.47%, $lightness: -2.353%) !default;
$button-toolbar-background-color-disabled: transparent !default;
$button-toolbar-background-gradient: null !default;
$button-toolbar-background-gradient-over: 'glossy-button-over' !default;
$button-toolbar-background-gradient-focus: $button-toolbar-background-gradient-over !default;
$button-toolbar-background-gradient-pressed: 'glossy-button-pressed' !default;
$button-toolbar-background-gradient-disabled: null !default;
$button-toolbar-background-gradient-color-stops: null !default;
$button-toolbar-background-gradient-color-stops-over: null !default;
$button-toolbar-background-gradient-color-stops-focus: $button-toolbar-background-gradient-color-stops-over !default;
$button-toolbar-background-gradient-color-stops-pressed: null !default;
$button-toolbar-background-gradient-color-stops-disabled: null !default;
$button-toolbar-color: #333 !default;
$button-toolbar-color-over: $button-toolbar-color !default;
$button-toolbar-color-focus: $button-toolbar-color-over !default;
$button-toolbar-color-pressed: $button-toolbar-color !default;
$button-toolbar-color-disabled: lighten($button-toolbar-color, 35) !default;
</pre>
</body>
</html>