Dotclear

source: admin/style/scss/partials/_buttons.scss @ 3465:7aa33f56eb4b

Revision 3465:7aa33f56eb4b, 5.4 KB checked in by franck <carnet.franck.paul@…>, 9 years ago (diff)

Fix vertical position of pseudo-button a element

Line 
1/* Removes inner padding and border in FF3+  - Knacss */
2
3button::-moz-focus-inner,
4input[type=button]::-moz-focus-inner,
5input[type=reset]::-moz-focus-inner,
6input[type=submit]::-moz-focus-inner {
7     border: 0;
8     padding: 0;
9}
10
11
12/* tous les boutons */
13
14button,
15a.button,
16input[type=button],
17input[type=reset],
18input[type=submit] {
19     border: 1px solid #ccc;
20     font-family: $sans-serif-input;
21     padding: 3px 10px;
22     line-height: normal !important;
23     display: inline-block;
24     font-size: 100%;
25     text-align: center;
26     text-decoration: none;
27     cursor: pointer;
28     position: relative;
29     box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
30     border-style: solid;
31     border-width: 1px;
32}
33
34a.button {
35     vertical-align: middle;
36}
37
38button,
39input[type=button],
40input[type=reset],
41input[type=submit] {
42     -webkit-appearance: button;
43}
44
45
46/* Boutons javascript (dépliage/repliage, …) */
47
48.void-btn {
49     border: none;
50     border-radius: 0;
51     padding: 0;
52}
53
54
55/* validation */
56
57input[type=submit],
58button[type=submit],
59a.button.submit,
60button.submit,
61input.button.start {
62     color: #fff;
63     background-color: #25a6e1;
64     @include background-image(linear-gradient(to bottom, #25a6e1, #188bc0));
65     border-color: #25a6e1;
66     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
67}
68
69input[type=submit]:hover,
70input[type=submit]:focus,
71button[type=submit]:hover,
72button[type=submit]:focus,
73input.button.start:hover,
74input.button.start:focus,
75button.submit:hover,
76button.submit:focus,
77a.button.submit:hover,
78a.button.submit:focus {
79     background-color: #188bc0;
80     @include background-image(linear-gradient(to bottom, #188bc0, #25a6e1));
81     border-color: #188bc0;
82}
83
84
85/* suppression, reset, "neutres" fond gris */
86
87button,
88input[type=button],
89input.button,
90input[type=reset],
91input[type=submit].reset,
92input.reset,
93input[type=submit].delete,
94input.delete,
95a.button,
96a.button.delete,
97a.button.reset {
98     color: #000;
99     background-color: #eaeaea;
100     @include background-image(linear-gradient(to bottom, #f9f9f9, #eaeaea));
101     background-repeat: repeat-x;
102     border-color: #dfdfdf #dfdfdf #c5c5c5;
103     text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);
104}
105
106button:hover,
107input[type=button]:hover,
108input.button:hover,
109button:focus,
110input[type=button]:focus,
111input.button:focus,
112input[type=reset]:hover,
113input[type=submit].reset:hover,
114input.reset:hover,
115input[type=reset]:focus,
116input[type=submit].reset:focus,
117input.reset:focus,
118input[type=submit].delete:hover,
119input.delete:hover,
120input[type=submit].delete:focus,
121input.delete:focus,
122a.button.delete:hover,
123a.button.reset:hover,
124a.button:hover,
125a.button.delete:focus,
126a.button.reset:focus,
127a.button:focus {
128     background-color: #dadada;
129     @include background-image(linear-gradient(to bottom, #eaeaea, #dadada));
130     background-repeat: repeat-x;
131     border-color: #cccccc #cccccc #b5b5b5;
132}
133
134
135/* suppression */
136
137input[type=submit].delete,
138input.delete,
139button[type=submit].delete,
140button.delete,
141a.button.delete {
142     color: #900;
143}
144
145input[type=submit].delete:hover,
146input.delete:hover,
147button[type=submit].delete:hover,
148button.delete:hover,
149a.button.delete:hover,
150input[type=submit].delete:focus,
151input.delete:focus,
152button[type=submit].delete:focus,
153button.delete:focus,
154a.button.delete:focus {
155     color: #ffffff;
156     background-color: #b33630;
157     @include background-image(linear-gradient(to bottom, #dc5f59, #b33630));
158     background-repeat: repeat-x;
159     border-color: #cd504a;
160     text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
161}
162
163#info-box a.button,
164#info-box button {
165     padding: 0 .5em;
166     margin-left: 2em;
167}
168
169.button.add,
170button.add {
171     color: #000;
172     background-color: #bee74b;
173     @include background-image(linear-gradient(to bottom, #bee74b, #9bca1c));
174     border-color: #bee74b;
175     padding: .33em 1.33em .5em;
176     text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
177     //    font-weight: normal;
178     //    font-size: 1.16em;
179}
180
181.button.add:hover,
182.button.add:active,
183.button.add:focus,
184button.add:hover,
185button.add:active,
186button.add:focus {
187     background-color: #9bca1c;
188     @include background-image(linear-gradient(to bottom, #9bca1c, #bee74b));
189     border-color: #9bca1c;
190}
191
192.button-add:focus {
193     outline: dotted 1px;
194}
195
196
197/* paragraphe pour bouton Nouveau bidule */
198
199p.top-add {
200     text-align: right;
201     margin: 0;
202}
203
204
205/* disabled */
206
207input.disabled,
208input[type=submit].disabled,
209button.disabled,
210button[type=submit].disabled {
211     text-shadow: none;
212     color: #676e78;
213     background: #F5F5F5;
214     border: 1px solid #CCC;
215}
216
217input.disabled:hover,
218input[type=submit].disabled:hover,
219button.disabled:hover,
220button[type=submit].disabled:hover {
221     color: #676e78;
222     background: #eee;
223     border: 1px solid #CCC;
224}
225
226
227/* specific buttons */
228
229// Ajax or js buttons (action do not reload current page)
230.checkbox-helper,
231#gototop,
232.metaGetList,
233.metaGetMore,
234a.checkbox-helper,
235a#gototop,
236a.metaGetList,
237a.metaGetMore {
238     font-size: 0.825em;
239     color: #333;
240     text-shadow: none;
241     background: #fff;
242     box-shadow: none;
243     border: 1px solid #676e78;
244     margin-bottom: .25em;
245     text-align: center;
246     &:hover {
247          background: #a2cbe9;
248          box-shadow: none;
249          border: 1px solid #676e78;
250     }
251}
252
253#gototop {
254     display: none;
255     z-index: 1000;
256     position: fixed;
257     bottom: 0;
258     right: .5em;
259     width: 10em;
260     padding: .25em;
261     border-radius: .25em;
262     a,
263     a:link,
264     a:hover,
265     a:active {
266          color: #333;
267          background: transparent;
268          border: none;
269     }
270}
271
272.metaRemove,
273.addMeta button:not(.metaGetMore),
274.addMeta a:not(.metaGetMore) {
275     border: none;
276     border-radius: 0;
277     padding: 0;
278     background: none;
279}
280
281.addMeta button:not(.metaGetMore),
282.addMeta a:not(.metaGetMore) {
283     text-shadow: initial;
284     box-shadow: initial;
285     margin-bottom: 2px;
286     &:hover,
287     &:focus {
288          background: #fc0;
289     }
290}
Note: See TracBrowser for help on using the repository browser.

Sites map