handy-css-rails 0.0.4 → 0.0.5
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.
- checksums.yaml +7 -0
- data/lib/handy-css-rails/version.rb +1 -1
- data/vendor/assets/stylesheets/handyCSS.backdrops.css +433 -327
- data/vendor/assets/stylesheets/handyCSS.box.css +53 -718
- data/vendor/assets/stylesheets/handyCSS.css +859 -1680
- metadata +10 -14
@@ -1,5 +1,5 @@
|
|
1
1
|
/* ========================================================
|
2
|
-
*
|
2
|
+
* handycss.backdrops.css v0.0.1
|
3
3
|
* https://github.com/kpvarma/handyCSS
|
4
4
|
* ========================================================
|
5
5
|
* Copyright 2013 VarmaLabs
|
@@ -20,11 +20,12 @@
|
|
20
20
|
#backdrop-holder {
|
21
21
|
background-size: cover;
|
22
22
|
background-repeat: no-repeat;
|
23
|
-
/*
|
23
|
+
/* color: inherit;*/
|
24
24
|
min-height: 800px;
|
25
25
|
position: fixed;
|
26
26
|
width: 100%;
|
27
|
-
z-index: -1;
|
27
|
+
z-index: -1;
|
28
|
+
}
|
28
29
|
|
29
30
|
/* Picture based backdrops */
|
30
31
|
.backdrop-picture-mountains {
|
@@ -32,132 +33,149 @@
|
|
32
33
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #0066cc), color-stop(100%, #0066cc));
|
33
34
|
background-image: -webkit-linear-gradient(#0066cc, #0066cc);
|
34
35
|
background-image: linear-gradient(#0066cc, #0066cc);
|
35
|
-
background-image: url(../images/backdrops/pictures/mountains.jpg);
|
36
|
+
background-image: url(../images/backdrops/pictures/mountains.jpg);
|
37
|
+
}
|
36
38
|
|
37
39
|
.backdrop-picture-wood {
|
38
40
|
background-color: #663300;
|
39
|
-
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #663300), color-stop(100%,
|
40
|
-
background-image: -webkit-linear-gradient(#663300,
|
41
|
-
background-image: linear-gradient(#663300,
|
42
|
-
background-image: url(../images/backdrops/pictures/wood.jpg);
|
41
|
+
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #663300), color-stop(100%, #000000));
|
42
|
+
background-image: -webkit-linear-gradient(#663300, #000000);
|
43
|
+
background-image: linear-gradient(#663300, #000000);
|
44
|
+
background-image: url(../images/backdrops/pictures/wood.jpg);
|
45
|
+
}
|
43
46
|
|
44
47
|
.backdrop-picture-beach {
|
45
48
|
background-color: #0099cc;
|
46
49
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #0099cc), color-stop(100%, #cccccc));
|
47
50
|
background-image: -webkit-linear-gradient(#0099cc, #cccccc);
|
48
51
|
background-image: linear-gradient(#0099cc, #cccccc);
|
49
|
-
background-image: url(../images/backdrops/pictures/beach.jpg);
|
52
|
+
background-image: url(../images/backdrops/pictures/beach.jpg);
|
53
|
+
}
|
50
54
|
|
51
55
|
.backdrop-picture-ocean {
|
52
56
|
background-color: #3399cc;
|
53
57
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3399cc), color-stop(100%, #99ccff));
|
54
58
|
background-image: -webkit-linear-gradient(#3399cc, #99ccff);
|
55
59
|
background-image: linear-gradient(#3399cc, #99ccff);
|
56
|
-
background-image: url(../images/backdrops/pictures/ocean.jpg);
|
60
|
+
background-image: url(../images/backdrops/pictures/ocean.jpg);
|
61
|
+
}
|
57
62
|
|
58
63
|
.backdrop-picture-treetops {
|
59
64
|
background-color: #6699cc;
|
60
65
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #6699cc), color-stop(100%, #006699));
|
61
66
|
background-image: -webkit-linear-gradient(#6699cc, #006699);
|
62
67
|
background-image: linear-gradient(#6699cc, #006699);
|
63
|
-
background-image: url(../images/backdrops/pictures/treetops.jpg);
|
68
|
+
background-image: url(../images/backdrops/pictures/treetops.jpg);
|
69
|
+
}
|
64
70
|
|
65
71
|
.backdrop-picture-desk {
|
66
72
|
background-color: #563b26;
|
67
73
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #563b26), color-stop(100%, #663333));
|
68
74
|
background-image: -webkit-linear-gradient(#563b26, #663333);
|
69
75
|
background-image: linear-gradient(#563b26, #663333);
|
70
|
-
background-image: url(../images/backdrops/pictures/desk.jpg);
|
76
|
+
background-image: url(../images/backdrops/pictures/desk.jpg);
|
77
|
+
}
|
71
78
|
|
72
79
|
.backdrop-picture-turf {
|
73
80
|
background-color: #339900;
|
74
81
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #339900), color-stop(100%, #336600));
|
75
82
|
background-image: -webkit-linear-gradient(#339900, #336600);
|
76
83
|
background-image: linear-gradient(#339900, #336600);
|
77
|
-
background-image: url(../images/backdrops/pictures/turf.jpg);
|
84
|
+
background-image: url(../images/backdrops/pictures/turf.jpg);
|
85
|
+
}
|
78
86
|
|
79
87
|
.backdrop-picture-grafitti {
|
80
|
-
background-color:
|
81
|
-
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,
|
82
|
-
background-image: -webkit-linear-gradient(
|
83
|
-
background-image: linear-gradient(
|
84
|
-
background-image: url(../images/backdrops/pictures/grafitti.jpg);
|
88
|
+
background-color: #000000;
|
89
|
+
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #000000), color-stop(100%, #000000));
|
90
|
+
background-image: -webkit-linear-gradient(#000000, #000000);
|
91
|
+
background-image: linear-gradient(#000000, #000000);
|
92
|
+
background-image: url(../images/backdrops/pictures/grafitti.jpg);
|
93
|
+
}
|
85
94
|
|
86
95
|
.backdrop-picture-pebbles {
|
87
96
|
background-color: #666666;
|
88
97
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #666666), color-stop(100%, #333333));
|
89
98
|
background-image: -webkit-linear-gradient(#666666, #333333);
|
90
99
|
background-image: linear-gradient(#666666, #333333);
|
91
|
-
background-image: url(../images/backdrops/pictures/pebbles.jpg);
|
100
|
+
background-image: url(../images/backdrops/pictures/pebbles.jpg);
|
101
|
+
}
|
92
102
|
|
93
103
|
.backdrop-picture-venus {
|
94
|
-
background-color:
|
95
|
-
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,
|
96
|
-
background-image: -webkit-linear-gradient(
|
97
|
-
background-image: linear-gradient(
|
98
|
-
background-image: url(../images/backdrops/pictures/venus.jpg);
|
104
|
+
background-color: #000;
|
105
|
+
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #000), color-stop(100%, #000));
|
106
|
+
background-image: -webkit-linear-gradient(#000, #000);
|
107
|
+
background-image: linear-gradient(#000, #000);
|
108
|
+
background-image: url(../images/backdrops/pictures/venus.jpg);
|
109
|
+
}
|
99
110
|
|
100
111
|
.backdrop-picture-octopus {
|
101
|
-
background-color:
|
102
|
-
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,
|
103
|
-
background-image: -webkit-linear-gradient(
|
104
|
-
background-image: linear-gradient(
|
105
|
-
background-image: url(../images/backdrops/pictures/octopus.jpg);
|
112
|
+
background-color: #000;
|
113
|
+
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #000), color-stop(100%, #000));
|
114
|
+
background-image: -webkit-linear-gradient(#000, #000);
|
115
|
+
background-image: linear-gradient(#000, #000);
|
116
|
+
background-image: url(../images/backdrops/pictures/octopus.jpg);
|
117
|
+
}
|
106
118
|
|
107
119
|
.backdrop-picture-ruby {
|
108
120
|
background-color: #990000;
|
109
121
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #990000), color-stop(100%, #990000));
|
110
122
|
background-image: -webkit-linear-gradient(#990000, #990000);
|
111
123
|
background-image: linear-gradient(#990000, #990000);
|
112
|
-
background-image: url(../images/backdrops/pictures/ruby.jpg);
|
124
|
+
background-image: url(../images/backdrops/pictures/ruby.jpg);
|
125
|
+
}
|
113
126
|
|
114
127
|
.backdrop-picture-apple {
|
115
128
|
background-color: #333333;
|
116
129
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #333333));
|
117
130
|
background-image: -webkit-linear-gradient(#333333, #333333);
|
118
131
|
background-image: linear-gradient(#333333, #333333);
|
119
|
-
background-image: url(../images/backdrops/pictures/apple.jpg);
|
132
|
+
background-image: url(../images/backdrops/pictures/apple.jpg);
|
133
|
+
}
|
120
134
|
|
121
135
|
.backdrop-picture-ror1 {
|
122
136
|
background-color: #000033;
|
123
137
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #000033), color-stop(100%, #000033));
|
124
138
|
background-image: -webkit-linear-gradient(#000033, #000033);
|
125
139
|
background-image: linear-gradient(#000033, #000033);
|
126
|
-
background-image: url(../images/backdrops/pictures/ror1.jpg);
|
140
|
+
background-image: url(../images/backdrops/pictures/ror1.jpg);
|
141
|
+
}
|
127
142
|
|
128
143
|
.backdrop-picture-ror2 {
|
129
144
|
background-color: #990033;
|
130
145
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #990033), color-stop(100%, #990033));
|
131
146
|
background-image: -webkit-linear-gradient(#990033, #990033);
|
132
147
|
background-image: linear-gradient(#990033, #990033);
|
133
|
-
background-image: url(../images/backdrops/pictures/ror2.jpg);
|
148
|
+
background-image: url(../images/backdrops/pictures/ror2.jpg);
|
149
|
+
}
|
134
150
|
|
135
151
|
.backdrop-picture-ror3 {
|
136
|
-
background-color:
|
137
|
-
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,
|
138
|
-
background-image: -webkit-linear-gradient(
|
139
|
-
background-image: linear-gradient(
|
140
|
-
background-image: url(../images/backdrops/pictures/ror3.jpg);
|
152
|
+
background-color: #000;
|
153
|
+
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #000), color-stop(100%, #000));
|
154
|
+
background-image: -webkit-linear-gradient(#000, #000);
|
155
|
+
background-image: linear-gradient(#000, #000);
|
156
|
+
background-image: url(../images/backdrops/pictures/ror3.jpg);
|
157
|
+
}
|
141
158
|
|
142
159
|
.backdrop-picture-ror4 {
|
143
160
|
background-color: #3366cc;
|
144
161
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3366cc), color-stop(100%, #3366cc));
|
145
162
|
background-image: -webkit-linear-gradient(#3366cc, #3366cc);
|
146
163
|
background-image: linear-gradient(#3366cc, #3366cc);
|
147
|
-
background-image: url(../images/backdrops/pictures/ror4.jpg);
|
164
|
+
background-image: url(../images/backdrops/pictures/ror4.jpg);
|
165
|
+
}
|
148
166
|
|
149
167
|
/* Add a new image based theme here.
|
150
|
-
|
151
|
-
|
152
|
-
|
153
|
-
|
168
|
+
.backdrop-picture-name {
|
169
|
+
@include linear-gradient(#topColor, #botomColor);
|
170
|
+
background-image: url(../images/backdrops/pictures/image-name.jpg);
|
171
|
+
}
|
154
172
|
Don't forget to add the image to the above mentioned folder.
|
155
173
|
Now you can use
|
156
|
-
|
157
|
-
|
158
|
-
|
159
|
-
|
160
|
-
|
174
|
+
<body class="backdrop-picture theme-default">
|
175
|
+
<div id="backdrop-holder" class="backdrop-picture-image-name">
|
176
|
+
Content Goes here.
|
177
|
+
</div>
|
178
|
+
</body>
|
161
179
|
*/
|
162
180
|
/* Pattern based backdrops */
|
163
181
|
.backdrop-pattern #backdrop-holder::after {
|
@@ -168,7 +186,8 @@
|
|
168
186
|
right: 0;
|
169
187
|
bottom: 0;
|
170
188
|
left: 0;
|
171
|
-
opacity: 0.1;
|
189
|
+
opacity: 0.1;
|
190
|
+
}
|
172
191
|
|
173
192
|
/*[class*="backdrop-pattern-preview-"] { opacity: 0.1; }*/
|
174
193
|
.backdrop-pattern .backdrop-pattern-01::after, .backdrop-pattern-preview-01::after {
|
@@ -176,85 +195,95 @@
|
|
176
195
|
background: url(../images/backdrops/patterns/01.png) repeat center center;
|
177
196
|
display: block;
|
178
197
|
opacity: 0.1;
|
179
|
-
height: 100%;
|
198
|
+
height: 100%;
|
199
|
+
}
|
180
200
|
|
181
201
|
.backdrop-pattern .backdrop-pattern-02::after, .backdrop-pattern-preview-02::after {
|
182
202
|
content: '';
|
183
203
|
background: url(../images/backdrops/patterns/02.png) repeat center center;
|
184
204
|
display: block;
|
185
205
|
opacity: 0.1;
|
186
|
-
height: 100%;
|
206
|
+
height: 100%;
|
207
|
+
}
|
187
208
|
|
188
209
|
.backdrop-pattern .backdrop-pattern-03::after, .backdrop-pattern-preview-03::after {
|
189
210
|
content: '';
|
190
211
|
background: url(../images/backdrops/patterns/03.png) repeat center center;
|
191
212
|
display: block;
|
192
213
|
opacity: 0.1;
|
193
|
-
height: 100%;
|
214
|
+
height: 100%;
|
215
|
+
}
|
194
216
|
|
195
217
|
.backdrop-pattern .backdrop-pattern-04::after, .backdrop-pattern-preview-04::after {
|
196
218
|
content: '';
|
197
219
|
background: url(../images/backdrops/patterns/04.png) repeat center center;
|
198
220
|
display: block;
|
199
221
|
opacity: 0.1;
|
200
|
-
height: 100%;
|
222
|
+
height: 100%;
|
223
|
+
}
|
201
224
|
|
202
225
|
.backdrop-pattern .backdrop-pattern-05::after, .backdrop-pattern-preview-05::after {
|
203
226
|
content: '';
|
204
227
|
background: url(../images/backdrops/patterns/05.png) repeat center center;
|
205
228
|
display: block;
|
206
229
|
opacity: 0.1;
|
207
|
-
height: 100%;
|
230
|
+
height: 100%;
|
231
|
+
}
|
208
232
|
|
209
233
|
.backdrop-pattern .backdrop-pattern-06::after, .backdrop-pattern-preview-06::after {
|
210
234
|
content: '';
|
211
235
|
background: url(../images/backdrops/patterns/06.png) repeat center center;
|
212
236
|
display: block;
|
213
237
|
opacity: 0.1;
|
214
|
-
height: 100%;
|
238
|
+
height: 100%;
|
239
|
+
}
|
215
240
|
|
216
241
|
.backdrop-pattern .backdrop-pattern-07::after, .backdrop-pattern-preview-07::after {
|
217
242
|
content: '';
|
218
243
|
background: url(../images/backdrops/patterns/07.png) repeat center center;
|
219
244
|
display: block;
|
220
245
|
opacity: 0.1;
|
221
|
-
height: 100%;
|
246
|
+
height: 100%;
|
247
|
+
}
|
222
248
|
|
223
249
|
.backdrop-pattern .backdrop-pattern-08::after, .backdrop-pattern-preview-08::after {
|
224
250
|
content: '';
|
225
251
|
background: url(../images/backdrops/patterns/08.png) repeat center center;
|
226
252
|
display: block;
|
227
253
|
opacity: 0.1;
|
228
|
-
height: 100%;
|
254
|
+
height: 100%;
|
255
|
+
}
|
229
256
|
|
230
257
|
.backdrop-pattern .backdrop-pattern-09::after, .backdrop-pattern-preview-09::after {
|
231
258
|
content: '';
|
232
259
|
background: url(../images/backdrops/patterns/09.png) repeat center center;
|
233
260
|
display: block;
|
234
261
|
opacity: 0.1;
|
235
|
-
height: 100%;
|
262
|
+
height: 100%;
|
263
|
+
}
|
236
264
|
|
237
265
|
.backdrop-pattern .backdrop-pattern-10::after, .backdrop-pattern-preview-10::after {
|
238
266
|
content: '';
|
239
267
|
background: url(../images/backdrops/patterns/10.png) repeat center center;
|
240
268
|
display: block;
|
241
269
|
opacity: 0.1;
|
242
|
-
height: 100%;
|
270
|
+
height: 100%;
|
271
|
+
}
|
243
272
|
|
244
273
|
/* Add a new dark colored gradient themes here.
|
245
274
|
.backdrop-pattern .backdrop-pattern-xxxx::after, .backdrop-pattern-preview-xxxx::after {
|
246
|
-
|
247
|
-
|
248
|
-
|
249
|
-
|
250
|
-
|
251
|
-
|
252
|
-
Now you can use
|
253
|
-
|
254
|
-
|
255
|
-
|
256
|
-
|
257
|
-
|
275
|
+
content: '';
|
276
|
+
background: url(../images/backdrops/patterns/xxxx.png) repeat center center;
|
277
|
+
display: block;
|
278
|
+
opacity: 0.1;
|
279
|
+
height: 100%;
|
280
|
+
}
|
281
|
+
Now you can use
|
282
|
+
<body class="backdrop-pattern theme-default">
|
283
|
+
<div id="backdrop-holder" class="backdrop-pattern-xxxx backdrop-pattern-some-shade">
|
284
|
+
Content Goes here.
|
285
|
+
</div>
|
286
|
+
</body>
|
258
287
|
*/
|
259
288
|
.backdrop-shade-bootstrap-violet, .backdrop-shade-preview-bootstrap-violet {
|
260
289
|
background-color: #6d3353;
|
@@ -263,238 +292,262 @@
|
|
263
292
|
background-image: -moz-linear-gradient(280deg, #020031, #6d3353);
|
264
293
|
background-image: -webkit-linear-gradient(280deg, #020031, #6d3353);
|
265
294
|
background-image: -o-linear-gradient(280deg, #020031, #6d3353);
|
266
|
-
background-image: linear, 280deg, #020031, #6d3353;
|
295
|
+
background-image: linear, 280deg, #020031, #6d3353;
|
296
|
+
}
|
267
297
|
|
268
298
|
.backdrop-shade-olive-green, .backdrop-shade-preview-olive-green {
|
269
299
|
background-color: darkOliveGreen;
|
270
|
-
background-color:
|
300
|
+
background-color: #fff;
|
271
301
|
background-repeat: repeat-x;
|
272
|
-
background-image: -moz-linear-gradient(280deg,
|
273
|
-
background-image: -webkit-linear-gradient(280deg,
|
274
|
-
background-image: -o-linear-gradient(280deg,
|
275
|
-
background-image: linear, 280deg,
|
302
|
+
background-image: -moz-linear-gradient(280deg, darkOliveGreen, #fff);
|
303
|
+
background-image: -webkit-linear-gradient(280deg, darkOliveGreen, #fff);
|
304
|
+
background-image: -o-linear-gradient(280deg, darkOliveGreen, #fff);
|
305
|
+
background-image: linear, 280deg, darkOliveGreen, #fff;
|
306
|
+
}
|
276
307
|
|
277
308
|
.backdrop-shade-goldern-red, .backdrop-shade-preview-goldern-red {
|
278
309
|
background-color: darkgoldenrod;
|
279
|
-
background-color:
|
310
|
+
background-color: #fff;
|
280
311
|
background-repeat: repeat-x;
|
281
|
-
background-image: -moz-linear-gradient(280deg, darkgoldenrod,
|
282
|
-
background-image: -webkit-linear-gradient(280deg, darkgoldenrod,
|
283
|
-
background-image: -o-linear-gradient(280deg, darkgoldenrod,
|
284
|
-
background-image: linear, 280deg, darkgoldenrod,
|
312
|
+
background-image: -moz-linear-gradient(280deg, darkgoldenrod, #fff);
|
313
|
+
background-image: -webkit-linear-gradient(280deg, darkgoldenrod, #fff);
|
314
|
+
background-image: -o-linear-gradient(280deg, darkgoldenrod, #fff);
|
315
|
+
background-image: linear, 280deg, darkgoldenrod, #fff;
|
316
|
+
}
|
285
317
|
|
286
318
|
.backdrop-shade-dark-green, .backdrop-shade-preview-dark-green {
|
287
319
|
background-color: darkGreen;
|
288
|
-
background-color:
|
320
|
+
background-color: #fff;
|
289
321
|
background-repeat: repeat-x;
|
290
|
-
background-image: -moz-linear-gradient(280deg,
|
291
|
-
background-image: -webkit-linear-gradient(280deg,
|
292
|
-
background-image: -o-linear-gradient(280deg,
|
293
|
-
background-image: linear, 280deg,
|
322
|
+
background-image: -moz-linear-gradient(280deg, darkGreen, #fff);
|
323
|
+
background-image: -webkit-linear-gradient(280deg, darkGreen, #fff);
|
324
|
+
background-image: -o-linear-gradient(280deg, darkGreen, #fff);
|
325
|
+
background-image: linear, 280deg, darkGreen, #fff;
|
326
|
+
}
|
294
327
|
|
295
328
|
.backdrop-shade-dark-red, .backdrop-shade-preview-dark-red {
|
296
329
|
background-color: darkRed;
|
297
|
-
background-color:
|
330
|
+
background-color: #fff;
|
298
331
|
background-repeat: repeat-x;
|
299
|
-
background-image: -moz-linear-gradient(280deg,
|
300
|
-
background-image: -webkit-linear-gradient(280deg,
|
301
|
-
background-image: -o-linear-gradient(280deg,
|
302
|
-
background-image: linear, 280deg,
|
332
|
+
background-image: -moz-linear-gradient(280deg, darkRed, #fff);
|
333
|
+
background-image: -webkit-linear-gradient(280deg, darkRed, #fff);
|
334
|
+
background-image: -o-linear-gradient(280deg, darkRed, #fff);
|
335
|
+
background-image: linear, 280deg, darkRed, #fff;
|
336
|
+
}
|
303
337
|
|
304
338
|
.backdrop-shade-dark-salmon, .backdrop-shade-preview-dark-salmon {
|
305
339
|
background-color: darkSalmon;
|
306
|
-
background-color:
|
340
|
+
background-color: #fff;
|
307
341
|
background-repeat: repeat-x;
|
308
|
-
background-image: -moz-linear-gradient(280deg,
|
309
|
-
background-image: -webkit-linear-gradient(280deg,
|
310
|
-
background-image: -o-linear-gradient(280deg,
|
311
|
-
background-image: linear, 280deg,
|
342
|
+
background-image: -moz-linear-gradient(280deg, darkSalmon, #fff);
|
343
|
+
background-image: -webkit-linear-gradient(280deg, darkSalmon, #fff);
|
344
|
+
background-image: -o-linear-gradient(280deg, darkSalmon, #fff);
|
345
|
+
background-image: linear, 280deg, darkSalmon, #fff;
|
346
|
+
}
|
312
347
|
|
313
348
|
.backdrop-shade-dark-grey, .backdrop-shade-preview-dark-grey {
|
314
349
|
background-color: darkGray;
|
315
|
-
background-color:
|
350
|
+
background-color: #fff;
|
316
351
|
background-repeat: repeat-x;
|
317
|
-
background-image: -moz-linear-gradient(280deg,
|
318
|
-
background-image: -webkit-linear-gradient(280deg,
|
319
|
-
background-image: -o-linear-gradient(280deg,
|
320
|
-
background-image: linear, 280deg,
|
352
|
+
background-image: -moz-linear-gradient(280deg, darkGray, #fff);
|
353
|
+
background-image: -webkit-linear-gradient(280deg, darkGray, #fff);
|
354
|
+
background-image: -o-linear-gradient(280deg, darkGray, #fff);
|
355
|
+
background-image: linear, 280deg, darkGray, #fff;
|
356
|
+
}
|
321
357
|
|
322
358
|
.backdrop-shade-slate-grey, .backdrop-shade-preview-slate-grey {
|
323
359
|
background-color: SlateGrey;
|
324
|
-
background-color:
|
360
|
+
background-color: #fff;
|
325
361
|
background-repeat: repeat-x;
|
326
|
-
background-image: -moz-linear-gradient(280deg,
|
327
|
-
background-image: -webkit-linear-gradient(280deg,
|
328
|
-
background-image: -o-linear-gradient(280deg,
|
329
|
-
background-image: linear, 280deg,
|
362
|
+
background-image: -moz-linear-gradient(280deg, SlateGrey, #fff);
|
363
|
+
background-image: -webkit-linear-gradient(280deg, SlateGrey, #fff);
|
364
|
+
background-image: -o-linear-gradient(280deg, SlateGrey, #fff);
|
365
|
+
background-image: linear, 280deg, SlateGrey, #fff;
|
366
|
+
}
|
330
367
|
|
331
368
|
.backdrop-shade-dark-slate-grey, .backdrop-shade-preview-dark-slate-grey {
|
332
369
|
background-color: darkSlateGrey;
|
333
|
-
background-color:
|
370
|
+
background-color: #fff;
|
334
371
|
background-repeat: repeat-x;
|
335
|
-
background-image: -moz-linear-gradient(280deg,
|
336
|
-
background-image: -webkit-linear-gradient(280deg,
|
337
|
-
background-image: -o-linear-gradient(280deg,
|
338
|
-
background-image: linear, 280deg,
|
372
|
+
background-image: -moz-linear-gradient(280deg, darkSlateGrey, #fff);
|
373
|
+
background-image: -webkit-linear-gradient(280deg, darkSlateGrey, #fff);
|
374
|
+
background-image: -o-linear-gradient(280deg, darkSlateGrey, #fff);
|
375
|
+
background-image: linear, 280deg, darkSlateGrey, #fff;
|
376
|
+
}
|
339
377
|
|
340
378
|
.backdrop-shade-light-slate-grey, .backdrop-shade-preview-light-slate-grey {
|
341
379
|
background-color: lightSlateGrey;
|
342
|
-
background-color:
|
380
|
+
background-color: #fff;
|
343
381
|
background-repeat: repeat-x;
|
344
|
-
background-image: -moz-linear-gradient(280deg,
|
345
|
-
background-image: -webkit-linear-gradient(280deg,
|
346
|
-
background-image: -o-linear-gradient(280deg,
|
347
|
-
background-image: linear, 280deg,
|
382
|
+
background-image: -moz-linear-gradient(280deg, lightSlateGrey, #fff);
|
383
|
+
background-image: -webkit-linear-gradient(280deg, lightSlateGrey, #fff);
|
384
|
+
background-image: -o-linear-gradient(280deg, lightSlateGrey, #fff);
|
385
|
+
background-image: linear, 280deg, lightSlateGrey, #fff;
|
386
|
+
}
|
348
387
|
|
349
388
|
.backdrop-shade-dim-grey, .backdrop-shade-preview-dim-grey {
|
350
389
|
background-color: dimGrey;
|
351
|
-
background-color:
|
390
|
+
background-color: #fff;
|
352
391
|
background-repeat: repeat-x;
|
353
|
-
background-image: -moz-linear-gradient(280deg,
|
354
|
-
background-image: -webkit-linear-gradient(280deg,
|
355
|
-
background-image: -o-linear-gradient(280deg,
|
356
|
-
background-image: linear, 280deg,
|
392
|
+
background-image: -moz-linear-gradient(280deg, dimGrey, #fff);
|
393
|
+
background-image: -webkit-linear-gradient(280deg, dimGrey, #fff);
|
394
|
+
background-image: -o-linear-gradient(280deg, dimGrey, #fff);
|
395
|
+
background-image: linear, 280deg, dimGrey, #fff;
|
396
|
+
}
|
357
397
|
|
358
398
|
.backdrop-shade-steel-blue, .backdrop-shade-preview-steel-blue {
|
359
399
|
background-color: steelBlue;
|
360
|
-
background-color:
|
400
|
+
background-color: #fff;
|
361
401
|
background-repeat: repeat-x;
|
362
|
-
background-image: -moz-linear-gradient(280deg,
|
363
|
-
background-image: -webkit-linear-gradient(280deg,
|
364
|
-
background-image: -o-linear-gradient(280deg,
|
365
|
-
background-image: linear, 280deg,
|
402
|
+
background-image: -moz-linear-gradient(280deg, steelBlue, #fff);
|
403
|
+
background-image: -webkit-linear-gradient(280deg, steelBlue, #fff);
|
404
|
+
background-image: -o-linear-gradient(280deg, steelBlue, #fff);
|
405
|
+
background-image: linear, 280deg, steelBlue, #fff;
|
406
|
+
}
|
366
407
|
|
367
408
|
.backdrop-shade-dark-steel-blue, .backdrop-shade-preview-dark-steel-blue {
|
368
409
|
background-color: darkSteelBlue;
|
369
|
-
background-color:
|
410
|
+
background-color: #fff;
|
370
411
|
background-repeat: repeat-x;
|
371
|
-
background-image: -moz-linear-gradient(280deg, darkSteelBlue,
|
372
|
-
background-image: -webkit-linear-gradient(280deg, darkSteelBlue,
|
373
|
-
background-image: -o-linear-gradient(280deg, darkSteelBlue,
|
374
|
-
background-image: linear, 280deg, darkSteelBlue,
|
412
|
+
background-image: -moz-linear-gradient(280deg, darkSteelBlue, #fff);
|
413
|
+
background-image: -webkit-linear-gradient(280deg, darkSteelBlue, #fff);
|
414
|
+
background-image: -o-linear-gradient(280deg, darkSteelBlue, #fff);
|
415
|
+
background-image: linear, 280deg, darkSteelBlue, #fff;
|
416
|
+
}
|
375
417
|
|
376
418
|
.backdrop-shade-light-steel-blue, .backdrop-shade-preview-light-steel-blue {
|
377
419
|
background-color: lightSteelBlue;
|
378
|
-
background-color:
|
420
|
+
background-color: #fff;
|
379
421
|
background-repeat: repeat-x;
|
380
|
-
background-image: -moz-linear-gradient(280deg,
|
381
|
-
background-image: -webkit-linear-gradient(280deg,
|
382
|
-
background-image: -o-linear-gradient(280deg,
|
383
|
-
background-image: linear, 280deg,
|
422
|
+
background-image: -moz-linear-gradient(280deg, lightSteelBlue, #fff);
|
423
|
+
background-image: -webkit-linear-gradient(280deg, lightSteelBlue, #fff);
|
424
|
+
background-image: -o-linear-gradient(280deg, lightSteelBlue, #fff);
|
425
|
+
background-image: linear, 280deg, lightSteelBlue, #fff;
|
426
|
+
}
|
384
427
|
|
385
428
|
.backdrop-shade-cadet-blue, .backdrop-shade-preview-cadet-blue {
|
386
429
|
background-color: cadetBlue;
|
387
|
-
background-color:
|
430
|
+
background-color: #fff;
|
388
431
|
background-repeat: repeat-x;
|
389
|
-
background-image: -moz-linear-gradient(280deg,
|
390
|
-
background-image: -webkit-linear-gradient(280deg,
|
391
|
-
background-image: -o-linear-gradient(280deg,
|
392
|
-
background-image: linear, 280deg,
|
432
|
+
background-image: -moz-linear-gradient(280deg, cadetBlue, #fff);
|
433
|
+
background-image: -webkit-linear-gradient(280deg, cadetBlue, #fff);
|
434
|
+
background-image: -o-linear-gradient(280deg, cadetBlue, #fff);
|
435
|
+
background-image: linear, 280deg, cadetBlue, #fff;
|
436
|
+
}
|
393
437
|
|
394
438
|
.backdrop-shade-brown, .backdrop-shade-preview-brown {
|
395
439
|
background-color: brown;
|
396
|
-
background-color:
|
440
|
+
background-color: #fff;
|
397
441
|
background-repeat: repeat-x;
|
398
|
-
background-image: -moz-linear-gradient(280deg, brown,
|
399
|
-
background-image: -webkit-linear-gradient(280deg, brown,
|
400
|
-
background-image: -o-linear-gradient(280deg, brown,
|
401
|
-
background-image: linear, 280deg, brown,
|
442
|
+
background-image: -moz-linear-gradient(280deg, brown, #fff);
|
443
|
+
background-image: -webkit-linear-gradient(280deg, brown, #fff);
|
444
|
+
background-image: -o-linear-gradient(280deg, brown, #fff);
|
445
|
+
background-image: linear, 280deg, brown, #fff;
|
446
|
+
}
|
402
447
|
|
403
448
|
.backdrop-shade-maroon, .backdrop-shade-preview-maroon {
|
404
449
|
background-color: maroon;
|
405
|
-
background-color:
|
450
|
+
background-color: #fff;
|
406
451
|
background-repeat: repeat-x;
|
407
|
-
background-image: -moz-linear-gradient(280deg, maroon,
|
408
|
-
background-image: -webkit-linear-gradient(280deg, maroon,
|
409
|
-
background-image: -o-linear-gradient(280deg, maroon,
|
410
|
-
background-image: linear, 280deg, maroon,
|
452
|
+
background-image: -moz-linear-gradient(280deg, maroon, #fff);
|
453
|
+
background-image: -webkit-linear-gradient(280deg, maroon, #fff);
|
454
|
+
background-image: -o-linear-gradient(280deg, maroon, #fff);
|
455
|
+
background-image: linear, 280deg, maroon, #fff;
|
456
|
+
}
|
411
457
|
|
412
458
|
.backdrop-shade-forest-green, .backdrop-shade-preview-forest-green {
|
413
459
|
background-color: forestGreen;
|
414
|
-
background-color:
|
460
|
+
background-color: #fff;
|
415
461
|
background-repeat: repeat-x;
|
416
|
-
background-image: -moz-linear-gradient(280deg,
|
417
|
-
background-image: -webkit-linear-gradient(280deg,
|
418
|
-
background-image: -o-linear-gradient(280deg,
|
419
|
-
background-image: linear, 280deg,
|
462
|
+
background-image: -moz-linear-gradient(280deg, forestGreen, #fff);
|
463
|
+
background-image: -webkit-linear-gradient(280deg, forestGreen, #fff);
|
464
|
+
background-image: -o-linear-gradient(280deg, forestGreen, #fff);
|
465
|
+
background-image: linear, 280deg, forestGreen, #fff;
|
466
|
+
}
|
420
467
|
|
421
468
|
.backdrop-shade-peru, .backdrop-shade-preview-peru {
|
422
469
|
background-color: peru;
|
423
|
-
background-color:
|
470
|
+
background-color: #fff;
|
424
471
|
background-repeat: repeat-x;
|
425
|
-
background-image: -moz-linear-gradient(280deg, peru,
|
426
|
-
background-image: -webkit-linear-gradient(280deg, peru,
|
427
|
-
background-image: -o-linear-gradient(280deg, peru,
|
428
|
-
background-image: linear, 280deg, peru,
|
472
|
+
background-image: -moz-linear-gradient(280deg, peru, #fff);
|
473
|
+
background-image: -webkit-linear-gradient(280deg, peru, #fff);
|
474
|
+
background-image: -o-linear-gradient(280deg, peru, #fff);
|
475
|
+
background-image: linear, 280deg, peru, #fff;
|
476
|
+
}
|
429
477
|
|
430
478
|
.backdrop-shade-olive, .backdrop-shade-preview-olive {
|
431
479
|
background-color: olive;
|
432
|
-
background-color:
|
480
|
+
background-color: #fff;
|
433
481
|
background-repeat: repeat-x;
|
434
|
-
background-image: -moz-linear-gradient(280deg, olive,
|
435
|
-
background-image: -webkit-linear-gradient(280deg, olive,
|
436
|
-
background-image: -o-linear-gradient(280deg, olive,
|
437
|
-
background-image: linear, 280deg, olive,
|
482
|
+
background-image: -moz-linear-gradient(280deg, olive, #fff);
|
483
|
+
background-image: -webkit-linear-gradient(280deg, olive, #fff);
|
484
|
+
background-image: -o-linear-gradient(280deg, olive, #fff);
|
485
|
+
background-image: linear, 280deg, olive, #fff;
|
486
|
+
}
|
438
487
|
|
439
488
|
.backdrop-shade-olive-rab, .backdrop-shade-preview-olive-rab {
|
440
489
|
background-color: oliveRab;
|
441
|
-
background-color:
|
490
|
+
background-color: #fff;
|
442
491
|
background-repeat: repeat-x;
|
443
|
-
background-image: -moz-linear-gradient(280deg, oliveRab,
|
444
|
-
background-image: -webkit-linear-gradient(280deg, oliveRab,
|
445
|
-
background-image: -o-linear-gradient(280deg, oliveRab,
|
446
|
-
background-image: linear, 280deg, oliveRab,
|
492
|
+
background-image: -moz-linear-gradient(280deg, oliveRab, #fff);
|
493
|
+
background-image: -webkit-linear-gradient(280deg, oliveRab, #fff);
|
494
|
+
background-image: -o-linear-gradient(280deg, oliveRab, #fff);
|
495
|
+
background-image: linear, 280deg, oliveRab, #fff;
|
496
|
+
}
|
447
497
|
|
448
498
|
.backdrop-shade-indian-red, .backdrop-shade-preview-indian-red {
|
449
499
|
background-color: indianRed;
|
450
|
-
background-color:
|
500
|
+
background-color: #fff;
|
451
501
|
background-repeat: repeat-x;
|
452
|
-
background-image: -moz-linear-gradient(280deg,
|
453
|
-
background-image: -webkit-linear-gradient(280deg,
|
454
|
-
background-image: -o-linear-gradient(280deg,
|
455
|
-
background-image: linear, 280deg,
|
502
|
+
background-image: -moz-linear-gradient(280deg, indianRed, #fff);
|
503
|
+
background-image: -webkit-linear-gradient(280deg, indianRed, #fff);
|
504
|
+
background-image: -o-linear-gradient(280deg, indianRed, #fff);
|
505
|
+
background-image: linear, 280deg, indianRed, #fff;
|
506
|
+
}
|
456
507
|
|
457
508
|
.backdrop-shade-fire-brick, .backdrop-shade-preview-fire-brick {
|
458
509
|
background-color: fireBrick;
|
459
|
-
background-color:
|
510
|
+
background-color: #fff;
|
460
511
|
background-repeat: repeat-x;
|
461
|
-
background-image: -moz-linear-gradient(280deg,
|
462
|
-
background-image: -webkit-linear-gradient(280deg,
|
463
|
-
background-image: -o-linear-gradient(280deg,
|
464
|
-
background-image: linear, 280deg,
|
512
|
+
background-image: -moz-linear-gradient(280deg, fireBrick, #fff);
|
513
|
+
background-image: -webkit-linear-gradient(280deg, fireBrick, #fff);
|
514
|
+
background-image: -o-linear-gradient(280deg, fireBrick, #fff);
|
515
|
+
background-image: linear, 280deg, fireBrick, #fff;
|
516
|
+
}
|
465
517
|
|
466
518
|
.backdrop-shade-white-smoke, .backdrop-shade-preview-white-smoke {
|
467
519
|
background-color: whiteSmoke;
|
468
|
-
background-color:
|
520
|
+
background-color: #fff;
|
469
521
|
background-repeat: repeat-x;
|
470
|
-
background-image: -moz-linear-gradient(280deg,
|
471
|
-
background-image: -webkit-linear-gradient(280deg,
|
472
|
-
background-image: -o-linear-gradient(280deg,
|
473
|
-
background-image: linear, 280deg,
|
522
|
+
background-image: -moz-linear-gradient(280deg, whiteSmoke, #fff);
|
523
|
+
background-image: -webkit-linear-gradient(280deg, whiteSmoke, #fff);
|
524
|
+
background-image: -o-linear-gradient(280deg, whiteSmoke, #fff);
|
525
|
+
background-image: linear, 280deg, whiteSmoke, #fff;
|
526
|
+
}
|
474
527
|
|
475
528
|
/* Add a new dark colored gradient themes here.
|
476
529
|
.backdrop-shade-some-shade { background-color:some-shade;}
|
477
|
-
|
478
|
-
|
479
|
-
|
480
|
-
|
481
|
-
|
482
|
-
|
483
|
-
|
484
|
-
|
485
|
-
|
486
|
-
|
487
|
-
|
488
|
-
|
489
|
-
|
490
|
-
|
491
|
-
|
492
|
-
|
493
|
-
|
494
|
-
|
495
|
-
|
496
|
-
|
497
|
-
|
530
|
+
|
531
|
+
1.Now you can use without pattern or picture
|
532
|
+
<body class="theme-default">
|
533
|
+
<div id="backdrop-holder" class="backdrop-shade-olive-green">
|
534
|
+
Content Goes here.
|
535
|
+
</div>
|
536
|
+
</body>
|
537
|
+
|
538
|
+
2.Now you can use with pattern
|
539
|
+
<body class="backgrop-pattern backdrop-pattern-01 theme-default">
|
540
|
+
<div id="backdrop-holder" class="backdrop-shade-olive-green">
|
541
|
+
Content Goes here.
|
542
|
+
</div>
|
543
|
+
</body>
|
544
|
+
|
545
|
+
3.Now you can use with picture as a fallback background color
|
546
|
+
<body class="backdrop-picture theme-default">
|
547
|
+
<div id="backdrop-holder" class="backdrop-shade-olive-green backdrop-picture-mountains">
|
548
|
+
Content Goes here.
|
549
|
+
</div>
|
550
|
+
</body>
|
498
551
|
*/
|
499
552
|
.theme-default .palette.shadowed:hover {
|
500
553
|
-webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
|
@@ -503,7 +556,8 @@
|
|
503
556
|
-webkit-transition: all 0.5s ease;
|
504
557
|
-moz-transition: all 0.5s ease;
|
505
558
|
-o-transition: all 0.5s ease;
|
506
|
-
transition: all 0.5s ease;
|
559
|
+
transition: all 0.5s ease;
|
560
|
+
}
|
507
561
|
.theme-default .palette {
|
508
562
|
position: relative;
|
509
563
|
top: auto;
|
@@ -512,85 +566,98 @@
|
|
512
566
|
margin: 0px;
|
513
567
|
overflow: auto;
|
514
568
|
background-color: transparent;
|
515
|
-
*zoom: 1;
|
516
|
-
|
517
|
-
|
518
|
-
|
519
|
-
|
520
|
-
|
521
|
-
|
522
|
-
|
523
|
-
|
524
|
-
|
525
|
-
|
526
|
-
|
527
|
-
|
528
|
-
|
529
|
-
|
530
|
-
|
531
|
-
|
532
|
-
|
533
|
-
|
534
|
-
|
535
|
-
|
536
|
-
|
537
|
-
|
538
|
-
|
539
|
-
|
540
|
-
|
541
|
-
|
542
|
-
|
543
|
-
|
544
|
-
|
545
|
-
|
546
|
-
|
547
|
-
|
548
|
-
|
549
|
-
|
550
|
-
|
551
|
-
|
552
|
-
|
553
|
-
|
554
|
-
|
555
|
-
|
556
|
-
|
557
|
-
|
558
|
-
|
559
|
-
|
560
|
-
|
561
|
-
|
562
|
-
|
563
|
-
|
564
|
-
|
565
|
-
|
566
|
-
|
567
|
-
|
568
|
-
|
569
|
-
|
570
|
-
|
571
|
-
|
572
|
-
|
573
|
-
|
574
|
-
|
575
|
-
|
576
|
-
|
577
|
-
|
578
|
-
|
579
|
-
|
580
|
-
|
581
|
-
|
582
|
-
|
583
|
-
|
584
|
-
|
585
|
-
|
586
|
-
|
587
|
-
|
588
|
-
|
589
|
-
|
590
|
-
|
569
|
+
*zoom: 1;
|
570
|
+
}
|
571
|
+
.theme-default .palette:before, .theme-default .palette:after {
|
572
|
+
content: " ";
|
573
|
+
display: table;
|
574
|
+
}
|
575
|
+
.theme-default .palette:after {
|
576
|
+
clear: both;
|
577
|
+
}
|
578
|
+
.theme-default .palette.fixed {
|
579
|
+
position: fixed;
|
580
|
+
}
|
581
|
+
.theme-default .palette.bordered {
|
582
|
+
border: 1px solid #eee;
|
583
|
+
-webkit-background-clip: padding-box;
|
584
|
+
-moz-background-clip: padding-box;
|
585
|
+
background-clip: padding-box;
|
586
|
+
}
|
587
|
+
.theme-default .palette.rounded {
|
588
|
+
-webkit-border-radius: 6px;
|
589
|
+
-moz-border-radius: 6px;
|
590
|
+
border-radius: 6px;
|
591
|
+
}
|
592
|
+
.theme-default .palette .palette-header {
|
593
|
+
background-color: #fff;
|
594
|
+
padding: 9px 15px;
|
595
|
+
border-bottom: 1px solid #eee;
|
596
|
+
}
|
597
|
+
.theme-default .palette .palette-header.rounded {
|
598
|
+
-webkit-border-radius: 4px 4px 0px 0px;
|
599
|
+
-moz-border-radius: 4px 4px 0px 0px;
|
600
|
+
border-radius: 4px 4px 0px 0px;
|
601
|
+
}
|
602
|
+
.theme-default .palette .palette-header.bordered {
|
603
|
+
border-bottom: 1px solid #ddd;
|
604
|
+
-webkit-box-shadow: inset 0 1px 0 #ffffff;
|
605
|
+
-moz-box-shadow: inset 0 1px 0 #ffffff;
|
606
|
+
box-shadow: inset 0 1px 0 #ffffff;
|
607
|
+
}
|
608
|
+
.theme-default .palette .palette-body {
|
609
|
+
background-color: #fff;
|
610
|
+
overflow-y: auto;
|
611
|
+
padding: 15px;
|
612
|
+
}
|
613
|
+
.theme-default .palette .palette-footer {
|
614
|
+
padding: 14px 15px 15px;
|
615
|
+
margin-bottom: 0;
|
616
|
+
text-align: right;
|
617
|
+
background-color: #f5f5f5;
|
618
|
+
}
|
619
|
+
.theme-default .palette .palette-footer.rounded {
|
620
|
+
-webkit-border-radius: 0 0 6px 6px;
|
621
|
+
-moz-border-radius: 0 0 6px 6px;
|
622
|
+
border-radius: 0 0 6px 6px;
|
623
|
+
}
|
624
|
+
.theme-default .palette .palette-footer.bordered {
|
625
|
+
border-top: 1px solid #ddd;
|
626
|
+
-webkit-box-shadow: inset 0 1px 0 #ffffff;
|
627
|
+
-moz-box-shadow: inset 0 1px 0 #ffffff;
|
628
|
+
box-shadow: inset 0 1px 0 #ffffff;
|
629
|
+
}
|
630
|
+
|
631
|
+
/* .palette-content {
|
632
|
+
background-color: white;color:#4b4b4b;
|
633
|
+
:hover, .selected { background-color: #fff; }
|
634
|
+
}
|
635
|
+
.palette-outer {
|
636
|
+
background-color: white;color:#4b4b4b;
|
637
|
+
:hover, .selected { background-color: #fff; }
|
638
|
+
}
|
639
|
+
.palette-inner {
|
640
|
+
background-color: white;color:#4b4b4b;
|
641
|
+
:hover, .selected { background-color: #fff; }
|
642
|
+
}
|
643
|
+
.palette-token {
|
644
|
+
background-color: white;color:#4b4b4b;
|
645
|
+
a { color:#4b4b4b !important}
|
646
|
+
:hover, .selected { background-color: #fff; }
|
647
|
+
}
|
648
|
+
.palette-shadow {
|
649
|
+
-webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
|
650
|
+
-moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
|
651
|
+
box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
|
652
|
+
-webkit-transition: all 0.5s ease;
|
653
|
+
-moz-transition: all 0.5s ease;
|
654
|
+
-o-transition: all 0.5s ease;
|
655
|
+
transition: all 0.5s ease;
|
656
|
+
}
|
657
|
+
.palette-rounded { -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; }
|
591
658
|
}*/
|
592
659
|
/*
|
593
|
-
.theme-default
|
660
|
+
.theme-default
|
594
661
|
.theme-default .palette-bordered { border: 1px solid #c1c1c1; }
|
595
662
|
|
596
663
|
.theme-default .palette > h1, .theme-default .palette > h2, .theme-default .palette > h3, .theme-default .palette > h4, .theme-default .palette > h5, .theme-default .palette > h6 { margin: 10px 0; font-family: inherit; font-weight: bold; line-height: 20px; color: #4b4b4b; text-rendering: optimizelegibility; text-align:left; border-bottom:1px solid #c1c1c1; padding-bottom:20px; }
|
@@ -602,74 +669,92 @@
|
|
602
669
|
min-height: 20px;
|
603
670
|
padding: 10px;
|
604
671
|
margin-bottom: 20px;
|
605
|
-
background: transparent;
|
672
|
+
background: transparent;
|
673
|
+
}
|
606
674
|
|
607
675
|
/** Palette Outer **/
|
608
676
|
.theme-glass .palette-outer {
|
609
|
-
color: #fff;
|
677
|
+
color: #fff;
|
678
|
+
}
|
610
679
|
|
611
680
|
.contrast-light.theme-glass .palette-outer {
|
612
681
|
background: rgba(255, 255, 255, 0.2);
|
613
|
-
border: 1px solid rgba(255, 255, 255, 0.2);
|
682
|
+
border: 1px solid rgba(255, 255, 255, 0.2);
|
683
|
+
}
|
614
684
|
|
615
685
|
.contrast-light.theme-glass .palette-outer:hover, .contrast-light.theme-glass .palette-outer.selected {
|
616
|
-
border: 1px solid rgba(255, 255, 255, 0.4);
|
686
|
+
border: 1px solid rgba(255, 255, 255, 0.4);
|
687
|
+
}
|
617
688
|
|
618
689
|
.contrast-dark.theme-glass .palette-outer {
|
619
690
|
background: rgba(0, 0, 0, 0.4);
|
620
|
-
border: 1px solid rgba(0, 0, 0, 0.2);
|
691
|
+
border: 1px solid rgba(0, 0, 0, 0.2);
|
692
|
+
}
|
621
693
|
|
622
694
|
.contrast-dark.theme-glass .palette-outer:hover, .contrast-light.theme-glass .palette-outer.selected {
|
623
|
-
border: 1px solid rgba(0, 0, 0, 0.9);
|
695
|
+
border: 1px solid rgba(0, 0, 0, 0.9);
|
696
|
+
}
|
624
697
|
|
625
698
|
/** Palette Inner **/
|
626
699
|
.theme-glass .palette-inner {
|
627
700
|
background: rgba(255, 255, 255, 0.9);
|
628
|
-
color: #4B4B4B;
|
701
|
+
color: #4B4B4B;
|
702
|
+
}
|
629
703
|
|
630
704
|
.theme-glass .palette-inner:hover, .theme-glass .palette-inner.selected {
|
631
|
-
background-color: #fff;
|
705
|
+
background-color: #fff;
|
706
|
+
}
|
632
707
|
|
633
708
|
/** Palette Token **/
|
634
709
|
.theme-glass .palette-token {
|
635
710
|
background-color: rgba(255, 255, 255, 0.1);
|
636
|
-
color: #fff;
|
711
|
+
color: #fff;
|
712
|
+
}
|
637
713
|
|
638
714
|
.theme-glass .palette-token a {
|
639
|
-
color: #fff !important;
|
715
|
+
color: #fff !important;
|
716
|
+
}
|
640
717
|
|
641
718
|
.theme-glass .palette-token:hover, .theme-glass .palette-token.selected {
|
642
|
-
color: #fff;
|
719
|
+
color: #fff;
|
720
|
+
}
|
643
721
|
|
644
722
|
.contrast-light.theme-glass .palette-token {
|
645
723
|
background-color: rgba(255, 255, 255, 0.1);
|
646
|
-
border: 1px solid rgba(255, 255, 255, 0.1);
|
724
|
+
border: 1px solid rgba(255, 255, 255, 0.1);
|
725
|
+
}
|
647
726
|
|
648
727
|
.contrast-dark.theme-glass .palette-token {
|
649
728
|
background-color: rgba(0, 0, 0, 0.1);
|
650
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
729
|
+
border: 1px solid rgba(0, 0, 0, 0.1);
|
730
|
+
}
|
651
731
|
|
652
732
|
.contrast-light.theme-glass .palette-token:hover, .contrast-light.theme-glass .palette-token.selected {
|
653
733
|
background-color: rgba(255, 255, 255, 0.5);
|
654
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
734
|
+
border: 1px solid rgba(0, 0, 0, 0.1);
|
735
|
+
}
|
655
736
|
|
656
737
|
.contrast-dark.theme-glass .palette-token:hover, .contrast-light.theme-glass .palette-token.selected {
|
657
738
|
background-color: rgba(0, 0, 0, 0.5);
|
658
|
-
border: 1px solid rgba(255, 255, 255, 0.5);
|
739
|
+
border: 1px solid rgba(255, 255, 255, 0.5);
|
740
|
+
}
|
659
741
|
|
660
742
|
/** Palette Topup Classes **/
|
661
743
|
.theme-glass .palette-shadow {
|
662
744
|
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
|
663
745
|
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
|
664
|
-
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
|
746
|
+
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
|
747
|
+
}
|
665
748
|
|
666
749
|
.theme-glass .palette-rounded {
|
667
750
|
-webkit-border-radius: 4px;
|
668
751
|
-moz-border-radius: 4px;
|
669
|
-
border-radius: 4px;
|
752
|
+
border-radius: 4px;
|
753
|
+
}
|
670
754
|
|
671
755
|
.theme-glass .palette-bordered {
|
672
|
-
border: 1px solid #E3E3E3;
|
756
|
+
border: 1px solid #E3E3E3;
|
757
|
+
}
|
673
758
|
|
674
759
|
.theme-glass .palette > h1, .theme-glass .palette > h2, .theme-glass .palette > h3, .theme-glass .palette > h4, .theme-glass .palette > h5, .theme-glass .palette > h6 {
|
675
760
|
margin: 10px 0;
|
@@ -680,77 +765,98 @@
|
|
680
765
|
text-rendering: optimizelegibility;
|
681
766
|
text-align: left;
|
682
767
|
border-bottom: 1px solid #c1c1c1;
|
683
|
-
padding-bottom: 20px;
|
768
|
+
padding-bottom: 20px;
|
769
|
+
}
|
684
770
|
|
685
771
|
.theme-glass .palette > h4, .theme-glass .palette > h5, .theme-glass .palette > h6 {
|
686
|
-
padding-bottom: 10px;
|
772
|
+
padding-bottom: 10px;
|
773
|
+
}
|
687
774
|
|
688
775
|
.theme-glass .palette-inner > h1, .theme-glass .palette-inner > h2, .theme-glass .palette-inner > h3, .theme-glass .palette-inner > h4, .theme-glass .palette-inner > h5, .theme-glass .palette-inner > h6 {
|
689
|
-
color: #4b4b4b;
|
776
|
+
color: #4b4b4b;
|
777
|
+
}
|
690
778
|
|
691
779
|
.theme-glass .palette a:not(.close):not(.escape-color) {
|
692
780
|
color: #08C;
|
693
|
-
font-weight: bold;
|
781
|
+
font-weight: bold;
|
782
|
+
}
|
694
783
|
|
695
784
|
.theme-glass .palette a:not(.close):not(.escape-color):hover {
|
696
|
-
color: #005580;
|
785
|
+
color: #005580;
|
786
|
+
}
|
697
787
|
|
698
788
|
.theme-glass .palette a.title {
|
699
|
-
font-size: 18px;
|
789
|
+
font-size: 18px;
|
790
|
+
}
|
700
791
|
|
701
792
|
.theme-glass .palette a.sub-title {
|
702
|
-
font-size: 16px;
|
793
|
+
font-size: 16px;
|
794
|
+
}
|
703
795
|
|
704
796
|
.theme-glass .palette a.small-title {
|
705
|
-
font-size: 14px;
|
797
|
+
font-size: 14px;
|
798
|
+
}
|
706
799
|
|
707
800
|
.theme-glass .palette a.small-sub-title {
|
708
|
-
font-size: 13px;
|
801
|
+
font-size: 13px;
|
802
|
+
}
|
709
803
|
|
710
804
|
.theme-glass .palette a.tiny-title {
|
711
|
-
font-size: 12px;
|
805
|
+
font-size: 12px;
|
806
|
+
}
|
712
807
|
|
713
808
|
.theme-glass .palette .description {
|
714
809
|
color: #4b4b4b;
|
715
|
-
margin: 0px;
|
810
|
+
margin: 0px;
|
811
|
+
}
|
716
812
|
|
717
813
|
.theme-glass .palette .description > a.read-more {
|
718
814
|
font-size: 11px;
|
719
|
-
float: right;
|
815
|
+
float: right;
|
816
|
+
}
|
720
817
|
|
721
818
|
.theme-glass .palette a.author {
|
722
819
|
color: brown;
|
723
|
-
font-weight: bold !important;
|
820
|
+
font-weight: bold !important;
|
821
|
+
}
|
724
822
|
|
725
823
|
.theme-glass .palette .time, .theme-glass .palette .date, .theme-glass .palette .time-ago, .theme-glass .palette .date-time, .theme-glass .palette .display-time {
|
726
|
-
color: #898989;
|
824
|
+
color: #898989;
|
825
|
+
}
|
727
826
|
|
728
827
|
.theme-glass .palette a.right-heading-link {
|
729
828
|
float: right;
|
730
829
|
color: #fff;
|
731
830
|
font-style: underline;
|
732
|
-
font-size: 11px;
|
831
|
+
font-size: 11px;
|
832
|
+
}
|
733
833
|
|
734
834
|
/* Overriding simple form css for forms */
|
735
835
|
.theme-glass .palette .form-horizontal .control-group {
|
736
|
-
margin-bottom: 10px;
|
836
|
+
margin-bottom: 10px;
|
837
|
+
}
|
737
838
|
|
738
839
|
.theme-glass .palette .form-horizontal .help-block {
|
739
840
|
text-align: right;
|
740
|
-
color: #C1C1C1;
|
841
|
+
color: #C1C1C1;
|
842
|
+
}
|
741
843
|
|
742
844
|
.control-group.error > label, .control-group.error .help-block, .control-group.error .help-inline {
|
743
|
-
color: #ce817f;
|
845
|
+
color: #ce817f;
|
846
|
+
}
|
744
847
|
|
745
848
|
.theme-glass .palette .form-horizontal .help-block {
|
746
849
|
text-align: right;
|
747
|
-
color: #C1C1C1;
|
850
|
+
color: #C1C1C1;
|
851
|
+
}
|
748
852
|
|
749
853
|
.theme-glass .palette .form-horizontal .controls input {
|
750
|
-
width: 90%;
|
854
|
+
width: 90%;
|
855
|
+
}
|
751
856
|
|
752
857
|
.theme-glass .palette .form-horizontal .control-label {
|
753
|
-
color: #FFF;
|
858
|
+
color: #FFF;
|
859
|
+
}
|
754
860
|
|
755
861
|
/*.theme-default .palette { min-height: 20px;padding: 10px;margin-bottom: 20px;background: transparent; }
|
756
862
|
|
@@ -783,7 +889,7 @@
|
|
783
889
|
|
784
890
|
h1 > a.right-heading-link, h2 > a.right-heading-link, h3 > a.right-heading-link, h4 > a.right-heading-link, h5 > a.right-heading-link, h6 > a.right-heading-link {float:right;color:#898989;font-style:underline; font-size:11px;}
|
785
891
|
|
786
|
-
.theme-default .palette a:not(.close):not(.escape-color)
|
892
|
+
.theme-default .palette a:not(.close):not(.escape-color) {color:#4b4b4b;font-weight:bold;}
|
787
893
|
.theme-default .palette a:not(.close):not(.escape-color):hover {color:#005580;}
|
788
894
|
|
789
895
|
.lnk { color: #fff; }
|
@@ -793,7 +899,7 @@ h1 > a.right-heading-link, h2 > a.right-heading-link, h3 > a.right-heading-link,
|
|
793
899
|
.theme-default .palette .palette-inner a.title {color:#fff;}
|
794
900
|
.theme-default .palette .palette-inner a.title:hover {color:orange;}
|
795
901
|
|
796
|
-
.theme-default .palette a.sub-title {font-size:16px;}
|
902
|
+
.theme-default .palette a.sub-title {font-size:16px;}
|
797
903
|
.theme-default .palette .palette-inner a.sub-title {color:#fff;}
|
798
904
|
.theme-default .palette .palette-inner a.sub-title:hover {color:orange;}
|
799
905
|
|