root / snf-cyclades-app / synnefo / ui / new_ui / ui / stylesheets / font_custom.css @ e4a6c3b8
History | View | Annotate | Download (7.8 kB)
1 |
/* snf-font */
|
---|---|
2 |
|
3 |
@font-face {
|
4 |
font-family: "snf-font"; |
5 |
src:url("../fonts/snf-font.eot"); |
6 |
src:url("../fonts/snf-font.eot?#iefix") format("embedded-opentype"), |
7 |
url("../fonts/snf-font.woff") format("woff"), |
8 |
url("../fonts/snf-font.ttf") format("truetype"), |
9 |
url("../fonts/snf-font.svg#snf-font") format("svg"); |
10 |
font-weight: normal; |
11 |
font-style: normal; |
12 |
} |
13 |
|
14 |
/* Use the following CSS code if you want to use data attributes for inserting your icons */
|
15 |
[data-icon]:before { |
16 |
font-family: "snf-font"; |
17 |
content: attr(data-icon); |
18 |
speak: none; |
19 |
font-weight: normal; |
20 |
font-variant: normal; |
21 |
text-transform: none; |
22 |
line-height: 1; |
23 |
-webkit-font-smoothing: antialiased; |
24 |
-moz-osx-font-smoothing: grayscale; |
25 |
} |
26 |
|
27 |
/* Use the following CSS code if you want to have a class per icon */
|
28 |
/*
|
29 |
Instead of a list of all class selectors,
|
30 |
you can use the generic selector below, but it"s slower:
|
31 |
[class*="snf-"] {
|
32 |
*/
|
33 |
.snf-font, .snf-trash-outline, .snf-eye, .snf-radio-checked, .snf-radio-unchecked, .snf-close, .snf-www, .snf-arrow-up, .snf-arrow-down, .snf-checkbox-unchecked, .snf-checkbox-checked, .snf-cancel-circled, .snf-search, .snf-twitter-logo, .snf-ok, .snf-switch, .snf-ban-circle, .snf-ok-sign, .snf-minus-sign, .snf-edit, .snf-listview, .snf-gridview, .snf-dashboard-outline, .snf-pithos-outline, .snf-info-full, .snf-volume-create-full, .snf-image-full, .snf-pc-create-full, .snf-network-create-outline, .snf-network-create-full, .snf-ram-outline, .snf-nic-outline, .snf-ram-full, .snf-nic-full, .snf-network-broken-1-full, .snf-network-broken-2-full, .snf-pc-broken-full, .snf-pc-reboot-full, .snf-pc-switch-full, .snf-key-full, .snf-router-full, .snf-chip-full, .snf-plus-full, .snf-snapshot-full, .snf-pithos-full, .snf-volume-full, .snf-network-full, .snf-pc-full, .snf-network-broken-1-outline, .snf-network-broken-2-outline, .snf-pc-broken-outline, .snf-volume-broken-outline, .snf-pc-reboot-outline, .snf-pc-switch-outline, .snf-key-outline, .snf-router-outline, .snf-chip-outline, .snf-image-outline, .snf-plus-outline, .snf-snapshot-outline, .snf-volume-outline, .snf-network-outline, .snf-pc-outline, .snf-info-outline, .snf-thunder-full, .snf-lock-closed, .snf-lock-open, .snf-trash-full, .snf-link-outline, .snf-refresh-outline, .snf-download-full, .snf-person-outline, .snf-upload-full, .snf-arrow-right-small-full, .snf-copy-outline, .snf-copy-full, .snf-arrow-left-small-full { |
34 |
font-family: 'snf-font'; |
35 |
speak: none; |
36 |
font-style: normal; |
37 |
font-weight: normal; |
38 |
font-variant: normal; |
39 |
text-transform: none; |
40 |
line-height: 1; |
41 |
-webkit-font-smoothing: antialiased; |
42 |
} |
43 |
.snf-eye:before { |
44 |
content: "\41"; |
45 |
} |
46 |
.snf-radio-checked:before { |
47 |
content: "\42"; |
48 |
} |
49 |
.snf-radio-unchecked:before { |
50 |
content: "\43"; |
51 |
} |
52 |
.snf-close:before { |
53 |
content: "\44"; |
54 |
} |
55 |
.snf-www:before { |
56 |
content: "\49"; |
57 |
} |
58 |
.snf-arrow-up:before { |
59 |
content: "\4c"; |
60 |
} |
61 |
.snf-arrow-down:before { |
62 |
content: "\4d"; |
63 |
} |
64 |
.snf-checkbox-unchecked:before { |
65 |
content: "\61"; |
66 |
} |
67 |
.snf-checkbox-checked:before { |
68 |
content: "\62"; |
69 |
} |
70 |
.snf-cancel-circled:before { |
71 |
content: "\63"; |
72 |
} |
73 |
.snf-search:before { |
74 |
content: "\64"; |
75 |
} |
76 |
.snf-twitter-logo:before { |
77 |
content: "\67"; |
78 |
} |
79 |
.snf-ok:before { |
80 |
content: "\68"; |
81 |
} |
82 |
.snf-switch:before { |
83 |
content: "\69"; |
84 |
} |
85 |
.snf-ban-circle:before { |
86 |
content: "\6a"; |
87 |
} |
88 |
.snf-ok-sign:before { |
89 |
content: "\6c"; |
90 |
} |
91 |
.snf-minus-sign:before { |
92 |
content: "\6e"; |
93 |
} |
94 |
.snf-edit:before { |
95 |
content: "\71"; |
96 |
} |
97 |
.snf-listview:before { |
98 |
content: "\73"; |
99 |
} |
100 |
.snf-gridview:before { |
101 |
content: "\74"; |
102 |
} |
103 |
.snf-dashboard-outline:before { |
104 |
content: "\7a"; |
105 |
} |
106 |
.snf-pithos-outline:before { |
107 |
content: "\79"; |
108 |
} |
109 |
.snf-info-full:before { |
110 |
content: "\70"; |
111 |
} |
112 |
.snf-volume-create-full:before { |
113 |
content: "\36"; |
114 |
} |
115 |
.snf-image-full:before { |
116 |
content: "\51"; |
117 |
} |
118 |
.snf-pc-create-full:before { |
119 |
content: "\53"; |
120 |
} |
121 |
.snf-network-create-outline:before { |
122 |
content: "\54"; |
123 |
} |
124 |
.snf-network-create-full:before { |
125 |
content: "\55"; |
126 |
} |
127 |
.snf-ram-outline:before { |
128 |
content: "\4a"; |
129 |
} |
130 |
.snf-nic-outline:before { |
131 |
content: "\50"; |
132 |
} |
133 |
.snf-ram-full:before { |
134 |
content: "\52"; |
135 |
} |
136 |
.snf-nic-full:before { |
137 |
content: "\72"; |
138 |
} |
139 |
.snf-network-broken-1-full:before { |
140 |
content: "\56"; |
141 |
} |
142 |
.snf-network-broken-2-full:before { |
143 |
content: "\57"; |
144 |
} |
145 |
.snf-pc-broken-full:before { |
146 |
content: "\58"; |
147 |
} |
148 |
.snf-pc-reboot-full:before { |
149 |
content: "\59"; |
150 |
} |
151 |
.snf-pc-switch-full:before { |
152 |
content: "\5a"; |
153 |
} |
154 |
.snf-key-full:before { |
155 |
content: "\31"; |
156 |
} |
157 |
.snf-router-full:before { |
158 |
content: "\32"; |
159 |
} |
160 |
.snf-chip-full:before { |
161 |
content: "\33"; |
162 |
} |
163 |
.snf-plus-full:before { |
164 |
content: "\34"; |
165 |
} |
166 |
.snf-snapshot-full:before { |
167 |
content: "\4e"; |
168 |
} |
169 |
.snf-pithos-full:before { |
170 |
content: "\35"; |
171 |
} |
172 |
.snf-volume-full:before { |
173 |
content: "\4f"; |
174 |
} |
175 |
.snf-network-full:before { |
176 |
content: "\4b"; |
177 |
} |
178 |
.snf-pc-full:before { |
179 |
content: "\78"; |
180 |
} |
181 |
.snf-network-broken-1-outline:before { |
182 |
content: "\37"; |
183 |
} |
184 |
.snf-network-broken-2-outline:before { |
185 |
content: "\38"; |
186 |
} |
187 |
.snf-pc-broken-outline:before { |
188 |
content: "\39"; |
189 |
} |
190 |
.snf-volume-broken-outline:before { |
191 |
content: "\30"; |
192 |
} |
193 |
.snf-pc-reboot-outline:before { |
194 |
content: "\21"; |
195 |
} |
196 |
.snf-pc-switch-outline:before { |
197 |
content: "\40"; |
198 |
} |
199 |
.snf-key-outline:before { |
200 |
content: "\23"; |
201 |
} |
202 |
.snf-router-outline:before { |
203 |
content: "\48"; |
204 |
} |
205 |
.snf-chip-outline:before { |
206 |
content: "\45"; |
207 |
} |
208 |
.snf-image-outline:before { |
209 |
content: "\66"; |
210 |
} |
211 |
.snf-plus-outline:before { |
212 |
content: "\6d"; |
213 |
} |
214 |
.snf-snapshot-outline:before { |
215 |
content: "\65"; |
216 |
} |
217 |
.snf-volume-outline:before { |
218 |
content: "\75"; |
219 |
} |
220 |
.snf-network-outline:before { |
221 |
content: "\76"; |
222 |
} |
223 |
.snf-pc-outline:before { |
224 |
content: "\77"; |
225 |
} |
226 |
.snf-info-outline:before { |
227 |
content: "\6f"; |
228 |
} |
229 |
.snf-thunder-full:before { |
230 |
content: "\6b"; |
231 |
} |
232 |
.snf-lock-closed-full:before { |
233 |
content: "\46"; |
234 |
} |
235 |
.snf-lock-open-full:before { |
236 |
content: "\47"; |
237 |
} |
238 |
|
239 |
.snf-link-outline:before { |
240 |
content: "\26"; |
241 |
} |
242 |
.snf-refresh-outline:before { |
243 |
content: "\29"; |
244 |
} |
245 |
.snf-download-full:before { |
246 |
content: "\25"; |
247 |
} |
248 |
.snf-person-outline:before { |
249 |
content: "\2a"; |
250 |
} |
251 |
.snf-upload-full:before { |
252 |
content: "\28"; |
253 |
} |
254 |
.snf-arrow-right-small-full:before { |
255 |
content: "\2d"; |
256 |
} |
257 |
.snf-copy-outline:before { |
258 |
content: "\3f"; |
259 |
} |
260 |
.snf-copy-full:before { |
261 |
content: "\22"; |
262 |
} |
263 |
.snf-arrow-left-small-full:before { |
264 |
content: "\5f"; |
265 |
} |
266 |
.snf-trash-full:before { |
267 |
content: "\3d"; |
268 |
} |
269 |
.snf-trash-outline:before { |
270 |
content: "\24"; |
271 |
} |
272 |
|
273 |
|
274 |
/*snf-font-auxiliary*/
|
275 |
@font-face {
|
276 |
font-family: 'snf-font-auxiliary'; |
277 |
src:url('../fonts/snf-font-auxiliary.eot'); |
278 |
src:url('../fonts/snf-font-auxiliary.eot?#iefix') format('embedded-opentype'), |
279 |
url('../fonts/snf-font-auxiliary.woff') format('woff'), |
280 |
url('../fonts/snf-font-auxiliary.ttf') format('truetype'), |
281 |
url('../fonts/snf-font-auxiliary.svg#snf-font-auxiliary') format('svg'); |
282 |
font-weight: normal; |
283 |
font-style: normal; |
284 |
} |
285 |
|
286 |
/* Use the following CSS code if you want to use data attributes for inserting your icons */
|
287 |
[data-icon-aux]:before { |
288 |
font-family: 'snf-font-auxiliary'; |
289 |
content: attr(data-icon-aux); |
290 |
speak: none; |
291 |
font-weight: normal; |
292 |
font-variant: normal; |
293 |
text-transform: none; |
294 |
line-height: 1; |
295 |
-webkit-font-smoothing: antialiased; |
296 |
-moz-osx-font-smoothing: grayscale; |
297 |
} |
298 |
|
299 |
/* Use the following CSS code if you want to have a class per icon */
|
300 |
/*
|
301 |
Instead of a list of all class selectors,
|
302 |
you can use the generic selector below, but it's slower:
|
303 |
[class*="snf-"] {
|
304 |
*/
|
305 |
.snf-font-aux, .snf-folder-create-outline, .snf-folder-create-full, .snf-shared-by-me-outline, .snf-shared-to-me-outline, .snf-shared-by-me-full, .snf-folder-move-full, .snf-folder-move-outline, .snf-shared-to-me-full { |
306 |
font-family: 'snf-font-auxiliary'; |
307 |
speak: none; |
308 |
font-style: normal; |
309 |
font-weight: normal; |
310 |
font-variant: normal; |
311 |
text-transform: none; |
312 |
line-height: 1; |
313 |
-webkit-font-smoothing: antialiased; |
314 |
} |
315 |
.snf-folder-create-outline:before { |
316 |
content: "\61"; |
317 |
} |
318 |
.snf-folder-create-full:before { |
319 |
content: "\41"; |
320 |
} |
321 |
.snf-folder-move-outline:before { |
322 |
content: "\65"; |
323 |
} |
324 |
.snf-folder-move-full:before { |
325 |
content: "\45"; |
326 |
} |
327 |
.snf-folder-outline:before { |
328 |
content: "\66"; |
329 |
} |
330 |
.snf-folder-full:before { |
331 |
content: "\46"; |
332 |
} |
333 |
.snf-shared-by-me-outline:before { |
334 |
content: "\63"; |
335 |
} |
336 |
.snf-shared-by-me-full:before { |
337 |
content: "\43"; |
338 |
} |
339 |
.snf-shared-to-me-outline:before { |
340 |
content: "\64"; |
341 |
} |
342 |
.snf-shared-to-me-full:before { |
343 |
content: "\44"; |
344 |
} |