58 |
65 |
66 |
67 |
72 |
73 |
74 |
75 |
76 |
77 |
78 |
105 |
106 |
107 |
114 |
115 |
116 |
143 |
144 |
145 |
146 |
147 |
148 |
149 |
150 |
151 |
152 |
153 |
154 |
--------------------------------------------------------------------------------
/docs/css/documentation.css:
--------------------------------------------------------------------------------
1 | body {
2 | /*position: relative !important;*/
3 | font-size: 16px;
4 | line-height: 1.67em;
5 | color: #777;
6 | background-color: #f2f2f2;
7 | -webkit-font-smoothing: antialiased;
8 | -webkit-text-size-adjust: 100%;
9 | }
10 |
11 | em {
12 | color: #999;
13 | }
14 |
15 | h1, h2, h3, h4, h5, h6 {
16 | line-height: 1.2em;
17 | }
18 | h1 { font-size: 48px; }
19 | h2 { font-size: 36px; }
20 | h3 { font-size: 24px; }
21 | h4 { font-size: 18px; }
22 | h5 { font-size: 16px; }
23 | h6 { font-size: 14px; }
24 |
25 | .prettyprint {
26 | overflow: auto;
27 | }
28 | pre.prettyprint {
29 | width: 100%;
30 | padding: 4px 8px;
31 | margin-bottom: 30px;
32 | border: 1px solid #FFF;
33 | font-size: 14px;
34 | background: #F7F7F7;
35 | -webkit-border-radius: 2px;
36 | -moz-border-radius: 2px;
37 | border-radius: 2px;
38 | }
39 |
40 | code {
41 | background: #F7F7F7;
42 | font-size: 14px;
43 | border: 1px solid #DDD;
44 | -webkit-border-radius: 2px;
45 | -moz-border-radius: 2px;
46 | border-radius: 2px;
47 |
48 | padding: 2px 5px;
49 | }
50 |
51 | .docs-header {
52 | -webkit-box-shadow: none;
53 | -moz-box-shadow: none;
54 | box-shadow: none;
55 | }
56 |
57 | .docs-header > .app-icon .title {
58 | line-height: 32px;
59 | padding-right: 4px;
60 | }
61 |
62 | .docs-header .tab-fixed {
63 | position: absolute;
64 | width: 540px;
65 | left: 90px;
66 | background: none;
67 | -webkit-box-shadow: none;
68 | -moz-box-shadow: none;
69 | box-shadow: none;
70 | }
71 |
72 | .docs-header .spinner {
73 | top: 48px;
74 | }
75 |
76 | .docs-header .tab-fixed .tab-inner li a {
77 | color: #999;
78 | }
79 | .docs-header .tab-fixed .tab-inner li.active a {
80 | color: #fff;
81 | }
82 |
83 | .docs-sidebar {
84 | position: absolute;
85 | top: 48px;
86 | bottom: 48px;
87 | left: 0;
88 | background: #111;
89 | width: 320px;
90 | }
91 |
92 | .docs-content {
93 | position: absolute;
94 | top: 48px;
95 | right: 0;
96 | bottom: 0;
97 | left: 0;
98 | padding: 0 540px 0 80px;
99 | width: 100%;
100 | overflow: auto;
101 | }
102 |
103 | .docs-content.inner-content {
104 | left: 320px !important;
105 | width: auto;
106 | padding: 0 80px 80px 80px;
107 | }
108 |
109 | .docs-footer {
110 | background-color: rgba(255, 255, 255, 0.8);
111 | border-top: 1px solid rgba(255, 255, 255, 0.8);
112 | }
113 |
114 | .docs-footer ul {
115 | list-style: none;
116 | padding: 12px 0 0;
117 | width: 640px;
118 | margin: 0 auto;
119 | }
120 |
121 | .docs-footer ul li {
122 | display: inline-block;
123 | }
124 |
125 | .masthead {
126 | padding: 168px 0 0 0 !important;
127 | }
128 |
129 | .masthead h1 {
130 | color: #333;
131 | font-size: 60px;
132 | font-weight: 200;
133 | line-height: 1.67em;
134 | letter-spacing: -1px;
135 | }
136 |
137 | .masthead p.subtitle {
138 | font-size: 24px;
139 | font-weight: 200;
140 | line-height: 1.3em;
141 | padding: 2px;
142 | color: #999;
143 | }
144 |
145 | .content-section {
146 | padding-top: 80px;
147 | }
148 |
149 | .content-section .section-header {
150 | padding-bottom: 24px;
151 | }
152 |
153 | .content-section .section-title {
154 | line-height: 1.67em;
155 | color: #333;
156 | }
157 |
158 | .content-section .section-description {
159 | font-size: 24px;
160 | font-weight: 200;
161 | }
162 |
163 | .content-section ol.docs {
164 | font-size: 18px;
165 | font-weight: bold;
166 | padding-left: 30px;
167 | }
168 |
169 | .content-section ol.docs li {
170 | padding: 0 0 20px; 36px;
171 | font-weight: normal;
172 | }
173 |
174 | .content-section ol.docs li h3 {
175 | font-size: 18px;
176 | }
177 |
178 | .content-section ol.docs li p {
179 | font-size: 16px;
180 | padding: 12px 0;
181 | }
182 |
183 | .content-section > p {
184 | padding-bottom: 20px;
185 | }
186 |
187 | h3.component-title {
188 | font-weight: normal;
189 | padding: 40px 0 20px;
190 | }
191 | p.component-description {
192 | left: 320px;
193 | padding-bottom: 20px;
194 | }
195 |
196 | .component {
197 | padding-bottom: 100px;
198 | }
199 |
200 | .component h4 {
201 | padding: 20px 0 8px;
202 | }
203 |
204 | .component .component-title {
205 | border-bottom: 2px solid rgb(153, 153, 153);
206 | text-transform: uppercase;
207 | font-size: 18px;
208 | font-weight: bold;
209 | padding: 40px 0 4px 4px;
210 | margin-bottom: 40px;
211 | }
212 |
213 | .component-example {
214 | padding-bottom: 30px;
215 | }
216 |
217 | .component-example .action-bar,
218 | .component-example .tab-fixed {
219 | position: relative;
220 | z-index: 1;
221 | }
222 |
223 | .downloads {
224 | padding: 48px 0;
225 | }
226 |
227 | .downloads ul {
228 | padding-top: 56px;
229 | list-style: none;
230 | }
231 |
232 | .downloads ul li {
233 | display: inline-block;
234 | }
235 |
236 | #nexus {
237 | position: fixed;
238 | z-index: 999;
239 | right: 40px;
240 | bottom: -80px;
241 | width: 477px;
242 | height: 837px;
243 | }
244 |
245 | .nexus-overlay {
246 | background: url('../images/nexus4-vert.png') no-repeat;
247 | width: 100%;
248 | height: 100%;
249 | }
250 |
251 | .nexus-content {
252 | position: absolute;
253 | top: 119px;
254 | left: 46px;
255 | right: 47px;
256 | bottom: 153px;
257 | background: #111;
258 | }
259 |
260 | .nexus-content iframe {
261 | width: 100%;
262 | height: 100%;
263 | }
264 |
265 | .black-bg {
266 | background: #111;
267 | }
268 |
269 | .dialogs {
270 | position: fixed !important;
271 | }
272 |
273 | .dialog {
274 | max-width: 380px;
275 | }
276 |
277 | .non-webkit-notice {
278 | display: none;
279 | cursor: pointer;
280 | position: fixed;
281 | top: 48px;
282 | left: 0;
283 | right: 0;
284 | background: rgba(255, 170, 170, 0.7);
285 | padding: 12px 540px 12px 80px;
286 | z-index: 10;
287 | -webkit-transition: opacity 0.2s ease-out;
288 | -moz-transition: opacity 0.2s ease-out;
289 | transition: opacity 0.2s ease-out;
290 | }
291 |
292 | .non-webkit-notice.inner {
293 | left: 320px;
294 | padding: 12px 80px;
295 | }
296 |
297 | .non-webkit-notice p {
298 | font-size: 14px;
299 | }
300 |
301 | .fade {
302 | cursor: default;
303 | opacity: 0;
304 | }
305 |
306 | .view-demo {
307 | display: none;
308 | }
309 |
310 | .action-overflow-docs {
311 | position: relative;
312 | -webkit-user-select: none;
313 | -moz-user-select: none;
314 | user-select: none;
315 | }
316 | .action-overflow-docs .spinner {
317 | right: 10px;
318 | }
319 |
320 | @media (min-width: 769px) {
321 | .docs-header .actions {
322 | display: none;
323 | }
324 | }
325 |
326 | @media only screen and (max-width: 1136px) {
327 | .docs-content {
328 | padding-right: 80px;
329 | }
330 |
331 | .view-demo {
332 | display: initial;
333 | }
334 |
335 | #nexus {
336 | display: none;
337 | }
338 | }
339 |
340 | @media only screen and (max-width: 1024px) {
341 | }
342 |
343 | @media (max-width: 768px) {
344 | .docs-header .tab-fixed {
345 | display: none;
346 | }
347 |
348 | .docs-content {
349 | padding: 40px !important;
350 | }
351 | .docs-content.inner-content {
352 | left: 0 !important;
353 | }
354 |
355 | .masthead {
356 | padding-top: 40px !important;
357 | text-align: center;
358 | }
359 |
360 | .component {
361 | padding-bottom: 40px;
362 | }
363 |
364 | .docs-sidebar {
365 | display: none;
366 | }
367 | }
368 |
369 | @media (max-width: 670px) {
370 | .btn {
371 | text-align: center;
372 | margin-left: 0 !important;
373 | display: block;
374 | height: 36px;
375 | line-height: 20px;
376 | }
377 |
378 | .content-section {
379 | padding-top: 40px;
380 | }
381 |
382 | .docs-footer {
383 | display: none;
384 | }
385 | }
386 |
387 | @media (max-width: 480px) {
388 | .masthead h1 {
389 | font-size: 48px;
390 | }
391 | .masthead p.subtitle {
392 | font-size: 18px;
393 | }
394 |
395 | .component-example {
396 | margin: 0 -40px;
397 | }
398 | }
399 |
--------------------------------------------------------------------------------
/examples/js/fingerblast.js:
--------------------------------------------------------------------------------
1 | // FINGERBLAST.js
2 | // --------------
3 | // Adapted from phantom limb by Brian Cartensen
4 |
5 | /* jshint bitwise: false */
6 | /* global GLOBAL: true */
7 |
8 | (function () {
9 |
10 | 'use strict';
11 |
12 | function FingerBlast(element) {
13 | this.element = typeof element === 'string' ? document.querySelector(element) : element;
14 |
15 | if (this.element) {
16 | this.listen();
17 | }
18 | }
19 |
20 | FingerBlast.prototype = {
21 | x: NaN,
22 | y: NaN,
23 |
24 | startDistance: NaN,
25 | startAngle: NaN,
26 |
27 | mouseIsDown: false,
28 |
29 | listen: function () {
30 | var activate = this.activate.bind(this);
31 | var deactivate = this.deactivate.bind(this);
32 |
33 | function contains (element, ancestor) {
34 | var descendants;
35 | var index;
36 | var descendant;
37 |
38 | if ('compareDocumentPosition' in ancestor) {
39 | return !!(ancestor.compareDocumentPosition(element) & 16);
40 | } else if ('contains' in ancestor) {
41 | return ancestor !== element && ancestor.contains(element);
42 | } else {
43 | for ((descendants = ancestor.getElementsByTagName('*')), index = 0; (descendant = descendants[index++]);) {
44 | if (descendant === element) {
45 | return true;
46 | }
47 | }
48 | return false;
49 | }
50 | }
51 |
52 | this.element.addEventListener('mouseover', function (e) {
53 | var target = e.relatedTarget;
54 | if (target !== this && !contains(target, this)) {
55 | activate();
56 | }
57 | });
58 |
59 | this.element.addEventListener('mouseout', function (e) {
60 | var target = e.relatedTarget;
61 | if (target !== this && !contains(target, this)) {
62 | deactivate(e);
63 | }
64 | });
65 | },
66 |
67 | activate: function () {
68 | if (this.active) {
69 | return;
70 | }
71 | this.element.addEventListener('mousedown', (this.touchStart = this.touchStart.bind(this)), true);
72 | this.element.addEventListener('mousemove', (this.touchMove = this.touchMove.bind(this)), true);
73 | this.element.addEventListener('mouseup', (this.touchEnd = this.touchEnd.bind(this)), true);
74 | this.element.addEventListener('click', (this.click = this.click.bind(this)), true);
75 | this.active = true;
76 | },
77 |
78 | deactivate: function (e) {
79 | this.active = false;
80 | if (this.mouseIsDown) {
81 | this.touchEnd(e);
82 | }
83 | this.element.removeEventListener('mousedown', this.touchStart, true);
84 | this.element.removeEventListener('mousemove', this.touchMove, true);
85 | this.element.removeEventListener('mouseup', this.touchEnd, true);
86 | this.element.removeEventListener('click', this.click, true);
87 | },
88 |
89 | click: function (e) {
90 | if (e.synthetic) {
91 | return;
92 | }
93 | e.preventDefault();
94 | e.stopPropagation();
95 | },
96 |
97 | touchStart: function (e) {
98 | if (e.synthetic || /input|textarea/.test(e.target.tagName.toLowerCase())) {
99 | return;
100 | }
101 |
102 | this.mouseIsDown = true;
103 |
104 | e.preventDefault();
105 | e.stopPropagation();
106 |
107 | this.fireTouchEvents('touchstart', e);
108 | },
109 |
110 | touchMove: function (e) {
111 | if (e.synthetic) {
112 | return;
113 | }
114 |
115 | e.preventDefault();
116 | e.stopPropagation();
117 |
118 | this.move(e.clientX, e.clientY);
119 |
120 | if (this.mouseIsDown) {
121 | this.fireTouchEvents('touchmove', e);
122 | }
123 | },
124 |
125 | touchEnd: function (e) {
126 | if (e.synthetic) {
127 | return;
128 | }
129 |
130 | this.mouseIsDown = false;
131 |
132 | e.preventDefault();
133 | e.stopPropagation();
134 |
135 | this.fireTouchEvents('touchend', e);
136 |
137 | if (!this.target) {
138 | return;
139 | }
140 |
141 | // Mobile Safari moves all the mouse events to fire after the touchend event.
142 | this.target.dispatchEvent(this.createMouseEvent('mouseover', e));
143 | this.target.dispatchEvent(this.createMouseEvent('mousemove', e));
144 | this.target.dispatchEvent(this.createMouseEvent('mousedown', e));
145 | },
146 |
147 | fireTouchEvents: function (eventName, originalEvent) {
148 | var events = [];
149 | var gestures = [];
150 |
151 | if (!this.target) {
152 | return;
153 | }
154 |
155 | // Convert 'ontouch*' properties and attributes to listeners.
156 | var onEventName = 'on' + eventName;
157 |
158 | if (onEventName in this.target) {
159 | console.warn('Converting `' + onEventName + '` property to event listener.', this.target);
160 | this.target.addEventListener(eventName, this.target[onEventName], false);
161 | delete this.target[onEventName];
162 | }
163 |
164 | if (this.target.hasAttribute(onEventName)) {
165 | console.warn('Converting `' + onEventName + '` attribute to event listener.', this.target);
166 | var handler = new GLOBAL.Function('event', this.target.getAttribute(onEventName));
167 | this.target.addEventListener(eventName, handler, false);
168 | this.target.removeAttribute(onEventName);
169 | }
170 |
171 | // Set up a new event with the coordinates of the finger.
172 | var touch = this.createMouseEvent(eventName, originalEvent);
173 |
174 | events.push(touch);
175 |
176 | // Figure out scale and rotation.
177 | if (events.length > 1) {
178 | var x = events[0].pageX - events[1].pageX;
179 | var y = events[0].pageY - events[1].pageY;
180 |
181 | var distance = Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2));
182 | var angle = Math.atan2(x, y) * (180 / Math.PI);
183 |
184 | var gestureName = 'gesturechange';
185 |
186 | if (eventName === 'touchstart') {
187 | gestureName = 'gesturestart';
188 | this.startDistance = distance;
189 | this.startAngle = angle;
190 | }
191 |
192 | if (eventName === 'touchend') {
193 | gestureName = 'gestureend';
194 | }
195 |
196 | events.forEach(function(event) {
197 | var gesture = this.createMouseEvent.call(event._finger, gestureName, event);
198 | gestures.push(gesture);
199 | }.bind(this));
200 |
201 | events.concat(gestures).forEach(function(event) {
202 | event.scale = distance / this.startDistance;
203 | event.rotation = this.startAngle - angle;
204 | });
205 | }
206 |
207 | // Loop through the events array and fill in each touch array.
208 | events.forEach(function(touch) {
209 | touch.touches = events.filter(function(e) {
210 | return ~e.type.indexOf('touch') && e.type !== 'touchend';
211 | });
212 |
213 | touch.changedTouches = events.filter(function(e) {
214 | return ~e.type.indexOf('touch') && e._finger.target === touch._finger.target;
215 | });
216 |
217 | touch.targetTouches = touch.changedTouches.filter(function(e) {
218 | return ~e.type.indexOf('touch') && e.type !== 'touchend';
219 | });
220 | });
221 |
222 | // Then fire the events.
223 | events.concat(gestures).forEach(function(event, i) {
224 | event.identifier = i;
225 | event._finger.target.dispatchEvent(event);
226 | });
227 | },
228 |
229 | createMouseEvent: function (eventName, originalEvent) {
230 | var e = document.createEvent('MouseEvent');
231 |
232 | e.initMouseEvent(eventName, true, true,
233 | originalEvent.view, originalEvent.detail,
234 | this.x || originalEvent.screenX, this.y || originalEvent.screenY,
235 | this.x || originalEvent.clientX, this.y || originalEvent.clientY,
236 | originalEvent.ctrlKey, originalEvent.shiftKey,
237 | originalEvent.altKey, originalEvent.metaKey,
238 | originalEvent.button, this.target || originalEvent.relatedTarget
239 | );
240 |
241 | e.synthetic = true;
242 | e._finger = this;
243 |
244 | return e;
245 | },
246 |
247 | move: function (x, y) {
248 | if (isNaN(x) || isNaN(y)) {
249 | this.target = null;
250 | } else {
251 | this.x = x;
252 | this.y = y;
253 |
254 | if (!this.mouseIsDown) {
255 | this.target = document.elementFromPoint(x, y);
256 | }
257 | }
258 | }
259 | };
260 |
261 | window.FingerBlast = FingerBlast;
262 |
263 | }());
264 |
--------------------------------------------------------------------------------
/lib/js/stack.js:
--------------------------------------------------------------------------------
1 | (function(){
2 |
3 | var isScrolling;
4 | var maxCacheLength = 20;
5 | var cacheMapping = sessionStorage;
6 | var domCache = {};
7 |
8 | var cacheReplace = function (data, updates) {
9 | doXHR.id = data.id;
10 | if (updates) data = getCached(data.id);
11 | cacheMapping[data.id] = JSON.stringify(data);
12 | window.history.replaceState(data.id, data.title, data.url);
13 | domCache[data.id] = document.body.cloneNode(true);
14 | };
15 |
16 | var cachePush = function () {
17 | var id = doXHR.id;
18 |
19 | var cacheForwardStack = JSON.parse(cacheMapping.cacheForwardStack || '[]');
20 | var cacheBackStack = JSON.parse(cacheMapping.cacheBackStack || '[]');
21 |
22 | cacheBackStack.push(id);
23 |
24 | while (cacheForwardStack.length) delete cacheMapping[cacheForwardStack.shift()];
25 | while (cacheBackStack.length > maxCacheLength) delete cacheMapping[cacheBackStack.shift()];
26 |
27 | window.history.pushState(null, '', cacheMapping[doXHR.id].url);
28 |
29 | cacheMapping.cacheForwardStack = JSON.stringify(cacheForwardStack);
30 | cacheMapping.cacheBackStack = JSON.stringify(cacheBackStack);
31 | };
32 |
33 | var cachePop = function (id, direction) {
34 | var forward = direction == 'forward';
35 | var cacheForwardStack = JSON.parse(cacheMapping.cacheForwardStack || '[]');
36 | var cacheBackStack = JSON.parse(cacheMapping.cacheBackStack || '[]');
37 | var pushStack = forward ? cacheBackStack : cacheForwardStack;
38 | var popStack = forward ? cacheForwardStack : cacheBackStack;
39 |
40 | if (doXHR.id) pushStack.push(doXHR.id);
41 | popStack.pop();
42 |
43 | cacheMapping.cacheForwardStack = JSON.stringify(cacheForwardStack);
44 | cacheMapping.cacheBackStack = JSON.stringify(cacheBackStack);
45 | };
46 |
47 | var getCached = function (id) {
48 | return JSON.parse(cacheMapping[id] || null) || {};
49 | };
50 |
51 | var handleTouch = function (e) {
52 | var target = getTarget(e);
53 |
54 | if (!target) return;
55 |
56 | e.preventDefault();
57 |
58 | if (target.getAttribute('data-transition') == 'pop' && !target.classList.contains('up')) {
59 | window.history.go(-1);
60 | triggerStateChange();
61 | return;
62 | }
63 |
64 | doXHR({
65 | url: target.getAttribute('href'),
66 | hash : target.hash,
67 | container: '.page',
68 | timeout: target.getAttribute('data-timeout'),
69 | transition: target.getAttribute('data-transition')
70 | });
71 |
72 | };
73 |
74 | var handlePopState = function (e) {
75 | var activeObj;
76 | var activeDom;
77 | var direction;
78 | var transition;
79 | var transitionFrom;
80 | var transitionFromObj;
81 | var id = e.state;
82 |
83 | if (!id || !cacheMapping[id]) return;
84 |
85 | direction = doXHR.id < id ? 'forward' : 'back';
86 |
87 | cachePop(id, direction);
88 |
89 | activeObj = getCached(id);
90 | activeDom = domCache[id];
91 |
92 | if (activeObj.title) document.title = activeObj.title;
93 |
94 | if (direction == 'back') {
95 | transitionFrom = JSON.parse(direction == 'back' ? cacheMapping.cacheForwardStack : cacheMapping.cacheBackStack);
96 | transitionFromObj = getCached(transitionFrom[transitionFrom.length - 1]);
97 | } else {
98 | transitionFromObj = activeObj;
99 | }
100 |
101 | if (direction == 'back' && !transitionFromObj.id) return doXHR.id = id;
102 |
103 | transition = direction == 'back' ? 'pop' : transitionFromObj.transition;
104 |
105 | if (!activeDom) {
106 | return doXHR({
107 | id : activeObj.id,
108 | url : activeObj.url,
109 | title : activeObj.title,
110 | timeout : activeObj.timeout,
111 | transition : transition,
112 | ignorePush : true
113 | });
114 | }
115 |
116 | replaceContents(
117 | (activeObj.contents || activeDom.querySelector('.page')).cloneNode(true),
118 | document.querySelector('.page'),
119 | transition
120 | );
121 |
122 | doXHR.id = id;
123 | };
124 |
125 | var doXHR = function(options) {
126 | var xhr = doXHR.xhr;
127 |
128 | options.container = document.querySelector(options.container);
129 | if (!options.container) options.container = document.querySelector('.page');
130 |
131 | if (xhr && xhr.readyState < 4) {
132 | xhr.onreadystatechange = function () {};
133 | xhr.abort();
134 | }
135 |
136 | xhr = new XMLHttpRequest();
137 | xhr.open('GET', options.url, false);
138 | xhr.setRequestHeader('X-DOCUMENT', 'true');
139 |
140 | xhr.onreadystatechange = function () {
141 | if (options._timeout) clearTimeout(options._timeout);
142 | if (xhr.readyState == 4) {
143 | if (xhr.status == 200 || xhr.status === 0) onSuccess(xhr, options);
144 | else onError(options.url);
145 | }
146 | };
147 |
148 | if (!doXHR.id) {
149 | cacheReplace({
150 | id : +new Date(),
151 | url : options.url,
152 | title : document.title,
153 | timeout : options.timeout,
154 | transition : null
155 | });
156 | }
157 |
158 | if (options.timeout) {
159 | options._timeout = setTimeout(function () { xhr.abort('timeout'); }, options.timeout);
160 | }
161 |
162 | xhr.send();
163 |
164 | if (xhr.readyState && !options.ignorePush) cachePush();
165 | };
166 |
167 | var replaceContents = function (contents, container, transition, callback) {
168 | // If there's no set transition, just replace the contents of the container
169 | if (!transition) {
170 | container.innerHTML = contents.innerHTML;
171 | }
172 | else {
173 | // Else, we'll be needing to animate the transition so keep the container for now
174 | container.parentNode.insertBefore(contents, container);
175 | }
176 |
177 | // If there's no set transition, do the callback, there's no use continuing
178 | if (!transition && callback) callback();
179 |
180 | if (/push/.test(transition)) {
181 | contents.classList.add(transition);
182 | container.classList.add('fade');
183 | contents.addEventListener('webkitAnimationEnd', onPushAnimationEnd, false);
184 |
185 | // Causes a jshint warning. Use --force to ignore
186 | function onPushAnimationEnd() {
187 | contents.removeEventListener('webkitAnimationEnd', onPushAnimationEnd, false);
188 | contents.classList.remove(transition);
189 | if (container.parentNode) container.parentNode.removeChild(container);
190 | if (callback) callback();
191 | }
192 | }
193 |
194 | if (/pop/.test(transition)) {
195 | contents.style.opacity = 1;
196 | container.classList.add('pop');
197 |
198 | container.addEventListener('webkitAnimationEnd', onPopAnimationEnd, false);
199 |
200 | // Causes a jshint warning. Use --force to ignore
201 | function onPopAnimationEnd() {
202 | container.classList.add('hidden');
203 | container.removeEventListener('webkitAnimationEnd', onPopAnimationEnd, false);
204 | container.parentNode.removeChild(container);
205 | if (callback) callback();
206 | }
207 | }
208 | };
209 |
210 | var pushCallback = function (data, options) {
211 | cacheReplace({
212 | id : options.id || +new Date(),
213 | url : data.url,
214 | title : data.title,
215 | timeout : options.timeout,
216 | transition : options.transition
217 | }, options.id);
218 |
219 | triggerStateChange();
220 | };
221 |
222 | var onSuccess = function (xhr, options) {
223 | var data = parseXHR(xhr, options);
224 |
225 | if (!data.contents) {
226 | window.history.replaceState(null, '', '#');
227 | window.location.replace(options.url);
228 | return;
229 | }
230 |
231 | replaceContents(data.contents, options.container, options.transition, pushCallback(data, options));
232 |
233 | if (data.title) document.title = data.title;
234 |
235 | if (!options.ignorePush && window._gaq) _gaq.push(['_trackPageview']); // Google Analytics
236 | if (!options.hash) return;
237 | };
238 |
239 | var onError = function (url) {
240 | throw new Error('Could not get ' + url);
241 | };
242 |
243 | var parseXHR = function (xhr, options) {
244 | var data = {};
245 | var responseText = xhr.responseText;
246 |
247 | data.url = options.url;
248 |
249 | if (!responseText) return data;
250 |
251 | if (/]*>([\s\S.]*)<\/head>/i)[0];
255 | body.innerHTML = responseText.match(/
]*>([\s\S.]*)<\/body>/i)[0];
256 | } else {
257 | head = body = document.createElement('div');
258 | head.innerHTML = responseText;
259 | }
260 |
261 | // Get the title from the page
262 | data.title = head.querySelector('title');
263 | data.title = data.title && data.title.innerText.trim();
264 |
265 | // Get the contents of the page
266 | data.contents = body.querySelector('.page');
267 |
268 | return data;
269 | };
270 |
271 | var triggerStateChange = function () {
272 | // Fix from https://github.com/maker/ratchet/issues/101 where CustomEvent is undefined
273 | if (typeof CustomEvent === 'undefined') {
274 | CustomEvent = function(type, eventInitDict) {
275 | var event = document.createEvent('CustomEvent');
276 | event.initCustomEvent(type, eventInitDict.bubbles, eventInitDict.cancelable, eventInitDict.detail);
277 | return event;
278 | };
279 | }
280 |
281 | var e = new CustomEvent('push', {
282 | detail: { state: getCached(doXHR.id) },
283 | bubbles: true,
284 | cancelable: true
285 | });
286 |
287 | setTimeout(function () {
288 | window.dispatchEvent(e);
289 | }, 200);
290 | };
291 |
292 | var findTarget = function (target) {
293 | var i, toggles = document.querySelectorAll('a');
294 | for (; target && target !== document; target = target.parentNode) {
295 | for (i = toggles.length; i--;) { if (toggles[i] === target) return target; }
296 | }
297 | };
298 |
299 | var getTarget = function (e) {
300 | var target = findTarget(e.target);
301 |
302 | if ( !target || e.which > 1 || e.metaKey || e.ctrlKey || isScrolling || location.protocol !== target.protocol || location.host !== target.host || !target.hash && /#/.test(target.href) || target.hash && target.href.replace(target.hash, '') === location.href.replace(location.hash, '') || target.getAttribute('data-ignore') == 'true') return;
303 | return target;
304 | };
305 |
306 | // Attach event handlers
307 | window.addEventListener('touchstart', function () { isScrolling = false; });
308 | window.addEventListener('touchmove', function () { isScrolling = true; });
309 | window.addEventListener('touchend', handleTouch);
310 | window.addEventListener('popstate', handlePopState);
311 | }());
312 |
--------------------------------------------------------------------------------
/lib/sass/holo-dark/icomoon.scss:
--------------------------------------------------------------------------------
1 | @font-face {
2 | font-family: 'icomoon';
3 | src:url('../../fonts/icomoon.eot');
4 | src:url('../../fonts/icomoon.eot?#iefix') format('embedded-opentype'),
5 | url('../../fonts/icomoon.woff') format('woff'),
6 | url('../../fonts/icomoon.ttf') format('truetype'),
7 | url('../../fonts/icomoon.svg#icomoon') format('svg');
8 | font-weight: normal;
9 | font-style: normal;
10 | }
11 |
12 | /* Use the following CSS code if you want to use data attributes for inserting your icons */
13 | [data-icon]:before {
14 | font-family: 'icomoon';
15 | content: attr(data-icon);
16 | speak: none;
17 | font-weight: normal;
18 | font-variant: normal;
19 | text-transform: none;
20 | line-height: 1;
21 | -webkit-font-smoothing: antialiased;
22 | }
23 |
24 | /* Use the following CSS code if you want to have a class per icon */
25 | /*
26 | Instead of a list of all class selectors,
27 | you can use the generic selector below, but it's slower:
28 | [class*="icon-"] {
29 | */
30 | .icon-back, .icon-accept, .icon-cancel, .icon-chevron-up, .icon-chevron-down, .icon-forward, .icon-chevron-right, .icon-chevron-left, .icon-refresh, .icon-information, .icon-help, .icon-search, .icon-settings, .icon-vote-down, .icon-heart, .icon-star-half, .icon-vote-up, .icon-star-full, .icon-star-empty, .icon-cloud, .icon-folder, .icon-calendar, .icon-tags, .icon-add-tag, .icon-sort-by-size, .icon-grid, .icon-view-as-list, .icon-attachment, .icon-new-image, .icon-new-event, .icon-new-attachment, .icon-new-message, .icon-new, .icon-merge, .icon-import-export, .icon-calendar-event, .icon-mail, .icon-edit, .icon-trash, .icon-cut, .icon-copy, .icon-backspace, .icon-clipboard, .icon-image, .icon-read, .icon-remove, .icon-save, .icon-select-all, .icon-split, .icon-undo, .icon-unread, .icon-add-group, .icon-add-person, .icon-cc-bcc, .icon-chat, .icon-forward-2, .icon-slideshow, .icon-rotate-right, .icon-rotate-left, .icon-globe, .icon-crop, .icon-location-marker, .icon-map, .icon-direction, .icon-share, .icon-send, .icon-reply-all, .icon-reply, .icon-person, .icon-group, .icon-add-to-queue, .icon-download, .icon-fast-forward, .icon-full-screen, .icon-pin, .icon-next, .icon-pause, .icon-pause-2, .icon-play, .icon-play-2, .icon-previous, .icon-repeat, .icon-replay, .icon-return-from-full-screen, .icon-brightness-high, .icon-brightness-auto, .icon-bluetooth-searching, .icon-bluetooth-connected, .icon-bluetooth, .icon-brightness, .icon-battery, .icon-add-alarm, .icon-alarm, .icon-key, .icon-upload, .icon-stop, .icon-shuffle, .icon-rewind, .icon-brightness-medium, .icon-call, .icon-camera, .icon-dashboard, .icon-dial, .icon-hang-up, .icon-power-auto, .icon-power-none, .icon-power, .icon-location-target, .icon-location-off, .icon-location-searching, .icon-microphone, .icon-microphone-off, .icon-clock, .icon-camera-video-rotate, .icon-camera-rotate, .icon-storage, .icon-locked, .icon-storage-sd, .icon-screen-lock-portrait, .icon-screen-rotate, .icon-screen-lock-landscape, .icon-call-volume, .icon-unlocked, .icon-new-account, .icon-signal, .icon-signal-2, .icon-usb, .icon-mouse, .icon-smartphone, .icon-fries, .icon-video, .icon-volume-off, .icon-volume-adjust, .icon-airplane, .icon-airplane-2, .icon-alert, .icon-alert-2, .icon-laptop, .icon-desktop, .icon-joystick, .icon-headphones, .icon-headphones-mic, .icon-keyboard, .icon-up-button {
31 | font-family: 'icomoon';
32 | speak: none;
33 | font-style: normal;
34 | font-weight: normal;
35 | font-variant: normal;
36 | text-transform: none;
37 | line-height: 1;
38 | -webkit-font-smoothing: antialiased;
39 | }
40 | .icon-back:before {
41 | content: "\e001";
42 | }
43 | .icon-accept:before {
44 | content: "\e002";
45 | }
46 | .icon-cancel:before {
47 | content: "\e003";
48 | }
49 | .icon-chevron-up:before {
50 | content: "\e004";
51 | }
52 | .icon-chevron-down:before {
53 | content: "\e005";
54 | }
55 | .icon-forward:before {
56 | content: "\e006";
57 | }
58 | .icon-chevron-right:before {
59 | content: "\e007";
60 | }
61 | .icon-chevron-left:before {
62 | content: "\e008";
63 | }
64 | .icon-refresh:before {
65 | content: "\e009";
66 | }
67 | .icon-information:before {
68 | content: "\e010";
69 | }
70 | .icon-help:before {
71 | content: "\e011";
72 | }
73 | .icon-search:before {
74 | content: "\e012";
75 | }
76 | .icon-settings:before {
77 | content: "\e013";
78 | }
79 | .icon-vote-down:before {
80 | content: "\e020";
81 | }
82 | .icon-heart:before {
83 | content: "\e021";
84 | }
85 | .icon-star-half:before {
86 | content: "\e023";
87 | }
88 | .icon-vote-up:before {
89 | content: "\e022";
90 | }
91 | .icon-star-full:before {
92 | content: "\e024";
93 | }
94 | .icon-star-empty:before {
95 | content: "\e025";
96 | }
97 | .icon-cloud:before {
98 | content: "\e030";
99 | }
100 | .icon-folder:before {
101 | content: "\e031";
102 | }
103 | .icon-calendar:before {
104 | content: "\e032";
105 | }
106 | .icon-tags:before {
107 | content: "\e033";
108 | }
109 | .icon-add-tag:before {
110 | content: "\e034";
111 | }
112 | .icon-sort-by-size:before {
113 | content: "\e035";
114 | }
115 | .icon-grid:before {
116 | content: "\e036";
117 | }
118 | .icon-view-as-list:before {
119 | content: "\e037";
120 | }
121 | .icon-attachment:before {
122 | content: "\e040";
123 | }
124 | .icon-new-image:before {
125 | content: "\e04e";
126 | }
127 | .icon-new-event:before {
128 | content: "\e04d";
129 | }
130 | .icon-new-attachment:before {
131 | content: "\e04b";
132 | }
133 | .icon-new-message:before {
134 | content: "\e04c";
135 | }
136 | .icon-new:before {
137 | content: "\e04a";
138 | }
139 | .icon-merge:before {
140 | content: "\e049";
141 | }
142 | .icon-import-export:before {
143 | content: "\e048";
144 | }
145 | .icon-calendar-event:before {
146 | content: "\e047";
147 | }
148 | .icon-mail:before {
149 | content: "\e046";
150 | }
151 | .icon-edit:before {
152 | content: "\e045";
153 | }
154 | .icon-trash:before {
155 | content: "\e044";
156 | }
157 | .icon-cut:before {
158 | content: "\e043";
159 | }
160 | .icon-copy:before {
161 | content: "\e042";
162 | }
163 | .icon-backspace:before {
164 | content: "\e041";
165 | }
166 | .icon-clipboard:before {
167 | content: "\e04f";
168 | }
169 | .icon-image:before {
170 | content: "\e050";
171 | }
172 | .icon-read:before {
173 | content: "\e051";
174 | }
175 | .icon-remove:before {
176 | content: "\e052";
177 | }
178 | .icon-save:before {
179 | content: "\e053";
180 | }
181 | .icon-select-all:before {
182 | content: "\e054";
183 | }
184 | .icon-split:before {
185 | content: "\e055";
186 | }
187 | .icon-undo:before {
188 | content: "\e056";
189 | }
190 | .icon-unread:before {
191 | content: "\e057";
192 | }
193 | .icon-add-group:before {
194 | content: "\e060";
195 | }
196 | .icon-add-person:before {
197 | content: "\e061";
198 | }
199 | .icon-cc-bcc:before {
200 | content: "\e062";
201 | }
202 | .icon-chat:before {
203 | content: "\e063";
204 | }
205 | .icon-forward-2:before {
206 | content: "\e064";
207 | }
208 | .icon-slideshow:before {
209 | content: "\e083";
210 | }
211 | .icon-rotate-right:before {
212 | content: "\e082";
213 | }
214 | .icon-rotate-left:before {
215 | content: "\e081";
216 | }
217 | .icon-globe:before {
218 | content: "\e073";
219 | }
220 | .icon-crop:before {
221 | content: "\e080";
222 | }
223 | .icon-location-marker:before {
224 | content: "\e072";
225 | }
226 | .icon-map:before {
227 | content: "\e071";
228 | }
229 | .icon-direction:before {
230 | content: "\e070";
231 | }
232 | .icon-share:before {
233 | content: "\e06a";
234 | }
235 | .icon-send:before {
236 | content: "\e069";
237 | }
238 | .icon-reply-all:before {
239 | content: "\e068";
240 | }
241 | .icon-reply:before {
242 | content: "\e067";
243 | }
244 | .icon-person:before {
245 | content: "\e066";
246 | }
247 | .icon-group:before {
248 | content: "\e065";
249 | }
250 | .icon-add-to-queue:before {
251 | content: "\e090";
252 | }
253 | .icon-download:before {
254 | content: "\e091";
255 | }
256 | .icon-fast-forward:before {
257 | content: "\e092";
258 | }
259 | .icon-full-screen:before {
260 | content: "\e093";
261 | }
262 | .icon-pin:before {
263 | content: "\e094";
264 | }
265 | .icon-next:before {
266 | content: "\e095";
267 | }
268 | .icon-pause:before {
269 | content: "\e096";
270 | }
271 | .icon-pause-2:before {
272 | content: "\e097";
273 | }
274 | .icon-play:before {
275 | content: "\e098";
276 | }
277 | .icon-play-2:before {
278 | content: "\e099";
279 | }
280 | .icon-previous:before {
281 | content: "\e09a";
282 | }
283 | .icon-repeat:before {
284 | content: "\e09b";
285 | }
286 | .icon-replay:before {
287 | content: "\e09c";
288 | }
289 | .icon-return-from-full-screen:before {
290 | content: "\e09d";
291 | }
292 | .icon-brightness-high:before {
293 | content: "\e0b9";
294 | }
295 | .icon-brightness-auto:before {
296 | content: "\e0b8";
297 | }
298 | .icon-bluetooth-searching:before {
299 | content: "\e0b7";
300 | }
301 | .icon-bluetooth-connected:before {
302 | content: "\e0b6";
303 | }
304 | .icon-bluetooth:before {
305 | content: "\e0b5";
306 | }
307 | .icon-brightness:before {
308 | content: "\e0b4";
309 | }
310 | .icon-battery:before {
311 | content: "\e0b3";
312 | }
313 | .icon-add-alarm:before {
314 | content: "\e0b1";
315 | }
316 | .icon-alarm:before {
317 | content: "\e0b2";
318 | }
319 | .icon-key:before {
320 | content: "\e0b0";
321 | }
322 | .icon-upload:before {
323 | content: "\e0a1";
324 | }
325 | .icon-stop:before {
326 | content: "\e0a0";
327 | }
328 | .icon-shuffle:before {
329 | content: "\e09f";
330 | }
331 | .icon-rewind:before {
332 | content: "\e09e";
333 | }
334 | .icon-brightness-medium:before {
335 | content: "\e0ba";
336 | }
337 | .icon-call:before {
338 | content: "\e0bb";
339 | }
340 | .icon-camera:before {
341 | content: "\e0bc";
342 | }
343 | .icon-dashboard:before {
344 | content: "\e0bd";
345 | }
346 | .icon-dial:before {
347 | content: "\e0be";
348 | }
349 | .icon-hang-up:before {
350 | content: "\e0bf";
351 | }
352 | .icon-power-auto:before {
353 | content: "\e0c0";
354 | }
355 | .icon-power-none:before {
356 | content: "\e0c1";
357 | }
358 | .icon-power:before {
359 | content: "\e0c2";
360 | }
361 | .icon-location-target:before {
362 | content: "\e0c3";
363 | }
364 | .icon-location-off:before {
365 | content: "\e0c4";
366 | }
367 | .icon-location-searching:before {
368 | content: "\e0c5";
369 | }
370 | .icon-microphone:before {
371 | content: "\e0c6";
372 | }
373 | .icon-microphone-off:before {
374 | content: "\e0c7";
375 | }
376 | .icon-clock:before {
377 | content: "\e0d5";
378 | }
379 | .icon-camera-video-rotate:before {
380 | content: "\e0d4";
381 | }
382 | .icon-camera-rotate:before {
383 | content: "\e0d3";
384 | }
385 | .icon-storage:before {
386 | content: "\e0d2";
387 | }
388 | .icon-locked:before {
389 | content: "\e0d1";
390 | }
391 | .icon-storage-sd:before {
392 | content: "\e0d0";
393 | }
394 | .icon-screen-lock-portrait:before {
395 | content: "\e0ce";
396 | }
397 | .icon-screen-rotate:before {
398 | content: "\e0cf";
399 | }
400 | .icon-screen-lock-landscape:before {
401 | content: "\e0cd";
402 | }
403 | .icon-call-volume:before {
404 | content: "\e0cc";
405 | }
406 | .icon-unlocked:before {
407 | content: "\e0cb";
408 | }
409 | .icon-new-account:before {
410 | content: "\e0ca";
411 | }
412 | .icon-signal:before {
413 | content: "\e0c9";
414 | }
415 | .icon-signal-2:before {
416 | content: "\e0c8";
417 | }
418 | .icon-usb:before {
419 | content: "\e0d6";
420 | }
421 | .icon-mouse:before {
422 | content: "\e0f6";
423 | }
424 | .icon-smartphone:before {
425 | content: "\e0f7";
426 | }
427 | .icon-fries:before {
428 | content: "\e000";
429 | }
430 | .icon-video:before {
431 | content: "\e0d7";
432 | }
433 | .icon-volume-off:before {
434 | content: "\e0d8";
435 | }
436 | .icon-volume-adjust:before {
437 | content: "\e0d9";
438 | }
439 | .icon-airplane:before {
440 | content: "\e0e0";
441 | }
442 | .icon-airplane-2:before {
443 | content: "\e0e1";
444 | }
445 | .icon-alert:before {
446 | content: "\e0e2";
447 | }
448 | .icon-alert-2:before {
449 | content: "\e0e3";
450 | }
451 | .icon-laptop:before {
452 | content: "\e0f0";
453 | }
454 | .icon-desktop:before {
455 | content: "\e0f1";
456 | }
457 | .icon-joystick:before {
458 | content: "\e0f2";
459 | }
460 | .icon-headphones:before {
461 | content: "\e0f3";
462 | }
463 | .icon-headphones-mic:before {
464 | content: "\e0f4";
465 | }
466 | .icon-keyboard:before {
467 | content: "\e0f5";
468 | }
469 | .icon-up-button:before {
470 | content: "\e00a";
471 | }
472 |
--------------------------------------------------------------------------------
/dist/fries.min.js:
--------------------------------------------------------------------------------
1 | /* fries.min.js (v2.0.5) 26-09-2014 */
2 | !function(){var a=function(){for(var a=document.querySelectorAll(".action-bar"),b=a.length,c=document.querySelectorAll(".action-overflow"),d=c.length;c&&d--;)c[d].parentNode.removeChild(c[d]);if(window.innerWidth<=480)for(;b--;){var e=a[b].querySelector(".actions"),f=a[b].querySelectorAll(".actions .action");if(f.length>2&&"false"!==e.getAttribute("data-overflow")){var g=(f[0],f.length),h=document.createElement("ol"),i=document.createElement("li"),j=document.createElement("a"),k=document.createElement("i");h.setAttribute("reversed","reversed"),h.classList.add("action-overflow-list"),h.classList.add("spinner");for(var l=1;g>l;l++){f[l].parentNode.classList.add("action-overflow-hidden");var m=document.createElement("li"),n=document.createElement("a");n.innerHTML=f[l].getAttribute("title"),n.setAttribute("href",f[l].getAttribute("href")),n.setAttribute("data-transition",f[l].getAttribute("data-transition")),n.setAttribute("data-timeout",f[l].getAttribute("data-timeout")),n.setAttribute("data-ignore",f[l].getAttribute("data-ignore")),m.classList.add("spinner-item"),m.appendChild(n),h.appendChild(m)}j.classList.add("action"),j.classList.add("action-overflow-icon"),j.classList.add("toggle-spinner"),j.appendChild(k),i.classList.add("action-overflow"),i.appendChild(j),i.appendChild(h),a[b].querySelector(".actions").appendChild(i)}}else for(;b--;)for(var o=a[b].querySelectorAll(".actions .action"),p=o.length;p--;)o[p].parentNode.classList.remove("action-overflow-hidden")};window.addEventListener("load",a,!1),window.addEventListener("resize",a,!1),window.addEventListener("popstate",a,!1),window.addEventListener("push",a,!1)}(),this.fries=this.fries||{},function(){var a=function(a){this._init(a)};a.prototype={_dialog:null,_settings:{selector:null,callbackOk:function(){this.hide()},callbackCancel:function(){this.hide()}},_init:function(a){if(this._settings=fries.utils.merge(this._settings,a),!this._settings.selector)throw new Error("Missing parameter: selector");if(this._dialog=document.querySelector(this._settings.selector),!this._dialog)throw new Error("Could not find "+this._settings.selector+" in the DOM");this.attachEventHandlers()},attachEventHandlers:function(){this._dialog.querySelector(".dialog-ok-button").addEventListener("touchend",this._settings.callbackOk.bind(this),!1),this._dialog.querySelector(".dialog-cancel-button").addEventListener("touchend",this._settings.callbackCancel.bind(this),!1)},center:function(a){var b=getComputedStyle(a),c=b.width,d=b.height;c=c.slice(0,c.length-2),d=d.slice(0,d.length-2);var e=window.innerWidth/2-c/2,f=window.innerHeight/2-d/2;a.style.marginLeft=e+"px",a.style.marginTop=f+"px"},show:function(){function a(){c.parentNode.removeEventListener("webkitTransitionEnd",a),c.classList.add("on"),c.classList.add("push"),document.querySelector(".dialogs").addEventListener("touchend",function(a){a.target===document.querySelector(".dialogs")&&(console.log("Hiding the dialog"),this.hide())}.bind(b),!1)}var b=this,c=this._dialog;this.center(c),c.parentNode.classList.add("on"),c.parentNode.removeEventListener("webkitTransitionEnd"),c.parentNode.addEventListener("webkitTransitionEnd",a,!1),setTimeout(function(){this._dialog.parentNode.classList.add("fade-in")}.bind(this),200)},hide:function(){function a(){c.removeEventListener("webkitAnimationEnd",a),c.classList.remove("pop"),c.parentNode.classList.remove("fade-in"),c.parentNode.addEventListener("webkitTransitionEnd",b)}function b(){c.parentNode.removeEventListener("webkitTransitionEnd",b),c.parentNode.classList.remove("on")}var c=this._dialog;c.classList.remove("push"),c.classList.remove("on"),c.classList.add("pop"),c.addEventListener("webkitAnimationEnd",a,!1),document.querySelector(".dialogs").removeEventListener("touchend"),this.destroy()},destroy:function(){}},this.fries.Dialog=a}(),function(){var a=function(){for(var a=document.querySelectorAll(".input-text"),c=a.length;c--;){var d=a[c],e=document.createElement("span");d.parentNode.classList.contains("input-pretty")||(d.classList.contains("flex1")?(e.classList.add("flex1"),d.classList.remove("flex1")):d.classList.contains("flex2")?(e.classList.add("flex2"),d.classList.remove("flex2")):d.classList.contains("flex3")&&(e.classList.add("flex3"),d.classList.remove("flex3")),e.classList.add("input-pretty"),d.parentNode.insertBefore(e,d),d.parentNode.removeChild(d),e.appendChild(d),d.addEventListener("focus",b,!1),d.addEventListener("blur",b,!1))}},b=function(a){var b=a.currentTarget;b.parentNode.classList.toggle("focus")};window.addEventListener("load",a),window.addEventListener("resize",a,!1),window.addEventListener("popstate",a,!1),window.addEventListener("push",a,!1)}(),function(){var a=function(a){for(var b,c=document.querySelectorAll(".toggle-spinner");a&&a!==document;a=a.parentNode)for(b=c.length;b--;)if(c[b]===a)return a},b=function(b){var c=a(b.target);if(c)return c},c=function(a){for(var b,c=document.querySelectorAll(".spinner-item");a&&a!==document;a=a.parentNode)for(b=c.length;b--;)if(c[b]===a)return a},d=function(a){var b=c(a.target);if(b)return b},e=function(a){var c=b(a);c&&(a.preventDefault(),f(c))},f=function(a){function b(){c.classList.contains("active")||(c.style.display="none")}var c=a.parentNode.querySelectorAll(".spinner")[0];c.classList.contains("active")||(c.style.display="block"),setTimeout(function(){c.classList.toggle("active"),c.addEventListener("webkitTransitionEnd",b)},20)};document.addEventListener("touchend",function(a){if(!d(a)&&!b(a))for(var c=document.querySelectorAll(".spinner"),e=c.length;e--;)c[e].classList.remove("active")}),window.addEventListener("touchend",e,!1)}(),function(){var a,b=20,c=sessionStorage,d={},e=function(a,b){k.id=a.id,b&&(a=h(a.id)),c[a.id]=JSON.stringify(a),window.history.replaceState(a.id,a.title,a.url),d[a.id]=document.body.cloneNode(!0)},f=function(){var a=k.id,d=JSON.parse(c.cacheForwardStack||"[]"),e=JSON.parse(c.cacheBackStack||"[]");for(e.push(a);d.length;)delete c[d.shift()];for(;e.length>b;)delete c[e.shift()];window.history.pushState(null,"",c[k.id].url),c.cacheForwardStack=JSON.stringify(d),c.cacheBackStack=JSON.stringify(e)},g=function(a,b){var d="forward"==b,e=JSON.parse(c.cacheForwardStack||"[]"),f=JSON.parse(c.cacheBackStack||"[]"),g=d?f:e,h=d?e:f;k.id&&g.push(k.id),h.pop(),c.cacheForwardStack=JSON.stringify(e),c.cacheBackStack=JSON.stringify(f)},h=function(a){return JSON.parse(c[a]||null)||{}},i=function(a){var b=s(a);if(b)return a.preventDefault(),"pop"!=b.getAttribute("data-transition")||b.classList.contains("up")?(k({url:b.getAttribute("href"),hash:b.hash,container:".page",timeout:b.getAttribute("data-timeout"),transition:b.getAttribute("data-transition")}),void 0):(window.history.go(-1),q(),void 0)},j=function(a){var b,e,f,i,j,m,n=a.state;if(n&&c[n]){if(f=k.id]*>([\s\S.]*)<\/head>/i)[0],body.innerHTML=d.match(/]*>([\s\S.]*)<\/body>/i)[0]):(head=body=document.createElement("div"),head.innerHTML=d),c.title=head.querySelector("title"),c.title=c.title&&c.title.innerText.trim(),c.contents=body.querySelector(".page"),c):c},q=function(){"undefined"==typeof CustomEvent&&(CustomEvent=function(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,b.bubbles,b.cancelable,b.detail),c});var a=new CustomEvent("push",{detail:{state:h(k.id)},bubbles:!0,cancelable:!0});setTimeout(function(){window.dispatchEvent(a)},200)},r=function(a){for(var b,c=document.querySelectorAll("a");a&&a!==document;a=a.parentNode)for(b=c.length;b--;)if(c[b]===a)return a},s=function(b){var c=r(b.target);if(!(!c||b.which>1||b.metaKey||b.ctrlKey||a||location.protocol!==c.protocol||location.host!==c.host||!c.hash&&/#/.test(c.href)||c.hash&&c.href.replace(c.hash,"")===location.href.replace(location.hash,"")||"true"==c.getAttribute("data-ignore")))return c};window.addEventListener("touchstart",function(){a=!1}),window.addEventListener("touchmove",function(){a=!0}),window.addEventListener("touchend",i),window.addEventListener("popstate",j)}(),function(){var a=function(a){for(var b,c=document.querySelectorAll(".tab-fixed li a");a&&a!==document;a=a.parentNode)for(b=c.length;b--;)if(c[b]===a)return a};window.addEventListener("touchend",function(b){function c(a){a.target.classList.remove("in-transition")}var d,e,f,g,h="active",i="."+h,j=a(b.target);if(j&&(b.preventDefault(),b.preventDefault(),g=j.parentNode,d=g.parentNode.querySelector(i),d&&d.classList.remove(h),g.classList.add(h),f=document.querySelector(j.hash))){e=f.parentNode.querySelector(i),e&&e.classList.remove(h),f.classList.add(h);for(var k=document.querySelectorAll(".tab-item"),l=k.length;l--;)k[l].classList.add("in-transition"),k[l].style.left=100*l+"%",k[l]==f&&(targetIndex=l),k[l]==e&&(activeIndex=l);l=k.length,setTimeout(function(){for(;l--;)k[l].style.webkitTransform="translateX("+(0===targetIndex?0:"-"+100*targetIndex)+"%)",k[l].addEventListener("webkitTransitionEnd",c)},50)}})}(),this.fries=this.fries||{},function(){var a=function(a){this._init(a)};a.duration={SHORT:3e3,LONG:5e3},a.prototype={_toast:null,_settings:{content:"Please follow @jaunesarmiento on Twitter.",duration:a.duration.SHORT,position:"bottom"},_init:function(a){if(this._settings=fries.utils.merge(this._settings,a),void 0===this._settings.content)throw new Error("Error: missing paramter content.");this._toast=document.createElement("div"),this._toast.classList.add("toast");var b=document.createElement("p");switch(b.classList.add("toast-message"),this._settings.position){case"top":this._toast.style.top="72px";break;case"center":break;default:this._toast.style.bottom="72px"}this._toast.appendChild(b),document.body.appendChild(this._toast),this.show()},setContent:function(a){this._settings.content=a.trim(),this._toast.querySelector(".toast-message").innerHTML=this._settings.content},show:function(){this.setContent(this._settings.content);var a=getComputedStyle(this._toast.childNodes[0]).width;a=a.slice(0,a.length-2);var b=window.innerWidth/2-a/2;this._toast.style.marginLeft=b+"px",this._toast.classList.add("on"),setTimeout(function(){this._toast.classList.add("fade-in"),setTimeout(this.hide.bind(this),this._settings.duration)}.bind(this),50)},hide:function(){this._toast.addEventListener("webkitTransitionEnd",function(a){a.target.classList.remove("on"),this.destroy(a.target)}.bind(this),!1),this._toast.classList.remove("fade-in")},destroy:function(a){document.body.removeChild(a)}},this.fries.Toast=a}(),this.fries=this.fries||{},function(){var a={merge:function(a,b){var c,d={};for(c in a)d[c]=a[c];for(c in b)d[c]=b[c];return d}};fries.utils=a}();
--------------------------------------------------------------------------------
/lib/sass/holo-dark/forms.scss:
--------------------------------------------------------------------------------
1 | @import "variables", "utilities";
2 |
3 | form {
4 | width: 100%;
5 | @include box-sizing(border-box);
6 |
7 | &.form-flex {
8 |
9 | .flex-group {
10 | @include flexbox;
11 |
12 | margin: 0;
13 |
14 | .flex1 {
15 | @include box-flex(1);
16 | }
17 |
18 | .flex2 {
19 | @include box-flex(2);
20 | }
21 |
22 | .flex3 {
23 | @include box-flex(3);
24 | }
25 |
26 | > :nth-child(n) {
27 | margin-left: 10px;
28 | }
29 |
30 | > :first-child {
31 | margin-left: 0;
32 | }
33 | }
34 |
35 | }
36 | }
37 |
38 | [class*="flex"].input-text + [class*="flex"].input-text {
39 | margin-left: 10px;
40 | }
41 |
42 | .input-text {
43 | @include box-sizing(border-box);
44 | display: block;
45 | outline: none;
46 | border: none;
47 | border-bottom: 1px solid $input-text-border-color;
48 | padding: 10px 10px 0;
49 | width: 100%;
50 | height: $bar-height;
51 | background: transparent;
52 | color: $input-text-color;
53 | font-size: 14px;
54 | vertical-align: middle;
55 | -webkit-transition: border ease-out 0.2s;
56 | -moz-transition: border ease-out 0.2s;
57 | transition: border ease-out 0.2s;
58 | -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
59 | font-family: $base-font-family;
60 | font-weight: normal;
61 |
62 | &:focus {
63 | border-bottom: 1px solid $input-text-border-highlight-color;
64 | }
65 |
66 | &[type="password"] {
67 | font-family: $mono-font-family;
68 | }
69 | }
70 |
71 | legend.form-legend,
72 | label.block-label {
73 | @include box-sizing(border-box);
74 |
75 | display: block;
76 | padding: 5px 5px 3px;
77 | margin-top: 10px;
78 | width: 100%;
79 | border-bottom: 2px solid $form-legend-label-border-color;
80 | font-size: 14px;
81 | font-weight: bold;
82 | line-height: 18px;
83 | text-transform: uppercase;
84 | color: $form-legend-label-text-color;
85 | }
86 |
87 | label.inline-label {
88 | display: block;
89 | }
90 |
91 | .form-actions {
92 | margin-top: 20px;
93 | }
94 |
95 | .input-pretty {
96 | position: relative;
97 | display: block;
98 | margin-bottom: 8px;
99 |
100 | &:before,
101 | &:after {
102 | position: absolute;
103 | content: '';
104 | bottom: 0;
105 | height: 5px;
106 | width: 1px;
107 | background: $input-text-border-color;
108 | -webkit-transition: background ease-out 0.2s;
109 | -moz-transition: background ease-out 0.2s;
110 | transition: background ease-out 0.2s;
111 | }
112 |
113 | &:before {
114 | left: 0;
115 | }
116 |
117 | &:after {
118 | right: 0;
119 | }
120 |
121 | &.focus {
122 |
123 | &:before,
124 | &:after {
125 | background: $input-text-border-highlight-color;
126 | }
127 |
128 | }
129 | }
130 |
131 | .input-switch-wrapper {
132 | position: relative;
133 | display: inline-block;
134 | width: 96px;
135 |
136 | padding: 12px 0;
137 |
138 | -webkit-user-select: none;
139 | -moz-user-select: none;
140 | -ms-user-select: none;
141 |
142 | .input-switch {
143 | display: none;
144 |
145 | &:checked + .input-switch-outer .input-switch-button {
146 | background-color: $primary-button-active-color;
147 |
148 | -webkit-transform: translateX(100%);
149 | transform: translateX(100%);
150 |
151 | &:before {
152 | content: 'On';
153 | }
154 | }
155 | }
156 |
157 | .input-switch-outer {
158 | display: block;
159 | overflow: hidden;
160 | cursor: pointer;
161 | border: 0px solid $input-switch-border-color;
162 | border-radius: 0px;
163 |
164 | .input-switch-inner {
165 |
166 | background: $input-switch-background-color;
167 |
168 | .input-switch-button {
169 | @include border-radius(2px);
170 |
171 | position: relative;
172 | width: 48px;
173 | height: 24px;
174 | font-size: 14px;
175 | font-weight: 200;
176 | text-transform: uppercase;
177 | text-align: center;
178 | line-height: 24px;
179 | background-color: $input-switch-button-color;
180 | color: $input-switch-text-color;
181 |
182 | -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.5), inset 0 -1px 0 rgba(0, 0, 0, 0.25), 0 2px 3px rgba(0,0,0,0.5);
183 | -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.5), inset 0 -1px 0 rgba(0, 0, 0, 0.25), inset 0 2px 0 rgba(0, 0, 0, 0.25), 0 2px 3px rgba(0,0,0,0.5);
184 | box-shadow: inset 0 1px 0 rgba(255,255,255,0.5), inset 0 -1px 0 rgba(0, 0, 0, 0.25), 0 2px 3px rgba(0,0,0,0.5);
185 |
186 | -webkit-transition: all 0.1s ease-out;
187 | transition: all 0.1s ease-out;
188 |
189 | -webkit-transform: translateX(0);
190 | transform: translateX(0);
191 |
192 | &:before {
193 | @include absolute-position(0, 0, 0, 0);
194 | content: 'Off';
195 | width: 100%;
196 | height: 100%;
197 | }
198 | }
199 |
200 | }
201 | }
202 | }
203 |
204 | .input-radio-wrapper {
205 | display: inline-block;
206 | width: 32px;
207 | height: 32px;
208 | padding: 8px;
209 |
210 | -webkit-user-select: none;
211 | -moz-user-select: none;
212 | -ms-user-select: none;
213 |
214 | .input-radio {
215 | position: absolute;
216 | left: -9999px;
217 |
218 | &:checked {
219 |
220 | &[disabled] {
221 | + .input-radio-inner .input-radio-button {
222 | background: rgba($gray-dark, 0.8);
223 |
224 | -webkit-box-shadow: 0 0 4px rgba($gray-dark, 0.8), inset 0 1px 0 rgba($white, 0.5);
225 | -moz-box-shadow: 0 0 4px rgba($gray-dark, 0.8), inset 0 1px 0 rgba($white, 0.5);
226 | box-shadow: 0 0 4px rgba($gray-dark, 0.8), inset 0 1px 0 rgba($white, 0.5);
227 | }
228 | }
229 |
230 | + .input-radio-inner .input-radio-button {
231 | background: $primary-color;
232 |
233 | -webkit-box-shadow: 0 0 4px rgba($primary-color, 0.8), inset 0 1px 0 rgba($white, 0.5);
234 | -moz-box-shadow: 0 0 4px rgba($primary-color, 0.8), inset 0 1px 0 rgba($white, 0.5);
235 | box-shadow: 0 0 4px rgba($primary-color, 0.8), inset 0 1px 0 rgba($white, 0.5);
236 | }
237 | }
238 |
239 | &:active + .input-radio-inner {
240 | background: rgba($primary-color, 0.5);
241 | border-color: rgba($white, 0.8);
242 |
243 | -webkit-box-shadow: 0 0 2px 7px rgba($primary-color, 0.5);
244 | -moz-box-shadow: 0 0 2px 7px rgba($primary-color, 0.5);
245 | box-shadow: 0 0 2px 7px rgba($primary-color, 0.5);
246 | }
247 |
248 | &[disabled] + .input-radio-inner {
249 | border-color: rgba($gray-dark, 0.8);
250 | }
251 |
252 | &:focus {
253 |
254 | &[disabled] {
255 | + .input-radio-inner:before {
256 | border-color: rgba($secondary-color, 0.6);
257 | }
258 | }
259 |
260 | + .input-radio-inner:before {
261 | @include border-radius(20px);
262 | position: absolute;
263 | display: block;
264 | content: '';
265 | top: -4px;
266 | left: -4px;
267 | width: 20px;
268 | height: 20px;
269 | border: 1px solid $secondary-color;
270 | }
271 | }
272 | }
273 |
274 | .input-radio-inner {
275 | @include border-radius(16px);
276 |
277 | position: relative;
278 | display: block;
279 | width: 16px;
280 | height: 16px;
281 | border: 1px solid $primary-button-color;
282 | cursor: pointer;
283 |
284 | -webkit-transition: all 0.1s ease-out;
285 | transition: all 0.1s ease-out;
286 |
287 | &:active {
288 | background: rgba($primary-color, 0.5);
289 | border-color: rgba($white, 0.8);
290 |
291 | -webkit-box-shadow: 0 0 2px 7px rgba($primary-color, 0.5);
292 | -moz-box-shadow: 0 0 2px 7px rgba($primary-color, 0.5);
293 | box-shadow: 0 0 2px 7px rgba($primary-color, 0.5);
294 | }
295 |
296 | &:focus {
297 | outline: none;
298 | }
299 |
300 | .input-radio-button {
301 | @include border-radius(8px);
302 |
303 | width: 8px;
304 | height: 8px;
305 | margin: 3px;
306 |
307 | background: transparent;
308 | }
309 | }
310 | }
311 |
312 | .input-checkbox-wrapper {
313 |
314 | display: block;
315 | width: 32px;
316 | height: 32px;
317 | padding: 8px;
318 |
319 | -webkit-user-select: none;
320 | -moz-user-select: none;
321 | -ms-user-select: none;
322 |
323 | .input-checkbox {
324 | position: absolute;
325 | left: -9999px;
326 |
327 | &:checked {
328 |
329 | &[disabled] {
330 | + .input-checkbox-outer .input-checkbox-button {
331 | background: transparent;
332 |
333 | &:before {
334 | border-color: rgba($gray-dark, 0.8);
335 | }
336 |
337 | &:after {
338 | border-color: transparent;
339 | }
340 | }
341 | }
342 |
343 | &:active:not([disabled]) {
344 | + .input-checkbox-outer .input-checkbox-button {
345 | border-color: transparent;
346 |
347 | &:before {
348 | border-color: $white;
349 | }
350 |
351 | &:after {
352 | border-color: rgba($white, 0.5)
353 | }
354 | }
355 |
356 | }
357 |
358 | + .input-checkbox-outer .input-checkbox-button {
359 | position: absolute;
360 | top: -9px;
361 | width: 10px;
362 | right: -4px;
363 | height: 18px;
364 | border: solid #222;
365 | border-width: 0 6px 6px 0;
366 |
367 | -webkit-transform: rotate(45deg);
368 | -moz-transform: rotate(45deg);
369 | transform: rotate(45deg);
370 |
371 | &:before,
372 | &:after {
373 | position: absolute;
374 | content: '';
375 | width: 5px;
376 | }
377 |
378 | &:before {
379 | top: 2px;
380 | right: -5px;
381 | height: 12px;
382 | border: solid $primary-color;
383 | border-width: 0 3px 3px 0;
384 | height: 12px;
385 | }
386 |
387 | &:after {
388 | top: 1px;
389 | right: -4px;
390 | height: 15px;
391 | border: solid rgba($primary-color, 0.5);
392 | border-width: 0 2px 2px 0;
393 |
394 | -webkit-filter: blur(2px);
395 | -moz-filter: blur(2px);
396 | filter: blur(2px);
397 | }
398 | }
399 | }
400 |
401 | &:active + .input-checkbox-outer {
402 | background: rgba($primary-color, 0.5);
403 | border-color: rgba($white, 0.8);
404 |
405 | -webkit-box-shadow: 0 0 2px 7px rgba($primary-color, 0.5);
406 | -moz-box-shadow: 0 0 2px 7px rgba($primary-color, 0.5);
407 | box-shadow: 0 0 2px 7px rgba($primary-color, 0.5);
408 | }
409 |
410 | &[disabled] + .input-checkbox-outer {
411 | border-color: rgba($gray-dark, 0.8);
412 | }
413 |
414 | &:focus {
415 |
416 | &[disabled] {
417 | + .input-checkbox-outer:before {
418 | border-color: rgba($secondary-color, 0.6);
419 | }
420 | }
421 |
422 | + .input-checkbox-outer:before {
423 | position: absolute;
424 | display: block;
425 | content: '';
426 | top: -4px;
427 | left: -4px;
428 | width: 20px;
429 | height: 20px;
430 | border: 1px solid $secondary-color;
431 | }
432 | }
433 | }
434 |
435 | .input-checkbox-outer {
436 |
437 | position: relative;
438 | display: block;
439 | width: 16px;
440 | height: 16px;
441 | border: 1px solid $primary-button-color;
442 | cursor: pointer;
443 |
444 | -webkit-transition: all 0.1s ease-out;
445 | transition: all 0.1s ease-out;
446 |
447 | &:active {
448 | background: rgba($primary-color, 0.5);
449 | border-color: rgba($white, 0.8);
450 |
451 | -webkit-box-shadow: 0 0 2px 7px rgba($primary-color, 0.5);
452 | -moz-box-shadow: 0 0 2px 7px rgba($primary-color, 0.5);
453 | box-shadow: 0 0 2px 7px rgba($primary-color, 0.5);
454 | }
455 |
456 | &:focus {
457 | outline: none;
458 | }
459 |
460 | .input-checkbox-button {
461 |
462 | width: 8px;
463 | height: 8px;
464 | margin: 3px;
465 |
466 | background: transparent;
467 | }
468 | }
469 | }
--------------------------------------------------------------------------------
/dist/css/holo-dark/icomoon.css:
--------------------------------------------------------------------------------
1 | @font-face {
2 | font-family: 'icomoon';
3 | src: url("../../fonts/icomoon.eot");
4 | src: url("../../fonts/icomoon.eot?#iefix") format("embedded-opentype"), url("../../fonts/icomoon.woff") format("woff"), url("../../fonts/icomoon.ttf") format("truetype"), url("../../fonts/icomoon.svg#icomoon") format("svg");
5 | font-weight: normal;
6 | font-style: normal; }
7 | /* Use the following CSS code if you want to use data attributes for inserting your icons */
8 | [data-icon]:before {
9 | font-family: 'icomoon';
10 | content: attr(data-icon);
11 | speak: none;
12 | font-weight: normal;
13 | font-variant: normal;
14 | text-transform: none;
15 | line-height: 1;
16 | -webkit-font-smoothing: antialiased; }
17 |
18 | /* Use the following CSS code if you want to have a class per icon */
19 | /*
20 | Instead of a list of all class selectors,
21 | you can use the generic selector below, but it's slower:
22 | [class*="icon-"] {
23 | */
24 | .icon-back, .icon-accept, .icon-cancel, .icon-chevron-up, .icon-chevron-down, .icon-forward, .icon-chevron-right, .icon-chevron-left, .icon-refresh, .icon-information, .icon-help, .icon-search, .icon-settings, .icon-vote-down, .icon-heart, .icon-star-half, .icon-vote-up, .icon-star-full, .icon-star-empty, .icon-cloud, .icon-folder, .icon-calendar, .icon-tags, .icon-add-tag, .icon-sort-by-size, .icon-grid, .icon-view-as-list, .icon-attachment, .icon-new-image, .icon-new-event, .icon-new-attachment, .icon-new-message, .icon-new, .icon-merge, .icon-import-export, .icon-calendar-event, .icon-mail, .icon-edit, .icon-trash, .icon-cut, .icon-copy, .icon-backspace, .icon-clipboard, .icon-image, .icon-read, .icon-remove, .icon-save, .icon-select-all, .icon-split, .icon-undo, .icon-unread, .icon-add-group, .icon-add-person, .icon-cc-bcc, .icon-chat, .icon-forward-2, .icon-slideshow, .icon-rotate-right, .icon-rotate-left, .icon-globe, .icon-crop, .icon-location-marker, .icon-map, .icon-direction, .icon-share, .icon-send, .icon-reply-all, .icon-reply, .icon-person, .icon-group, .icon-add-to-queue, .icon-download, .icon-fast-forward, .icon-full-screen, .icon-pin, .icon-next, .icon-pause, .icon-pause-2, .icon-play, .icon-play-2, .icon-previous, .icon-repeat, .icon-replay, .icon-return-from-full-screen, .icon-brightness-high, .icon-brightness-auto, .icon-bluetooth-searching, .icon-bluetooth-connected, .icon-bluetooth, .icon-brightness, .icon-battery, .icon-add-alarm, .icon-alarm, .icon-key, .icon-upload, .icon-stop, .icon-shuffle, .icon-rewind, .icon-brightness-medium, .icon-call, .icon-camera, .icon-dashboard, .icon-dial, .icon-hang-up, .icon-power-auto, .icon-power-none, .icon-power, .icon-location-target, .icon-location-off, .icon-location-searching, .icon-microphone, .icon-microphone-off, .icon-clock, .icon-camera-video-rotate, .icon-camera-rotate, .icon-storage, .icon-locked, .icon-storage-sd, .icon-screen-lock-portrait, .icon-screen-rotate, .icon-screen-lock-landscape, .icon-call-volume, .icon-unlocked, .icon-new-account, .icon-signal, .icon-signal-2, .icon-usb, .icon-mouse, .icon-smartphone, .icon-fries, .icon-video, .icon-volume-off, .icon-volume-adjust, .icon-airplane, .icon-airplane-2, .icon-alert, .icon-alert-2, .icon-laptop, .icon-desktop, .icon-joystick, .icon-headphones, .icon-headphones-mic, .icon-keyboard, .icon-up-button {
25 | font-family: 'icomoon';
26 | speak: none;
27 | font-style: normal;
28 | font-weight: normal;
29 | font-variant: normal;
30 | text-transform: none;
31 | line-height: 1;
32 | -webkit-font-smoothing: antialiased; }
33 |
34 | .icon-back:before {
35 | content: "\e001"; }
36 |
37 | .icon-accept:before {
38 | content: "\e002"; }
39 |
40 | .icon-cancel:before {
41 | content: "\e003"; }
42 |
43 | .icon-chevron-up:before {
44 | content: "\e004"; }
45 |
46 | .icon-chevron-down:before {
47 | content: "\e005"; }
48 |
49 | .icon-forward:before {
50 | content: "\e006"; }
51 |
52 | .icon-chevron-right:before {
53 | content: "\e007"; }
54 |
55 | .icon-chevron-left:before {
56 | content: "\e008"; }
57 |
58 | .icon-refresh:before {
59 | content: "\e009"; }
60 |
61 | .icon-information:before {
62 | content: "\e010"; }
63 |
64 | .icon-help:before {
65 | content: "\e011"; }
66 |
67 | .icon-search:before {
68 | content: "\e012"; }
69 |
70 | .icon-settings:before {
71 | content: "\e013"; }
72 |
73 | .icon-vote-down:before {
74 | content: "\e020"; }
75 |
76 | .icon-heart:before {
77 | content: "\e021"; }
78 |
79 | .icon-star-half:before {
80 | content: "\e023"; }
81 |
82 | .icon-vote-up:before {
83 | content: "\e022"; }
84 |
85 | .icon-star-full:before {
86 | content: "\e024"; }
87 |
88 | .icon-star-empty:before {
89 | content: "\e025"; }
90 |
91 | .icon-cloud:before {
92 | content: "\e030"; }
93 |
94 | .icon-folder:before {
95 | content: "\e031"; }
96 |
97 | .icon-calendar:before {
98 | content: "\e032"; }
99 |
100 | .icon-tags:before {
101 | content: "\e033"; }
102 |
103 | .icon-add-tag:before {
104 | content: "\e034"; }
105 |
106 | .icon-sort-by-size:before {
107 | content: "\e035"; }
108 |
109 | .icon-grid:before {
110 | content: "\e036"; }
111 |
112 | .icon-view-as-list:before {
113 | content: "\e037"; }
114 |
115 | .icon-attachment:before {
116 | content: "\e040"; }
117 |
118 | .icon-new-image:before {
119 | content: "\e04e"; }
120 |
121 | .icon-new-event:before {
122 | content: "\e04d"; }
123 |
124 | .icon-new-attachment:before {
125 | content: "\e04b"; }
126 |
127 | .icon-new-message:before {
128 | content: "\e04c"; }
129 |
130 | .icon-new:before {
131 | content: "\e04a"; }
132 |
133 | .icon-merge:before {
134 | content: "\e049"; }
135 |
136 | .icon-import-export:before {
137 | content: "\e048"; }
138 |
139 | .icon-calendar-event:before {
140 | content: "\e047"; }
141 |
142 | .icon-mail:before {
143 | content: "\e046"; }
144 |
145 | .icon-edit:before {
146 | content: "\e045"; }
147 |
148 | .icon-trash:before {
149 | content: "\e044"; }
150 |
151 | .icon-cut:before {
152 | content: "\e043"; }
153 |
154 | .icon-copy:before {
155 | content: "\e042"; }
156 |
157 | .icon-backspace:before {
158 | content: "\e041"; }
159 |
160 | .icon-clipboard:before {
161 | content: "\e04f"; }
162 |
163 | .icon-image:before {
164 | content: "\e050"; }
165 |
166 | .icon-read:before {
167 | content: "\e051"; }
168 |
169 | .icon-remove:before {
170 | content: "\e052"; }
171 |
172 | .icon-save:before {
173 | content: "\e053"; }
174 |
175 | .icon-select-all:before {
176 | content: "\e054"; }
177 |
178 | .icon-split:before {
179 | content: "\e055"; }
180 |
181 | .icon-undo:before {
182 | content: "\e056"; }
183 |
184 | .icon-unread:before {
185 | content: "\e057"; }
186 |
187 | .icon-add-group:before {
188 | content: "\e060"; }
189 |
190 | .icon-add-person:before {
191 | content: "\e061"; }
192 |
193 | .icon-cc-bcc:before {
194 | content: "\e062"; }
195 |
196 | .icon-chat:before {
197 | content: "\e063"; }
198 |
199 | .icon-forward-2:before {
200 | content: "\e064"; }
201 |
202 | .icon-slideshow:before {
203 | content: "\e083"; }
204 |
205 | .icon-rotate-right:before {
206 | content: "\e082"; }
207 |
208 | .icon-rotate-left:before {
209 | content: "\e081"; }
210 |
211 | .icon-globe:before {
212 | content: "\e073"; }
213 |
214 | .icon-crop:before {
215 | content: "\e080"; }
216 |
217 | .icon-location-marker:before {
218 | content: "\e072"; }
219 |
220 | .icon-map:before {
221 | content: "\e071"; }
222 |
223 | .icon-direction:before {
224 | content: "\e070"; }
225 |
226 | .icon-share:before {
227 | content: "\e06a"; }
228 |
229 | .icon-send:before {
230 | content: "\e069"; }
231 |
232 | .icon-reply-all:before {
233 | content: "\e068"; }
234 |
235 | .icon-reply:before {
236 | content: "\e067"; }
237 |
238 | .icon-person:before {
239 | content: "\e066"; }
240 |
241 | .icon-group:before {
242 | content: "\e065"; }
243 |
244 | .icon-add-to-queue:before {
245 | content: "\e090"; }
246 |
247 | .icon-download:before {
248 | content: "\e091"; }
249 |
250 | .icon-fast-forward:before {
251 | content: "\e092"; }
252 |
253 | .icon-full-screen:before {
254 | content: "\e093"; }
255 |
256 | .icon-pin:before {
257 | content: "\e094"; }
258 |
259 | .icon-next:before {
260 | content: "\e095"; }
261 |
262 | .icon-pause:before {
263 | content: "\e096"; }
264 |
265 | .icon-pause-2:before {
266 | content: "\e097"; }
267 |
268 | .icon-play:before {
269 | content: "\e098"; }
270 |
271 | .icon-play-2:before {
272 | content: "\e099"; }
273 |
274 | .icon-previous:before {
275 | content: "\e09a"; }
276 |
277 | .icon-repeat:before {
278 | content: "\e09b"; }
279 |
280 | .icon-replay:before {
281 | content: "\e09c"; }
282 |
283 | .icon-return-from-full-screen:before {
284 | content: "\e09d"; }
285 |
286 | .icon-brightness-high:before {
287 | content: "\e0b9"; }
288 |
289 | .icon-brightness-auto:before {
290 | content: "\e0b8"; }
291 |
292 | .icon-bluetooth-searching:before {
293 | content: "\e0b7"; }
294 |
295 | .icon-bluetooth-connected:before {
296 | content: "\e0b6"; }
297 |
298 | .icon-bluetooth:before {
299 | content: "\e0b5"; }
300 |
301 | .icon-brightness:before {
302 | content: "\e0b4"; }
303 |
304 | .icon-battery:before {
305 | content: "\e0b3"; }
306 |
307 | .icon-add-alarm:before {
308 | content: "\e0b1"; }
309 |
310 | .icon-alarm:before {
311 | content: "\e0b2"; }
312 |
313 | .icon-key:before {
314 | content: "\e0b0"; }
315 |
316 | .icon-upload:before {
317 | content: "\e0a1"; }
318 |
319 | .icon-stop:before {
320 | content: "\e0a0"; }
321 |
322 | .icon-shuffle:before {
323 | content: "\e09f"; }
324 |
325 | .icon-rewind:before {
326 | content: "\e09e"; }
327 |
328 | .icon-brightness-medium:before {
329 | content: "\e0ba"; }
330 |
331 | .icon-call:before {
332 | content: "\e0bb"; }
333 |
334 | .icon-camera:before {
335 | content: "\e0bc"; }
336 |
337 | .icon-dashboard:before {
338 | content: "\e0bd"; }
339 |
340 | .icon-dial:before {
341 | content: "\e0be"; }
342 |
343 | .icon-hang-up:before {
344 | content: "\e0bf"; }
345 |
346 | .icon-power-auto:before {
347 | content: "\e0c0"; }
348 |
349 | .icon-power-none:before {
350 | content: "\e0c1"; }
351 |
352 | .icon-power:before {
353 | content: "\e0c2"; }
354 |
355 | .icon-location-target:before {
356 | content: "\e0c3"; }
357 |
358 | .icon-location-off:before {
359 | content: "\e0c4"; }
360 |
361 | .icon-location-searching:before {
362 | content: "\e0c5"; }
363 |
364 | .icon-microphone:before {
365 | content: "\e0c6"; }
366 |
367 | .icon-microphone-off:before {
368 | content: "\e0c7"; }
369 |
370 | .icon-clock:before {
371 | content: "\e0d5"; }
372 |
373 | .icon-camera-video-rotate:before {
374 | content: "\e0d4"; }
375 |
376 | .icon-camera-rotate:before {
377 | content: "\e0d3"; }
378 |
379 | .icon-storage:before {
380 | content: "\e0d2"; }
381 |
382 | .icon-locked:before {
383 | content: "\e0d1"; }
384 |
385 | .icon-storage-sd:before {
386 | content: "\e0d0"; }
387 |
388 | .icon-screen-lock-portrait:before {
389 | content: "\e0ce"; }
390 |
391 | .icon-screen-rotate:before {
392 | content: "\e0cf"; }
393 |
394 | .icon-screen-lock-landscape:before {
395 | content: "\e0cd"; }
396 |
397 | .icon-call-volume:before {
398 | content: "\e0cc"; }
399 |
400 | .icon-unlocked:before {
401 | content: "\e0cb"; }
402 |
403 | .icon-new-account:before {
404 | content: "\e0ca"; }
405 |
406 | .icon-signal:before {
407 | content: "\e0c9"; }
408 |
409 | .icon-signal-2:before {
410 | content: "\e0c8"; }
411 |
412 | .icon-usb:before {
413 | content: "\e0d6"; }
414 |
415 | .icon-mouse:before {
416 | content: "\e0f6"; }
417 |
418 | .icon-smartphone:before {
419 | content: "\e0f7"; }
420 |
421 | .icon-fries:before {
422 | content: "\e000"; }
423 |
424 | .icon-video:before {
425 | content: "\e0d7"; }
426 |
427 | .icon-volume-off:before {
428 | content: "\e0d8"; }
429 |
430 | .icon-volume-adjust:before {
431 | content: "\e0d9"; }
432 |
433 | .icon-airplane:before {
434 | content: "\e0e0"; }
435 |
436 | .icon-airplane-2:before {
437 | content: "\e0e1"; }
438 |
439 | .icon-alert:before {
440 | content: "\e0e2"; }
441 |
442 | .icon-alert-2:before {
443 | content: "\e0e3"; }
444 |
445 | .icon-laptop:before {
446 | content: "\e0f0"; }
447 |
448 | .icon-desktop:before {
449 | content: "\e0f1"; }
450 |
451 | .icon-joystick:before {
452 | content: "\e0f2"; }
453 |
454 | .icon-headphones:before {
455 | content: "\e0f3"; }
456 |
457 | .icon-headphones-mic:before {
458 | content: "\e0f4"; }
459 |
460 | .icon-keyboard:before {
461 | content: "\e0f5"; }
462 |
463 | .icon-up-button:before {
464 | content: "\e00a"; }
465 |
--------------------------------------------------------------------------------