username
-description
-","
"]},sa=da(y),ta=sa.appendChild(y.createElement("div"));ra.optgroup=ra.option,ra.tbody=ra.tfoot=ra.colgroup=ra.caption=ra.thead,ra.th=ra.td;function ua(a,b){var c,d,e=0,f=typeof a.getElementsByTagName!==K?a.getElementsByTagName(b||"*"):typeof a.querySelectorAll!==K?a.querySelectorAll(b||"*"):void 0;if(!f)for(f=[],c=a.childNodes||a;null!=(d=c[e]);e++)!b||m.nodeName(d,b)?f.push(d):m.merge(f,ua(d,b));return void 0===b||b&&m.nodeName(a,b)?m.merge([a],f):f}function va(a){W.test(a.type)&&(a.defaultChecked=a.checked)}function wa(a,b){return m.nodeName(a,"table")&&m.nodeName(11!==b.nodeType?b:b.firstChild,"tr")?a.getElementsByTagName("tbody")[0]||a.appendChild(a.ownerDocument.createElement("tbody")):a}function xa(a){return a.type=(null!==m.find.attr(a,"type"))+"/"+a.type,a}function ya(a){var b=pa.exec(a.type);return b?a.type=b[1]:a.removeAttribute("type"),a}function za(a,b){for(var c,d=0;null!=(c=a[d]);d++)m._data(c,"globalEval",!b||m._data(b[d],"globalEval"))}function Aa(a,b){if(1===b.nodeType&&m.hasData(a)){var c,d,e,f=m._data(a),g=m._data(b,f),h=f.events;if(h){delete g.handle,g.events={};for(c in h)for(d=0,e=h[c].length;e>d;d++)m.event.add(b,c,h[c][d])}g.data&&(g.data=m.extend({},g.data))}}function Ba(a,b){var c,d,e;if(1===b.nodeType){if(c=b.nodeName.toLowerCase(),!k.noCloneEvent&&b[m.expando]){e=m._data(b);for(d in e.events)m.removeEvent(b,d,e.handle);b.removeAttribute(m.expando)}"script"===c&&b.text!==a.text?(xa(b).text=a.text,ya(b)):"object"===c?(b.parentNode&&(b.outerHTML=a.outerHTML),k.html5Clone&&a.innerHTML&&!m.trim(b.innerHTML)&&(b.innerHTML=a.innerHTML)):"input"===c&&W.test(a.type)?(b.defaultChecked=b.checked=a.checked,b.value!==a.value&&(b.value=a.value)):"option"===c?b.defaultSelected=b.selected=a.defaultSelected:("input"===c||"textarea"===c)&&(b.defaultValue=a.defaultValue)}}m.extend({clone:function(a,b,c){var d,e,f,g,h,i=m.contains(a.ownerDocument,a);if(k.html5Clone||m.isXMLDoc(a)||!ga.test("<"+a.nodeName+">")?f=a.cloneNode(!0):(ta.innerHTML=a.outerHTML,ta.removeChild(f=ta.firstChild)),!(k.noCloneEvent&&k.noCloneChecked||1!==a.nodeType&&11!==a.nodeType||m.isXMLDoc(a)))for(d=ua(f),h=ua(a),g=0;null!=(e=h[g]);++g)d[g]&&Ba(e,d[g]);if(b)if(c)for(h=h||ua(a),d=d||ua(f),g=0;null!=(e=h[g]);g++)Aa(e,d[g]);else Aa(a,f);return d=ua(f,"script"),d.length>0&&za(d,!i&&ua(a,"script")),d=h=e=null,f},buildFragment:function(a,b,c,d){for(var e,f,g,h,i,j,l,n=a.length,o=da(b),p=[],q=0;n>q;q++)if(f=a[q],f||0===f)if("object"===m.type(f))m.merge(p,f.nodeType?[f]:f);else if(la.test(f)){h=h||o.appendChild(b.createElement("div")),i=(ja.exec(f)||["",""])[1].toLowerCase(),l=ra[i]||ra._default,h.innerHTML=l[1]+f.replace(ia,"<$1>")+l[2],e=l[0];while(e--)h=h.lastChild;if(!k.leadingWhitespace&&ha.test(f)&&p.push(b.createTextNode(ha.exec(f)[0])),!k.tbody){f="table"!==i||ka.test(f)?"| t |
").append(m.parseHTML(a)).find(d):a)}).complete(c&&function(a,b){g.each(c,e||[a.responseText,b,a])}),this},m.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(a,b){m.fn[b]=function(a){return this.on(b,a)}}),m.expr.filters.animated=function(a){return m.grep(m.timers,function(b){return a===b.elem}).length};var cc=a.document.documentElement;function dc(a){return m.isWindow(a)?a:9===a.nodeType?a.defaultView||a.parentWindow:!1}m.offset={setOffset:function(a,b,c){var d,e,f,g,h,i,j,k=m.css(a,"position"),l=m(a),n={};"static"===k&&(a.style.position="relative"),h=l.offset(),f=m.css(a,"top"),i=m.css(a,"left"),j=("absolute"===k||"fixed"===k)&&m.inArray("auto",[f,i])>-1,j?(d=l.position(),g=d.top,e=d.left):(g=parseFloat(f)||0,e=parseFloat(i)||0),m.isFunction(b)&&(b=b.call(a,c,h)),null!=b.top&&(n.top=b.top-h.top+g),null!=b.left&&(n.left=b.left-h.left+e),"using"in b?b.using.call(a,n):l.css(n)}},m.fn.extend({offset:function(a){if(arguments.length)return void 0===a?this:this.each(function(b){m.offset.setOffset(this,a,b)});var b,c,d={top:0,left:0},e=this[0],f=e&&e.ownerDocument;if(f)return b=f.documentElement,m.contains(b,e)?(typeof e.getBoundingClientRect!==K&&(d=e.getBoundingClientRect()),c=dc(f),{top:d.top+(c.pageYOffset||b.scrollTop)-(b.clientTop||0),left:d.left+(c.pageXOffset||b.scrollLeft)-(b.clientLeft||0)}):d},position:function(){if(this[0]){var a,b,c={top:0,left:0},d=this[0];return"fixed"===m.css(d,"position")?b=d.getBoundingClientRect():(a=this.offsetParent(),b=this.offset(),m.nodeName(a[0],"html")||(c=a.offset()),c.top+=m.css(a[0],"borderTopWidth",!0),c.left+=m.css(a[0],"borderLeftWidth",!0)),{top:b.top-c.top-m.css(d,"marginTop",!0),left:b.left-c.left-m.css(d,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){var a=this.offsetParent||cc;while(a&&!m.nodeName(a,"html")&&"static"===m.css(a,"position"))a=a.offsetParent;return a||cc})}}),m.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(a,b){var c=/Y/.test(b);m.fn[a]=function(d){return V(this,function(a,d,e){var f=dc(a);return void 0===e?f?b in f?f[b]:f.document.documentElement[d]:a[d]:void(f?f.scrollTo(c?m(f).scrollLeft():e,c?e:m(f).scrollTop()):a[d]=e)},a,d,arguments.length,null)}}),m.each(["top","left"],function(a,b){m.cssHooks[b]=La(k.pixelPosition,function(a,c){return c?(c=Ja(a,b),Ha.test(c)?m(a).position()[b]+"px":c):void 0})}),m.each({Height:"height",Width:"width"},function(a,b){m.each({padding:"inner"+a,content:b,"":"outer"+a},function(c,d){m.fn[d]=function(d,e){var f=arguments.length&&(c||"boolean"!=typeof d),g=c||(d===!0||e===!0?"margin":"border");return V(this,function(b,c,d){var e;return m.isWindow(b)?b.document.documentElement["client"+a]:9===b.nodeType?(e=b.documentElement,Math.max(b.body["scroll"+a],e["scroll"+a],b.body["offset"+a],e["offset"+a],e["client"+a])):void 0===d?m.css(b,c,g):m.style(b,c,d,g)},b,f?d:void 0,f,null)}})}),m.fn.size=function(){return this.length},m.fn.andSelf=m.fn.addBack,"function"==typeof define&&define.amd&&define("jquery",[],function(){return m});var ec=a.jQuery,fc=a.$;return m.noConflict=function(b){return a.$===m&&(a.$=fc),b&&a.jQuery===m&&(a.jQuery=ec),m},typeof b===K&&(a.jQuery=a.$=m),m});
diff --git a/GiphyTV/assets/js/main.js b/GiphyTV/assets/js/main.js
deleted file mode 100644
index 265feb4..0000000
--- a/GiphyTV/assets/js/main.js
+++ /dev/null
@@ -1,763 +0,0 @@
-/*
- Lens by HTML5 UP
- html5up.net | @ajlkn
- Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-*/
-
-var main = (function($) { var _ = {
-
- /**
- * Settings.
- * @var {object}
- */
- settings: {
-
- // Preload all images.
- preload: false,
-
- // Slide duration (must match "duration.slide" in _vars.scss).
- slideDuration: 500,
-
- // Layout duration (must match "duration.layout" in _vars.scss).
- layoutDuration: 750,
-
- // Thumbnails per "row" (must match "misc.thumbnails-per-row" in _vars.scss).
- thumbnailsPerRow: 2,
-
- // Side of main wrapper (must match "misc.main-side" in _vars.scss).
- mainSide: 'right'
-
- },
-
- /**
- * Window.
- * @var {jQuery}
- */
- $window: null,
-
- /**
- * Body.
- * @var {jQuery}
- */
- $body: null,
-
- /**
- * Main wrapper.
- * @var {jQuery}
- */
- $main: null,
-
- /**
- * Thumbnails.
- * @var {jQuery}
- */
- $thumbnails: null,
-
- /**
- * Viewer.
- * @var {jQuery}
- */
- $viewer: null,
-
- /**
- * Toggle.
- * @var {jQuery}
- */
- $toggle: null,
-
- /**
- * Nav (next).
- * @var {jQuery}
- */
- $navNext: null,
-
- /**
- * Nav (previous).
- * @var {jQuery}
- */
- $navPrevious: null,
-
- /**
- * Slides.
- * @var {array}
- */
- slides: [],
-
- /**
- * Current slide index.
- * @var {integer}
- */
- current: null,
-
- /**
- * Lock state.
- * @var {bool}
- */
- locked: false,
-
- /**
- * Keyboard shortcuts.
- * @var {object}
- */
- keys: {
-
- // Escape: Toggle main wrapper.
- 27: function() {
- _.toggle();
- },
-
- // Up: Move up.
- 38: function() {
- _.up();
- },
-
- // Down: Move down.
- 40: function() {
- _.down();
- },
-
- // Space: Next.
- 32: function() {
- _.next();
- },
-
- // Right Arrow: Next.
- 39: function() {
- _.next();
- },
-
- // Left Arrow: Previous.
- 37: function() {
- _.previous();
- }
-
- },
-
- /**
- * Initialize properties.
- */
- initProperties: function() {
-
- // Window, body.
- _.$window = $(window);
- _.$body = $('body');
-
- // Thumbnails.
- _.$thumbnails = $('#thumbnails');
-
- // Viewer.
- _.$viewer = $(
- '
');
-
- // Set slide's background image to it.
- s.$slideImage
- .css('background-image', 'url(' + s.url + ')');
-
- // Mark slide as loaded.
- s.$slide.addClass('loaded');
- s.loaded = true;
-
- }
-
- // Add to slides array.
- _.slides.push(s);
-
- // Set thumbnail's index.
- $thumbnail.data('index', _.slides.length - 1);
-
- });
-
- },
-
- /**
- * Initialize stuff.
- */
- init: function() {
-
- // IE<10: Zero out transition delays.
- if (skel.vars.IEVersion < 10) {
-
- _.settings.slideDuration = 0;
- _.settings.layoutDuration = 0;
-
- }
-
- // Skel.
- skel.breakpoints({
- xlarge: '(max-width: 1680px)',
- large: '(max-width: 1280px)',
- medium: '(max-width: 980px)',
- small: '(max-width: 736px)',
- xsmall: '(max-width: 480px)'
- });
-
- // Everything else.
- _.initProperties();
- _.initViewer();
- _.initEvents();
-
- // Initial slide.
- window.setTimeout(function() {
-
- // Show first slide if xsmall isn't active or it just deactivated.
- skel.on('-xsmall !xsmall', function() {
-
- if (_.current === null)
- _.switchTo(0, true);
-
- });
-
- }, 0);
-
- },
-
- /**
- * Switch to a specific slide.
- * @param {integer} index Index.
- */
- switchTo: function(index, noHide) {
-
- // Already at index and xsmall isn't active? Bail.
- if (_.current == index
- && !skel.breakpoint('xsmall').active)
- return;
-
- // Locked? Bail.
- if (_.locked)
- return;
-
- // Lock.
- _.locked = true;
-
- // Hide main wrapper if medium is active.
- if (!noHide
- && skel.breakpoint('medium').active
- && skel.vars.IEVersion > 8)
- _.hide();
-
- // Get slides.
- var oldSlide = (_.current !== null ? _.slides[_.current] : null),
- newSlide = _.slides[index];
-
- // Update current.
- _.current = index;
-
- // Deactivate old slide (if there is one).
- if (oldSlide) {
-
- // Thumbnail.
- oldSlide.$parent
- .removeClass('active');
-
- // Slide.
- oldSlide.$slide.removeClass('active');
-
- }
-
- // Activate new slide.
-
- // Thumbnail.
- newSlide.$parent
- .addClass('active')
- .focus();
-
- // Slide.
- var f = function() {
-
- // Old slide exists? Detach it.
- if (oldSlide)
- oldSlide.$slide.detach();
-
- // Attach new slide.
- newSlide.$slide.appendTo(_.$viewer);
-
- // New slide not yet loaded?
- if (!newSlide.loaded) {
-
- window.setTimeout(function() {
-
- // Mark as loading.
- newSlide.$slide.addClass('loading');
-
- // Wait for it to load.
- $('
').on('load', function() {
- //window.setTimeout(function() {
-
- // Set background image.
- newSlide.$slideImage
- .css('background-image', 'url(' + newSlide.url + ')');
-
- // Mark as loaded.
- newSlide.loaded = true;
- newSlide.$slide.removeClass('loading');
-
- // Mark as active.
- newSlide.$slide.addClass('active');
-
- // Unlock.
- window.setTimeout(function() {
- _.locked = false;
- }, 100);
-
- //}, 1000);
- });
-
- }, 100);
-
- }
-
- // Otherwise ...
- else {
-
- window.setTimeout(function() {
-
- // Mark as active.
- newSlide.$slide.addClass('active');
-
- // Unlock.
- window.setTimeout(function() {
- _.locked = false;
- }, 100);
-
- }, 100);
-
- }
-
- };
-
- // No old slide? Switch immediately.
- if (!oldSlide)
- (f)();
-
- // Otherwise, wait for old slide to disappear first.
- else
- window.setTimeout(f, _.settings.slideDuration);
-
- },
-
- /**
- * Switches to the next slide.
- */
- next: function() {
-
- // Calculate new index.
- var i, c = _.current, l = _.slides.length;
-
- if (c >= l - 1)
- i = 0;
- else
- i = c + 1;
-
- // Switch.
- _.switchTo(i);
-
- },
-
- /**
- * Switches to the previous slide.
- */
- previous: function() {
-
- // Calculate new index.
- var i, c = _.current, l = _.slides.length;
-
- if (c <= 0)
- i = l - 1;
- else
- i = c - 1;
-
- // Switch.
- _.switchTo(i);
-
- },
-
- /**
- * Switches to slide "above" current.
- */
- up: function() {
-
- // Fullscreen? Bail.
- if (_.$body.hasClass('fullscreen'))
- return;
-
- // Calculate new index.
- var i, c = _.current, l = _.slides.length, tpr = _.settings.thumbnailsPerRow;
-
- if (c <= (tpr - 1))
- i = l - (tpr - 1 - c) - 1;
- else
- i = c - tpr;
-
- // Switch.
- _.switchTo(i);
-
- },
-
- /**
- * Switches to slide "below" current.
- */
- down: function() {
-
- // Fullscreen? Bail.
- if (_.$body.hasClass('fullscreen'))
- return;
-
- // Calculate new index.
- var i, c = _.current, l = _.slides.length, tpr = _.settings.thumbnailsPerRow;
-
- if (c >= l - tpr)
- i = c - l + tpr;
- else
- i = c + tpr;
-
- // Switch.
- _.switchTo(i);
-
- },
-
- /**
- * Shows the main wrapper.
- */
- show: function() {
-
- // Already visible? Bail.
- if (!_.$body.hasClass('fullscreen'))
- return;
-
- // Show main wrapper.
- _.$body.removeClass('fullscreen');
-
- // Focus.
- _.$main.focus();
-
- },
-
- /**
- * Hides the main wrapper.
- */
- hide: function() {
-
- // Already hidden? Bail.
- if (_.$body.hasClass('fullscreen'))
- return;
-
- // Hide main wrapper.
- _.$body.addClass('fullscreen');
-
- // Blur.
- _.$main.blur();
-
- },
-
- /**
- * Toggles main wrapper.
- */
- toggle: function() {
-
- if (_.$body.hasClass('fullscreen'))
- _.show();
- else
- _.hide();
-
- },
-
-}; return _; })(jQuery); main.init();
\ No newline at end of file
diff --git a/GiphyTV/assets/js/skel.min.js b/GiphyTV/assets/js/skel.min.js
deleted file mode 100644
index 6ca4bf1..0000000
--- a/GiphyTV/assets/js/skel.min.js
+++ /dev/null
@@ -1,2 +0,0 @@
-/* skel.js v3.0.1 | (c) skel.io | MIT licensed */
-var skel=function(){"use strict";var t={breakpointIds:null,events:{},isInit:!1,obj:{attachments:{},breakpoints:{},head:null,states:{}},sd:"/",state:null,stateHandlers:{},stateId:"",vars:{},DOMReady:null,indexOf:null,isArray:null,iterate:null,matchesMedia:null,extend:function(e,n){t.iterate(n,function(i){t.isArray(n[i])?(t.isArray(e[i])||(e[i]=[]),t.extend(e[i],n[i])):"object"==typeof n[i]?("object"!=typeof e[i]&&(e[i]={}),t.extend(e[i],n[i])):e[i]=n[i]})},newStyle:function(t){var e=document.createElement("style");return e.type="text/css",e.innerHTML=t,e},_canUse:null,canUse:function(e){t._canUse||(t._canUse=document.createElement("div"));var n=t._canUse.style,i=e.charAt(0).toUpperCase()+e.slice(1);return e in n||"Moz"+i in n||"Webkit"+i in n||"O"+i in n||"ms"+i in n},on:function(e,n){var i=e.split(/[\s]+/);return t.iterate(i,function(e){var a=i[e];if(t.isInit){if("init"==a)return void n();if("change"==a)n();else{var r=a.charAt(0);if("+"==r||"!"==r){var o=a.substring(1);if(o in t.obj.breakpoints)if("+"==r&&t.obj.breakpoints[o].active)n();else if("!"==r&&!t.obj.breakpoints[o].active)return void n()}}}t.events[a]||(t.events[a]=[]),t.events[a].push(n)}),t},trigger:function(e){return t.events[e]&&0!=t.events[e].length?(t.iterate(t.events[e],function(n){t.events[e][n]()}),t):void 0},breakpoint:function(e){return t.obj.breakpoints[e]},breakpoints:function(e){function n(t,e){this.name=this.id=t,this.media=e,this.active=!1,this.wasActive=!1}return n.prototype.matches=function(){return t.matchesMedia(this.media)},n.prototype.sync=function(){this.wasActive=this.active,this.active=this.matches()},t.iterate(e,function(i){t.obj.breakpoints[i]=new n(i,e[i])}),window.setTimeout(function(){t.poll()},0),t},addStateHandler:function(e,n){t.stateHandlers[e]=n},callStateHandler:function(e){var n=t.stateHandlers[e]();t.iterate(n,function(e){t.state.attachments.push(n[e])})},changeState:function(e){t.iterate(t.obj.breakpoints,function(e){t.obj.breakpoints[e].sync()}),t.vars.lastStateId=t.stateId,t.stateId=e,t.breakpointIds=t.stateId===t.sd?[]:t.stateId.substring(1).split(t.sd),t.obj.states[t.stateId]?t.state=t.obj.states[t.stateId]:(t.obj.states[t.stateId]={attachments:[]},t.state=t.obj.states[t.stateId],t.iterate(t.stateHandlers,t.callStateHandler)),t.detachAll(t.state.attachments),t.attachAll(t.state.attachments),t.vars.stateId=t.stateId,t.vars.state=t.state,t.trigger("change"),t.iterate(t.obj.breakpoints,function(e){t.obj.breakpoints[e].active?t.obj.breakpoints[e].wasActive||t.trigger("+"+e):t.obj.breakpoints[e].wasActive&&t.trigger("-"+e)})},generateStateConfig:function(e,n){var i={};return t.extend(i,e),t.iterate(t.breakpointIds,function(e){t.extend(i,n[t.breakpointIds[e]])}),i},getStateId:function(){var e="";return t.iterate(t.obj.breakpoints,function(n){var i=t.obj.breakpoints[n];i.matches()&&(e+=t.sd+i.id)}),e},poll:function(){var e="";e=t.getStateId(),""===e&&(e=t.sd),e!==t.stateId&&t.changeState(e)},_attach:null,attach:function(e){var n=t.obj.head,i=e.element;return i.parentNode&&i.parentNode.tagName?!1:(t._attach||(t._attach=n.firstChild),n.insertBefore(i,t._attach.nextSibling),e.permanent&&(t._attach=i),!0)},attachAll:function(e){var n=[];t.iterate(e,function(t){n[e[t].priority]||(n[e[t].priority]=[]),n[e[t].priority].push(e[t])}),n.reverse(),t.iterate(n,function(e){t.iterate(n[e],function(i){t.attach(n[e][i])})})},detach:function(t){var e=t.element;return t.permanent||!e.parentNode||e.parentNode&&!e.parentNode.tagName?!1:(e.parentNode.removeChild(e),!0)},detachAll:function(e){var n={};t.iterate(e,function(t){n[e[t].id]=!0}),t.iterate(t.obj.attachments,function(e){e in n||t.detach(t.obj.attachments[e])})},attachment:function(e){return e in t.obj.attachments?t.obj.attachments[e]:null},newAttachment:function(e,n,i,a){return t.obj.attachments[e]={id:e,element:n,priority:i,permanent:a}},init:function(){t.initMethods(),t.initVars(),t.initEvents(),t.obj.head=document.getElementsByTagName("head")[0],t.isInit=!0,t.trigger("init")},initEvents:function(){t.on("resize",function(){t.poll()}),t.on("orientationChange",function(){t.poll()}),t.DOMReady(function(){t.trigger("ready")}),window.onload&&t.on("load",window.onload),window.onload=function(){t.trigger("load")},window.onresize&&t.on("resize",window.onresize),window.onresize=function(){t.trigger("resize")},window.onorientationchange&&t.on("orientationChange",window.onorientationchange),window.onorientationchange=function(){t.trigger("orientationChange")}},initMethods:function(){document.addEventListener?!function(e,n){t.DOMReady=n()}("domready",function(){function t(t){for(r=1;t=n.shift();)t()}var e,n=[],i=document,a="DOMContentLoaded",r=/^loaded|^c/.test(i.readyState);return i.addEventListener(a,e=function(){i.removeEventListener(a,e),t()}),function(t){r?t():n.push(t)}}):!function(e,n){t.DOMReady=n()}("domready",function(t){function e(t){for(h=1;t=i.shift();)t()}var n,i=[],a=!1,r=document,o=r.documentElement,s=o.doScroll,c="DOMContentLoaded",d="addEventListener",u="onreadystatechange",l="readyState",f=s?/^loaded|^c/:/^loaded|c/,h=f.test(r[l]);return r[d]&&r[d](c,n=function(){r.removeEventListener(c,n,a),e()},a),s&&r.attachEvent(u,n=function(){/^c/.test(r[l])&&(r.detachEvent(u,n),e())}),t=s?function(e){self!=top?h?e():i.push(e):function(){try{o.doScroll("left")}catch(n){return setTimeout(function(){t(e)},50)}e()}()}:function(t){h?t():i.push(t)}}),Array.prototype.indexOf?t.indexOf=function(t,e){return t.indexOf(e)}:t.indexOf=function(t,e){if("string"==typeof t)return t.indexOf(e);var n,i,a=e?e:0;if(!this)throw new TypeError;if(i=this.length,0===i||a>=i)return-1;for(0>a&&(a=i-Math.abs(a)),n=a;i>n;n++)if(this[n]===t)return n;return-1},Array.isArray?t.isArray=function(t){return Array.isArray(t)}:t.isArray=function(t){return"[object Array]"===Object.prototype.toString.call(t)},Object.keys?t.iterate=function(t,e){if(!t)return[];var n,i=Object.keys(t);for(n=0;i[n]&&e(i[n],t[i[n]])!==!1;n++);}:t.iterate=function(t,e){if(!t)return[];var n;for(n in t)if(Object.prototype.hasOwnProperty.call(t,n)&&e(n,t[n])===!1)break},window.matchMedia?t.matchesMedia=function(t){return""==t?!0:window.matchMedia(t).matches}:window.styleMedia||window.media?t.matchesMedia=function(t){if(""==t)return!0;var e=window.styleMedia||window.media;return e.matchMedium(t||"all")}:window.getComputedStyle?t.matchesMedia=function(t){if(""==t)return!0;var e=document.createElement("style"),n=document.getElementsByTagName("script")[0],i=null;e.type="text/css",e.id="matchmediajs-test",n.parentNode.insertBefore(e,n),i="getComputedStyle"in window&&window.getComputedStyle(e,null)||e.currentStyle;var a="@media "+t+"{ #matchmediajs-test { width: 1px; } }";return e.styleSheet?e.styleSheet.cssText=a:e.textContent=a,"1px"===i.width}:t.matchesMedia=function(t){if(""==t)return!0;var e,n,i,a,r={"min-width":null,"max-width":null},o=!1;for(i=t.split(/\s+and\s+/),e=0;er["max-width"]||null!==r["min-height"]&&cr["max-height"]?!1:!0},navigator.userAgent.match(/MSIE ([0-9]+)/)&&RegExp.$1<9&&(t.newStyle=function(t){var e=document.createElement("span");return e.innerHTML=' ",e})},initVars:function(){var e,n,i,a=navigator.userAgent;e="other",n=0,i=[["firefox",/Firefox\/([0-9\.]+)/],["bb",/BlackBerry.+Version\/([0-9\.]+)/],["bb",/BB[0-9]+.+Version\/([0-9\.]+)/],["opera",/OPR\/([0-9\.]+)/],["opera",/Opera\/([0-9\.]+)/],["edge",/Edge\/([0-9\.]+)/],["safari",/Version\/([0-9\.]+).+Safari/],["chrome",/Chrome\/([0-9\.]+)/],["ie",/MSIE ([0-9]+)/],["ie",/Trident\/.+rv:([0-9]+)/]],t.iterate(i,function(t,i){return a.match(i[1])?(e=i[0],n=parseFloat(RegExp.$1),!1):void 0}),t.vars.browser=e,t.vars.browserVersion=n,e="other",n=0,i=[["ios",/([0-9_]+) like Mac OS X/,function(t){return t.replace("_",".").replace("_","")}],["ios",/CPU like Mac OS X/,function(t){return 0}],["wp",/Windows Phone ([0-9\.]+)/,null],["android",/Android ([0-9\.]+)/,null],["mac",/Macintosh.+Mac OS X ([0-9_]+)/,function(t){return t.replace("_",".").replace("_","")}],["windows",/Windows NT ([0-9\.]+)/,null],["bb",/BlackBerry.+Version\/([0-9\.]+)/,null],["bb",/BB[0-9]+.+Version\/([0-9\.]+)/,null]],t.iterate(i,function(t,i){return a.match(i[1])?(e=i[0],n=parseFloat(i[2]?i[2](RegExp.$1):RegExp.$1),!1):void 0}),t.vars.os=e,t.vars.osVersion=n,t.vars.IEVersion="ie"==t.vars.browser?t.vars.browserVersion:99,t.vars.touch="wp"==t.vars.os?navigator.msMaxTouchPoints>0:!!("ontouchstart"in window),t.vars.mobile="wp"==t.vars.os||"android"==t.vars.os||"ios"==t.vars.os||"bb"==t.vars.os}};return t.init(),t}();!function(t,e){"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?module.exports=e():t.skel=e()}(this,function(){return skel});
diff --git a/GiphyTV/assets/sass/ie8.scss b/GiphyTV/assets/sass/ie8.scss
deleted file mode 100644
index 971508a..0000000
--- a/GiphyTV/assets/sass/ie8.scss
+++ /dev/null
@@ -1,16 +0,0 @@
-@import 'libs/vars';
-@import 'libs/functions';
-@import 'libs/mixins';
-@import 'libs/skel';
-
-/*
- Lens by HTML5 UP
- html5up.net | @ajlkn
- Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-*/
-
-/* Viewer */
-
- #viewer {
- width: 100%;
- }
\ No newline at end of file
diff --git a/GiphyTV/assets/sass/ie9.scss b/GiphyTV/assets/sass/ie9.scss
deleted file mode 100644
index bdf68d9..0000000
--- a/GiphyTV/assets/sass/ie9.scss
+++ /dev/null
@@ -1,42 +0,0 @@
-@import 'libs/vars';
-@import 'libs/functions';
-@import 'libs/mixins';
-@import 'libs/skel';
-
-/*
- Lens by HTML5 UP
- html5up.net | @ajlkn
- Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-*/
-
-/* Thumbnails */
-
- #thumbnails {
- &:after {
- content: '';
- display: block;
- clear: both;
- }
-
- article {
- float: left;
- }
- }
-
-/* Viewer */
-
- #viewer {
- .inner {
- box-shadow: inset 0 0 9em 2em rgba(16,16,16,0.2);
-
- &:before {
- display: none;
- }
- }
-
- .slide {
- .caption {
- background-color: rgba(16,16,16,0.5);
- }
- }
- }
\ No newline at end of file
diff --git a/GiphyTV/assets/sass/libs/_functions.scss b/GiphyTV/assets/sass/libs/_functions.scss
deleted file mode 100644
index 3b834f5..0000000
--- a/GiphyTV/assets/sass/libs/_functions.scss
+++ /dev/null
@@ -1,34 +0,0 @@
-/// Gets a duration value.
-/// @param {string} $keys Key(s).
-/// @return {string} Value.
-@function _duration($keys...) {
- @return val($duration, $keys...);
-}
-
-/// Gets a font value.
-/// @param {string} $keys Key(s).
-/// @return {string} Value.
-@function _font($keys...) {
- @return val($font, $keys...);
-}
-
-/// Gets a misc value.
-/// @param {string} $keys Key(s).
-/// @return {string} Value.
-@function _misc($keys...) {
- @return val($misc, $keys...);
-}
-
-/// Gets a palette value.
-/// @param {string} $keys Key(s).
-/// @return {string} Value.
-@function _palette($keys...) {
- @return val($palette, $keys...);
-}
-
-/// Gets a size value.
-/// @param {string} $keys Key(s).
-/// @return {string} Value.
-@function _size($keys...) {
- @return val($size, $keys...);
-}
\ No newline at end of file
diff --git a/GiphyTV/assets/sass/libs/_mixins.scss b/GiphyTV/assets/sass/libs/_mixins.scss
deleted file mode 100644
index ab6191f..0000000
--- a/GiphyTV/assets/sass/libs/_mixins.scss
+++ /dev/null
@@ -1,398 +0,0 @@
-/// Makes an element's :before pseudoelement a FontAwesome icon.
-/// @param {string} $content Optional content value to use.
-/// @param {string} $where Optional pseudoelement to target (before or after).
-@mixin icon($content: false, $where: before) {
-
- text-decoration: none;
-
- &:#{$where} {
-
- @if $content {
- content: $content;
- }
-
- -moz-osx-font-smoothing: grayscale;
- -webkit-font-smoothing: antialiased;
- font-family: FontAwesome;
- font-style: normal;
- font-weight: normal;
- text-transform: none !important;
-
- }
-
-}
-
-/// Applies padding to an element, taking the current element-margin value into account.
-/// @param {mixed} $tb Top/bottom padding.
-/// @param {mixed} $lr Left/right padding.
-/// @param {list} $pad Optional extra padding (in the following order top, right, bottom, left)
-/// @param {bool} $important If true, adds !important.
-@mixin padding($tb, $lr, $pad: (0,0,0,0), $important: null) {
-
- @if $important {
- $important: '!important';
- }
-
- $x: 0.1em;
-
- @if unit(_size(element-margin)) == 'rem' {
- $x: 0.1rem;
- }
-
- padding: ($tb + nth($pad,1)) ($lr + nth($pad,2)) max($x, $tb - _size(element-margin) + nth($pad,3)) ($lr + nth($pad,4)) #{$important};
-
-}
-
-/// Encodes a SVG data URL so IE doesn't choke (via codepen.io/jakob-e/pen/YXXBrp).
-/// @param {string} $svg SVG data URL.
-/// @return {string} Encoded SVG data URL.
-@function svg-url($svg) {
-
- $svg: str-replace($svg, '"', '\'');
- $svg: str-replace($svg, '%', '%25');
- $svg: str-replace($svg, '<', '%3C');
- $svg: str-replace($svg, '>', '%3E');
- $svg: str-replace($svg, '&', '%26');
- $svg: str-replace($svg, '#', '%23');
- $svg: str-replace($svg, '{', '%7B');
- $svg: str-replace($svg, '}', '%7D');
- $svg: str-replace($svg, ';', '%3B');
-
- @return url("data:image/svg+xml;charset=utf8,#{$svg}");
-
-}
-
-/// Initializes base flexgrid classes.
-/// @param {string} $vertical-align Vertical alignment of cells.
-/// @param {string} $horizontal-align Horizontal alignment of cells.
-@mixin flexgrid-base($vertical-align: null, $horizontal-align: null) {
-
- // Grid.
- @include vendor('display', 'flex');
- @include vendor('flex-wrap', 'wrap');
-
- // Vertical alignment.
- @if ($vertical-align == top) {
- @include vendor('align-items', 'flex-start');
- }
- @else if ($vertical-align == bottom) {
- @include vendor('align-items', 'flex-end');
- }
- @else if ($vertical-align == center) {
- @include vendor('align-items', 'center');
- }
- @else {
- @include vendor('align-items', 'stretch');
- }
-
- // Horizontal alignment.
- @if ($horizontal-align != null) {
- text-align: $horizontal-align;
- }
-
- // Cells.
- > * {
- @include vendor('flex-shrink', '1');
- @include vendor('flex-grow', '0');
- }
-
-}
-
-/// Sets up flexgrid columns.
-/// @param {integer} $columns Columns.
-@mixin flexgrid-columns($columns) {
-
- > * {
- $cell-width: 100% / $columns;
- width: #{$cell-width};
- }
-
-}
-
-/// Sets up flexgrid gutters.
-/// @param {integer} $columns Columns.
-/// @param {number} $gutters Gutters.
-@mixin flexgrid-gutters($columns, $gutters) {
-
- // Apply padding.
- > * {
- $cell-width: 100% / $columns;
-
- padding: ($gutters * 0.5);
- width: $cell-width;
- }
-
-}
-
-/// Sets up flexgrid gutters (flush).
-/// @param {integer} $columns Columns.
-/// @param {number} $gutters Gutters.
-@mixin flexgrid-gutters-flush($columns, $gutters) {
-
- // Apply padding.
- > * {
- $cell-width: 100% / $columns;
- $cell-width-pad: $gutters / $columns;
-
- padding: ($gutters * 0.5);
- width: calc(#{$cell-width} + #{$cell-width-pad});
- }
-
- // Clear top/bottom gutters.
- > :nth-child(-n + #{$columns}) {
- padding-top: 0;
- }
-
- > :nth-last-child(-n + #{$columns}) {
- padding-bottom: 0;
- }
-
- // Clear left/right gutters.
- > :nth-child(#{$columns}n + 1) {
- padding-left: 0;
- }
-
- > :nth-child(#{$columns}n) {
- padding-right: 0;
- }
-
- // Adjust widths of leftmost and rightmost cells.
- > :nth-child(#{$columns}n + 1),
- > :nth-child(#{$columns}n) {
- $cell-width: 100% / $columns;
- $cell-width-pad: ($gutters / $columns) - ($gutters / 2);
-
- width: calc(#{$cell-width} + #{$cell-width-pad});
- }
-
-}
-
-/// Reset flexgrid gutters (flush only).
-/// Used to override a previous set of flexgrid gutter classes.
-/// @param {integer} $columns Columns.
-/// @param {number} $gutters Gutters.
-/// @param {integer} $prev-columns Previous columns.
-@mixin flexgrid-gutters-flush-reset($columns, $gutters, $prev-columns) {
-
- // Apply padding.
- > * {
- $cell-width: 100% / $prev-columns;
- $cell-width-pad: $gutters / $prev-columns;
-
- padding: ($gutters * 0.5);
- width: calc(#{$cell-width} + #{$cell-width-pad});
- }
-
- // Clear top/bottom gutters.
- > :nth-child(-n + #{$prev-columns}) {
- padding-top: ($gutters * 0.5);
- }
-
- > :nth-last-child(-n + #{$prev-columns}) {
- padding-bottom: ($gutters * 0.5);
- }
-
- // Clear left/right gutters.
- > :nth-child(#{$prev-columns}n + 1) {
- padding-left: ($gutters * 0.5);
- }
-
- > :nth-child(#{$prev-columns}n) {
- padding-right: ($gutters * 0.5);
- }
-
- // Adjust widths of leftmost and rightmost cells.
- > :nth-child(#{$prev-columns}n + 1),
- > :nth-child(#{$prev-columns}n) {
- $cell-width: 100% / $columns;
- $cell-width-pad: $gutters / $columns;
-
- padding: ($gutters * 0.5);
- width: calc(#{$cell-width} + #{$cell-width-pad});
- }
-
-}
-
-/// Adds debug styles to current flexgrid element.
-@mixin flexgrid-debug() {
-
- box-shadow: 0 0 0 1px red;
-
- > * {
- box-shadow: inset 0 0 0 1px blue;
- position: relative;
-
- > * {
- position: relative;
- box-shadow: inset 0 0 0 1px green;
- }
- }
-
-}
-
-/// Initializes the current element as a flexgrid.
-/// @param {integer} $columns Columns (optional).
-/// @param {number} $gutters Gutters (optional).
-/// @param {bool} $flush If true, clears padding around the very edge of the grid.
-@mixin flexgrid($settings: ()) {
-
- // Settings.
-
- // Debug.
- $debug: false;
-
- @if (map-has-key($settings, 'debug')) {
- $debug: map-get($settings, 'debug');
- }
-
- // Vertical align.
- $vertical-align: null;
-
- @if (map-has-key($settings, 'vertical-align')) {
- $vertical-align: map-get($settings, 'vertical-align');
- }
-
- // Horizontal align.
- $horizontal-align: null;
-
- @if (map-has-key($settings, 'horizontal-align')) {
- $horizontal-align: map-get($settings, 'horizontal-align');
- }
-
- // Columns.
- $columns: null;
-
- @if (map-has-key($settings, 'columns')) {
- $columns: map-get($settings, 'columns');
- }
-
- // Gutters.
- $gutters: 0;
-
- @if (map-has-key($settings, 'gutters')) {
- $gutters: map-get($settings, 'gutters');
- }
-
- // Flush.
- $flush: true;
-
- @if (map-has-key($settings, 'flush')) {
- $flush: map-get($settings, 'flush');
- }
-
- // Initialize base grid.
- @include flexgrid-base($vertical-align, $horizontal-align);
-
- // Debug?
- @if ($debug) {
- @include flexgrid-debug;
- }
-
- // Columns specified?
- @if ($columns != null) {
-
- // Initialize columns.
- @include flexgrid-columns($columns);
-
- // Gutters specified?
- @if ($gutters > 0) {
-
- // Flush gutters?
- @if ($flush) {
-
- // Initialize gutters (flush).
- @include flexgrid-gutters-flush($columns, $gutters);
-
- }
-
- // Otherwise ...
- @else {
-
- // Initialize gutters.
- @include flexgrid-gutters($columns, $gutters);
-
- }
-
- }
-
- }
-
-}
-
-/// Resizes a previously-initialized grid.
-/// @param {integer} $columns Columns.
-/// @param {number} $gutters Gutters (optional).
-/// @param {list} $reset A list of previously-initialized grid columns (only if $flush is true).
-/// @param {bool} $flush If true, clears padding around the very edge of the grid.
-@mixin flexgrid-resize($settings: ()) {
-
- // Settings.
-
- // Columns.
- $columns: 1;
-
- @if (map-has-key($settings, 'columns')) {
- $columns: map-get($settings, 'columns');
- }
-
- // Gutters.
- $gutters: 0;
-
- @if (map-has-key($settings, 'gutters')) {
- $gutters: map-get($settings, 'gutters');
- }
-
- // Previous columns.
- $prev-columns: false;
-
- @if (map-has-key($settings, 'prev-columns')) {
- $prev-columns: map-get($settings, 'prev-columns');
- }
-
- // Flush.
- $flush: true;
-
- @if (map-has-key($settings, 'flush')) {
- $flush: map-get($settings, 'flush');
- }
-
- // Resize columns.
- @include flexgrid-columns($columns);
-
- // Gutters specified?
- @if ($gutters > 0) {
-
- // Flush gutters?
- @if ($flush) {
-
- // Previous columns specified?
- @if ($prev-columns) {
-
- // Convert to list if it isn't one already.
- @if (type-of($prev-columns) != list) {
- $prev-columns: ($prev-columns);
- }
-
- // Step through list of previous columns and reset them.
- @each $x in $prev-columns {
- @include flexgrid-gutters-flush-reset($columns, $gutters, $x);
- }
-
- }
-
- // Resize gutters (flush).
- @include flexgrid-gutters-flush($columns, $gutters);
-
- }
-
- // Otherwise ...
- @else {
-
- // Resize gutters.
- @include flexgrid-gutters($columns, $gutters);
-
- }
-
- }
-
-}
\ No newline at end of file
diff --git a/GiphyTV/assets/sass/libs/_skel.scss b/GiphyTV/assets/sass/libs/_skel.scss
deleted file mode 100644
index 33fdccb..0000000
--- a/GiphyTV/assets/sass/libs/_skel.scss
+++ /dev/null
@@ -1,587 +0,0 @@
-// skel.scss v3.0.2-dev | (c) skel.io | MIT licensed */
-
-// Vars.
-
- /// Breakpoints.
- /// @var {list}
- $breakpoints: () !global;
-
- /// Vendor prefixes.
- /// @var {list}
- $vendor-prefixes: (
- '-moz-',
- '-webkit-',
- '-ms-',
- ''
- );
-
- /// Properties that should be vendorized.
- /// @var {list}
- $vendor-properties: (
- 'align-content',
- 'align-items',
- 'align-self',
- 'animation',
- 'animation-delay',
- 'animation-direction',
- 'animation-duration',
- 'animation-fill-mode',
- 'animation-iteration-count',
- 'animation-name',
- 'animation-play-state',
- 'animation-timing-function',
- 'appearance',
- 'backface-visibility',
- 'box-sizing',
- 'filter',
- 'flex',
- 'flex-basis',
- 'flex-direction',
- 'flex-flow',
- 'flex-grow',
- 'flex-shrink',
- 'flex-wrap',
- 'justify-content',
- 'object-fit',
- 'object-position',
- 'order',
- 'perspective',
- 'pointer-events',
- 'transform',
- 'transform-origin',
- 'transform-style',
- 'transition',
- 'transition-delay',
- 'transition-duration',
- 'transition-property',
- 'transition-timing-function',
- 'user-select'
- );
-
- /// Values that should be vendorized.
- /// @var {list}
- $vendor-values: (
- 'filter',
- 'flex',
- 'linear-gradient',
- 'radial-gradient',
- 'transform'
- );
-
-// Functions.
-
- /// Removes a specific item from a list.
- /// @author Hugo Giraudel
- /// @param {list} $list List.
- /// @param {integer} $index Index.
- /// @return {list} Updated list.
- @function remove-nth($list, $index) {
-
- $result: null;
-
- @if type-of($index) != number {
- @warn "$index: #{quote($index)} is not a number for `remove-nth`.";
- }
- @else if $index == 0 {
- @warn "List index 0 must be a non-zero integer for `remove-nth`.";
- }
- @else if abs($index) > length($list) {
- @warn "List index is #{$index} but list is only #{length($list)} item long for `remove-nth`.";
- }
- @else {
-
- $result: ();
- $index: if($index < 0, length($list) + $index + 1, $index);
-
- @for $i from 1 through length($list) {
-
- @if $i != $index {
- $result: append($result, nth($list, $i));
- }
-
- }
-
- }
-
- @return $result;
-
- }
-
- /// Replaces a substring within another string.
- /// @author Hugo Giraudel
- /// @param {string} $string String.
- /// @param {string} $search Substring.
- /// @param {string} $replace Replacement.
- /// @return {string} Updated string.
- @function str-replace($string, $search, $replace: '') {
-
- $index: str-index($string, $search);
-
- @if $index {
- @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);
- }
-
- @return $string;
-
- }
-
- /// Replaces a substring within each string in a list.
- /// @param {list} $strings List of strings.
- /// @param {string} $search Substring.
- /// @param {string} $replace Replacement.
- /// @return {list} Updated list of strings.
- @function str-replace-all($strings, $search, $replace: '') {
-
- @each $string in $strings {
- $strings: set-nth($strings, index($strings, $string), str-replace($string, $search, $replace));
- }
-
- @return $strings;
-
- }
-
- /// Gets a value from a map.
- /// @author Hugo Giraudel
- /// @param {map} $map Map.
- /// @param {string} $keys Key(s).
- /// @return {string} Value.
- @function val($map, $keys...) {
-
- @if nth($keys, 1) == null {
- $keys: remove-nth($keys, 1);
- }
-
- @each $key in $keys {
- $map: map-get($map, $key);
- }
-
- @return $map;
-
- }
-
-// Mixins.
-
- /// Sets the global box model.
- /// @param {string} $model Model (default is content).
- @mixin boxModel($model: 'content') {
-
- $x: $model + '-box';
-
- *, *:before, *:after {
- -moz-box-sizing: #{$x};
- -webkit-box-sizing: #{$x};
- box-sizing: #{$x};
- }
-
- }
-
- /// Wraps @content in a @media block using a given breakpoint.
- /// @param {string} $breakpoint Breakpoint.
- /// @param {map} $queries Additional queries.
- @mixin breakpoint($breakpoint: null, $queries: null) {
-
- $query: 'screen';
-
- // Breakpoint.
- @if $breakpoint and map-has-key($breakpoints, $breakpoint) {
- $query: $query + ' and ' + map-get($breakpoints, $breakpoint);
- }
-
- // Queries.
- @if $queries {
- @each $k, $v in $queries {
- $query: $query + ' and (' + $k + ':' + $v + ')';
- }
- }
-
- @media #{$query} {
- @content;
- }
-
- }
-
- /// Wraps @content in a @media block targeting a specific orientation.
- /// @param {string} $orientation Orientation.
- @mixin orientation($orientation) {
- @media screen and (orientation: #{$orientation}) {
- @content;
- }
- }
-
- /// Utility mixin for containers.
- /// @param {mixed} $width Width.
- @mixin containers($width) {
-
- // Locked?
- $lock: false;
-
- @if length($width) == 2 {
- $width: nth($width, 1);
- $lock: true;
- }
-
- // Modifiers.
- .container.\31 25\25 { width: 100%; max-width: $width * 1.25; min-width: $width; }
- .container.\37 5\25 { width: $width * 0.75; }
- .container.\35 0\25 { width: $width * 0.5; }
- .container.\32 5\25 { width: $width * 0.25; }
-
- // Main class.
- .container {
- @if $lock {
- width: $width !important;
- }
- @else {
- width: $width;
- }
- }
-
- }
-
- /// Utility mixin for grid.
- /// @param {list} $gutters Column and row gutters (default is 40px).
- /// @param {string} $breakpointName Optional breakpoint name.
- @mixin grid($gutters: 40px, $breakpointName: null) {
-
- // Gutters.
- @include grid-gutters($gutters);
- @include grid-gutters($gutters, \32 00\25, 2);
- @include grid-gutters($gutters, \31 50\25, 1.5);
- @include grid-gutters($gutters, \35 0\25, 0.5);
- @include grid-gutters($gutters, \32 5\25, 0.25);
-
- // Cells.
- $x: '';
-
- @if $breakpointName {
- $x: '\\28' + $breakpointName + '\\29';
- }
-
- .\31 2u#{$x}, .\31 2u\24#{$x} { width: 100%; clear: none; margin-left: 0; }
- .\31 1u#{$x}, .\31 1u\24#{$x} { width: 91.6666666667%; clear: none; margin-left: 0; }
- .\31 0u#{$x}, .\31 0u\24#{$x} { width: 83.3333333333%; clear: none; margin-left: 0; }
- .\39 u#{$x}, .\39 u\24#{$x} { width: 75%; clear: none; margin-left: 0; }
- .\38 u#{$x}, .\38 u\24#{$x} { width: 66.6666666667%; clear: none; margin-left: 0; }
- .\37 u#{$x}, .\37 u\24#{$x} { width: 58.3333333333%; clear: none; margin-left: 0; }
- .\36 u#{$x}, .\36 u\24#{$x} { width: 50%; clear: none; margin-left: 0; }
- .\35 u#{$x}, .\35 u\24#{$x} { width: 41.6666666667%; clear: none; margin-left: 0; }
- .\34 u#{$x}, .\34 u\24#{$x} { width: 33.3333333333%; clear: none; margin-left: 0; }
- .\33 u#{$x}, .\33 u\24#{$x} { width: 25%; clear: none; margin-left: 0; }
- .\32 u#{$x}, .\32 u\24#{$x} { width: 16.6666666667%; clear: none; margin-left: 0; }
- .\31 u#{$x}, .\31 u\24#{$x} { width: 8.3333333333%; clear: none; margin-left: 0; }
-
- .\31 2u\24#{$x} + *,
- .\31 1u\24#{$x} + *,
- .\31 0u\24#{$x} + *,
- .\39 u\24#{$x} + *,
- .\38 u\24#{$x} + *,
- .\37 u\24#{$x} + *,
- .\36 u\24#{$x} + *,
- .\35 u\24#{$x} + *,
- .\34 u\24#{$x} + *,
- .\33 u\24#{$x} + *,
- .\32 u\24#{$x} + *,
- .\31 u\24#{$x} + * {
- clear: left;
- }
-
- .\-11u#{$x} { margin-left: 91.6666666667% }
- .\-10u#{$x} { margin-left: 83.3333333333% }
- .\-9u#{$x} { margin-left: 75% }
- .\-8u#{$x} { margin-left: 66.6666666667% }
- .\-7u#{$x} { margin-left: 58.3333333333% }
- .\-6u#{$x} { margin-left: 50% }
- .\-5u#{$x} { margin-left: 41.6666666667% }
- .\-4u#{$x} { margin-left: 33.3333333333% }
- .\-3u#{$x} { margin-left: 25% }
- .\-2u#{$x} { margin-left: 16.6666666667% }
- .\-1u#{$x} { margin-left: 8.3333333333% }
-
- }
-
- /// Utility mixin for grid.
- /// @param {list} $gutters Gutters.
- /// @param {string} $class Optional class name.
- /// @param {integer} $multiplier Multiplier (default is 1).
- @mixin grid-gutters($gutters, $class: null, $multiplier: 1) {
-
- // Expand gutters if it's not a list.
- @if length($gutters) == 1 {
- $gutters: ($gutters, 0);
- }
-
- // Get column and row gutter values.
- $c: nth($gutters, 1);
- $r: nth($gutters, 2);
-
- // Get class (if provided).
- $x: '';
-
- @if $class {
- $x: '.' + $class;
- }
-
- // Default.
- .row#{$x} > * { padding: ($r * $multiplier) 0 0 ($c * $multiplier); }
- .row#{$x} { margin: ($r * $multiplier * -1) 0 -1px ($c * $multiplier * -1); }
-
- // Uniform.
- .row.uniform#{$x} > * { padding: ($c * $multiplier) 0 0 ($c * $multiplier); }
- .row.uniform#{$x} { margin: ($c * $multiplier * -1) 0 -1px ($c * $multiplier * -1); }
-
- }
-
- /// Wraps @content in vendorized keyframe blocks.
- /// @param {string} $name Name.
- @mixin keyframes($name) {
-
- @-moz-keyframes #{$name} { @content; }
- @-webkit-keyframes #{$name} { @content; }
- @-ms-keyframes #{$name} { @content; }
- @keyframes #{$name} { @content; }
-
- }
-
- ///
- /// Sets breakpoints.
- /// @param {map} $x Breakpoints.
- ///
- @mixin skel-breakpoints($x: ()) {
- $breakpoints: $x !global;
- }
-
- ///
- /// Initializes layout module.
- /// @param {map} config Config.
- ///
- @mixin skel-layout($config: ()) {
-
- // Config.
- $configPerBreakpoint: ();
-
- $z: map-get($config, 'breakpoints');
-
- @if $z {
- $configPerBreakpoint: $z;
- }
-
- // Reset.
- $x: map-get($config, 'reset');
-
- @if $x {
-
- /* Reset */
-
- @include reset($x);
-
- }
-
- // Box model.
- $x: map-get($config, 'boxModel');
-
- @if $x {
-
- /* Box Model */
-
- @include boxModel($x);
-
- }
-
- // Containers.
- $containers: map-get($config, 'containers');
-
- @if $containers {
-
- /* Containers */
-
- .container {
- margin-left: auto;
- margin-right: auto;
- }
-
- // Use default is $containers is just "true".
- @if $containers == true {
- $containers: 960px;
- }
-
- // Apply base.
- @include containers($containers);
-
- // Apply per-breakpoint.
- @each $name in map-keys($breakpoints) {
-
- // Get/use breakpoint setting if it exists.
- $x: map-get($configPerBreakpoint, $name);
-
- // Per-breakpoint config exists?
- @if $x {
- $y: map-get($x, 'containers');
-
- // Setting exists? Use it.
- @if $y {
- $containers: $y;
- }
-
- }
-
- // Create @media block.
- @media screen and #{map-get($breakpoints, $name)} {
- @include containers($containers);
- }
-
- }
-
- }
-
- // Grid.
- $grid: map-get($config, 'grid');
-
- @if $grid {
-
- /* Grid */
-
- // Use defaults if $grid is just "true".
- @if $grid == true {
- $grid: ();
- }
-
- // Sub-setting: Gutters.
- $grid-gutters: 40px;
- $x: map-get($grid, 'gutters');
-
- @if $x {
- $grid-gutters: $x;
- }
-
- // Rows.
- .row {
- border-bottom: solid 1px transparent;
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
- box-sizing: border-box;
- }
-
- .row > * {
- float: left;
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
- box-sizing: border-box;
- }
-
- .row:after, .row:before {
- content: '';
- display: block;
- clear: both;
- height: 0;
- }
-
- .row.uniform > * > :first-child {
- margin-top: 0;
- }
-
- .row.uniform > * > :last-child {
- margin-bottom: 0;
- }
-
- // Gutters (0%).
- @include grid-gutters($grid-gutters, \30 \25, 0);
-
- // Apply base.
- @include grid($grid-gutters);
-
- // Apply per-breakpoint.
- @each $name in map-keys($breakpoints) {
-
- // Get/use breakpoint setting if it exists.
- $x: map-get($configPerBreakpoint, $name);
-
- // Per-breakpoint config exists?
- @if $x {
- $y: map-get($x, 'grid');
-
- // Setting exists?
- @if $y {
-
- // Sub-setting: Gutters.
- $x: map-get($y, 'gutters');
-
- @if $x {
- $grid-gutters: $x;
- }
-
- }
-
- }
-
- // Create @media block.
- @media screen and #{map-get($breakpoints, $name)} {
- @include grid($grid-gutters, $name);
- }
-
- }
-
- }
-
- }
-
- /// Resets browser styles.
- /// @param {string} $mode Mode (default is 'normalize').
- @mixin reset($mode: 'normalize') {
-
- @if $mode == 'normalize' {
-
- // normalize.css v3.0.2 | MIT License | git.io/normalize
- html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}
-
- }
- @else if $mode == 'full' {
-
- // meyerweb.com/eric/tools/css/reset v2.0 | 20110126 | License: none (public domain)
- html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}body{line-height:1;}ol,ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}table{border-collapse:collapse;border-spacing:0;}body{-webkit-text-size-adjust:none}
-
- }
-
- }
-
- /// Vendorizes a declaration's property and/or value(s).
- /// @param {string} $property Property.
- /// @param {mixed} $value String/list of value(s).
- @mixin vendor($property, $value) {
-
- // Determine if property should expand.
- $expandProperty: index($vendor-properties, $property);
-
- // Determine if value should expand (and if so, add '-prefix-' placeholder).
- $expandValue: false;
-
- @each $x in $value {
- @each $y in $vendor-values {
- @if $y == str-slice($x, 1, str-length($y)) {
-
- $value: set-nth($value, index($value, $x), '-prefix-' + $x);
- $expandValue: true;
-
- }
- }
- }
-
- // Expand property?
- @if $expandProperty {
- @each $vendor in $vendor-prefixes {
- #{$vendor}#{$property}: #{str-replace-all($value, '-prefix-', $vendor)};
- }
- }
-
- // Expand just the value?
- @elseif $expandValue {
- @each $vendor in $vendor-prefixes {
- #{$property}: #{str-replace-all($value, '-prefix-', $vendor)};
- }
- }
-
- // Neither? Treat them as a normal declaration.
- @else {
- #{$property}: #{$value};
- }
-
- }
\ No newline at end of file
diff --git a/GiphyTV/assets/sass/libs/_vars.scss b/GiphyTV/assets/sass/libs/_vars.scss
deleted file mode 100644
index cec5f7a..0000000
--- a/GiphyTV/assets/sass/libs/_vars.scss
+++ /dev/null
@@ -1,45 +0,0 @@
-// Misc.
- $misc: (
- z-index-base: 10000,
- main-side: right,
- main-align: right,
- thumbnails-per-row: 2
- );
-
-// Duration.
- $duration: (
- transition: 0.25s,
- layout: 0.75s,
- layout-alt: 0.5s,
- slide: 0.5s,
- spinner: 1s
- );
-
-// Size.
- $size: (
- border-radius: 4px,
- border-width: 1px,
- element-height: 2.75em,
- element-margin: 1.25em,
- main: 22.5em,
- main-alt: 19em
- );
-
-// Font.
- $font: (
- family: ('Roboto', Helvetica, sans-serif),
- family-fixed: ('Courier New', monospace),
- weight: 400,
- weight-bold: 700
- );
-
-// Palette.
- $palette: (
- page-bg: #101010,
- bg: #fff,
- fg: #aaa,
- fg-bold: #555,
- fg-light: #ccc,
- border: #ccc,
- accent: #00D3B7
- );
\ No newline at end of file
diff --git a/GiphyTV/assets/sass/main.scss b/GiphyTV/assets/sass/main.scss
deleted file mode 100644
index 7ab5b44..0000000
--- a/GiphyTV/assets/sass/main.scss
+++ /dev/null
@@ -1,45 +0,0 @@
-@import 'libs/vars';
-@import 'libs/functions';
-@import 'libs/mixins';
-@import 'libs/skel';
-@import 'font-awesome.min.css';
-@import url("https://fonts.googleapis.com/css?family=Roboto:400,700");
-
-/*
- Lens by HTML5 UP
- html5up.net | @ajlkn
- Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-*/
-
- @include skel-breakpoints((
- xlarge: '(max-width: 1680px)',
- large: '(max-width: 1280px)',
- medium: '(max-width: 980px)',
- small: '(max-width: 736px)',
- xsmall: '(max-width: 480px)'
- ));
-
- @include skel-layout((
- reset: 'full',
- boxModel: 'border'
- ));
-
-// Base.
-
- @import 'base/page';
- @import 'base/typography';
-
-// Component.
-
- @import 'components/button';
- @import 'components/form';
- @import 'components/icon';
- @import 'components/list';
-
-// Layout.
-
- @import 'layout/main';
- @import 'layout/header';
- @import 'layout/footer';
- @import 'layout/thumbnails';
- @import 'layout/viewer';
\ No newline at end of file
diff --git a/GiphyTV/favicon/android-icon-144x144.png b/GiphyTV/favicon/android-icon-144x144.png
deleted file mode 100644
index deee515..0000000
Binary files a/GiphyTV/favicon/android-icon-144x144.png and /dev/null differ
diff --git a/GiphyTV/favicon/android-icon-192x192.png b/GiphyTV/favicon/android-icon-192x192.png
deleted file mode 100644
index 66077d9..0000000
Binary files a/GiphyTV/favicon/android-icon-192x192.png and /dev/null differ
diff --git a/GiphyTV/favicon/android-icon-36x36.png b/GiphyTV/favicon/android-icon-36x36.png
deleted file mode 100644
index 02ca412..0000000
Binary files a/GiphyTV/favicon/android-icon-36x36.png and /dev/null differ
diff --git a/GiphyTV/favicon/android-icon-48x48.png b/GiphyTV/favicon/android-icon-48x48.png
deleted file mode 100644
index db64197..0000000
Binary files a/GiphyTV/favicon/android-icon-48x48.png and /dev/null differ
diff --git a/GiphyTV/favicon/android-icon-72x72.png b/GiphyTV/favicon/android-icon-72x72.png
deleted file mode 100644
index 1c89b8c..0000000
Binary files a/GiphyTV/favicon/android-icon-72x72.png and /dev/null differ
diff --git a/GiphyTV/favicon/android-icon-96x96.png b/GiphyTV/favicon/android-icon-96x96.png
deleted file mode 100644
index da6bb22..0000000
Binary files a/GiphyTV/favicon/android-icon-96x96.png and /dev/null differ
diff --git a/GiphyTV/favicon/apple-icon-114x114.png b/GiphyTV/favicon/apple-icon-114x114.png
deleted file mode 100644
index c82e1c4..0000000
Binary files a/GiphyTV/favicon/apple-icon-114x114.png and /dev/null differ
diff --git a/GiphyTV/favicon/apple-icon-120x120.png b/GiphyTV/favicon/apple-icon-120x120.png
deleted file mode 100644
index e01935e..0000000
Binary files a/GiphyTV/favicon/apple-icon-120x120.png and /dev/null differ
diff --git a/GiphyTV/favicon/apple-icon-144x144.png b/GiphyTV/favicon/apple-icon-144x144.png
deleted file mode 100644
index deee515..0000000
Binary files a/GiphyTV/favicon/apple-icon-144x144.png and /dev/null differ
diff --git a/GiphyTV/favicon/apple-icon-152x152.png b/GiphyTV/favicon/apple-icon-152x152.png
deleted file mode 100644
index 55d9a04..0000000
Binary files a/GiphyTV/favicon/apple-icon-152x152.png and /dev/null differ
diff --git a/GiphyTV/favicon/apple-icon-180x180.png b/GiphyTV/favicon/apple-icon-180x180.png
deleted file mode 100644
index d82b278..0000000
Binary files a/GiphyTV/favicon/apple-icon-180x180.png and /dev/null differ
diff --git a/GiphyTV/favicon/apple-icon-57x57.png b/GiphyTV/favicon/apple-icon-57x57.png
deleted file mode 100644
index 857d318..0000000
Binary files a/GiphyTV/favicon/apple-icon-57x57.png and /dev/null differ
diff --git a/GiphyTV/favicon/apple-icon-60x60.png b/GiphyTV/favicon/apple-icon-60x60.png
deleted file mode 100644
index 39113ec..0000000
Binary files a/GiphyTV/favicon/apple-icon-60x60.png and /dev/null differ
diff --git a/GiphyTV/favicon/apple-icon-72x72.png b/GiphyTV/favicon/apple-icon-72x72.png
deleted file mode 100644
index 1c89b8c..0000000
Binary files a/GiphyTV/favicon/apple-icon-72x72.png and /dev/null differ
diff --git a/GiphyTV/favicon/apple-icon-76x76.png b/GiphyTV/favicon/apple-icon-76x76.png
deleted file mode 100644
index 7426898..0000000
Binary files a/GiphyTV/favicon/apple-icon-76x76.png and /dev/null differ
diff --git a/GiphyTV/favicon/apple-icon-precomposed.png b/GiphyTV/favicon/apple-icon-precomposed.png
deleted file mode 100644
index f18cf13..0000000
Binary files a/GiphyTV/favicon/apple-icon-precomposed.png and /dev/null differ
diff --git a/GiphyTV/favicon/apple-icon.png b/GiphyTV/favicon/apple-icon.png
deleted file mode 100644
index f18cf13..0000000
Binary files a/GiphyTV/favicon/apple-icon.png and /dev/null differ
diff --git a/GiphyTV/favicon/browserconfig.xml b/GiphyTV/favicon/browserconfig.xml
deleted file mode 100644
index c554148..0000000
--- a/GiphyTV/favicon/browserconfig.xml
+++ /dev/null
@@ -1,2 +0,0 @@
-
-#ffffff Run your own GiphyTV!!
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-' + '
').appendTo(_.$body);
+
+ // Nav.
+ _.$navNext = _.$viewer.find('.nav-next');
+ _.$navPrevious = _.$viewer.find('.nav-previous');
+
+ // Main wrapper.
+ _.$main = $('#main');
+
+ // Toggle.
+ $('')
+ .appendTo(_.$main);
+
+ _.$toggle = $('.toggle');
+
+ // IE<9: Fix viewer width (no calc support).
+ if (skel.vars.IEVersion < 9)
+ _.$window
+ .on('resize', function() {
+ window.setTimeout(function() {
+ _.$viewer.css('width', _.$window.width() - _.$main.width());
+ }, 100);
+ })
+ .trigger('resize');
+
+ },
+
+ /**
+ * Initialize events.
+ */
+ initEvents: function() {
+
+ // Window.
+
+ // Remove is-loading-* classes on load.
+ _.$window.on('load', function() {
+
+ _.$body.removeClass('is-loading-0');
+
+ window.setTimeout(function() {
+ _.$body.removeClass('is-loading-1');
+ }, 100);
+
+ window.setTimeout(function() {
+ _.$body.removeClass('is-loading-2');
+ }, 100 + Math.max(_.settings.layoutDuration - 150, 0));
+
+ });
+
+ // Disable animations/transitions on resize.
+ var resizeTimeout;
+
+ _.$window.on('resize', function() {
+
+ _.$body.addClass('is-loading-0');
+ window.clearTimeout(resizeTimeout);
+
+ resizeTimeout = window.setTimeout(function() {
+ _.$body.removeClass('is-loading-0');
+ }, 100);
+
+ });
+
+ // Viewer.
+
+ // Hide main wrapper on tap (<= medium only).
+ _.$viewer.on('touchend', function() {
+
+ if (skel.breakpoint('medium').active)
+ _.hide();
+
+ });
+
+ // Touch gestures.
+ _.$viewer
+ .on('touchstart', function(event) {
+
+ // Record start position.
+ _.$viewer.touchPosX = event.originalEvent.touches[0].pageX;
+ _.$viewer.touchPosY = event.originalEvent.touches[0].pageY;
+
+ })
+ .on('touchmove', function(event) {
+
+ // No start position recorded? Bail.
+ if (_.$viewer.touchPosX === null
+ || _.$viewer.touchPosY === null)
+ return;
+
+ // Calculate stuff.
+ var diffX = _.$viewer.touchPosX - event.originalEvent.touches[0].pageX,
+ diffY = _.$viewer.touchPosY - event.originalEvent.touches[0].pageY;
+ boundary = 20,
+ delta = 50;
+
+ // Swipe left (next).
+ if ( (diffY < boundary && diffY > (-1 * boundary)) && (diffX > delta) )
+ _.next();
+
+ // Swipe right (previous).
+ else if ( (diffY < boundary && diffY > (-1 * boundary)) && (diffX < (-1 * delta)) )
+ _.previous();
+
+ // Overscroll fix.
+ var th = _.$viewer.outerHeight(),
+ ts = (_.$viewer.get(0).scrollHeight - _.$viewer.scrollTop());
+
+ if ((_.$viewer.scrollTop() <= 0 && diffY < 0)
+ || (ts > (th - 2) && ts < (th + 2) && diffY > 0)) {
+
+ event.preventDefault();
+ event.stopPropagation();
+
+ }
+
+ });
+
+ // Main.
+
+ // Touch gestures.
+ _.$main
+ .on('touchstart', function(event) {
+
+ // Bail on xsmall.
+ if (skel.breakpoint('xsmall').active)
+ return;
+
+ // Record start position.
+ _.$main.touchPosX = event.originalEvent.touches[0].pageX;
+ _.$main.touchPosY = event.originalEvent.touches[0].pageY;
+
+ })
+ .on('touchmove', function(event) {
+
+ // Bail on xsmall.
+ if (skel.breakpoint('xsmall').active)
+ return;
+
+ // No start position recorded? Bail.
+ if (_.$main.touchPosX === null
+ || _.$main.touchPosY === null)
+ return;
+
+ // Calculate stuff.
+ var diffX = _.$main.touchPosX - event.originalEvent.touches[0].pageX,
+ diffY = _.$main.touchPosY - event.originalEvent.touches[0].pageY;
+ boundary = 20,
+ delta = 50,
+ result = false;
+
+ // Swipe to close.
+ switch (_.settings.mainSide) {
+
+ case 'left':
+ result = (diffY < boundary && diffY > (-1 * boundary)) && (diffX > delta);
+ break;
+
+ case 'right':
+ result = (diffY < boundary && diffY > (-1 * boundary)) && (diffX < (-1 * delta));
+ break;
+
+ default:
+ break;
+
+ }
+
+ if (result)
+ _.hide();
+
+ // Overscroll fix.
+ var th = _.$main.outerHeight(),
+ ts = (_.$main.get(0).scrollHeight - _.$main.scrollTop());
+
+ if ((_.$main.scrollTop() <= 0 && diffY < 0)
+ || (ts > (th - 2) && ts < (th + 2) && diffY > 0)) {
+
+ event.preventDefault();
+ event.stopPropagation();
+
+ }
+
+ });
+ // Toggle.
+ _.$toggle.on('click', function() {
+ _.toggle();
});
- // Fix: Placeholder polyfill.
- $('form').placeholder();
+ // Prevent event from bubbling up to "hide event on tap" event.
+ _.$toggle.on('touchend', function(event) {
+ event.stopPropagation();
+ });
+
+ // Nav.
+ _.$navNext.on('click', function() {
+ _.next();
+ });
+
+ _.$navPrevious.on('click', function() {
+ _.previous();
+ });
+
+ // Keyboard shortcuts.
+
+ // Ignore shortcuts within form elements.
+ _.$body.on('keydown', 'input,select,textarea', function(event) {
+ event.stopPropagation();
+ });
+
+ _.$window.on('keydown', function(event) {
+
+ // Ignore if xsmall is active.
+ if (skel.breakpoint('xsmall').active)
+ return;
+
+ // Check keycode.
+ if (event.keyCode in _.keys) {
+
+ // Stop other events.
+ event.stopPropagation();
+ event.preventDefault();
+
+ // Call shortcut.
+ (_.keys[event.keyCode])();
+
+ }
+
+ });
+
+ },
+
+ /**
+ * Initialize viewer.
+ */
+ initViewer: function() {
+
+ // Bind thumbnail click event.
+ _.$thumbnails
+ .on('click', '.thumbnail', function(event) {
+
+ var $this = $(this);
+
+ // Stop other events.
+ event.preventDefault();
+ event.stopPropagation();
+
+ // Locked? Blur.
+ if (_.locked)
+ $this.blur();
+
+ // Switch to this thumbnail's slide.
+ _.switchTo($this.data('index'));
+
+ });
- // Prioritize "important" elements on mobile.
- skel.on('+mobile -mobile', function() {
- $.prioritize(
- '.important\\28 mobile\\29',
- skel.breakpoint('mobile').active
- );
+ // Create slides from thumbnails.
+ _.$thumbnails.children()
+ .each(function() {
+
+ var $this = $(this),
+ $thumbnail = $this.children('.thumbnail'),
+ s;
+
+ // Slide object.
+ s = {
+ $parent: $this,
+ $slide: null,
+ $slideImage: null,
+ $slideCaption: null,
+ url: $thumbnail.attr('href'),
+ loaded: false
+ };
+
+ // Parent.
+ $this.attr('tabIndex', '-1');
+
+ // Slide.
+
+ // Create elements.
+ s.$slide = $('');
+
+ // Image.
+ s.$slideImage = s.$slide.children('.image');
+
+ // Set background stuff.
+ s.$slideImage
+ .css('background-image', '')
+ .css('background-position', ($thumbnail.data('position') || 'center'));
+
+ // Caption.
+ s.$slideCaption = s.$slide.find('.caption');
+
+ // Move everything *except* the thumbnail itself to the caption.
+ $this.children().not($thumbnail)
+ .appendTo(s.$slideCaption);
+
+ // Preload?
+ if (_.settings.preload) {
+
+ // Force image to download.
+ var $img = $('' + '
').appendTo(_.$body);
-
- // Nav.
- _.$navNext = _.$viewer.find('.nav-next');
- _.$navPrevious = _.$viewer.find('.nav-previous');
-
- // Main wrapper.
- _.$main = $('#main');
-
- // Toggle.
- $('')
- .appendTo(_.$main);
-
- _.$toggle = $('.toggle');
-
- // IE<9: Fix viewer width (no calc support).
- if (skel.vars.IEVersion < 9)
- _.$window
- .on('resize', function() {
- window.setTimeout(function() {
- _.$viewer.css('width', _.$window.width() - _.$main.width());
- }, 100);
- })
- .trigger('resize');
-
- },
-
- /**
- * Initialize events.
- */
- initEvents: function() {
-
- // Window.
-
- // Remove is-loading-* classes on load.
- _.$window.on('load', function() {
-
- _.$body.removeClass('is-loading-0');
-
- window.setTimeout(function() {
- _.$body.removeClass('is-loading-1');
- }, 100);
-
- window.setTimeout(function() {
- _.$body.removeClass('is-loading-2');
- }, 100 + Math.max(_.settings.layoutDuration - 150, 0));
-
- });
-
- // Disable animations/transitions on resize.
- var resizeTimeout;
-
- _.$window.on('resize', function() {
-
- _.$body.addClass('is-loading-0');
- window.clearTimeout(resizeTimeout);
-
- resizeTimeout = window.setTimeout(function() {
- _.$body.removeClass('is-loading-0');
- }, 100);
-
- });
-
- // Viewer.
-
- // Hide main wrapper on tap (<= medium only).
- _.$viewer.on('touchend', function() {
-
- if (skel.breakpoint('medium').active)
- _.hide();
-
- });
-
- // Touch gestures.
- _.$viewer
- .on('touchstart', function(event) {
-
- // Record start position.
- _.$viewer.touchPosX = event.originalEvent.touches[0].pageX;
- _.$viewer.touchPosY = event.originalEvent.touches[0].pageY;
-
- })
- .on('touchmove', function(event) {
-
- // No start position recorded? Bail.
- if (_.$viewer.touchPosX === null
- || _.$viewer.touchPosY === null)
- return;
-
- // Calculate stuff.
- var diffX = _.$viewer.touchPosX - event.originalEvent.touches[0].pageX,
- diffY = _.$viewer.touchPosY - event.originalEvent.touches[0].pageY;
- boundary = 20,
- delta = 50;
-
- // Swipe left (next).
- if ( (diffY < boundary && diffY > (-1 * boundary)) && (diffX > delta) )
- _.next();
-
- // Swipe right (previous).
- else if ( (diffY < boundary && diffY > (-1 * boundary)) && (diffX < (-1 * delta)) )
- _.previous();
-
- // Overscroll fix.
- var th = _.$viewer.outerHeight(),
- ts = (_.$viewer.get(0).scrollHeight - _.$viewer.scrollTop());
-
- if ((_.$viewer.scrollTop() <= 0 && diffY < 0)
- || (ts > (th - 2) && ts < (th + 2) && diffY > 0)) {
-
- event.preventDefault();
- event.stopPropagation();
-
- }
-
- });
-
- // Main.
-
- // Touch gestures.
- _.$main
- .on('touchstart', function(event) {
-
- // Bail on xsmall.
- if (skel.breakpoint('xsmall').active)
- return;
-
- // Record start position.
- _.$main.touchPosX = event.originalEvent.touches[0].pageX;
- _.$main.touchPosY = event.originalEvent.touches[0].pageY;
-
- })
- .on('touchmove', function(event) {
-
- // Bail on xsmall.
- if (skel.breakpoint('xsmall').active)
- return;
-
- // No start position recorded? Bail.
- if (_.$main.touchPosX === null
- || _.$main.touchPosY === null)
- return;
-
- // Calculate stuff.
- var diffX = _.$main.touchPosX - event.originalEvent.touches[0].pageX,
- diffY = _.$main.touchPosY - event.originalEvent.touches[0].pageY;
- boundary = 20,
- delta = 50,
- result = false;
-
- // Swipe to close.
- switch (_.settings.mainSide) {
-
- case 'left':
- result = (diffY < boundary && diffY > (-1 * boundary)) && (diffX > delta);
- break;
-
- case 'right':
- result = (diffY < boundary && diffY > (-1 * boundary)) && (diffX < (-1 * delta));
- break;
-
- default:
- break;
-
- }
-
- if (result)
- _.hide();
-
- // Overscroll fix.
- var th = _.$main.outerHeight(),
- ts = (_.$main.get(0).scrollHeight - _.$main.scrollTop());
-
- if ((_.$main.scrollTop() <= 0 && diffY < 0)
- || (ts > (th - 2) && ts < (th + 2) && diffY > 0)) {
-
- event.preventDefault();
- event.stopPropagation();
-
- }
-
- });
- // Toggle.
- _.$toggle.on('click', function() {
- _.toggle();
- });
-
- // Prevent event from bubbling up to "hide event on tap" event.
- _.$toggle.on('touchend', function(event) {
- event.stopPropagation();
- });
-
- // Nav.
- _.$navNext.on('click', function() {
- _.next();
- });
-
- _.$navPrevious.on('click', function() {
- _.previous();
- });
-
- // Keyboard shortcuts.
-
- // Ignore shortcuts within form elements.
- _.$body.on('keydown', 'input,select,textarea', function(event) {
- event.stopPropagation();
- });
-
- _.$window.on('keydown', function(event) {
-
- // Ignore if xsmall is active.
- if (skel.breakpoint('xsmall').active)
- return;
-
- // Check keycode.
- if (event.keyCode in _.keys) {
-
- // Stop other events.
- event.stopPropagation();
- event.preventDefault();
-
- // Call shortcut.
- (_.keys[event.keyCode])();
-
- }
-
- });
-
- },
-
- /**
- * Initialize viewer.
- */
- initViewer: function() {
-
- // Bind thumbnail click event.
- _.$thumbnails
- .on('click', '.thumbnail', function(event) {
-
- var $this = $(this);
-
- // Stop other events.
- event.preventDefault();
- event.stopPropagation();
-
- // Locked? Blur.
- if (_.locked)
- $this.blur();
-
- // Switch to this thumbnail's slide.
- _.switchTo($this.data('index'));
-
- });
-
- // Create slides from thumbnails.
- _.$thumbnails.children()
- .each(function() {
-
- var $this = $(this),
- $thumbnail = $this.children('.thumbnail'),
- s;
-
- // Slide object.
- s = {
- $parent: $this,
- $slide: null,
- $slideImage: null,
- $slideCaption: null,
- url: $thumbnail.attr('href'),
- loaded: false
- };
-
- // Parent.
- $this.attr('tabIndex', '-1');
-
- // Slide.
-
- // Create elements.
- s.$slide = $('');
-
- // Image.
- s.$slideImage = s.$slide.children('.image');
-
- // Set background stuff.
- s.$slideImage
- .css('background-image', '')
- .css('background-position', ($thumbnail.data('position') || 'center'));
-
- // Caption.
- s.$slideCaption = s.$slide.find('.caption');
-
- // Move everything *except* the thumbnail itself to the caption.
- $this.children().not($thumbnail)
- .appendTo(s.$slideCaption);
-
- // Preload?
- if (_.settings.preload) {
-
- // Force image to download.
- var $img = $('
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/assets/css/ie8.css b/assets/css/ie8.css
index 047d302..d939bf0 100644
--- a/assets/css/ie8.css
+++ b/assets/css/ie8.css
@@ -1,368 +1,11 @@
/*
- Photon by HTML5 UP
+ Lens by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/
-/* Basic */
+/* Viewer */
- hr {
- border-bottom: solid 1px #ccc;
- }
-
- blockquote {
- border-left: solid 4px #ccc;
- }
-
- code {
- border: solid 1px #ccc;
- }
-
-/* Section/Article */
-
- header.major:after {
- background: #ccc;
- }
-
-/* Form */
-
- input[type="text"],
- input[type="password"],
- input[type="email"],
- select,
- textarea {
- -ms-behavior: url("assets/js/ie/PIE.htc");
- border: solid 1px #ccc;
- position: relative;
- }
-
-/* List */
-
- ul.alt li {
- border-top: solid 1px #ccc;
- }
-
- ul.major-icons li .icon {
- -ms-behavior: url("assets/js/ie/PIE.htc");
- border: solid 1px #ccc;
- position: relative;
- }
-
-/* Table */
-
- table thead {
- border-bottom: solid 1px #ccc;
- }
-
- table tfoot {
- border-top: solid 1px #ccc;
- }
-
- table.alt tbody tr td {
- border: solid 1px #ccc;
- border-left-width: 0;
- border-top-width: 0;
- }
-
-/* Button */
-
- input[type="submit"],
- input[type="reset"],
- input[type="button"],
- button,
- .button {
- -ms-behavior: url("assets/js/ie/PIE.htc");
- border: solid 1px #ccc;
- position: relative;
- }
-
-/* Image */
-
- .image {
- -ms-behavior: url("assets/js/ie/PIE.htc");
- }
-
- .image img {
- -ms-behavior: url("assets/js/ie/PIE.htc");
- position: relative;
- }
-
-/* Main */
-
- .main.style2 {
- background-color: #333;
- color: #ffffff;
- -ms-behavior: url("assets/js/ie/backgroundsize.min.htc");
- background-image: url("../../images/header.jpg");
- background-size: cover;
- position: relative;
- }
-
- .main.style2 a {
- border-bottom-color: #ffffff;
- }
-
- .main.style2 a:hover {
- color: #ffffff;
- }
-
- .main.style2 h1, .main.style2 h2, .main.style2 h3, .main.style2 h4, .main.style2 h5, .main.style2 h6, .main.style2 strong, .main.style2 b {
- color: #ffffff;
- }
-
- .main.style2 header p {
- color: #ffffff;
- }
-
- .main.style2 header.major:after {
- background: #ffffff;
- }
-
- .main.style2 input[type="submit"],
- .main.style2 input[type="reset"],
- .main.style2 input[type="button"],
- .main.style2 button,
- .main.style2 .button {
- border: solid 1px #ffffff !important;
- color: #ffffff !important;
- }
-
- .main.style2 input[type="submit"]:hover,
- .main.style2 input[type="reset"]:hover,
- .main.style2 input[type="button"]:hover,
- .main.style2 button:hover,
- .main.style2 .button:hover {
- background-color: transparent;
- }
-
- .main.style2 input[type="submit"]:active,
- .main.style2 input[type="reset"]:active,
- .main.style2 input[type="button"]:active,
- .main.style2 button:active,
- .main.style2 .button:active {
- background-color: transparent;
- }
-
- .main.style2 input[type="submit"].special,
- .main.style2 input[type="reset"].special,
- .main.style2 input[type="button"].special,
- .main.style2 button.special,
- .main.style2 .button.special {
- background-color: #ffffff;
- border: solid 1px #ffffff !important;
- color: #333 !important;
- }
-
- .main.style2 input[type="submit"].special:hover,
- .main.style2 input[type="reset"].special:hover,
- .main.style2 input[type="button"].special:hover,
- .main.style2 button.special:hover,
- .main.style2 .button.special:hover {
- background-color: transparent !important;
- color: #ffffff !important;
- }
-
- .main.style2 input[type="submit"].special:active,
- .main.style2 input[type="reset"].special:active,
- .main.style2 input[type="button"].special:active,
- .main.style2 button.special:active,
- .main.style2 .button.special:active {
- background-color: transparent !important;
- }
-
- .main.style2 ul.major-icons li .icon {
- border-color: #ffffff;
- }
-
- .main.style2 .icon.major {
- color: #ffffff;
- }
-
- .main.style2:before {
- background-image: url("images/overlay1.png");
- content: '';
- height: 100%;
- left: 0;
- position: absolute;
- top: 0;
- width: 100%;
- }
-
- .main.style2 > * {
- position: relative;
- z-index: 1;
- }
-
-/* Header */
-
- #header {
- background-color: #4686a0;
- color: #ffffff;
- }
-
- #header a {
- border-bottom-color: #ffffff;
- }
-
- #header a:hover {
- color: #ffffff;
- }
-
- #header h1, #header h2, #header h3, #header h4, #header h5, #header h6, #header strong, #header b {
- color: #ffffff;
- }
-
- #header header p {
- color: #ffffff;
- }
-
- #header header.major:after {
- background: #ffffff;
- }
-
- #header input[type="submit"],
- #header input[type="reset"],
- #header input[type="button"],
- #header button,
- #header .button {
- border: solid 1px #ffffff !important;
- color: #ffffff !important;
- }
-
- #header input[type="submit"]:hover,
- #header input[type="reset"]:hover,
- #header input[type="button"]:hover,
- #header button:hover,
- #header .button:hover {
- background-color: transparent;
- }
-
- #header input[type="submit"]:active,
- #header input[type="reset"]:active,
- #header input[type="button"]:active,
- #header button:active,
- #header .button:active {
- background-color: transparent;
- }
-
- #header input[type="submit"].special,
- #header input[type="reset"].special,
- #header input[type="button"].special,
- #header button.special,
- #header .button.special {
- background-color: #ffffff;
- border: solid 1px #ffffff !important;
- color: #4686a0 !important;
- }
-
- #header input[type="submit"].special:hover,
- #header input[type="reset"].special:hover,
- #header input[type="button"].special:hover,
- #header button.special:hover,
- #header .button.special:hover {
- background-color: transparent !important;
- color: #ffffff !important;
- }
-
- #header input[type="submit"].special:active,
- #header input[type="reset"].special:active,
- #header input[type="button"].special:active,
- #header button.special:active,
- #header .button.special:active {
- background-color: transparent !important;
- }
-
- #header ul.major-icons li .icon {
- border-color: #ffffff;
- }
-
- #header .icon.major {
- color: #ffffff;
- }
-
-/* Footer */
-
- #footer {
- background-color: #4686a0;
- color: #ffffff;
- }
-
- #footer a {
- border-bottom-color: #ffffff;
- }
-
- #footer a:hover {
- color: #ffffff;
- }
-
- #footer h1, #footer h2, #footer h3, #footer h4, #footer h5, #footer h6, #footer strong, #footer b {
- color: #ffffff;
- }
-
- #footer header p {
- color: #ffffff;
- }
-
- #footer header.major:after {
- background: #ffffff;
- }
-
- #footer input[type="submit"],
- #footer input[type="reset"],
- #footer input[type="button"],
- #footer button,
- #footer .button {
- border: solid 1px #ffffff !important;
- color: #ffffff !important;
- }
-
- #footer input[type="submit"]:hover,
- #footer input[type="reset"]:hover,
- #footer input[type="button"]:hover,
- #footer button:hover,
- #footer .button:hover {
- background-color: transparent;
- }
-
- #footer input[type="submit"]:active,
- #footer input[type="reset"]:active,
- #footer input[type="button"]:active,
- #footer button:active,
- #footer .button:active {
- background-color: transparent;
- }
-
- #footer input[type="submit"].special,
- #footer input[type="reset"].special,
- #footer input[type="button"].special,
- #footer button.special,
- #footer .button.special {
- background-color: #ffffff;
- border: solid 1px #ffffff !important;
- color: #4686a0 !important;
- }
-
- #footer input[type="submit"].special:hover,
- #footer input[type="reset"].special:hover,
- #footer input[type="button"].special:hover,
- #footer button.special:hover,
- #footer .button.special:hover {
- background-color: transparent !important;
- color: #ffffff !important;
- }
-
- #footer input[type="submit"].special:active,
- #footer input[type="reset"].special:active,
- #footer input[type="button"].special:active,
- #footer button.special:active,
- #footer .button.special:active {
- background-color: transparent !important;
- }
-
- #footer ul.major-icons li .icon {
- border-color: #ffffff;
- }
-
- #footer .icon.major {
- color: #ffffff;
- }
\ No newline at end of file
+ #viewer {
+ width: 100%;
+ }
\ No newline at end of file
diff --git a/assets/css/ie9.css b/assets/css/ie9.css
index a51c00b..e39620a 100644
--- a/assets/css/ie9.css
+++ b/assets/css/ie9.css
@@ -1,55 +1,31 @@
/*
- Photon by HTML5 UP
+ Lens by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/
-/* Header */
+/* Thumbnails */
- #header {
- background-image: none;
- filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#4fa49a", endColorStr="#4361c2", GradientType=1);
- position: relative;
+ #thumbnails:after {
+ content: '';
+ display: block;
+ clear: both;
}
- #header:before {
- background-image: url("images/overlay2.png"), url("images/overlay3.svg");
- background-position: top left, center center;
- background-size: auto, cover;
- content: '';
- height: 100%;
- left: 0;
- position: absolute;
- top: 0;
- width: 100%;
- }
-
- #header > * {
- position: relative;
- z-index: 1;
- }
+ #thumbnails article {
+ float: left;
+ }
-/* Footer */
+/* Viewer */
- #footer {
- background-image: none;
- filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#4361c2", endColorStr="#4fa49a", GradientType=1);
- position: relative;
+ #viewer .inner {
+ box-shadow: inset 0 0 9em 2em rgba(16, 16, 16, 0.2);
}
- #footer:before {
- background-image: url("images/overlay2.png"), url("images/overlay4.svg");
- background-position: top left, center center;
- background-size: auto, cover;
- content: '';
- height: 100%;
- left: 0;
- position: absolute;
- top: 0;
- width: 100%;
+ #viewer .inner:before {
+ display: none;
}
- #footer > * {
- position: relative;
- z-index: 1;
- }
\ No newline at end of file
+ #viewer .slide .caption {
+ background-color: rgba(16, 16, 16, 0.5);
+ }
\ No newline at end of file
diff --git a/GiphyTV/assets/css/images/arrow-small.svg b/assets/css/images/arrow-small.svg
similarity index 100%
rename from GiphyTV/assets/css/images/arrow-small.svg
rename to assets/css/images/arrow-small.svg
diff --git a/GiphyTV/assets/css/images/arrow.svg b/assets/css/images/arrow.svg
similarity index 100%
rename from GiphyTV/assets/css/images/arrow.svg
rename to assets/css/images/arrow.svg
diff --git a/GiphyTV/assets/css/images/close-small-alt.svg b/assets/css/images/close-small-alt.svg
similarity index 100%
rename from GiphyTV/assets/css/images/close-small-alt.svg
rename to assets/css/images/close-small-alt.svg
diff --git a/GiphyTV/assets/css/images/close-small.svg b/assets/css/images/close-small.svg
similarity index 100%
rename from GiphyTV/assets/css/images/close-small.svg
rename to assets/css/images/close-small.svg
diff --git a/GiphyTV/assets/css/images/close.svg b/assets/css/images/close.svg
similarity index 100%
rename from GiphyTV/assets/css/images/close.svg
rename to assets/css/images/close.svg
diff --git a/GiphyTV/assets/css/images/open-small.svg b/assets/css/images/open-small.svg
similarity index 100%
rename from GiphyTV/assets/css/images/open-small.svg
rename to assets/css/images/open-small.svg
diff --git a/GiphyTV/assets/css/images/open.svg b/assets/css/images/open.svg
similarity index 100%
rename from GiphyTV/assets/css/images/open.svg
rename to assets/css/images/open.svg
diff --git a/assets/css/images/overlay1.png b/assets/css/images/overlay1.png
deleted file mode 100644
index 7aa8031..0000000
Binary files a/assets/css/images/overlay1.png and /dev/null differ
diff --git a/assets/css/images/overlay2.png b/assets/css/images/overlay2.png
deleted file mode 100644
index 1d1e8f5..0000000
Binary files a/assets/css/images/overlay2.png and /dev/null differ
diff --git a/assets/css/images/overlay3.svg b/assets/css/images/overlay3.svg
deleted file mode 100644
index cfe4dac..0000000
--- a/assets/css/images/overlay3.svg
+++ /dev/null
@@ -1,22 +0,0 @@
-
\ No newline at end of file
diff --git a/assets/css/images/overlay4.svg b/assets/css/images/overlay4.svg
deleted file mode 100644
index a28bf2b..0000000
--- a/assets/css/images/overlay4.svg
+++ /dev/null
@@ -1,22 +0,0 @@
-
\ No newline at end of file
diff --git a/GiphyTV/assets/css/images/spinner.svg b/assets/css/images/spinner.svg
similarity index 100%
rename from GiphyTV/assets/css/images/spinner.svg
rename to assets/css/images/spinner.svg
diff --git a/assets/css/main.css b/assets/css/main.css
index f06ad26..972d0a9 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -1,8 +1,8 @@
-@import url("font-awesome.min.css");
-@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,400italic");
+@import url(font-awesome.min.css);
+@import url("https://fonts.googleapis.com/css?family=Roboto:400,700");
/*
- Photon by HTML5 UP
+ Lens by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/
@@ -56,1967 +56,313 @@
box-sizing: border-box;
}
-/* Containers */
-
- .container {
- margin-left: auto;
- margin-right: auto;
- }
-
- .container.\31 25\25 {
- width: 100%;
- max-width: 75em;
- min-width: 60em;
- }
-
- .container.\37 5\25 {
- width: 45em;
- }
-
- .container.\35 0\25 {
- width: 30em;
- }
-
- .container.\32 5\25 {
- width: 15em;
- }
-
- .container {
- width: 60em;
- }
-
- @media screen and (max-width: 1680px) {
-
- .container.\31 25\25 {
- width: 100%;
- max-width: 75em;
- min-width: 60em;
- }
-
- .container.\37 5\25 {
- width: 45em;
- }
-
- .container.\35 0\25 {
- width: 30em;
- }
-
- .container.\32 5\25 {
- width: 15em;
- }
-
- .container {
- width: 60em;
- }
-
- }
-
- @media screen and (max-width: 1140px) {
-
- .container.\31 25\25 {
- width: 100%;
- max-width: 112.5%;
- min-width: 90%;
- }
+/* Basic */
- .container.\37 5\25 {
- width: 67.5%;
+ /*
+ @-ms-viewport {
+ width: device-width;
}
- .container.\35 0\25 {
- width: 45%;
- }
+ */
- .container.\32 5\25 {
- width: 22.5%;
- }
+ @media screen and (max-width: 480px) {
- .container {
- width: 90%;
+ html, body {
+ min-width: 320px;
}
}
- @media screen and (max-width: 980px) {
-
- .container.\31 25\25 {
- width: 100%;
- max-width: 125%;
- min-width: 100%;
- }
-
- .container.\37 5\25 {
- width: 75%;
- }
-
- .container.\35 0\25 {
- width: 50%;
- }
-
- .container.\32 5\25 {
- width: 25%;
- }
-
- .container {
- width: 100% !important;
- }
-
+ body.is-loading-0 *, body.is-loading-0 *:before, body.is-loading-0 *:after {
+ -moz-animation: none !important;
+ -webkit-animation: none !important;
+ -ms-animation: none !important;
+ animation: none !important;
+ -moz-transition: none !important;
+ -webkit-transition: none !important;
+ -ms-transition: none !important;
+ transition: none !important;
}
- @media screen and (max-width: 736px) {
-
- .container.\31 25\25 {
- width: 100%;
- max-width: 125%;
- min-width: 100%;
- }
-
- .container.\37 5\25 {
- width: 75%;
- }
-
- .container.\35 0\25 {
- width: 50%;
- }
-
- .container.\32 5\25 {
- width: 25%;
- }
-
- .container {
- width: 100% !important;
- }
-
+ html, body {
+ background-color: #101010;
+ overflow: hidden;
}
- @media screen and (max-width: 480px) {
-
- .container.\31 25\25 {
- width: 100%;
- max-width: 125%;
- min-width: 100%;
- }
-
- .container.\37 5\25 {
- width: 75%;
- }
-
- .container.\35 0\25 {
- width: 50%;
- }
-
- .container.\32 5\25 {
- width: 25%;
- }
-
- .container {
- width: 100% !important;
- }
+/* Type */
+ html {
+ font-size: 16pt;
}
- @media screen and (max-width: 320px) {
+ @media screen and (max-width: 1680px) {
- .container.\31 25\25 {
- width: 100%;
- max-width: 125%;
- min-width: 100%;
- }
+ html {
+ font-size: 12pt;
+ }
- .container.\37 5\25 {
- width: 75%;
}
- .container.\35 0\25 {
- width: 50%;
- }
+ @media screen and (max-width: 1280px) {
- .container.\32 5\25 {
- width: 25%;
- }
+ html {
+ font-size: 11pt;
+ }
- .container {
- width: 100% !important;
}
+ body {
+ background-color: #fff;
+ color: #aaa;
}
-/* Grid */
-
- .row {
- border-bottom: solid 1px transparent;
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
- box-sizing: border-box;
- }
-
- .row > * {
- float: left;
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
- box-sizing: border-box;
+ body, input, select, textarea {
+ font-family: "Roboto", Helvetica, sans-serif;
+ font-weight: 400;
+ line-height: 1.65;
+ font-size: 1em;
+ color: #aaa;
}
- .row:after, .row:before {
- content: '';
- display: block;
- clear: both;
- height: 0;
+ a {
+ -moz-transition: color 0.25s ease, border-bottom-color 0.25s ease;
+ -webkit-transition: color 0.25s ease, border-bottom-color 0.25s ease;
+ -ms-transition: color 0.25s ease, border-bottom-color 0.25s ease;
+ transition: color 0.25s ease, border-bottom-color 0.25s ease;
+ border-bottom: dotted 1px;
+ color: inherit;
+ text-decoration: none;
}
- .row.uniform > * > :first-child {
- margin-top: 0;
- }
+ a:hover {
+ border-bottom-color: transparent;
+ color: #00D3B7;
+ }
- .row.uniform > * > :last-child {
- margin-bottom: 0;
+ strong, b {
+ font-weight: 400;
+ color: #555;
}
- .row.\30 \25 > * {
- padding: 0 0 0 0em;
+ em, i {
+ font-style: italic;
}
- .row.\30 \25 {
- margin: 0 0 -1px 0em;
+ p {
+ margin: 0 0 1.25em 0;
}
- .row.uniform.\30 \25 > * {
- padding: 0em 0 0 0em;
+ h1, h2, h3, h4, h5, h6 {
+ font-weight: 400;
+ line-height: 1.25;
+ margin: 0 0 0.5em 0;
+ color: #555;
}
- .row.uniform.\30 \25 {
- margin: 0em 0 -1px 0em;
- }
+ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
+ color: inherit;
+ text-decoration: none;
+ }
- .row > * {
- padding: 0 0 0 2em;
+ h2 {
+ font-size: 1.25em;
}
- .row {
- margin: 0 0 -1px -2em;
+ h3 {
+ font-size: 1em;
}
- .row.uniform > * {
- padding: 2em 0 0 2em;
+ h4 {
+ font-size: 0.9em;
}
- .row.uniform {
- margin: -2em 0 -1px -2em;
+ h5 {
+ font-size: 0.8em;
}
- .row.\32 00\25 > * {
- padding: 0 0 0 4em;
+ h6 {
+ font-size: 0.7em;
}
- .row.\32 00\25 {
- margin: 0 0 -1px -4em;
+ sub {
+ font-size: 0.8em;
+ position: relative;
+ top: 0.5em;
}
- .row.uniform.\32 00\25 > * {
- padding: 4em 0 0 4em;
+ sup {
+ font-size: 0.8em;
+ position: relative;
+ top: -0.5em;
}
- .row.uniform.\32 00\25 {
- margin: -4em 0 -1px -4em;
+ blockquote {
+ border-left: solid 4px #ccc;
+ font-style: italic;
+ margin: 0 0 1.25em 0;
+ padding: 0.3125em 0 0.3125em 1.25em;
}
- .row.\31 50\25 > * {
- padding: 0 0 0 3em;
+ code {
+ border-radius: 4px;
+ border: solid 1px;
+ font-family: "Courier New", monospace;
+ font-size: 0.9em;
+ margin: 0 0.25em;
+ padding: 0.25em 0.65em;
+ border-color: #ccc;
}
- .row.\31 50\25 {
- margin: 0 0 -1px -3em;
+ pre {
+ -webkit-overflow-scrolling: touch;
+ font-family: "Courier New", monospace;
+ font-size: 0.9em;
+ margin: 0 0 1.25em 0;
}
- .row.uniform.\31 50\25 > * {
- padding: 3em 0 0 3em;
- }
+ pre code {
+ display: block;
+ padding: 1em 1.5em;
+ overflow-x: auto;
+ }
- .row.uniform.\31 50\25 {
- margin: -3em 0 -1px -3em;
+ hr {
+ border: 0;
+ border-bottom: solid 1px #ccc;
+ margin: 1.25em 0;
}
- .row.\35 0\25 > * {
- padding: 0 0 0 1em;
- }
+ hr.major {
+ margin: 1.875em 0;
+ }
- .row.\35 0\25 {
- margin: 0 0 -1px -1em;
+ .align-left {
+ text-align: left;
}
- .row.uniform.\35 0\25 > * {
- padding: 1em 0 0 1em;
+ .align-center {
+ text-align: center;
}
- .row.uniform.\35 0\25 {
- margin: -1em 0 -1px -1em;
+ .align-right {
+ text-align: right;
}
- .row.\32 5\25 > * {
- padding: 0 0 0 0.5em;
- }
+/* Button */
- .row.\32 5\25 {
- margin: 0 0 -1px -0.5em;
+ input[type="submit"],
+ input[type="reset"],
+ input[type="button"],
+ button,
+ .button {
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ -ms-appearance: none;
+ appearance: none;
+ -moz-transition: background-color 0.25s ease-in-out, border-color 0.25s ease-in-out, color 0.25s ease-in-out;
+ -webkit-transition: background-color 0.25s ease-in-out, border-color 0.25s ease-in-out, color 0.25s ease-in-out;
+ -ms-transition: background-color 0.25s ease-in-out, border-color 0.25s ease-in-out, color 0.25s ease-in-out;
+ transition: background-color 0.25s ease-in-out, border-color 0.25s ease-in-out, color 0.25s ease-in-out;
+ background-color: transparent;
+ border-radius: 4px;
+ border: solid 1px #ccc;
+ color: #555;
+ cursor: pointer;
+ display: inline-block;
+ line-height: 1;
+ padding: 0.75em 1.5em;
+ text-align: center;
+ text-decoration: none;
+ white-space: nowrap;
}
- .row.uniform.\32 5\25 > * {
- padding: 0.5em 0 0 0.5em;
- }
+ input[type="submit"]:hover,
+ input[type="reset"]:hover,
+ input[type="button"]:hover,
+ button:hover,
+ .button:hover {
+ border-color: #00D3B7;
+ color: #00D3B7;
+ }
- .row.uniform.\32 5\25 {
- margin: -0.5em 0 -1px -0.5em;
- }
+ input[type="submit"]:hover:active,
+ input[type="reset"]:hover:active,
+ input[type="button"]:hover:active,
+ button:hover:active,
+ .button:hover:active {
+ background-color: rgba(0, 211, 183, 0.15);
+ }
- .\31 2u, .\31 2u\24 {
- width: 100%;
- clear: none;
- margin-left: 0;
- }
+ input[type="submit"].icon,
+ input[type="reset"].icon,
+ input[type="button"].icon,
+ button.icon,
+ .button.icon {
+ padding-left: 1.35em;
+ }
- .\31 1u, .\31 1u\24 {
- width: 91.6666666667%;
- clear: none;
- margin-left: 0;
- }
+ input[type="submit"].icon:before,
+ input[type="reset"].icon:before,
+ input[type="button"].icon:before,
+ button.icon:before,
+ .button.icon:before {
+ margin-right: 0.5em;
+ }
- .\31 0u, .\31 0u\24 {
- width: 83.3333333333%;
- clear: none;
- margin-left: 0;
- }
+ input[type="submit"].fit,
+ input[type="reset"].fit,
+ input[type="button"].fit,
+ button.fit,
+ .button.fit {
+ display: block;
+ margin: 0 0 0.625em 0;
+ width: 100%;
+ }
- .\39 u, .\39 u\24 {
- width: 75%;
- clear: none;
- margin-left: 0;
- }
+ input[type="submit"].small,
+ input[type="reset"].small,
+ input[type="button"].small,
+ button.small,
+ .button.small {
+ font-size: 0.8em;
+ }
- .\38 u, .\38 u\24 {
- width: 66.6666666667%;
- clear: none;
- margin-left: 0;
- }
+ input[type="submit"].big,
+ input[type="reset"].big,
+ input[type="button"].big,
+ button.big,
+ .button.big {
+ font-size: 1.35em;
+ }
- .\37 u, .\37 u\24 {
- width: 58.3333333333%;
- clear: none;
- margin-left: 0;
- }
+ input[type="submit"].disabled, input[type="submit"]:disabled,
+ input[type="reset"].disabled,
+ input[type="reset"]:disabled,
+ input[type="button"].disabled,
+ input[type="button"]:disabled,
+ button.disabled,
+ button:disabled,
+ .button.disabled,
+ .button:disabled {
+ -moz-pointer-events: none;
+ -webkit-pointer-events: none;
+ -ms-pointer-events: none;
+ pointer-events: none;
+ opacity: 0.25;
+ }
- .\36 u, .\36 u\24 {
- width: 50%;
- clear: none;
- margin-left: 0;
- }
+/* Form */
- .\35 u, .\35 u\24 {
- width: 41.6666666667%;
- clear: none;
- margin-left: 0;
+ form {
+ margin: 0 0 1.25em 0;
}
- .\34 u, .\34 u\24 {
- width: 33.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\33 u, .\33 u\24 {
- width: 25%;
- clear: none;
- margin-left: 0;
- }
-
- .\32 u, .\32 u\24 {
- width: 16.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 u, .\31 u\24 {
- width: 8.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 2u\24 + *,
- .\31 1u\24 + *,
- .\31 0u\24 + *,
- .\39 u\24 + *,
- .\38 u\24 + *,
- .\37 u\24 + *,
- .\36 u\24 + *,
- .\35 u\24 + *,
- .\34 u\24 + *,
- .\33 u\24 + *,
- .\32 u\24 + *,
- .\31 u\24 + * {
- clear: left;
- }
-
- .\-11u {
- margin-left: 91.66667%;
- }
-
- .\-10u {
- margin-left: 83.33333%;
- }
-
- .\-9u {
- margin-left: 75%;
- }
-
- .\-8u {
- margin-left: 66.66667%;
- }
-
- .\-7u {
- margin-left: 58.33333%;
- }
-
- .\-6u {
- margin-left: 50%;
- }
-
- .\-5u {
- margin-left: 41.66667%;
- }
-
- .\-4u {
- margin-left: 33.33333%;
- }
-
- .\-3u {
- margin-left: 25%;
- }
-
- .\-2u {
- margin-left: 16.66667%;
- }
-
- .\-1u {
- margin-left: 8.33333%;
- }
-
- @media screen and (max-width: 1680px) {
-
- .row > * {
- padding: 0 0 0 2em;
- }
-
- .row {
- margin: 0 0 -1px -2em;
- }
-
- .row.uniform > * {
- padding: 2em 0 0 2em;
- }
-
- .row.uniform {
- margin: -2em 0 -1px -2em;
- }
-
- .row.\32 00\25 > * {
- padding: 0 0 0 4em;
- }
-
- .row.\32 00\25 {
- margin: 0 0 -1px -4em;
- }
-
- .row.uniform.\32 00\25 > * {
- padding: 4em 0 0 4em;
- }
-
- .row.uniform.\32 00\25 {
- margin: -4em 0 -1px -4em;
- }
-
- .row.\31 50\25 > * {
- padding: 0 0 0 3em;
- }
-
- .row.\31 50\25 {
- margin: 0 0 -1px -3em;
- }
-
- .row.uniform.\31 50\25 > * {
- padding: 3em 0 0 3em;
- }
-
- .row.uniform.\31 50\25 {
- margin: -3em 0 -1px -3em;
- }
-
- .row.\35 0\25 > * {
- padding: 0 0 0 1em;
- }
-
- .row.\35 0\25 {
- margin: 0 0 -1px -1em;
- }
-
- .row.uniform.\35 0\25 > * {
- padding: 1em 0 0 1em;
- }
-
- .row.uniform.\35 0\25 {
- margin: -1em 0 -1px -1em;
- }
-
- .row.\32 5\25 > * {
- padding: 0 0 0 0.5em;
- }
-
- .row.\32 5\25 {
- margin: 0 0 -1px -0.5em;
- }
-
- .row.uniform.\32 5\25 > * {
- padding: 0.5em 0 0 0.5em;
- }
-
- .row.uniform.\32 5\25 {
- margin: -0.5em 0 -1px -0.5em;
- }
-
- .\31 2u\28xlarge\29, .\31 2u\24\28xlarge\29 {
- width: 100%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 1u\28xlarge\29, .\31 1u\24\28xlarge\29 {
- width: 91.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 0u\28xlarge\29, .\31 0u\24\28xlarge\29 {
- width: 83.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\39 u\28xlarge\29, .\39 u\24\28xlarge\29 {
- width: 75%;
- clear: none;
- margin-left: 0;
- }
-
- .\38 u\28xlarge\29, .\38 u\24\28xlarge\29 {
- width: 66.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\37 u\28xlarge\29, .\37 u\24\28xlarge\29 {
- width: 58.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\36 u\28xlarge\29, .\36 u\24\28xlarge\29 {
- width: 50%;
- clear: none;
- margin-left: 0;
- }
-
- .\35 u\28xlarge\29, .\35 u\24\28xlarge\29 {
- width: 41.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\34 u\28xlarge\29, .\34 u\24\28xlarge\29 {
- width: 33.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\33 u\28xlarge\29, .\33 u\24\28xlarge\29 {
- width: 25%;
- clear: none;
- margin-left: 0;
- }
-
- .\32 u\28xlarge\29, .\32 u\24\28xlarge\29 {
- width: 16.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 u\28xlarge\29, .\31 u\24\28xlarge\29 {
- width: 8.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 2u\24\28xlarge\29 + *,
- .\31 1u\24\28xlarge\29 + *,
- .\31 0u\24\28xlarge\29 + *,
- .\39 u\24\28xlarge\29 + *,
- .\38 u\24\28xlarge\29 + *,
- .\37 u\24\28xlarge\29 + *,
- .\36 u\24\28xlarge\29 + *,
- .\35 u\24\28xlarge\29 + *,
- .\34 u\24\28xlarge\29 + *,
- .\33 u\24\28xlarge\29 + *,
- .\32 u\24\28xlarge\29 + *,
- .\31 u\24\28xlarge\29 + * {
- clear: left;
- }
-
- .\-11u\28xlarge\29 {
- margin-left: 91.66667%;
- }
-
- .\-10u\28xlarge\29 {
- margin-left: 83.33333%;
- }
-
- .\-9u\28xlarge\29 {
- margin-left: 75%;
- }
-
- .\-8u\28xlarge\29 {
- margin-left: 66.66667%;
- }
-
- .\-7u\28xlarge\29 {
- margin-left: 58.33333%;
- }
-
- .\-6u\28xlarge\29 {
- margin-left: 50%;
- }
-
- .\-5u\28xlarge\29 {
- margin-left: 41.66667%;
- }
-
- .\-4u\28xlarge\29 {
- margin-left: 33.33333%;
- }
-
- .\-3u\28xlarge\29 {
- margin-left: 25%;
- }
-
- .\-2u\28xlarge\29 {
- margin-left: 16.66667%;
- }
-
- .\-1u\28xlarge\29 {
- margin-left: 8.33333%;
- }
-
- }
-
- @media screen and (max-width: 1140px) {
-
- .row > * {
- padding: 0 0 0 1.5em;
- }
-
- .row {
- margin: 0 0 -1px -1.5em;
- }
-
- .row.uniform > * {
- padding: 1.5em 0 0 1.5em;
- }
-
- .row.uniform {
- margin: -1.5em 0 -1px -1.5em;
- }
-
- .row.\32 00\25 > * {
- padding: 0 0 0 3em;
- }
-
- .row.\32 00\25 {
- margin: 0 0 -1px -3em;
- }
-
- .row.uniform.\32 00\25 > * {
- padding: 3em 0 0 3em;
- }
-
- .row.uniform.\32 00\25 {
- margin: -3em 0 -1px -3em;
- }
-
- .row.\31 50\25 > * {
- padding: 0 0 0 2.25em;
- }
-
- .row.\31 50\25 {
- margin: 0 0 -1px -2.25em;
- }
-
- .row.uniform.\31 50\25 > * {
- padding: 2.25em 0 0 2.25em;
- }
-
- .row.uniform.\31 50\25 {
- margin: -2.25em 0 -1px -2.25em;
- }
-
- .row.\35 0\25 > * {
- padding: 0 0 0 0.75em;
- }
-
- .row.\35 0\25 {
- margin: 0 0 -1px -0.75em;
- }
-
- .row.uniform.\35 0\25 > * {
- padding: 0.75em 0 0 0.75em;
- }
-
- .row.uniform.\35 0\25 {
- margin: -0.75em 0 -1px -0.75em;
- }
-
- .row.\32 5\25 > * {
- padding: 0 0 0 0.375em;
- }
-
- .row.\32 5\25 {
- margin: 0 0 -1px -0.375em;
- }
-
- .row.uniform.\32 5\25 > * {
- padding: 0.375em 0 0 0.375em;
- }
-
- .row.uniform.\32 5\25 {
- margin: -0.375em 0 -1px -0.375em;
- }
-
- .\31 2u\28large\29, .\31 2u\24\28large\29 {
- width: 100%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 1u\28large\29, .\31 1u\24\28large\29 {
- width: 91.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 0u\28large\29, .\31 0u\24\28large\29 {
- width: 83.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\39 u\28large\29, .\39 u\24\28large\29 {
- width: 75%;
- clear: none;
- margin-left: 0;
- }
-
- .\38 u\28large\29, .\38 u\24\28large\29 {
- width: 66.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\37 u\28large\29, .\37 u\24\28large\29 {
- width: 58.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\36 u\28large\29, .\36 u\24\28large\29 {
- width: 50%;
- clear: none;
- margin-left: 0;
- }
-
- .\35 u\28large\29, .\35 u\24\28large\29 {
- width: 41.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\34 u\28large\29, .\34 u\24\28large\29 {
- width: 33.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\33 u\28large\29, .\33 u\24\28large\29 {
- width: 25%;
- clear: none;
- margin-left: 0;
- }
-
- .\32 u\28large\29, .\32 u\24\28large\29 {
- width: 16.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 u\28large\29, .\31 u\24\28large\29 {
- width: 8.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 2u\24\28large\29 + *,
- .\31 1u\24\28large\29 + *,
- .\31 0u\24\28large\29 + *,
- .\39 u\24\28large\29 + *,
- .\38 u\24\28large\29 + *,
- .\37 u\24\28large\29 + *,
- .\36 u\24\28large\29 + *,
- .\35 u\24\28large\29 + *,
- .\34 u\24\28large\29 + *,
- .\33 u\24\28large\29 + *,
- .\32 u\24\28large\29 + *,
- .\31 u\24\28large\29 + * {
- clear: left;
- }
-
- .\-11u\28large\29 {
- margin-left: 91.66667%;
- }
-
- .\-10u\28large\29 {
- margin-left: 83.33333%;
- }
-
- .\-9u\28large\29 {
- margin-left: 75%;
- }
-
- .\-8u\28large\29 {
- margin-left: 66.66667%;
- }
-
- .\-7u\28large\29 {
- margin-left: 58.33333%;
- }
-
- .\-6u\28large\29 {
- margin-left: 50%;
- }
-
- .\-5u\28large\29 {
- margin-left: 41.66667%;
- }
-
- .\-4u\28large\29 {
- margin-left: 33.33333%;
- }
-
- .\-3u\28large\29 {
- margin-left: 25%;
- }
-
- .\-2u\28large\29 {
- margin-left: 16.66667%;
- }
-
- .\-1u\28large\29 {
- margin-left: 8.33333%;
- }
-
- }
-
- @media screen and (max-width: 980px) {
-
- .row > * {
- padding: 0 0 0 1.5em;
- }
-
- .row {
- margin: 0 0 -1px -1.5em;
- }
-
- .row.uniform > * {
- padding: 1.5em 0 0 1.5em;
- }
-
- .row.uniform {
- margin: -1.5em 0 -1px -1.5em;
- }
-
- .row.\32 00\25 > * {
- padding: 0 0 0 3em;
- }
-
- .row.\32 00\25 {
- margin: 0 0 -1px -3em;
- }
-
- .row.uniform.\32 00\25 > * {
- padding: 3em 0 0 3em;
- }
-
- .row.uniform.\32 00\25 {
- margin: -3em 0 -1px -3em;
- }
-
- .row.\31 50\25 > * {
- padding: 0 0 0 2.25em;
- }
-
- .row.\31 50\25 {
- margin: 0 0 -1px -2.25em;
- }
-
- .row.uniform.\31 50\25 > * {
- padding: 2.25em 0 0 2.25em;
- }
-
- .row.uniform.\31 50\25 {
- margin: -2.25em 0 -1px -2.25em;
- }
-
- .row.\35 0\25 > * {
- padding: 0 0 0 0.75em;
- }
-
- .row.\35 0\25 {
- margin: 0 0 -1px -0.75em;
- }
-
- .row.uniform.\35 0\25 > * {
- padding: 0.75em 0 0 0.75em;
- }
-
- .row.uniform.\35 0\25 {
- margin: -0.75em 0 -1px -0.75em;
- }
-
- .row.\32 5\25 > * {
- padding: 0 0 0 0.375em;
- }
-
- .row.\32 5\25 {
- margin: 0 0 -1px -0.375em;
- }
-
- .row.uniform.\32 5\25 > * {
- padding: 0.375em 0 0 0.375em;
- }
-
- .row.uniform.\32 5\25 {
- margin: -0.375em 0 -1px -0.375em;
- }
-
- .\31 2u\28medium\29, .\31 2u\24\28medium\29 {
- width: 100%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 1u\28medium\29, .\31 1u\24\28medium\29 {
- width: 91.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 0u\28medium\29, .\31 0u\24\28medium\29 {
- width: 83.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\39 u\28medium\29, .\39 u\24\28medium\29 {
- width: 75%;
- clear: none;
- margin-left: 0;
- }
-
- .\38 u\28medium\29, .\38 u\24\28medium\29 {
- width: 66.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\37 u\28medium\29, .\37 u\24\28medium\29 {
- width: 58.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\36 u\28medium\29, .\36 u\24\28medium\29 {
- width: 50%;
- clear: none;
- margin-left: 0;
- }
-
- .\35 u\28medium\29, .\35 u\24\28medium\29 {
- width: 41.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\34 u\28medium\29, .\34 u\24\28medium\29 {
- width: 33.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\33 u\28medium\29, .\33 u\24\28medium\29 {
- width: 25%;
- clear: none;
- margin-left: 0;
- }
-
- .\32 u\28medium\29, .\32 u\24\28medium\29 {
- width: 16.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 u\28medium\29, .\31 u\24\28medium\29 {
- width: 8.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 2u\24\28medium\29 + *,
- .\31 1u\24\28medium\29 + *,
- .\31 0u\24\28medium\29 + *,
- .\39 u\24\28medium\29 + *,
- .\38 u\24\28medium\29 + *,
- .\37 u\24\28medium\29 + *,
- .\36 u\24\28medium\29 + *,
- .\35 u\24\28medium\29 + *,
- .\34 u\24\28medium\29 + *,
- .\33 u\24\28medium\29 + *,
- .\32 u\24\28medium\29 + *,
- .\31 u\24\28medium\29 + * {
- clear: left;
- }
-
- .\-11u\28medium\29 {
- margin-left: 91.66667%;
- }
-
- .\-10u\28medium\29 {
- margin-left: 83.33333%;
- }
-
- .\-9u\28medium\29 {
- margin-left: 75%;
- }
-
- .\-8u\28medium\29 {
- margin-left: 66.66667%;
- }
-
- .\-7u\28medium\29 {
- margin-left: 58.33333%;
- }
-
- .\-6u\28medium\29 {
- margin-left: 50%;
- }
-
- .\-5u\28medium\29 {
- margin-left: 41.66667%;
- }
-
- .\-4u\28medium\29 {
- margin-left: 33.33333%;
- }
-
- .\-3u\28medium\29 {
- margin-left: 25%;
- }
-
- .\-2u\28medium\29 {
- margin-left: 16.66667%;
- }
-
- .\-1u\28medium\29 {
- margin-left: 8.33333%;
- }
-
- }
-
- @media screen and (max-width: 736px) {
-
- .row > * {
- padding: 0 0 0 1.5em;
- }
-
- .row {
- margin: 0 0 -1px -1.5em;
- }
-
- .row.uniform > * {
- padding: 1.5em 0 0 1.5em;
- }
-
- .row.uniform {
- margin: -1.5em 0 -1px -1.5em;
- }
-
- .row.\32 00\25 > * {
- padding: 0 0 0 3em;
- }
-
- .row.\32 00\25 {
- margin: 0 0 -1px -3em;
- }
-
- .row.uniform.\32 00\25 > * {
- padding: 3em 0 0 3em;
- }
-
- .row.uniform.\32 00\25 {
- margin: -3em 0 -1px -3em;
- }
-
- .row.\31 50\25 > * {
- padding: 0 0 0 2.25em;
- }
-
- .row.\31 50\25 {
- margin: 0 0 -1px -2.25em;
- }
-
- .row.uniform.\31 50\25 > * {
- padding: 2.25em 0 0 2.25em;
- }
-
- .row.uniform.\31 50\25 {
- margin: -2.25em 0 -1px -2.25em;
- }
-
- .row.\35 0\25 > * {
- padding: 0 0 0 0.75em;
- }
-
- .row.\35 0\25 {
- margin: 0 0 -1px -0.75em;
- }
-
- .row.uniform.\35 0\25 > * {
- padding: 0.75em 0 0 0.75em;
- }
-
- .row.uniform.\35 0\25 {
- margin: -0.75em 0 -1px -0.75em;
- }
-
- .row.\32 5\25 > * {
- padding: 0 0 0 0.375em;
- }
-
- .row.\32 5\25 {
- margin: 0 0 -1px -0.375em;
- }
-
- .row.uniform.\32 5\25 > * {
- padding: 0.375em 0 0 0.375em;
- }
-
- .row.uniform.\32 5\25 {
- margin: -0.375em 0 -1px -0.375em;
- }
-
- .\31 2u\28small\29, .\31 2u\24\28small\29 {
- width: 100%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 1u\28small\29, .\31 1u\24\28small\29 {
- width: 91.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 0u\28small\29, .\31 0u\24\28small\29 {
- width: 83.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\39 u\28small\29, .\39 u\24\28small\29 {
- width: 75%;
- clear: none;
- margin-left: 0;
- }
-
- .\38 u\28small\29, .\38 u\24\28small\29 {
- width: 66.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\37 u\28small\29, .\37 u\24\28small\29 {
- width: 58.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\36 u\28small\29, .\36 u\24\28small\29 {
- width: 50%;
- clear: none;
- margin-left: 0;
- }
-
- .\35 u\28small\29, .\35 u\24\28small\29 {
- width: 41.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\34 u\28small\29, .\34 u\24\28small\29 {
- width: 33.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\33 u\28small\29, .\33 u\24\28small\29 {
- width: 25%;
- clear: none;
- margin-left: 0;
- }
-
- .\32 u\28small\29, .\32 u\24\28small\29 {
- width: 16.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 u\28small\29, .\31 u\24\28small\29 {
- width: 8.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 2u\24\28small\29 + *,
- .\31 1u\24\28small\29 + *,
- .\31 0u\24\28small\29 + *,
- .\39 u\24\28small\29 + *,
- .\38 u\24\28small\29 + *,
- .\37 u\24\28small\29 + *,
- .\36 u\24\28small\29 + *,
- .\35 u\24\28small\29 + *,
- .\34 u\24\28small\29 + *,
- .\33 u\24\28small\29 + *,
- .\32 u\24\28small\29 + *,
- .\31 u\24\28small\29 + * {
- clear: left;
- }
-
- .\-11u\28small\29 {
- margin-left: 91.66667%;
- }
-
- .\-10u\28small\29 {
- margin-left: 83.33333%;
- }
-
- .\-9u\28small\29 {
- margin-left: 75%;
- }
-
- .\-8u\28small\29 {
- margin-left: 66.66667%;
- }
-
- .\-7u\28small\29 {
- margin-left: 58.33333%;
- }
-
- .\-6u\28small\29 {
- margin-left: 50%;
- }
-
- .\-5u\28small\29 {
- margin-left: 41.66667%;
- }
-
- .\-4u\28small\29 {
- margin-left: 33.33333%;
- }
-
- .\-3u\28small\29 {
- margin-left: 25%;
- }
-
- .\-2u\28small\29 {
- margin-left: 16.66667%;
- }
-
- .\-1u\28small\29 {
- margin-left: 8.33333%;
- }
-
- }
-
- @media screen and (max-width: 480px) {
-
- .row > * {
- padding: 0 0 0 1.5em;
- }
-
- .row {
- margin: 0 0 -1px -1.5em;
- }
-
- .row.uniform > * {
- padding: 1.5em 0 0 1.5em;
- }
-
- .row.uniform {
- margin: -1.5em 0 -1px -1.5em;
- }
-
- .row.\32 00\25 > * {
- padding: 0 0 0 3em;
- }
-
- .row.\32 00\25 {
- margin: 0 0 -1px -3em;
- }
-
- .row.uniform.\32 00\25 > * {
- padding: 3em 0 0 3em;
- }
-
- .row.uniform.\32 00\25 {
- margin: -3em 0 -1px -3em;
- }
-
- .row.\31 50\25 > * {
- padding: 0 0 0 2.25em;
- }
-
- .row.\31 50\25 {
- margin: 0 0 -1px -2.25em;
- }
-
- .row.uniform.\31 50\25 > * {
- padding: 2.25em 0 0 2.25em;
- }
-
- .row.uniform.\31 50\25 {
- margin: -2.25em 0 -1px -2.25em;
- }
-
- .row.\35 0\25 > * {
- padding: 0 0 0 0.75em;
- }
-
- .row.\35 0\25 {
- margin: 0 0 -1px -0.75em;
- }
-
- .row.uniform.\35 0\25 > * {
- padding: 0.75em 0 0 0.75em;
- }
-
- .row.uniform.\35 0\25 {
- margin: -0.75em 0 -1px -0.75em;
- }
-
- .row.\32 5\25 > * {
- padding: 0 0 0 0.375em;
- }
-
- .row.\32 5\25 {
- margin: 0 0 -1px -0.375em;
- }
-
- .row.uniform.\32 5\25 > * {
- padding: 0.375em 0 0 0.375em;
- }
-
- .row.uniform.\32 5\25 {
- margin: -0.375em 0 -1px -0.375em;
- }
-
- .\31 2u\28xsmall\29, .\31 2u\24\28xsmall\29 {
- width: 100%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 1u\28xsmall\29, .\31 1u\24\28xsmall\29 {
- width: 91.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 0u\28xsmall\29, .\31 0u\24\28xsmall\29 {
- width: 83.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\39 u\28xsmall\29, .\39 u\24\28xsmall\29 {
- width: 75%;
- clear: none;
- margin-left: 0;
- }
-
- .\38 u\28xsmall\29, .\38 u\24\28xsmall\29 {
- width: 66.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\37 u\28xsmall\29, .\37 u\24\28xsmall\29 {
- width: 58.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\36 u\28xsmall\29, .\36 u\24\28xsmall\29 {
- width: 50%;
- clear: none;
- margin-left: 0;
- }
-
- .\35 u\28xsmall\29, .\35 u\24\28xsmall\29 {
- width: 41.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\34 u\28xsmall\29, .\34 u\24\28xsmall\29 {
- width: 33.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\33 u\28xsmall\29, .\33 u\24\28xsmall\29 {
- width: 25%;
- clear: none;
- margin-left: 0;
- }
-
- .\32 u\28xsmall\29, .\32 u\24\28xsmall\29 {
- width: 16.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 u\28xsmall\29, .\31 u\24\28xsmall\29 {
- width: 8.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 2u\24\28xsmall\29 + *,
- .\31 1u\24\28xsmall\29 + *,
- .\31 0u\24\28xsmall\29 + *,
- .\39 u\24\28xsmall\29 + *,
- .\38 u\24\28xsmall\29 + *,
- .\37 u\24\28xsmall\29 + *,
- .\36 u\24\28xsmall\29 + *,
- .\35 u\24\28xsmall\29 + *,
- .\34 u\24\28xsmall\29 + *,
- .\33 u\24\28xsmall\29 + *,
- .\32 u\24\28xsmall\29 + *,
- .\31 u\24\28xsmall\29 + * {
- clear: left;
- }
-
- .\-11u\28xsmall\29 {
- margin-left: 91.66667%;
- }
-
- .\-10u\28xsmall\29 {
- margin-left: 83.33333%;
- }
-
- .\-9u\28xsmall\29 {
- margin-left: 75%;
- }
-
- .\-8u\28xsmall\29 {
- margin-left: 66.66667%;
- }
-
- .\-7u\28xsmall\29 {
- margin-left: 58.33333%;
- }
-
- .\-6u\28xsmall\29 {
- margin-left: 50%;
- }
-
- .\-5u\28xsmall\29 {
- margin-left: 41.66667%;
- }
-
- .\-4u\28xsmall\29 {
- margin-left: 33.33333%;
- }
-
- .\-3u\28xsmall\29 {
- margin-left: 25%;
- }
-
- .\-2u\28xsmall\29 {
- margin-left: 16.66667%;
- }
-
- .\-1u\28xsmall\29 {
- margin-left: 8.33333%;
- }
-
- }
-
- @media screen and (max-width: 320px) {
-
- .row > * {
- padding: 0 0 0 1.5em;
- }
-
- .row {
- margin: 0 0 -1px -1.5em;
- }
-
- .row.uniform > * {
- padding: 1.5em 0 0 1.5em;
- }
-
- .row.uniform {
- margin: -1.5em 0 -1px -1.5em;
- }
-
- .row.\32 00\25 > * {
- padding: 0 0 0 3em;
- }
-
- .row.\32 00\25 {
- margin: 0 0 -1px -3em;
- }
-
- .row.uniform.\32 00\25 > * {
- padding: 3em 0 0 3em;
- }
-
- .row.uniform.\32 00\25 {
- margin: -3em 0 -1px -3em;
- }
-
- .row.\31 50\25 > * {
- padding: 0 0 0 2.25em;
- }
-
- .row.\31 50\25 {
- margin: 0 0 -1px -2.25em;
- }
-
- .row.uniform.\31 50\25 > * {
- padding: 2.25em 0 0 2.25em;
- }
-
- .row.uniform.\31 50\25 {
- margin: -2.25em 0 -1px -2.25em;
- }
-
- .row.\35 0\25 > * {
- padding: 0 0 0 0.75em;
- }
-
- .row.\35 0\25 {
- margin: 0 0 -1px -0.75em;
- }
-
- .row.uniform.\35 0\25 > * {
- padding: 0.75em 0 0 0.75em;
- }
-
- .row.uniform.\35 0\25 {
- margin: -0.75em 0 -1px -0.75em;
- }
-
- .row.\32 5\25 > * {
- padding: 0 0 0 0.375em;
- }
-
- .row.\32 5\25 {
- margin: 0 0 -1px -0.375em;
- }
-
- .row.uniform.\32 5\25 > * {
- padding: 0.375em 0 0 0.375em;
- }
-
- .row.uniform.\32 5\25 {
- margin: -0.375em 0 -1px -0.375em;
- }
-
- .\31 2u\28xxsmall\29, .\31 2u\24\28xxsmall\29 {
- width: 100%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 1u\28xxsmall\29, .\31 1u\24\28xxsmall\29 {
- width: 91.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 0u\28xxsmall\29, .\31 0u\24\28xxsmall\29 {
- width: 83.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\39 u\28xxsmall\29, .\39 u\24\28xxsmall\29 {
- width: 75%;
- clear: none;
- margin-left: 0;
- }
-
- .\38 u\28xxsmall\29, .\38 u\24\28xxsmall\29 {
- width: 66.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\37 u\28xxsmall\29, .\37 u\24\28xxsmall\29 {
- width: 58.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\36 u\28xxsmall\29, .\36 u\24\28xxsmall\29 {
- width: 50%;
- clear: none;
- margin-left: 0;
- }
-
- .\35 u\28xxsmall\29, .\35 u\24\28xxsmall\29 {
- width: 41.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\34 u\28xxsmall\29, .\34 u\24\28xxsmall\29 {
- width: 33.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\33 u\28xxsmall\29, .\33 u\24\28xxsmall\29 {
- width: 25%;
- clear: none;
- margin-left: 0;
- }
-
- .\32 u\28xxsmall\29, .\32 u\24\28xxsmall\29 {
- width: 16.6666666667%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 u\28xxsmall\29, .\31 u\24\28xxsmall\29 {
- width: 8.3333333333%;
- clear: none;
- margin-left: 0;
- }
-
- .\31 2u\24\28xxsmall\29 + *,
- .\31 1u\24\28xxsmall\29 + *,
- .\31 0u\24\28xxsmall\29 + *,
- .\39 u\24\28xxsmall\29 + *,
- .\38 u\24\28xxsmall\29 + *,
- .\37 u\24\28xxsmall\29 + *,
- .\36 u\24\28xxsmall\29 + *,
- .\35 u\24\28xxsmall\29 + *,
- .\34 u\24\28xxsmall\29 + *,
- .\33 u\24\28xxsmall\29 + *,
- .\32 u\24\28xxsmall\29 + *,
- .\31 u\24\28xxsmall\29 + * {
- clear: left;
- }
-
- .\-11u\28xxsmall\29 {
- margin-left: 91.66667%;
- }
-
- .\-10u\28xxsmall\29 {
- margin-left: 83.33333%;
- }
-
- .\-9u\28xxsmall\29 {
- margin-left: 75%;
- }
-
- .\-8u\28xxsmall\29 {
- margin-left: 66.66667%;
- }
-
- .\-7u\28xxsmall\29 {
- margin-left: 58.33333%;
- }
-
- .\-6u\28xxsmall\29 {
- margin-left: 50%;
- }
-
- .\-5u\28xxsmall\29 {
- margin-left: 41.66667%;
- }
-
- .\-4u\28xxsmall\29 {
- margin-left: 33.33333%;
- }
-
- .\-3u\28xxsmall\29 {
- margin-left: 25%;
- }
-
- .\-2u\28xxsmall\29 {
- margin-left: 16.66667%;
- }
-
- .\-1u\28xxsmall\29 {
- margin-left: 8.33333%;
- }
-
- }
-
-/* Basic */
-
- body {
- background: #fff;
- }
-
- body.is-loading *, body.is-loading *:before, body.is-loading *:after {
- -moz-animation: none !important;
- -webkit-animation: none !important;
- -ms-animation: none !important;
- animation: none !important;
- -moz-transition: none !important;
- -webkit-transition: none !important;
- -ms-transition: none !important;
- transition: none !important;
- }
-
- body, input, select, textarea {
- color: #666;
- font-family: "Source Sans Pro", Helvetica, sans-serif;
- font-size: 16pt;
- font-weight: 300;
- line-height: 1.65em;
- }
-
- a {
- -moz-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
- -webkit-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
- -ms-transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
- transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
- border-bottom: dotted 1px #666;
- color: inherit;
- text-decoration: none;
- }
-
- a:hover {
- border-bottom-color: transparent !important;
- color: #6bd4c8;
- }
-
- strong, b {
- color: #555;
- font-weight: 400;
- }
-
- em, i {
- font-style: italic;
- }
-
- p {
- margin: 0 0 2em 0;
- }
-
- h1, h2, h3, h4, h5, h6 {
- color: #555;
- line-height: 1em;
- margin: 0 0 1em 0;
- }
-
- h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
- color: inherit;
- text-decoration: none;
- }
-
- h1 {
- font-size: 2.25em;
- line-height: 1.35em;
- }
-
- h2 {
- font-size: 2em;
- line-height: 1.35em;
- }
-
- h3 {
- font-size: 1.35em;
- line-height: 1.5em;
- }
-
- h4 {
- font-size: 1.25em;
- line-height: 1.5em;
- }
-
- h5 {
- font-size: 0.9em;
- line-height: 1.5em;
- }
-
- h6 {
- font-size: 0.7em;
- line-height: 1.5em;
- }
-
- sub {
- font-size: 0.8em;
- position: relative;
- top: 0.5em;
- }
-
- sup {
- font-size: 0.8em;
- position: relative;
- top: -0.5em;
- }
-
- hr {
- border: 0;
- border-bottom: solid 1px rgba(144, 144, 144, 0.5);
- margin: 2em 0;
- }
-
- hr.major {
- margin: 3em 0;
- }
-
- blockquote {
- border-left: solid 4px rgba(144, 144, 144, 0.5);
- font-style: italic;
- margin: 0 0 2em 0;
- padding: 0.5em 0 0.5em 2em;
- }
-
- code {
- background: rgba(144, 144, 144, 0.075);
- border-radius: 4px;
- border: solid 1px rgba(144, 144, 144, 0.5);
- font-family: "Courier New", monospace;
- font-size: 0.9em;
- margin: 0 0.25em;
- padding: 0.25em 0.65em;
- }
-
- pre {
- -webkit-overflow-scrolling: touch;
- font-family: "Courier New", monospace;
- font-size: 0.9em;
- margin: 0 0 2em 0;
- }
-
- pre code {
- display: block;
- line-height: 1.75em;
- padding: 1em 1.5em;
- overflow-x: auto;
- }
-
- .align-left {
- text-align: left;
- }
-
- .align-center {
- text-align: center;
- }
-
- .align-right {
- text-align: right;
- }
-
-/* Section/Article */
-
- section.special, article.special {
- text-align: center;
- }
-
- header p {
- color: #999;
- margin: 0 0 1.5em 0;
- position: relative;
- }
-
- header h2 + p {
- font-size: 1.25em;
- line-height: 1.5em;
- margin-top: -1em;
- }
-
- header h3 + p {
- font-size: 1.1em;
- line-height: 1.5em;
- margin-top: -0.8em;
- }
-
- header h4 + p,
- header h5 + p,
- header h6 + p {
- font-size: 0.9em;
- line-height: 1.5em;
- margin-top: -0.6em;
- }
-
- header.major {
- margin: 0 0 1em 0;
- }
-
- header.major:after {
- background: rgba(144, 144, 144, 0.5);
- content: '';
- display: inline-block;
- height: 1px;
- margin-top: 1.5em;
- width: 6em;
- }
-
- header.major h2, header.major h3, header.major h4, header.major h5, header.major h6 {
- margin: 0;
- }
-
- header.major p {
- margin: 0.7em 0 0 0;
- }
-
- header.special {
- text-align: center;
- }
-
-/* Form */
-
- form {
- margin: 0 0 2em 0;
- }
-
- label {
- color: #555;
- display: block;
- font-size: 0.9em;
- font-weight: 400;
- margin: 0 0 1em 0;
+ label {
+ color: #555;
+ display: block;
+ font-size: 0.9em;
+ font-weight: 400;
+ margin: 0 0 0.625em 0;
}
input[type="text"],
@@ -2028,14 +374,13 @@
-webkit-appearance: none;
-ms-appearance: none;
appearance: none;
- background: rgba(144, 144, 144, 0.075);
+ background-color: transparent;
border-radius: 4px;
- border: none;
- border: solid 1px rgba(144, 144, 144, 0.5);
+ border: solid 1px #ccc;
color: inherit;
display: block;
outline: 0;
- padding: 0 1em;
+ padding: 0 0.75em;
text-decoration: none;
width: 100%;
}
@@ -2053,7 +398,7 @@
input[type="email"]:focus,
select:focus,
textarea:focus {
- border-color: #6bd4c8;
+ border-color: #00D3B7;
}
.select-wrapper {
@@ -2072,8 +417,8 @@
}
.select-wrapper:before {
- color: rgba(144, 144, 144, 0.5);
- content: '\f078';
+ color: #ccc;
+ content: '\f107';
display: block;
height: 2.75em;
line-height: 2.75em;
@@ -2117,11 +462,12 @@
input[type="checkbox"] + label,
input[type="radio"] + label {
text-decoration: none;
- color: #666;
+ color: #aaa;
cursor: pointer;
display: inline-block;
font-size: 1em;
- font-weight: 300;
+ font-weight: 400;
+ margin: 0;
padding-left: 2.4em;
padding-right: 0.75em;
position: relative;
@@ -2139,9 +485,9 @@
input[type="checkbox"] + label:before,
input[type="radio"] + label:before {
- background: rgba(144, 144, 144, 0.075);
+ background: transparent;
border-radius: 4px;
- border: solid 1px rgba(144, 144, 144, 0.5);
+ border: solid 1px #ccc;
content: '';
display: inline-block;
height: 1.65em;
@@ -2155,15 +501,15 @@
input[type="checkbox"]:checked + label:before,
input[type="radio"]:checked + label:before {
- background: #666666;
- border-color: #666666;
- color: #ffffff;
+ background-color: #555;
+ border-color: #555;
+ color: #fff;
content: '\f00c';
}
input[type="checkbox"]:focus + label:before,
input[type="radio"]:focus + label:before {
- border-color: #6bd4c8;
+ border-color: #00D3B7;
}
input[type="checkbox"] + label:before {
@@ -2175,167 +521,60 @@
}
::-webkit-input-placeholder {
- color: #999 !important;
opacity: 1.0;
+ color: #ccc !important;
}
:-moz-placeholder {
- color: #999 !important;
opacity: 1.0;
+ color: #ccc !important;
}
::-moz-placeholder {
- color: #999 !important;
opacity: 1.0;
+ color: #ccc !important;
}
:-ms-input-placeholder {
- color: #999 !important;
opacity: 1.0;
+ color: #ccc !important;
}
.formerize-placeholder {
- color: #999 !important;
- opacity: 1.0;
- }
-
-/* Box */
-
- .box {
- border-radius: 4px;
- border: solid 1px rgba(144, 144, 144, 0.5);
- margin-bottom: 2em;
- padding: 1.5em;
- }
-
- .box > :last-child,
- .box > :last-child > :last-child,
- .box > :last-child > :last-child > :last-child {
- margin-bottom: 0;
- }
-
- .box.alt {
- border: 0;
- border-radius: 0;
- padding: 0;
- }
-
-/* Icon */
-
- .icon {
- text-decoration: none;
- border-bottom: none;
- position: relative;
- }
-
- .icon:before {
- -moz-osx-font-smoothing: grayscale;
- -webkit-font-smoothing: antialiased;
- font-family: FontAwesome;
- font-style: normal;
- font-weight: normal;
- text-transform: none !important;
- }
-
- .icon > .label {
- display: none;
- }
-
- .icon.style1:before {
- color: #c3e895;
- }
-
- .icon.style2:before {
- color: #8addaa;
- }
-
- .icon.style3:before {
- color: #6bd4c8;
- }
-
- .icon.style4:before {
- color: #57aed3;
- }
-
- .icon.style5:before {
- color: #4a87d3;
- }
-
- .icon.style6:before {
- color: #6b88e6;
- }
-
- .icon.major {
- text-decoration: none;
- color: #555;
- cursor: default;
- display: inline-block;
- margin: 0 0 1.5em 0;
- }
-
- .icon.major:before {
- -moz-osx-font-smoothing: grayscale;
- -webkit-font-smoothing: antialiased;
- font-family: FontAwesome;
- font-style: normal;
- font-weight: normal;
- text-transform: none !important;
- }
-
- .icon.major:before {
- font-size: 4em;
- line-height: 1em;
- }
-
-/* Image */
-
- .image {
- border-radius: 4px;
- border: 0;
- display: inline-block;
- position: relative;
- }
-
- .image img {
- border-radius: 4px;
- display: block;
- }
-
- .image.left {
- float: left;
- padding: 0 1.5em 1em 0;
- top: 0.25em;
- }
+ opacity: 1.0;
+ color: #ccc !important;
+ }
- .image.right {
- float: right;
- padding: 0 0 1em 1.5em;
- top: 0.25em;
- }
+ .field {
+ margin: 0 0 1.25em 0;
+ }
- .image.left, .image.right {
- max-width: 40%;
- }
+/* Icon */
- .image.left img, .image.right img {
- width: 100%;
- }
+ .icon {
+ text-decoration: none;
+ border-bottom: none;
+ position: relative;
+ }
- .image.fit {
- display: block;
- margin: 0 0 2em 0;
- width: 100%;
+ .icon:before {
+ -moz-osx-font-smoothing: grayscale;
+ -webkit-font-smoothing: antialiased;
+ font-family: FontAwesome;
+ font-style: normal;
+ font-weight: normal;
+ text-transform: none !important;
}
- .image.fit img {
- width: 100%;
- }
+ .icon > .label {
+ display: none;
+ }
/* List */
ol {
list-style: decimal;
- margin: 0 0 2em 0;
+ margin: 0 0 1.25em 0;
padding-left: 1.25em;
}
@@ -2345,7 +584,7 @@
ul {
list-style: disc;
- margin: 0 0 2em 0;
+ margin: 0 0 1.25em 0;
padding-left: 1em;
}
@@ -2359,7 +598,7 @@
}
ul.alt li {
- border-top: solid 1px rgba(144, 144, 144, 0.5);
+ border-top: solid 1px #ccc;
padding: 0.5em 0;
}
@@ -2376,7 +615,7 @@
ul.icons li {
display: inline-block;
- padding: 0 1.25em 0 0;
+ padding: 0 1em 0 0;
}
ul.icons li:last-child {
@@ -2384,44 +623,9 @@
}
ul.icons li .icon:before {
- font-size: 1.5em;
- }
-
- ul.major-icons {
- list-style: none;
- padding-left: 0;
- }
-
- ul.major-icons li {
- display: inline-block;
- padding: 2.5em;
- text-align: center;
- }
-
- ul.major-icons li .icon {
- -moz-transform: rotate(45deg);
- -webkit-transform: rotate(45deg);
- -ms-transform: rotate(45deg);
- transform: rotate(45deg);
- border-radius: 4px;
- border: solid 1px rgba(144, 144, 144, 0.5);
- display: inline-block;
- height: 8em;
- line-height: 8em;
- margin: 0;
- text-align: center;
- width: 8em;
+ font-size: 1.5rem;
}
- ul.major-icons li .icon:before {
- -moz-transform: rotate(-45deg);
- -webkit-transform: rotate(-45deg);
- -ms-transform: rotate(-45deg);
- transform: rotate(-45deg);
- display: inline-block;
- line-height: inherit;
- }
-
ul.actions {
cursor: default;
list-style: none;
@@ -2430,7 +634,7 @@
ul.actions li {
display: inline-block;
- padding: 0 1em 0 0;
+ padding: 0 0.625em 0 0;
vertical-align: middle;
}
@@ -2439,983 +643,603 @@
}
ul.actions.small li {
- padding: 0 0.5em 0 0;
+ padding: 0 0.3125em 0 0;
}
ul.actions.vertical li {
display: block;
- padding: 1em 0 0 0;
+ padding: 0.625em 0 0 0;
}
ul.actions.vertical li:first-child {
- padding-top: 0;
- }
-
- ul.actions.vertical li > * {
- margin-bottom: 0;
- }
-
- ul.actions.vertical.small li {
- padding: 0.5em 0 0 0;
- }
-
- ul.actions.vertical.small li:first-child {
- padding-top: 0;
- }
-
- ul.actions.uniform li > * {
- min-width: 12em;
- }
-
- ul.actions.fit {
- display: table;
- margin-left: -1em;
- padding: 0;
- table-layout: fixed;
- width: calc(100% + 1em);
- }
-
- ul.actions.fit li {
- display: table-cell;
- padding: 0 0 0 1em;
- }
-
- ul.actions.fit li > * {
- margin-bottom: 0;
- }
-
- ul.actions.fit.small {
- margin-left: -0.5em;
- width: calc(100% + 0.5em);
- }
-
- ul.actions.fit.small li {
- padding: 0 0 0 0.5em;
- }
-
- dl {
- margin: 0 0 2em 0;
- }
-
-/* Table */
-
- .table-wrapper {
- -webkit-overflow-scrolling: touch;
- overflow-x: auto;
- }
-
- table {
- margin: 0 0 2em 0;
- width: 100%;
- }
-
- table tbody tr {
- border-left: 0;
- border-right: 0;
- }
-
- table tbody tr:nth-child(2n + 1) {
- background-color: rgba(144, 144, 144, 0.075);
- }
-
- table td {
- padding: 0.75em 0.75em;
- }
-
- table th {
- color: #555;
- font-size: 0.9em;
- font-weight: 400;
- padding: 0 0.75em 0.75em 0.75em;
- text-align: left;
- }
-
- table thead {
- border-bottom: solid 1px rgba(144, 144, 144, 0.5);
- }
-
- table tfoot {
- border-top: solid 1px rgba(144, 144, 144, 0.5);
- }
-
- table.alt {
- border-collapse: separate;
- }
-
- table.alt tbody tr td {
- border: solid 1px rgba(144, 144, 144, 0.5);
- border-left-width: 0;
- border-top-width: 0;
- }
-
- table.alt tbody tr td:first-child {
- border-left-width: 1px;
- }
-
- table.alt tbody tr:first-child td {
- border-top-width: 1px;
- }
-
- table.alt thead {
- border-bottom: 0;
- }
-
- table.alt tfoot {
- border-top: 0;
- }
-
-/* Button */
-
- input[type="submit"],
- input[type="reset"],
- input[type="button"],
- button,
- .button {
- -moz-appearance: none;
- -webkit-appearance: none;
- -ms-appearance: none;
- appearance: none;
- -moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
- -webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
- -ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
- transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
- background-color: transparent;
- border-radius: 4px;
- border: 0;
- box-shadow: inset 0 0 0 1px rgba(144, 144, 144, 0.5);
- color: #555 !important;
- cursor: pointer;
- display: inline-block;
- font-size: 0.9em;
- font-weight: 400;
- height: 2.75em;
- letter-spacing: 0.125em;
- line-height: 2.75em;
- padding: 0 2em;
- text-align: center;
- text-decoration: none;
- text-indent: 0.125em;
- text-transform: uppercase;
- white-space: nowrap;
- }
-
- input[type="submit"]:hover,
- input[type="reset"]:hover,
- input[type="button"]:hover,
- button:hover,
- .button:hover {
- background-color: rgba(144, 144, 144, 0.075);
- }
-
- input[type="submit"]:active,
- input[type="reset"]:active,
- input[type="button"]:active,
- button:active,
- .button:active {
- background-color: rgba(144, 144, 144, 0.2);
- }
-
- input[type="submit"].icon,
- input[type="reset"].icon,
- input[type="button"].icon,
- button.icon,
- .button.icon {
- padding-left: 1.35em;
- }
-
- input[type="submit"].icon:before,
- input[type="reset"].icon:before,
- input[type="button"].icon:before,
- button.icon:before,
- .button.icon:before {
- margin-right: 0.5em;
- }
-
- input[type="submit"].fit,
- input[type="reset"].fit,
- input[type="button"].fit,
- button.fit,
- .button.fit {
- display: block;
- margin: 0 0 1em 0;
- width: 100%;
- }
-
- input[type="submit"].small,
- input[type="reset"].small,
- input[type="button"].small,
- button.small,
- .button.small {
- font-size: 0.7em;
- }
-
- input[type="submit"].big,
- input[type="reset"].big,
- input[type="button"].big,
- button.big,
- .button.big {
- font-size: 1.25em;
- }
-
- input[type="submit"].special,
- input[type="reset"].special,
- input[type="button"].special,
- button.special,
- .button.special {
- background-color: #555;
- box-shadow: none !important;
- color: #fff !important;
- }
-
- input[type="submit"].special:hover,
- input[type="reset"].special:hover,
- input[type="button"].special:hover,
- button.special:hover,
- .button.special:hover {
- background-color: #626262;
- }
-
- input[type="submit"].special:active,
- input[type="reset"].special:active,
- input[type="button"].special:active,
- button.special:active,
- .button.special:active {
- background-color: #484848;
- }
-
- input[type="submit"].disabled, input[type="submit"]:disabled,
- input[type="reset"].disabled,
- input[type="reset"]:disabled,
- input[type="button"].disabled,
- input[type="button"]:disabled,
- button.disabled,
- button:disabled,
- .button.disabled,
- .button:disabled {
- cursor: default;
- opacity: 0.25;
- }
-
-/* Main */
-
- .main {
- padding: 6em 0 4em 0 ;
- }
-
- .main.style1 {
- background: #fff;
- }
-
- .main.style2 {
- background-color: #333;
- color: rgba(255, 255, 255, 0.75);
- background-attachment: fixed, fixed;
- background-image: url("images/overlay1.png"), url("../../images/header.jpg");
- background-size: auto, cover;
- }
-
- .main.style2 a {
- border-bottom-color: rgba(255, 255, 255, 0.5);
- }
-
- .main.style2 a:hover {
- color: #ffffff;
- }
-
- .main.style2 h1, .main.style2 h2, .main.style2 h3, .main.style2 h4, .main.style2 h5, .main.style2 h6, .main.style2 strong, .main.style2 b {
- color: #ffffff;
- }
-
- .main.style2 header p {
- color: #ffffff;
- }
-
- .main.style2 header.major:after {
- background: #ffffff;
- }
-
- .main.style2 input[type="submit"],
- .main.style2 input[type="reset"],
- .main.style2 input[type="button"],
- .main.style2 button,
- .main.style2 .button {
- box-shadow: inset 0 0 0 1px #ffffff;
- color: #ffffff !important;
- }
-
- .main.style2 input[type="submit"]:hover,
- .main.style2 input[type="reset"]:hover,
- .main.style2 input[type="button"]:hover,
- .main.style2 button:hover,
- .main.style2 .button:hover {
- background-color: rgba(255, 255, 255, 0.125);
- }
-
- .main.style2 input[type="submit"]:active,
- .main.style2 input[type="reset"]:active,
- .main.style2 input[type="button"]:active,
- .main.style2 button:active,
- .main.style2 .button:active {
- background-color: rgba(255, 255, 255, 0.25);
- }
-
- .main.style2 input[type="submit"].special,
- .main.style2 input[type="reset"].special,
- .main.style2 input[type="button"].special,
- .main.style2 button.special,
- .main.style2 .button.special {
- background-color: #ffffff;
- box-shadow: inset 0 0 0 1px #ffffff !important;
- color: #333 !important;
- }
-
- .main.style2 input[type="submit"].special:hover,
- .main.style2 input[type="reset"].special:hover,
- .main.style2 input[type="button"].special:hover,
- .main.style2 button.special:hover,
- .main.style2 .button.special:hover {
- background-color: rgba(255, 255, 255, 0.125) !important;
- color: #ffffff !important;
- }
-
- .main.style2 input[type="submit"].special:active,
- .main.style2 input[type="reset"].special:active,
- .main.style2 input[type="button"].special:active,
- .main.style2 button.special:active,
- .main.style2 .button.special:active {
- background-color: rgba(255, 255, 255, 0.25) !important;
- }
-
- .main.style2 ul.major-icons li .icon {
- border-color: #ffffff;
- }
-
- .main.style2 .icon.major {
- color: #ffffff;
- }
-
-/* Header */
-
- #header {
- padding: 9em 0 9em 0 ;
- background-color: #4686a0;
- color: rgba(255, 255, 255, 0.75);
- background-attachment: fixed, fixed, fixed;
- background-image: url("images/overlay2.png"), url("images/overlay3.svg"), linear-gradient(45deg, #9dc66b 5%, #4fa49a 30%, #4361c2);
- background-position: top left, center center, center center;
- background-size: auto, cover, cover;
- overflow: hidden;
- position: relative;
- text-align: center;
- }
-
- #header a {
- border-bottom-color: rgba(255, 255, 255, 0.5);
- }
-
- #header a:hover {
- color: #ffffff;
- }
-
- #header h1, #header h2, #header h3, #header h4, #header h5, #header h6, #header strong, #header b {
- color: #ffffff;
- }
-
- #header header p {
- color: #ffffff;
- }
-
- #header header.major:after {
- background: #ffffff;
- }
+ padding-top: 0;
+ }
- #header input[type="submit"],
- #header input[type="reset"],
- #header input[type="button"],
- #header button,
- #header .button {
- box-shadow: inset 0 0 0 1px #ffffff;
- color: #ffffff !important;
- }
+ ul.actions.vertical li > * {
+ margin-bottom: 0;
+ }
- #header input[type="submit"]:hover,
- #header input[type="reset"]:hover,
- #header input[type="button"]:hover,
- #header button:hover,
- #header .button:hover {
- background-color: rgba(255, 255, 255, 0.125);
+ ul.actions.vertical.small li {
+ padding: 0.3125em 0 0 0;
}
- #header input[type="submit"]:active,
- #header input[type="reset"]:active,
- #header input[type="button"]:active,
- #header button:active,
- #header .button:active {
- background-color: rgba(255, 255, 255, 0.25);
- }
+ ul.actions.vertical.small li:first-child {
+ padding-top: 0;
+ }
- #header input[type="submit"].special,
- #header input[type="reset"].special,
- #header input[type="button"].special,
- #header button.special,
- #header .button.special {
- background-color: #ffffff;
- box-shadow: inset 0 0 0 1px #ffffff !important;
- color: #4686a0 !important;
+ ul.actions.fit {
+ display: table;
+ margin-left: -0.625em;
+ padding: 0;
+ table-layout: fixed;
+ width: calc(100% + 0.625em);
}
- #header input[type="submit"].special:hover,
- #header input[type="reset"].special:hover,
- #header input[type="button"].special:hover,
- #header button.special:hover,
- #header .button.special:hover {
- background-color: rgba(255, 255, 255, 0.125) !important;
- color: #ffffff !important;
+ ul.actions.fit li {
+ display: table-cell;
+ padding: 0 0 0 0.625em;
}
- #header input[type="submit"].special:active,
- #header input[type="reset"].special:active,
- #header input[type="button"].special:active,
- #header button.special:active,
- #header .button.special:active {
- background-color: rgba(255, 255, 255, 0.25) !important;
- }
+ ul.actions.fit li > * {
+ margin-bottom: 0;
+ }
- #header ul.major-icons li .icon {
- border-color: #ffffff;
- }
+ ul.actions.fit.small {
+ margin-left: -0.3125em;
+ width: calc(100% + 0.3125em);
+ }
- #header .icon.major {
- color: #ffffff;
- }
+ ul.actions.fit.small li {
+ padding: 0 0 0 0.3125em;
+ }
- #header h1 {
- margin: 0;
- }
+ dl {
+ margin: 0 0 1.25em 0;
+ }
- #header p {
- margin: 1em 0 0 0;
+ dl dt {
+ display: block;
+ font-weight: 400;
+ margin: 0 0 0.625em 0;
}
- #header .actions {
- margin: 2.5em 0 0 0;
- position: relative;
+ dl dd {
+ margin-left: 1.25em;
}
- #header .actions:after {
- background: #ffffff;
- content: '';
- height: 100vh;
- left: 50%;
- position: absolute;
- top: 100%;
- width: 1px;
- }
-
- #header .inner {
- -moz-transition: -moz-transform 1.5s ease, opacity 2s ease;
- -webkit-transition: -webkit-transform 1.5s ease, opacity 2s ease;
- -ms-transition: -ms-transform 1.5s ease, opacity 2s ease;
- transition: transform 1.5s ease, opacity 2s ease;
- -moz-transition-delay: 0.25s;
- -webkit-transition-delay: 0.25s;
- -ms-transition-delay: 0.25s;
- transition-delay: 0.25s;
- -moz-transform: scale(1);
- -webkit-transform: scale(1);
- -ms-transform: scale(1);
- transform: scale(1);
- opacity: 1;
- position: relative;
- z-index: 1;
- }
+/* Main */
- #header .inner .actions {
- -moz-transition: -moz-transform 1.25s ease;
- -webkit-transition: -webkit-transform 1.25s ease;
- -ms-transition: -ms-transform 1.25s ease;
- transition: transform 1.25s ease;
- -moz-transition-delay: 1s;
- -webkit-transition-delay: 1s;
- -ms-transition-delay: 1s;
- transition-delay: 1s;
- -moz-transform: translateY(0);
- -webkit-transform: translateY(0);
- -ms-transform: translateY(0);
- transform: translateY(0);
- opacity: 1;
- }
+ #main {
+ -moz-transition: opacity 0.75s ease, right 0.75s ease, left 0.75s ease, visibility 0.75s;
+ -webkit-transition: opacity 0.75s ease, right 0.75s ease, left 0.75s ease, visibility 0.75s;
+ -ms-transition: opacity 0.75s ease, right 0.75s ease, left 0.75s ease, visibility 0.75s;
+ transition: opacity 0.75s ease, right 0.75s ease, left 0.75s ease, visibility 0.75s;
+ -webkit-overflow-scrolling: touch;
+ position: fixed;
+ top: 0;
+ width: 22.5em;
+ height: 100%;
+ background: #fff;
+ outline: 0;
+ overflow-x: hidden;
+ overflow-y: auto;
+ text-align: right;
+ visibility: visible;
+ z-index: 10000;
+ right: 0;
+ opacity: 0.7;
+ }
- #header:after {
- -moz-transition: opacity 1s ease;
- -webkit-transition: opacity 1s ease;
- -ms-transition: opacity 1s ease;
- transition: opacity 1s ease;
- background-image: linear-gradient(45deg, #4fa49a, #4361c2);
- content: '';
- height: 100%;
- left: 0;
- opacity: 0;
+ #main .toggle {
+ -webkit-tap-highlight-color: transparent;
position: absolute;
top: 0;
- width: 100%;
+ width: 4em;
+ height: 4em;
+ background-image: url("images/close-small-alt.svg");
+ background-repeat: no-repeat;
+ background-size: 32px 32px;
+ cursor: pointer;
+ display: none;
+ z-index: 1;
+ background-position: 0.5em 0.5em;
+ left: 0;
}
- body.is-loading #header .inner {
- -moz-transform: scale(1.05);
- -webkit-transform: scale(1.05);
- -ms-transform: scale(1.05);
- transform: scale(1.05);
- opacity: 0;
- }
+ body.fullscreen #main {
+ visibility: hidden;
+ right: -22.5em;
+ }
- body.is-loading #header .inner .actions {
- -moz-transform: translateY(30em);
- -webkit-transform: translateY(30em);
- -ms-transform: translateY(30em);
- transform: translateY(30em);
+ body.is-loading-1 #main {
opacity: 0;
+ right: -2em;
}
- body.is-loading #header:after {
- opacity: 1;
- }
+ @media screen and (max-width: 1280px) {
-/* Footer */
+ #main {
+ width: 19em;
+ }
- #footer {
- padding: 6em 0 6em 0 ;
- background-color: #4686a0;
- color: rgba(255, 255, 255, 0.75);
- background-attachment: fixed, fixed, fixed;
- background-image: url("images/overlay2.png"), url("images/overlay4.svg"), linear-gradient(45deg, #4361c2, #4fa49a 50%, #9dc66b 95%);
- background-position: top left, center center, center center;
- background-size: auto, cover, cover;
- text-align: center;
- }
+ body.fullscreen #main {
+ right: -19em;
+ }
- #footer a {
- border-bottom-color: rgba(255, 255, 255, 0.5);
}
- #footer a:hover {
- color: #ffffff;
- }
-
- #footer h1, #footer h2, #footer h3, #footer h4, #footer h5, #footer h6, #footer strong, #footer b {
- color: #ffffff;
- }
+ @media screen and (max-width: 980px) {
- #footer header p {
- color: #ffffff;
- }
+ #main {
+ background: rgba(255, 255, 255, 0.925);
+ }
- #footer header.major:after {
- background: #ffffff;
- }
+ #main .toggle {
+ display: block;
+ }
- #footer input[type="submit"],
- #footer input[type="reset"],
- #footer input[type="button"],
- #footer button,
- #footer .button {
- box-shadow: inset 0 0 0 1px #ffffff;
- color: #ffffff !important;
}
- #footer input[type="submit"]:hover,
- #footer input[type="reset"]:hover,
- #footer input[type="button"]:hover,
- #footer button:hover,
- #footer .button:hover {
- background-color: rgba(255, 255, 255, 0.125);
- }
+ @media screen and (max-width: 480px) {
- #footer input[type="submit"]:active,
- #footer input[type="reset"]:active,
- #footer input[type="button"]:active,
- #footer button:active,
- #footer .button:active {
- background-color: rgba(255, 255, 255, 0.25);
+ #main {
+ -moz-transition: opacity 0.5s ease, visibility 0.5s;
+ -webkit-transition: opacity 0.5s ease, visibility 0.5s;
+ -ms-transition: opacity 0.5s ease, visibility 0.5s;
+ transition: opacity 0.5s ease, visibility 0.5s;
+ width: 100%;
+ background: #fff;
+ text-align: center;
}
- #footer input[type="submit"].special,
- #footer input[type="reset"].special,
- #footer input[type="button"].special,
- #footer button.special,
- #footer .button.special {
- background-color: #ffffff;
- box-shadow: inset 0 0 0 1px #ffffff !important;
- color: #4686a0 !important;
- }
+ body.is-loading-1 #main {
+ left: auto !important;
+ right: auto !important;
+ }
- #footer input[type="submit"].special:hover,
- #footer input[type="reset"].special:hover,
- #footer input[type="button"].special:hover,
- #footer button.special:hover,
- #footer .button.special:hover {
- background-color: rgba(255, 255, 255, 0.125) !important;
- color: #ffffff !important;
+ body.fullscreen #main {
+ left: auto !important;
+ right: auto !important;
+ opacity: 0;
}
- #footer input[type="submit"].special:active,
- #footer input[type="reset"].special:active,
- #footer input[type="button"].special:active,
- #footer button.special:active,
- #footer .button.special:active {
- background-color: rgba(255, 255, 255, 0.25) !important;
+ #main .toggle {
+ display: none;
}
- #footer ul.major-icons li .icon {
- border-color: #ffffff;
}
- #footer .icon.major {
- color: #ffffff;
- }
+/* Header */
- #footer .icons {
- margin: 0;
+ #header {
+ padding: 3em 2.25em 1.75em 2.25em ;
+ opacity: 1;
+
+ }
+
+ #header h1 {
+ font-size: 2.25em;
+ font-weight: 700;
}
+/* Footer */
+
+ #footer {
+ padding: 2.25em 2.25em 1em 2.25em ;
+ }
+
#footer .copyright {
- font-size: 0.8em;
list-style: none;
- margin: 2em 0 0 0;
padding: 0;
}
#footer .copyright li {
- border-left: solid 1px;
display: inline-block;
- line-height: 1em;
- margin-left: 1em;
- padding: 0 0 0 1em;
+ font-size: 0.8em;
+ margin-left: 0.35em;
+ padding: 0;
}
#footer .copyright li:first-child {
- border-left: 0;
margin-left: 0;
- padding: 0;
}
-/* XLarge */
-
- @media screen and (max-width: 1680px) {
-
- /* Basic */
-
- body, input, select, textarea {
- font-size: 14pt;
- }
-
- /* Header */
-
- #header {
- padding: 6em 0 6em 0 ;
- }
+/* Thumbnails */
+ #thumbnails {
+ display: -moz-flex;
+ display: -webkit-flex;
+ display: -ms-flex;
+ display: flex;
+ -moz-flex-wrap: wrap;
+ -webkit-flex-wrap: wrap;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ padding: 0 0.75em;
}
-/* Large */
-
- @media screen and (max-width: 1140px) {
-
- /* Basic */
-
- body, input, select, textarea {
- font-size: 13pt;
- }
-
- h1 br, h2 br, h3 br, h4 br, h5 br, h6 br {
- display: none;
- }
-
- /* List */
+ #thumbnails article {
+ position: relative;
+ width: 50%;
+ background: #101010;
+ outline: 0;
+ }
- ul.major-icons li {
- padding: 2em;
+ #thumbnails article .thumbnail {
+ -webkit-tap-highlight-color: transparent;
+ display: block;
+ position: relative;
+ border: 0;
+ outline: 0;
}
- ul.major-icons li .icon {
- height: 8em;
- line-height: 8em;
- width: 8em;
+ #thumbnails article .thumbnail img {
+ display: block;
+ width: 100%;
}
- /* Main */
-
- .main {
- padding: 4em 0 2em 0 ;
- }
-
- .main.style2 {
- background-attachment: scroll;
+ #thumbnails article .thumbnail:before {
+ -moz-pointer-events: none;
+ -webkit-pointer-events: none;
+ -ms-pointer-events: none;
+ pointer-events: none;
+ -moz-transition: opacity 0.25s ease;
+ -webkit-transition: opacity 0.25s ease;
+ -ms-transition: opacity 0.25s ease;
+ transition: opacity 0.25s ease;
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ box-shadow: inset 0 0 0 2px #00D3B7, inset 0 0 0px 3px rgba(0, 0, 0, 0.15);
+ opacity: 0;
+ z-index: 1;
}
- /* Header */
-
- #header {
- padding: 5em 0 5em 0 ;
- background-attachment: scroll;
- }
-
- #header br {
- display: inline;
+ #thumbnails article .thumbnail:focus:before {
+ opacity: 0.5;
}
- /* Footer */
-
- #footer {
- padding: 4em 0 4em 0 ;
- background-attachment: scroll;
+ #thumbnails article h2, #thumbnails article p {
+ display: none;
}
- }
-
-/* Medium */
-
- @media screen and (max-width: 980px) {
-
- /* List */
-
- ul.major-icons li {
- padding: 2em;
+ #thumbnails article.active .thumbnail:before {
+ opacity: 1;
}
- ul.major-icons li .icon {
- height: 7em;
- line-height: 7em;
- width: 7em;
- }
-
- /* Main */
+ @media screen and (max-width: 480px) {
- .main {
- padding: 5em 3em 3em 3em ;
+ #thumbnails article .thumbnail:before {
+ display: none;
}
- /* Header */
-
- #header {
- padding: 8em 3em 8em 3em ;
- }
+ }
- /* Footer */
+/* Viewer */
- #footer {
- padding: 5em 3em 5em 3em ;
- }
+ @-moz-keyframes spinner {
+ 0% {
+ -moz-transform: rotate(0deg);
+ -webkit-transform: rotate(0deg);
+ -ms-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
- /* One */
+ 100% {
+ -moz-transform: rotate(360deg);
+ -webkit-transform: rotate(360deg);
+ -ms-transform: rotate(360deg);
+ transform: rotate(360deg);
+ }
+ }
- #one {
- text-align: center;
- }
+ @-webkit-keyframes spinner {
+ 0% {
+ -moz-transform: rotate(0deg);
+ -webkit-transform: rotate(0deg);
+ -ms-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
- /* Two */
+ 100% {
+ -moz-transform: rotate(360deg);
+ -webkit-transform: rotate(360deg);
+ -ms-transform: rotate(360deg);
+ transform: rotate(360deg);
+ }
+ }
- #two {
- text-align: center;
- }
+ @-ms-keyframes spinner {
+ 0% {
+ -moz-transform: rotate(0deg);
+ -webkit-transform: rotate(0deg);
+ -ms-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
+ 100% {
+ -moz-transform: rotate(360deg);
+ -webkit-transform: rotate(360deg);
+ -ms-transform: rotate(360deg);
+ transform: rotate(360deg);
+ }
}
-/* Small */
+ @keyframes spinner {
+ 0% {
+ -moz-transform: rotate(0deg);
+ -webkit-transform: rotate(0deg);
+ -ms-transform: rotate(0deg);
+ transform: rotate(0deg);
+ }
- @media screen and (max-width: 736px) {
+ 100% {
+ -moz-transform: rotate(360deg);
+ -webkit-transform: rotate(360deg);
+ -ms-transform: rotate(360deg);
+ transform: rotate(360deg);
+ }
+ }
- /* Basic */
+ #viewer {
+ -moz-transition: opacity 0.75s ease, width 0.75s ease;
+ -webkit-transition: opacity 0.75s ease, width 0.75s ease;
+ -ms-transition: opacity 0.75s ease, width 0.75s ease;
+ transition: opacity 0.75s ease, width 0.75s ease;
+ position: absolute;
+ top: 0;
+ width: calc(100% - 22.5em);
+ height: 100%;
+ left: 0;
+ }
- body, input, select, textarea {
- font-size: 12pt;
- }
+ #viewer .inner {
+ -moz-pointer-events: none;
+ -webkit-pointer-events: none;
+ -ms-pointer-events: none;
+ pointer-events: none;
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 2;
+ }
- h1 {
- font-size: 1.75em;
+ #viewer .inner > * {
+ -moz-pointer-events: auto;
+ -webkit-pointer-events: auto;
+ -ms-pointer-events: auto;
+ pointer-events: auto;
}
- h2 {
- font-size: 1.5em;
+ #viewer .inner:before {
+ background-image: -moz-linear-gradient(left, rgba(16,16,16,0.2), rgba(16,16,16,0) 10em, rgba(16,16,16,0)), -moz-linear-gradient(right, rgba(16,16,16,0.2), rgba(16,16,16,0) 10em, rgba(16,16,16,0));
+ background-image: -webkit-linear-gradient(left, rgba(16,16,16,0.2), rgba(16,16,16,0) 10em, rgba(16,16,16,0)), -webkit-linear-gradient(right, rgba(16,16,16,0.2), rgba(16,16,16,0) 10em, rgba(16,16,16,0));
+ background-image: -ms-linear-gradient(left, rgba(16,16,16,0.2), rgba(16,16,16,0) 10em, rgba(16,16,16,0)), -ms-linear-gradient(right, rgba(16,16,16,0.2), rgba(16,16,16,0) 10em, rgba(16,16,16,0));
+ background-image: linear-gradient(left, rgba(16,16,16,0.2), rgba(16,16,16,0) 10em, rgba(16,16,16,0)), linear-gradient(right, rgba(16,16,16,0.2), rgba(16,16,16,0) 10em, rgba(16,16,16,0));
+ content: '';
+ display: block;
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
}
- h3 {
- font-size: 1.1em;
+ #viewer .inner .toggle {
+ -webkit-tap-highlight-color: transparent;
+ position: absolute;
+ top: 0;
+ width: 4em;
+ height: 4em;
+ background-image: url("images/close.svg");
+ background-repeat: no-repeat;
+ background-size: 64px 64px;
+ cursor: pointer;
+ z-index: 1;
+ right: 0;
+ background-position: calc(100% - 0.75em) 0.75em;
+ }
+
+ #viewer .inner .nav-next,
+ #viewer .inner .nav-previous {
+ -webkit-tap-highlight-color: transparent;
+ position: absolute;
+ top: 50%;
+ width: 6em;
+ height: 6em;
+ margin-top: -3em;
+ background-image: url("images/arrow.svg");
+ background-position: center;
+ background-repeat: no-repeat;
+ background-size: contain;
+ cursor: pointer;
+ }
+
+ #viewer .inner .nav-previous {
+ -moz-transform: scaleX(-1);
+ -webkit-transform: scaleX(-1);
+ -ms-transform: scaleX(-1);
+ transform: scaleX(-1);
+ left: 0;
}
- h4 {
- font-size: 1em;
+ #viewer .inner .nav-next {
+ right: 0;
}
- /* List */
+ #viewer .slide {
+ -moz-transition: opacity 0.5s ease-in-out;
+ -webkit-transition: opacity 0.5s ease-in-out;
+ -ms-transition: opacity 0.5s ease-in-out;
+ transition: opacity 0.5s ease-in-out;
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ opacity: 1;
+ z-index: 1;
+ }
- ul.major-icons li {
- padding: 1.5em;
+ #viewer .slide .caption {
+ background-image: -moz-linear-gradient(bottom, rgba(16,16,16,0.75), rgba(16,16,16,0.25) 80%, rgba(16,16,16,0));
+ background-image: -webkit-linear-gradient(bottom, rgba(16,16,16,0.75), rgba(16,16,16,0.25) 80%, rgba(16,16,16,0));
+ background-image: -ms-linear-gradient(bottom, rgba(16,16,16,0.75), rgba(16,16,16,0.25) 80%, rgba(16,16,16,0));
+ background-image: linear-gradient(bottom, rgba(16,16,16,0.75), rgba(16,16,16,0.25) 80%, rgba(16,16,16,0));
+ padding: 2em 2em 0.75em 2em ;
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ color: rgba(255, 255, 255, 0.5);
+ z-index: 1;
}
- ul.major-icons li .icon {
- height: 5em;
- line-height: 5em;
- width: 5em;
+ #viewer .slide .caption h2, #viewer .slide .caption h3, #viewer .slide .caption h4, #viewer .slide .caption h5, #viewer .slide .caption h6 {
+ color: #fff;
}
- ul.major-icons li .icon:before {
- font-size: 42px;
- }
-
- /* Icon */
-
- .icon.major {
- margin: 0 0 1em 0;
- }
-
- /* Button */
-
- input[type="submit"],
- input[type="reset"],
- input[type="button"],
- button,
- .button {
+ #viewer .slide .image {
+ -moz-transition: opacity 0.5s ease-in-out;
+ -webkit-transition: opacity 0.5s ease-in-out;
+ -ms-transition: opacity 0.5s ease-in-out;
+ transition: opacity 0.5s ease-in-out;
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-repeat: no-repeat;
+ background-size: cover;
+ opacity: 0;
+ }
+
+ #viewer .slide:before {
+ -moz-animation: spinner 1s linear infinite;
+ -webkit-animation: spinner 1s linear infinite;
+ -ms-animation: spinner 1s linear infinite;
+ animation: spinner 1s linear infinite;
+ -moz-transition: opacity 0.5s ease-in-out;
+ -webkit-transition: opacity 0.5s ease-in-out;
+ -ms-transition: opacity 0.5s ease-in-out;
+ transition: opacity 0.5s ease-in-out;
+ content: '';
+ display: block;
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ width: 3em;
height: 3em;
- line-height: 3em;
+ background-image: url("images/spinner.svg");
+ background-position: center;
+ background-repeat: no-repeat;
+ background-size: contain;
+ margin: -1.5em 0 0 -1.5em;
+ opacity: 0;
}
- /* Main */
-
- .main {
- padding: 3em 1.5em 1em 1.5em ;
+ #viewer .slide.loading:before {
+ opacity: 1;
}
- /* Header */
-
- #header {
- padding: 4em 3em 4em 3em ;
+ #viewer .slide.active .image {
+ opacity: 1;
}
- #header .actions {
- margin: 2em 0 0 0;
- }
-
- /* Footer */
+ body.fullscreen #viewer {
+ width: 100%;
+ }
- #footer {
- padding: 3em 1.5em 3em 1.5em ;
+ body.fullscreen #viewer .inner .toggle {
+ background-image: url("images/open.svg");
}
- }
-
-/* XSmall */
+ body.is-loading-1 #viewer {
+ opacity: 0;
+ }
- @media screen and (max-width: 480px) {
+ body.is-loading-2 #viewer .slide {
+ opacity: 0;
+ }
- /* List */
+ @media screen and (max-width: 1280px) {
- ul.actions {
- margin: 0 0 2em 0;
+ #viewer {
+ width: calc(100% - 19em);
}
- ul.actions li {
- display: block;
- padding: 1em 0 0 0;
- text-align: center;
- width: 100%;
- }
+ }
- ul.actions li:first-child {
- padding-top: 0;
- }
+ @media screen and (max-width: 980px) {
- ul.actions li > * {
- margin: 0 !important;
- width: 100%;
- }
+ #viewer {
+ width: 100%;
+ }
- ul.actions li > *.icon:before {
- margin-left: -2em;
- }
+ #viewer .inner .toggle {
+ -moz-transition: opacity 0.75s ease;
+ -webkit-transition: opacity 0.75s ease;
+ -ms-transition: opacity 0.75s ease;
+ transition: opacity 0.75s ease;
+ background-image: url("images/open.svg");
+ opacity: 0;
+ right: 0;
+ }
- ul.actions.small li {
- padding: 0.5em 0 0 0;
+ body.fullscreen #viewer .inner .toggle {
+ opacity: 1;
}
- ul.actions.small li:first-child {
- padding-top: 0;
- }
+ }
- /* Button */
+ @media screen and (max-width: 736px) {
- input[type="submit"],
- input[type="reset"],
- input[type="button"],
- .button {
- padding: 0;
+ #viewer .inner .toggle {
+ background-size: 32px 32px;
}
- /* Main */
-
- .main {
- padding: 2em 1.5em 0.1em 1.5em ;
+ #viewer .inner .nav-next,
+ #viewer .inner .nav-previous {
+ background-image: url("images/arrow-small.svg");
+ background-size: 32px 32px;
}
- /* Header */
-
- #header {
- padding: 4em 2em 4em 2em ;
+ body.fullscreen #viewer .inner .toggle {
+ background-image: url("images/open-small.svg");
}
- #header br {
- display: none;
- }
+ }
- /* Footer */
+ @media screen and (max-width: 480px) {
- #footer {
- padding: 2em 1.5em 2em 1.5em ;
+ #viewer {
+ -moz-transition: opacity 0.5s ease;
+ -webkit-transition: opacity 0.5s ease;
+ -ms-transition: opacity 0.5s ease;
+ transition: opacity 0.5s ease;
+ -moz-transition-delay: 0s;
+ -webkit-transition-delay: 0s;
+ -ms-transition-delay: 0s;
+ transition-delay: 0s;
+ opacity: 0;
}
- #footer .copyright {
- margin: 1.5em 0 0 0;
+ #viewer .inner .toggle {
+ background-image: url("images/close-small.svg") !important;
+ background-size: 32px 32px;
}
- #footer .copyright li {
- border: 0;
- display: block;
- margin: 1em 0 0 0;
- padding: 0;
- }
-
- #footer .copyright li:first-child {
- margin-top: 0;
- }
-
- }
-
-/* XXSmall */
-
- @media screen and (max-width: 320px) {
-
- /* Basic */
-
- html, body {
- min-width: 320px;
- }
-
- /* Main */
-
- .main {
- padding: 2em 1em 0.1em 1em ;
- }
-
- /* Header */
-
- #header {
- padding: 3em 1em 3em 1em ;
- }
-
- /* Footer */
-
- #footer {
- padding: 2em 1em 2em 1em ;
- }
+ body.fullscreen #viewer {
+ -moz-transition-delay: 0.5s;
+ -webkit-transition-delay: 0.5s;
+ -ms-transition-delay: 0.5s;
+ transition-delay: 0.5s;
+ opacity: 1;
+ }
- }
\ No newline at end of file
+ }
diff --git a/GiphyTV/assets/css/noscript.css b/assets/css/noscript.css
similarity index 100%
rename from GiphyTV/assets/css/noscript.css
rename to assets/css/noscript.css
diff --git a/assets/js/ie/backgroundsize.min.htc b/assets/js/ie/backgroundsize.min.htc
deleted file mode 100644
index 9b2592e..0000000
--- a/assets/js/ie/backgroundsize.min.htc
+++ /dev/null
@@ -1,7 +0,0 @@
-')
- .append(i.clone())
- .remove()
- .html()
- .replace(/type="password"/i, 'type="text"')
- .replace(/type=password/i, 'type=text')
- );
-
- if (i.attr('id') != '')
- x.attr('id', i.attr('id') + '-polyfill-field');
-
- if (i.attr('name') != '')
- x.attr('name', i.attr('name') + '-polyfill-field');
-
- x.addClass('polyfill-placeholder')
- .val(x.attr('placeholder')).insertAfter(i);
-
- if (i.val() == '')
- i.hide();
- else
- x.hide();
-
- i
- .on('blur', function(event) {
-
- event.preventDefault();
-
- var x = i.parent().find('input[name=' + i.attr('name') + '-polyfill-field]');
-
- if (i.val() == '') {
-
- i.hide();
- x.show();
-
- }
-
- });
-
- x
- .on('focus', function(event) {
-
- event.preventDefault();
-
- var i = x.parent().find('input[name=' + x.attr('name').replace('-polyfill-field', '') + ']');
-
- x.hide();
-
- i
- .show()
- .focus();
-
- })
- .on('keypress', function(event) {
-
- event.preventDefault();
- x.val('');
-
- });
-
- });
-
- // Events.
- $this
- .on('submit', function() {
-
- $this.find('input[type=text],input[type=password],textarea')
- .each(function(event) {
-
- var i = $(this);
-
- if (i.attr('name').match(/-polyfill-field$/))
- i.attr('name', '');
-
- if (i.val() == i.attr('placeholder')) {
-
- i.removeClass('polyfill-placeholder');
- i.val('');
-
- }
-
- });
-
- })
- .on('reset', function(event) {
-
- event.preventDefault();
-
- $this.find('select')
- .val($('option:first').val());
-
- $this.find('input,textarea')
- .each(function() {
-
- var i = $(this),
- x;
-
- i.removeClass('polyfill-placeholder');
-
- switch (this.type) {
-
- case 'submit':
- case 'reset':
- break;
-
- case 'password':
- i.val(i.attr('defaultValue'));
-
- x = i.parent().find('input[name=' + i.attr('name') + '-polyfill-field]');
-
- if (i.val() == '') {
- i.hide();
- x.show();
- }
- else {
- i.show();
- x.hide();
- }
-
- break;
-
- case 'checkbox':
- case 'radio':
- i.attr('checked', i.attr('defaultValue'));
- break;
-
- case 'text':
- case 'textarea':
- i.val(i.attr('defaultValue'));
-
- if (i.val() == '') {
- i.addClass('polyfill-placeholder');
- i.val(i.attr('placeholder'));
- }
-
- break;
-
- default:
- i.val(i.attr('defaultValue'));
- break;
-
- }
- });
-
- });
-
- return $this;
-
- };
-
- /**
- * Moves elements to/from the first positions of their respective parents.
- * @param {jQuery} $elements Elements (or selector) to move.
- * @param {bool} condition If true, moves elements to the top. Otherwise, moves elements back to their original locations.
- */
- $.prioritize = function($elements, condition) {
-
- var key = '__prioritize';
-
- // Expand $elements if it's not already a jQuery object.
- if (typeof $elements != 'jQuery')
- $elements = $($elements);
-
- // Step through elements.
- $elements.each(function() {
-
- var $e = $(this), $p,
- $parent = $e.parent();
-
- // No parent? Bail.
- if ($parent.length == 0)
- return;
-
- // Not moved? Move it.
- if (!$e.data(key)) {
-
- // Condition is false? Bail.
- if (!condition)
- return;
-
- // Get placeholder (which will serve as our point of reference for when this element needs to move back).
- $p = $e.prev();
-
- // Couldn't find anything? Means this element's already at the top, so bail.
- if ($p.length == 0)
- return;
-
- // Move element to top of parent.
- $e.prependTo($parent);
-
- // Mark element as moved.
- $e.data(key, $p);
-
- }
-
- // Moved already?
- else {
-
- // Condition is true? Bail.
- if (condition)
- return;
-
- $p = $e.data(key);
-
- // Move element back to its original location (using our placeholder).
- $e.insertAfter($p);
-
- // Unmark element as moved.
- $e.removeData(key);
-
- }
-
- });
-
- };
-
-})(jQuery);
\ No newline at end of file
diff --git a/GiphyTV/assets/sass/base/_page.scss b/assets/sass/base/_page.scss
similarity index 100%
rename from GiphyTV/assets/sass/base/_page.scss
rename to assets/sass/base/_page.scss
diff --git a/GiphyTV/assets/sass/base/_typography.scss b/assets/sass/base/_typography.scss
similarity index 100%
rename from GiphyTV/assets/sass/base/_typography.scss
rename to assets/sass/base/_typography.scss
diff --git a/GiphyTV/assets/sass/components/_button.scss b/assets/sass/components/_button.scss
similarity index 100%
rename from GiphyTV/assets/sass/components/_button.scss
rename to assets/sass/components/_button.scss
diff --git a/GiphyTV/assets/sass/components/_form.scss b/assets/sass/components/_form.scss
similarity index 100%
rename from GiphyTV/assets/sass/components/_form.scss
rename to assets/sass/components/_form.scss
diff --git a/GiphyTV/assets/sass/components/_icon.scss b/assets/sass/components/_icon.scss
similarity index 100%
rename from GiphyTV/assets/sass/components/_icon.scss
rename to assets/sass/components/_icon.scss
diff --git a/GiphyTV/assets/sass/components/_list.scss b/assets/sass/components/_list.scss
similarity index 100%
rename from GiphyTV/assets/sass/components/_list.scss
rename to assets/sass/components/_list.scss
diff --git a/assets/sass/ie8.scss b/assets/sass/ie8.scss
index b6b04d4..971508a 100644
--- a/assets/sass/ie8.scss
+++ b/assets/sass/ie8.scss
@@ -4,243 +4,13 @@
@import 'libs/skel';
/*
- Photon by HTML5 UP
+ Lens by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/
-// Vars
+/* Viewer */
- $ie-palette-border: #ccc;
- $ie-palette-border-bg: transparent;
- $ie-palette-border2: #ccc;
- $ie-palette-border2-bg: transparent;
- $ie-palette-dark-bg: #666666;
- $ie-palette-dark-fg-bold: #ffffff;
- $ie-palette-dark-fg: #ffffff;
- $ie-palette-dark-fg-light: #ffffff;
- $ie-palette-dark-border: #ffffff;
- $ie-palette-dark-border-bg: transparent;
- $ie-palette-dark-border2: #ffffff;
- $ie-palette-dark-border2-bg: transparent;
-
-/* Basic */
-
- hr {
- border-bottom: solid 1px $ie-palette-border;
- }
-
- blockquote {
- border-left: solid 4px $ie-palette-border;
- }
-
- code {
- border: solid 1px $ie-palette-border;
- }
-
-/* Section/Article */
-
- header {
- &.major {
- &:after {
- background: $ie-palette-border;
- }
- }
- }
-
-/* Form */
-
- input[type="text"],
- input[type="password"],
- input[type="email"],
- select,
- textarea {
- -ms-behavior: url('assets/js/ie/PIE.htc');
- border: solid 1px $ie-palette-border;
- position: relative;
- }
-
-/* List */
-
- ul {
- &.alt {
- li {
- border-top: solid 1px $ie-palette-border;
- }
- }
-
- &.major-icons {
- li {
- .icon {
- -ms-behavior: url('assets/js/ie/PIE.htc');
- border: solid 1px $ie-palette-border;
- position: relative;
- }
- }
- }
- }
-
-/* Table */
-
- table {
- thead {
- border-bottom: solid 1px $ie-palette-border;
- }
-
- tfoot {
- border-top: solid 1px $ie-palette-border;
- }
-
- &.alt {
- tbody {
- tr {
- td {
- border: solid 1px $ie-palette-border;
- border-left-width: 0;
- border-top-width: 0;
- }
- }
- }
- }
- }
-
-/* Button */
-
- input[type="submit"],
- input[type="reset"],
- input[type="button"],
- button,
- .button {
- -ms-behavior: url('assets/js/ie/PIE.htc');
- border: solid 1px $ie-palette-border;
- position: relative;
- }
-
-/* Image */
-
- .image {
- -ms-behavior: url('assets/js/ie/PIE.htc');
-
- img {
- -ms-behavior: url('assets/js/ie/PIE.htc');
- position: relative;
- }
- }
-
-// Dark (mixin)
-
- @mixin dark($ie-palette-this-bg: $ie-palette-dark-bg) {
- background-color: $ie-palette-this-bg;
- color: $ie-palette-dark-fg;
-
- a {
- border-bottom-color: $ie-palette-dark-fg;
-
- &:hover {
- color: $ie-palette-dark-fg-bold;
- }
- }
-
- h1, h2, h3, h4, h5, h6, strong, b {
- color: $ie-palette-dark-fg-bold;
- }
-
- header {
- p {
- color: $ie-palette-dark-fg-bold;
- }
-
- &.major {
- &:after {
- background: $ie-palette-dark-border;
- }
- }
- }
-
- input[type="submit"],
- input[type="reset"],
- input[type="button"],
- button,
- .button {
- border: solid 1px $ie-palette-dark-border !important;
- color: $ie-palette-dark-fg-bold !important;
-
- &:hover {
- background-color: $ie-palette-dark-border-bg;
- }
-
- &:active {
- background-color: $ie-palette-dark-border2-bg;
- }
-
- &.special {
- background-color: $ie-palette-dark-fg-bold;
- border: solid 1px $ie-palette-dark-border !important;
- color: $ie-palette-this-bg !important;
-
- &:hover {
- background-color: $ie-palette-dark-border-bg !important;
- color: $ie-palette-dark-fg-bold !important;
- }
-
- &:active {
- background-color: $ie-palette-dark-border2-bg !important;
- }
- }
- }
-
- ul {
- &.major-icons {
- li {
- .icon {
- border-color: $ie-palette-dark-border;
- }
- }
- }
- }
-
- .icon {
- &.major {
- color: $ie-palette-dark-fg-bold;
- }
- }
- }
-
-/* Main */
-
- .main {
- &.style2 {
- @include dark(#333);
- -ms-behavior: url('assets/js/ie/backgroundsize.min.htc');
- background-image: url('../../images/header.jpg');
- background-size: cover;
- position: relative;
-
- &:before {
- background-image: url('images/overlay1.png');
- content: '';
- height: 100%;
- left: 0;
- position: absolute;
- top: 0;
- width: 100%;
- }
-
- > * {
- position: relative;
- z-index: 1;
- }
- }
- }
-
-/* Header */
-
- #header {
- @include dark(#4686a0);
- }
-
-/* Footer */
-
- #footer {
- @include dark(#4686a0);
+ #viewer {
+ width: 100%;
}
\ No newline at end of file
diff --git a/assets/sass/ie9.scss b/assets/sass/ie9.scss
index f991ca5..bdf68d9 100644
--- a/assets/sass/ie9.scss
+++ b/assets/sass/ie9.scss
@@ -4,63 +4,39 @@
@import 'libs/skel';
/*
- Photon by HTML5 UP
+ Lens by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/
-/* Header */
+/* Thumbnails */
- #header {
- $from: _palette(accent3-alt);
- $to: _palette(accent6-alt);
-
- background-image: none;
- filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#{$from}", endColorStr="#{$to}", GradientType=1);
- position: relative;
-
- &:before {
- background-image: url('images/overlay2.png'), url('images/overlay3.svg');
- background-position: top left, center center;
- background-size: auto, cover;
+ #thumbnails {
+ &:after {
content: '';
- height: 100%;
- left: 0;
- position: absolute;
- top: 0;
- width: 100%;
+ display: block;
+ clear: both;
}
- > * {
- position: relative;
- z-index: 1;
+ article {
+ float: left;
}
}
-/* Footer */
+/* Viewer */
- #footer {
- $from: _palette(accent6-alt);
- $to: _palette(accent3-alt);
+ #viewer {
+ .inner {
+ box-shadow: inset 0 0 9em 2em rgba(16,16,16,0.2);
- background-image: none;
- filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr="#{$from}", endColorStr="#{$to}", GradientType=1);
- position: relative;
-
- &:before {
- background-image: url('images/overlay2.png'), url('images/overlay4.svg');
- background-position: top left, center center;
- background-size: auto, cover;
- content: '';
- height: 100%;
- left: 0;
- position: absolute;
- top: 0;
- width: 100%;
+ &:before {
+ display: none;
+ }
}
- > * {
- position: relative;
- z-index: 1;
+ .slide {
+ .caption {
+ background-color: rgba(16,16,16,0.5);
+ }
}
}
\ No newline at end of file
diff --git a/GiphyTV/assets/sass/layout/_footer.scss b/assets/sass/layout/_footer.scss
similarity index 100%
rename from GiphyTV/assets/sass/layout/_footer.scss
rename to assets/sass/layout/_footer.scss
diff --git a/GiphyTV/assets/sass/layout/_header.scss b/assets/sass/layout/_header.scss
similarity index 100%
rename from GiphyTV/assets/sass/layout/_header.scss
rename to assets/sass/layout/_header.scss
diff --git a/GiphyTV/assets/sass/layout/_main.scss b/assets/sass/layout/_main.scss
similarity index 100%
rename from GiphyTV/assets/sass/layout/_main.scss
rename to assets/sass/layout/_main.scss
diff --git a/GiphyTV/assets/sass/layout/_thumbnails.scss b/assets/sass/layout/_thumbnails.scss
similarity index 100%
rename from GiphyTV/assets/sass/layout/_thumbnails.scss
rename to assets/sass/layout/_thumbnails.scss
diff --git a/GiphyTV/assets/sass/layout/_viewer.scss b/assets/sass/layout/_viewer.scss
similarity index 100%
rename from GiphyTV/assets/sass/layout/_viewer.scss
rename to assets/sass/layout/_viewer.scss
diff --git a/assets/sass/libs/_vars.scss b/assets/sass/libs/_vars.scss
index 24fb74a..cec5f7a 100644
--- a/assets/sass/libs/_vars.scss
+++ b/assets/sass/libs/_vars.scss
@@ -1,59 +1,45 @@
// Misc.
$misc: (
- z-index-base: 10000
+ z-index-base: 10000,
+ main-side: right,
+ main-align: right,
+ thumbnails-per-row: 2
);
// Duration.
$duration: (
- transition: 0.2s
+ transition: 0.25s,
+ layout: 0.75s,
+ layout-alt: 0.5s,
+ slide: 0.5s,
+ spinner: 1s
);
// Size.
$size: (
border-radius: 4px,
+ border-width: 1px,
element-height: 2.75em,
- element-margin: 2em
+ element-margin: 1.25em,
+ main: 22.5em,
+ main-alt: 19em
);
// Font.
$font: (
- family: ('Source Sans Pro', Helvetica, sans-serif),
+ family: ('Roboto', Helvetica, sans-serif),
family-fixed: ('Courier New', monospace),
- weight: 300,
- weight-bold: 400
+ weight: 400,
+ weight-bold: 700
);
// Palette.
$palette: (
+ page-bg: #101010,
bg: #fff,
- fg: #666,
+ fg: #aaa,
fg-bold: #555,
- fg-light: #999,
- border: rgba(144,144,144,0.5),
- border-bg: rgba(144,144,144,0.075),
- border2: rgba(144,144,144,0.75),
- border2-bg: rgba(144,144,144,0.2),
- accent1: #c3e895,
- accent2: #8addaa,
- accent3: #6bd4c8,
- accent4: #57aed3,
- accent5: #4a87d3,
- accent6: #6b88e6,
- accent1-alt: desaturate(darken(#c3e895, 15), 20),
- accent2-alt: desaturate(darken(#8addaa, 15), 20),
- accent3-alt: desaturate(darken(#6bd4c8, 15), 20),
- accent4-alt: desaturate(darken(#57aed3, 15), 20),
- accent5-alt: desaturate(darken(#4a87d3, 15), 20),
- accent6-alt: desaturate(darken(#6b88e6, 15), 20),
-
- dark: (
- bg: #666666,
- fg-bold: #ffffff,
- fg: rgba(255,255,255,0.75),
- fg-light: rgba(255,255,255,0.5),
- border: #ffffff,
- border-bg: rgba(255,255,255,0.125),
- border2: rgba(255,255,255,0.75),
- border2-bg: rgba(255,255,255,0.25)
- )
+ fg-light: #ccc,
+ border: #ccc,
+ accent: #00D3B7
);
\ No newline at end of file
diff --git a/assets/sass/main.scss b/assets/sass/main.scss
index ccf4827..7ab5b44 100644
--- a/assets/sass/main.scss
+++ b/assets/sass/main.scss
@@ -1,1408 +1,45 @@
@import 'libs/vars';
@import 'libs/functions';
@import 'libs/mixins';
-@import url('font-awesome.min.css');
-@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,400italic");
+@import 'libs/skel';
+@import 'font-awesome.min.css';
+@import url("https://fonts.googleapis.com/css?family=Roboto:400,700");
/*
- Photon by HTML5 UP
+ Lens by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/
- @import "libs/skel";
-
@include skel-breakpoints((
xlarge: '(max-width: 1680px)',
- large: '(max-width: 1140px)',
+ large: '(max-width: 1280px)',
medium: '(max-width: 980px)',
small: '(max-width: 736px)',
- xsmall: '(max-width: 480px)',
- xxsmall: '(max-width: 320px)'
+ xsmall: '(max-width: 480px)'
));
@include skel-layout((
reset: 'full',
- boxModel: 'border',
- grid: ( gutters: 2em ),
- conditionals: true,
- containers: 60em,
- breakpoints: (
- large: (
- containers: 90%,
- grid: (
- gutters: 1.5em
- ),
- ),
- medium: (
- containers: (100%, true),
- )
- )
+ boxModel: 'border'
));
-/* Basic */
-
- body {
- background: _palette(bg);
-
- &.is-loading {
- *, *:before, *:after {
- @include vendor('animation', 'none !important');
- @include vendor('transition', 'none !important');
- }
- }
- }
-
- body, input, select, textarea {
- color: _palette(fg);
- font-family: _font(family);
- font-size: 16pt;
- font-weight: _font(weight);
- line-height: 1.65em;
- }
-
- a {
- @include vendor('transition', ('color #{_duration(transition)} ease-in-out', 'border-color #{_duration(transition)} ease-in-out'));
- border-bottom: dotted 1px _palette(fg);
- color: inherit;
- text-decoration: none;
-
- &:hover {
- border-bottom-color: transparent !important;
- color: _palette(accent3);
- }
- }
-
- strong, b {
- color: _palette(fg-bold);
- font-weight: _font(weight-bold);
- }
-
- em, i {
- font-style: italic;
- }
-
- p {
- margin: 0 0 _size(element-margin) 0;
- }
-
- h1, h2, h3, h4, h5, h6 {
- color: _palette(fg-bold);
- line-height: 1em;
- margin: 0 0 (_size(element-margin) * 0.5) 0;
-
- a {
- color: inherit;
- text-decoration: none;
- }
- }
-
- h1 {
- font-size: 2.25em;
- line-height: 1.35em;
- }
-
- h2 {
- font-size: 2em;
- line-height: 1.35em;
- }
-
- h3 {
- font-size: 1.35em;
- line-height: 1.5em;
- }
-
- h4 {
- font-size: 1.25em;
- line-height: 1.5em;
- }
-
- h5 {
- font-size: 0.9em;
- line-height: 1.5em;
- }
-
- h6 {
- font-size: 0.7em;
- line-height: 1.5em;
- }
-
- sub {
- font-size: 0.8em;
- position: relative;
- top: 0.5em;
- }
-
- sup {
- font-size: 0.8em;
- position: relative;
- top: -0.5em;
- }
-
- hr {
- border: 0;
- border-bottom: solid 1px _palette(border);
-
- // This is the *only* instance where we need to rely on margin collapse.
- margin: _size(element-margin) 0;
-
- &.major {
- margin: (_size(element-margin) * 1.5) 0;
- }
- }
-
- blockquote {
- border-left: solid 4px _palette(border);
- font-style: italic;
- margin: 0 0 _size(element-margin) 0;
- padding: 0.5em 0 0.5em 2em;
- }
-
- code {
- background: _palette(border-bg);
- border-radius: _size(border-radius);
- border: solid 1px _palette(border);
- font-family: _font(family-fixed);
- font-size: 0.9em;
- margin: 0 0.25em;
- padding: 0.25em 0.65em;
- }
-
- pre {
- -webkit-overflow-scrolling: touch;
- font-family: _font(family-fixed);
- font-size: 0.9em;
- margin: 0 0 _size(element-margin) 0;
-
- code {
- display: block;
- line-height: 1.75em;
- padding: 1em 1.5em;
- overflow-x: auto;
- }
- }
-
- .align-left {
- text-align: left;
- }
-
- .align-center {
- text-align: center;
- }
-
- .align-right {
- text-align: right;
- }
-
-/* Section/Article */
-
- section, article {
- &.special {
- text-align: center;
- }
- }
-
- header {
- p {
- color: _palette(fg-light);
- margin: 0 0 (_size(element-margin) * 0.75) 0;
- position: relative;
- }
-
- h2 + p {
- font-size: 1.25em;
- line-height: 1.5em;
- margin-top: (_size(element-margin) * -0.5);
- }
-
- h3 + p {
- font-size: 1.1em;
- line-height: 1.5em;
- margin-top: (_size(element-margin) * -0.4);
- }
-
- h4 + p,
- h5 + p,
- h6 + p {
- font-size: 0.9em;
- line-height: 1.5em;
- margin-top: (_size(element-margin) * -0.3);
- }
-
- &.major {
- margin: 0 0 (_size(element-margin) * 0.5) 0;
-
- &:after {
- background: _palette(border);
- content: '';
- display: inline-block;
- height: 1px;
- margin-top: (_size(element-margin) * 0.75);
- width: 6em;
- }
-
- h2, h3, h4, h5, h6 {
- margin: 0;
- }
-
- p {
- margin: (_size(element-margin) * 0.35) 0 0 0;
- }
- }
-
- &.special {
- text-align: center;
- }
- }
-
-/* Form */
-
- form {
- margin: 0 0 _size(element-margin) 0;
- }
-
- label {
- color: _palette(fg-bold);
- display: block;
- font-size: 0.9em;
- font-weight: _font(weight-bold);
- margin: 0 0 (_size(element-margin) * 0.5) 0;
- }
-
- input[type="text"],
- input[type="password"],
- input[type="email"],
- select,
- textarea {
- @include vendor('appearance', 'none');
- background: _palette(border-bg);
- border-radius: _size(border-radius);
- border: none;
- border: solid 1px _palette(border);
- color: inherit;
- display: block;
- outline: 0;
- padding: 0 1em;
- text-decoration: none;
- width: 100%;
-
- &:invalid {
- box-shadow: none;
- }
-
- &:focus {
- border-color: _palette(accent3);
- }
- }
-
- .select-wrapper {
- @include icon;
- display: block;
- position: relative;
-
- &:before {
- color: _palette(border);
- content: '\f078';
- display: block;
- height: _size(element-height);
- line-height: _size(element-height);
- pointer-events: none;
- position: absolute;
- right: 0;
- text-align: center;
- top: 0;
- width: _size(element-height);
- }
-
- select::-ms-expand {
- display: none;
- }
- }
-
- input[type="text"],
- input[type="password"],
- input[type="email"],
- select {
- height: _size(element-height);
- }
-
- textarea {
- padding: 0.75em 1em;
- }
-
- input[type="checkbox"],
- input[type="radio"], {
- @include vendor('appearance', 'none');
- display: block;
- float: left;
- margin-right: -2em;
- opacity: 0;
- width: 1em;
- z-index: -1;
-
- & + label {
- @include icon;
- color: _palette(fg);
- cursor: pointer;
- display: inline-block;
- font-size: 1em;
- font-weight: _font(weight);
- padding-left: (_size(element-height) * 0.6) + 0.75em;
- padding-right: 0.75em;
- position: relative;
-
- &:before {
- background: _palette(border-bg);
- border-radius: _size(border-radius);
- border: solid 1px _palette(border);
- content: '';
- display: inline-block;
- height: (_size(element-height) * 0.6);
- left: 0;
- line-height: (_size(element-height) * 0.575);
- position: absolute;
- text-align: center;
- top: 0;
- width: (_size(element-height) * 0.6);
- }
- }
-
- &:checked + label {
- &:before {
- background: _palette(dark, bg);
- border-color: _palette(dark, bg);
- color: _palette(dark, fg-bold);
- content: '\f00c';
- }
- }
-
- &:focus + label {
- &:before {
- border-color: _palette(accent3);
- }
- }
- }
-
- input[type="checkbox"] {
- & + label {
- &:before {
- border-radius: _size(border-radius);
- }
- }
- }
-
- input[type="radio"] {
- & + label {
- &:before {
- border-radius: 100%;
- }
- }
- }
-
- ::-webkit-input-placeholder {
- color: _palette(fg-light) !important;
- opacity: 1.0;
- }
-
- :-moz-placeholder {
- color: _palette(fg-light) !important;
- opacity: 1.0;
- }
-
- ::-moz-placeholder {
- color: _palette(fg-light) !important;
- opacity: 1.0;
- }
-
- :-ms-input-placeholder {
- color: _palette(fg-light) !important;
- opacity: 1.0;
- }
-
- .formerize-placeholder {
- color: _palette(fg-light) !important;
- opacity: 1.0;
- }
-
-/* Box */
-
- .box {
- border-radius: _size(border-radius);
- border: solid 1px _palette(border);
- margin-bottom: _size(element-margin);
- padding: 1.5em;
-
- > :last-child,
- > :last-child > :last-child,
- > :last-child > :last-child > :last-child {
- margin-bottom: 0;
- }
-
- &.alt {
- border: 0;
- border-radius: 0;
- padding: 0;
- }
- }
-
-/* Icon */
-
- .icon {
- @include icon;
- border-bottom: none;
- position: relative;
-
- > .label {
- display: none;
- }
-
- &.style1 { &:before { color: _palette(accent1); } }
- &.style2 { &:before { color: _palette(accent2); } }
- &.style3 { &:before { color: _palette(accent3); } }
- &.style4 { &:before { color: _palette(accent4); } }
- &.style5 { &:before { color: _palette(accent5); } }
- &.style6 { &:before { color: _palette(accent6); } }
-
- &.major {
- @include icon;
- color: _palette(fg-bold);
- cursor: default;
- display: inline-block;
- margin: 0 0 (_size(element-margin) * 0.75) 0;
-
- &:before {
- font-size: 4em;
- line-height: 1em;
- }
- }
- }
-
-/* Image */
-
- .image {
- border-radius: _size(border-radius);
- border: 0;
- display: inline-block;
- position: relative;
-
- img {
- border-radius: _size(border-radius);
- display: block;
- }
-
- &.left {
- float: left;
- padding: 0 1.5em 1em 0;
- top: 0.25em;
- }
-
- &.right {
- float: right;
- padding: 0 0 1em 1.5em;
- top: 0.25em;
- }
-
- &.left,
- &.right {
- max-width: 40%;
-
- img {
- width: 100%;
- }
- }
-
- &.fit {
- display: block;
- margin: 0 0 _size(element-margin) 0;
- width: 100%;
-
- img {
- width: 100%;
- }
- }
- }
-
-/* List */
-
- ol {
- list-style: decimal;
- margin: 0 0 _size(element-margin) 0;
- padding-left: 1.25em;
-
- li {
- padding-left: 0.25em;
- }
- }
-
- ul {
- list-style: disc;
- margin: 0 0 _size(element-margin) 0;
- padding-left: 1em;
-
- li {
- padding-left: 0.5em;
- }
-
- &.alt {
- list-style: none;
- padding-left: 0;
-
- li {
- border-top: solid 1px _palette(border);
- padding: 0.5em 0;
-
- &:first-child {
- border-top: 0;
- padding-top: 0;
- }
- }
- }
-
- &.icons {
- cursor: default;
- list-style: none;
- padding-left: 0;
-
- li {
- display: inline-block;
- padding: 0 1.25em 0 0;
-
- &:last-child {
- padding-right: 0;
- }
-
- .icon {
- &:before {
- font-size: 1.5em;
- }
- }
- }
- }
-
- &.major-icons {
- list-style: none;
- padding-left: 0;
-
- li {
- display: inline-block;
- padding: 2.5em;
- text-align: center;
-
- .icon {
- @include vendor('transform', 'rotate(45deg)');
- border-radius: _size(border-radius);
- border: solid 1px _palette(border);
- display: inline-block;
- height: 8em;
- line-height: 8em;
- margin: 0;
- text-align: center;
- width: 8em;
-
- &:before {
- @include vendor('transform', 'rotate(-45deg)');
- display: inline-block;
- line-height: inherit;
- }
- }
- }
- }
-
- &.actions {
- cursor: default;
- list-style: none;
- padding-left: 0;
-
- li {
- display: inline-block;
- padding: 0 (_size(element-margin) * 0.5) 0 0;
- vertical-align: middle;
-
- &:last-child {
- padding-right: 0;
- }
- }
-
- &.small {
- li {
- padding: 0 (_size(element-margin) * 0.25) 0 0;
- }
- }
-
- &.vertical {
- li {
- display: block;
- padding: (_size(element-margin) * 0.5) 0 0 0;
-
- &:first-child {
- padding-top: 0;
- }
-
- > * {
- margin-bottom: 0;
- }
- }
-
- &.small {
- li {
- padding: (_size(element-margin) * 0.25) 0 0 0;
-
- &:first-child {
- padding-top: 0;
- }
- }
- }
- }
-
- &.uniform {
- li {
- > * {
- min-width: 12em;
- }
- }
- }
-
- &.fit {
- display: table;
- margin-left: (_size(element-margin) * -0.5);
- padding: 0;
- table-layout: fixed;
- width: calc(100% + #{(_size(element-margin) * 0.5)});
-
- li {
- display: table-cell;
- padding: 0 0 0 (_size(element-margin) * 0.5);
-
- > * {
- margin-bottom: 0;
- }
- }
-
- &.small {
- margin-left: (_size(element-margin) * -0.25);
- width: calc(100% + #{(_size(element-margin) * 0.25)});
-
- li {
- padding: 0 0 0 (_size(element-margin) * 0.25);
- }
- }
- }
- }
- }
-
- dl {
- margin: 0 0 _size(element-margin) 0;
- }
-
-/* Table */
-
- .table-wrapper {
- -webkit-overflow-scrolling: touch;
- overflow-x: auto;
- }
-
- table {
- margin: 0 0 _size(element-margin) 0;
- width: 100%;
-
- tbody {
- tr {
- border-left: 0;
- border-right: 0;
-
- &:nth-child(2n + 1) {
- background-color: _palette(border-bg);
- }
- }
- }
-
- td {
- padding: 0.75em 0.75em;
- }
-
- th {
- color: _palette(fg-bold);
- font-size: 0.9em;
- font-weight: _font(weight-bold);
- padding: 0 0.75em 0.75em 0.75em;
- text-align: left;
- }
-
- thead {
- border-bottom: solid 1px _palette(border);
- }
-
- tfoot {
- border-top: solid 1px _palette(border);
- }
-
- &.alt {
- border-collapse: separate;
-
- tbody {
- tr {
- td {
- border: solid 1px _palette(border);
- border-left-width: 0;
- border-top-width: 0;
-
- &:first-child {
- border-left-width: 1px;
- }
- }
-
- &:first-child {
- td {
- border-top-width: 1px;
- }
- }
- }
- }
-
- thead {
- border-bottom: 0;
- }
-
- tfoot {
- border-top: 0;
- }
- }
- }
-
-/* Button */
-
- input[type="submit"],
- input[type="reset"],
- input[type="button"],
- button,
- .button {
- @include vendor('appearance', 'none');
- @include vendor('transition', ('background-color #{_duration(transition)} ease-in-out', 'color #{_duration(transition)} ease-in-out'));
- background-color: transparent;
- border-radius: _size(border-radius);
- border: 0;
- box-shadow: inset 0 0 0 1px _palette(border);
- color: _palette(fg-bold) !important;
- cursor: pointer;
- display: inline-block;
- font-size: 0.9em;
- font-weight: _font(weight-bold);
- height: 2.75em;
- letter-spacing: 0.125em;
- line-height: 2.75em;
- padding: 0 2em;
- text-align: center;
- text-decoration: none;
- text-indent: 0.125em;
- text-transform: uppercase;
- white-space: nowrap;
-
- &:hover {
- background-color: _palette(border-bg);
- }
-
- &:active {
- background-color: _palette(border2-bg);
- }
-
- &.icon {
- padding-left: 1.35em;
-
- &:before {
- margin-right: 0.5em;
- }
- }
-
- &.fit {
- display: block;
- margin: 0 0 (_size(element-margin) * 0.5) 0;
- width: 100%;
- }
-
- &.small {
- font-size: 0.7em;
- }
-
- &.big {
- font-size: 1.25em;
- }
-
- &.special {
- background-color: _palette(fg-bold);
- box-shadow: none !important;
- color: _palette(bg) !important;
-
- &:hover {
- background-color: lighten(_palette(fg-bold), 5);
- }
-
- &:active {
- background-color: darken(_palette(fg-bold), 5);
- }
- }
-
- &.disabled,
- &:disabled {
- cursor: default;
- opacity: 0.25;
- }
- }
-
-// Dark (mixin)
-
- @mixin dark($color-this-bg: _palette(dark, bg)) {
- background-color: $color-this-bg;
- color: _palette(dark, fg);
-
- a {
- border-bottom-color: transparentize(_palette(dark, fg), 0.25);
-
- &:hover {
- color: _palette(dark, fg-bold);
- }
- }
-
- h1, h2, h3, h4, h5, h6, strong, b {
- color: _palette(dark, fg-bold);
- }
-
- header {
- p {
- color: _palette(dark, fg-bold);
- }
-
- &.major {
- &:after {
- background: _palette(dark, border);
- }
- }
- }
-
- input[type="submit"],
- input[type="reset"],
- input[type="button"],
- button,
- .button {
- box-shadow: inset 0 0 0 1px _palette(dark, border);
- color: _palette(dark, fg-bold) !important;
-
- &:hover {
- background-color: _palette(dark, border-bg);
- }
-
- &:active {
- background-color: _palette(dark, border2-bg);
- }
-
- &.special {
- background-color: _palette(dark, fg-bold);
- box-shadow: inset 0 0 0 1px _palette(dark, border) !important;
- color: $color-this-bg !important;
-
- &:hover {
- background-color: _palette(dark, border-bg) !important;
- color: _palette(dark, fg-bold) !important;
- }
-
- &:active {
- background-color: _palette(dark, border2-bg) !important;
- }
- }
- }
-
- ul {
- &.major-icons {
- li {
- .icon {
- border-color: _palette(dark, border);
- }
- }
- }
- }
-
- .icon {
- &.major {
- color: _palette(dark, fg-bold);
- }
- }
- }
-
-/* Main */
-
- .main {
- @include padding(6em, 0);
-
- &.style1 {
- background: _palette(bg);
- }
-
- &.style2 {
- @include dark(#333);
- background-attachment: fixed, fixed;
- background-image: url('images/overlay1.png'), url('../../images/header.jpg');
- background-size: auto, cover;
- }
- }
-
-/* Header */
-
- #header {
- @include padding(9em, 0, (0,0,_size(element-margin),0));
- @include dark(#4686a0);
- background-attachment: fixed, fixed, fixed;
- background-image: url('images/overlay2.png'), url('images/overlay3.svg'), linear-gradient(45deg, _palette(accent1-alt) 5%, _palette(accent3-alt) 30%, _palette(accent6-alt));
- background-position: top left, center center, center center;
- background-size: auto, cover, cover;
- overflow: hidden;
- position: relative;
- text-align: center;
-
- h1 {
- margin: 0;
- }
-
- p {
- margin: (_size(element-margin) * 0.5) 0 0 0;
- }
-
- .actions {
- margin: (_size(element-margin) * 1.25) 0 0 0;
- position: relative;
-
- &:after {
- background: _palette(dark, border);
- content: '';
- height: 100vh;
- left: 50%;
- position: absolute;
- top: 100%;
- width: 1px;
- }
- }
-
- .inner {
- @include vendor('transition', ('transform 1.5s ease', 'opacity 2s ease'));
- @include vendor('transition-delay', '0.25s');
- @include vendor('transform', 'scale(1)');
- opacity: 1;
- position: relative;
- z-index: 1;
-
- .actions {
- @include vendor('transition', 'transform 1.25s ease');
- @include vendor('transition-delay', '1s');
- @include vendor('transform', 'translateY(0)');
- opacity: 1;
- }
- }
-
- &:after {
- @include vendor('transition', 'opacity 1s ease');
- background-image: linear-gradient(45deg, _palette(accent3-alt), _palette(accent6-alt));
- content: '';
- height: 100%;
- left: 0;
- opacity: 0;
- position: absolute;
- top: 0;
- width: 100%;
- }
- }
-
- body.is-loading {
- #header {
- .inner {
- @include vendor('transform', 'scale(1.05)');
- opacity: 0;
-
- .actions {
- @include vendor('transform', 'translateY(30em)');
- opacity: 0;
- }
- }
-
- &:after {
- opacity: 1;
- }
- }
- }
-
-/* Footer */
-
- #footer {
- @include padding(6em, 0, (0,0,_size(element-margin),0));
- @include dark(#4686a0);
- background-attachment: fixed, fixed, fixed;
- background-image: url('images/overlay2.png'), url('images/overlay4.svg'), linear-gradient(45deg, _palette(accent6-alt), _palette(accent3-alt) 50%, _palette(accent1-alt) 95%);
- background-position: top left, center center, center center;
- background-size: auto, cover, cover;
- text-align: center;
-
- .icons {
- margin: 0;
- }
-
- .copyright {
- font-size: 0.8em;
- list-style: none;
- margin: _size(element-margin) 0 0 0;
- padding: 0;
-
- li {
- border-left: solid 1px;
- display: inline-block;
- line-height: 1em;
- margin-left: 1em;
- padding: 0 0 0 1em;
-
- &:first-child {
- border-left: 0;
- margin-left: 0;
- padding: 0;
- }
- }
- }
- }
-
-/* XLarge */
-
- @include breakpoint(xlarge) {
-
- /* Basic */
-
- body, input, select, textarea {
- font-size: 14pt;
- }
-
- /* Header */
-
- #header {
- @include padding(6em, 0, (0,0,_size(element-margin),0));
- }
-
- }
-
-/* Large */
-
- @include breakpoint(large) {
-
- /* Basic */
-
- body, input, select, textarea {
- font-size: 13pt;
- }
-
- h1, h2, h3, h4, h5, h6 {
- br {
- display: none;
- }
- }
-
- /* List */
-
- ul {
- &.major-icons {
- li {
- padding: 2em;
-
- .icon {
- height: 8em;
- line-height: 8em;
- width: 8em;
- }
- }
- }
- }
-
- /* Main */
-
- .main {
- @include padding(4em, 0);
-
- &.style2 {
- background-attachment: scroll;
- }
- }
-
- /* Header */
-
- #header {
- @include padding(5em, 0, (0,0,_size(element-margin),0));
- background-attachment: scroll;
-
- br {
- display: inline;
- }
- }
-
- /* Footer */
-
- #footer {
- @include padding(4em, 0, (0,0,_size(element-margin),0));
- background-attachment: scroll;
- }
-
- }
-
-/* Medium */
-
- @include breakpoint(medium) {
-
- /* List */
-
- ul {
- &.major-icons {
- li {
- padding: 2em;
-
- .icon {
- height: 7em;
- line-height: 7em;
- width: 7em;
- }
- }
- }
- }
-
- /* Main */
-
- .main {
- @include padding(5em, 3em);
- }
-
- /* Header */
-
- #header {
- @include padding(8em, 3em, (0,0,_size(element-margin),0));
- }
-
- /* Footer */
-
- #footer {
- @include padding(5em, 3em, (0,0,_size(element-margin),0));
- }
-
- /* One */
-
- #one {
- text-align: center;
- }
-
- /* Two */
-
- #two {
- text-align: center;
- }
-
- }
-
-/* Small */
-
- @include breakpoint(small) {
-
- /* Basic */
-
- body, input, select, textarea {
- font-size: 12pt;
- }
-
- h1 {
- font-size: 1.75em;
- }
-
- h2 {
- font-size: 1.5em;
- }
-
- h3 {
- font-size: 1.1em;
- }
-
- h4 {
- font-size: 1em;
- }
-
- /* List */
-
- ul {
- &.major-icons {
- li {
- padding: 1.5em;
-
- .icon {
- height: 5em;
- line-height: 5em;
- width: 5em;
-
- &:before {
- font-size: 42px;
- }
- }
- }
- }
- }
-
- /* Icon */
-
- .icon {
- &.major {
- margin: 0 0 (_size(element-margin) * 0.5) 0;
- }
- }
-
- /* Button */
-
- input[type="submit"],
- input[type="reset"],
- input[type="button"],
- button,
- .button {
- height: 3em;
- line-height: 3em;
- }
-
- /* Main */
-
- .main {
- @include padding(3em, 1.5em);
- }
-
- /* Header */
-
- #header {
- @include padding(4em, 3em, (0,0,_size(element-margin),0));
-
- .actions {
- margin: _size(element-margin) 0 0 0;
- }
- }
-
- /* Footer */
-
- #footer {
- @include padding(3em, 1.5em, (0,0,_size(element-margin),0));
- }
-
- }
-
-/* XSmall */
-
- @include breakpoint(xsmall) {
-
- /* List */
-
- ul {
- &.actions {
- margin: 0 0 _size(element-margin) 0;
-
- li {
- display: block;
- padding: (_size(element-margin) * 0.5) 0 0 0;
- text-align: center;
- width: 100%;
-
- &:first-child {
- padding-top: 0;
- }
-
- > * {
- margin: 0 !important;
- width: 100%;
-
- &.icon {
- &:before {
- margin-left: -2em;
- }
- }
- }
- }
-
- &.small {
- li {
- padding: (_size(element-margin) * 0.25) 0 0 0;
-
- &:first-child {
- padding-top: 0;
- }
- }
- }
- }
- }
-
- /* Button */
-
- input[type="submit"],
- input[type="reset"],
- input[type="button"],
- .button {
- padding: 0;
- }
-
- /* Main */
-
- .main {
- @include padding(2em, 1.5em);
- }
-
- /* Header */
-
- #header {
- @include padding(4em, 2em, (0,0,_size(element-margin),0));
-
- br {
- display: none;
- }
- }
-
- /* Footer */
-
- #footer {
- @include padding(2em, 1.5em, (0,0,_size(element-margin),0));
-
- .copyright {
- margin: (_size(element-margin) * 0.75) 0 0 0;
-
- li {
- border: 0;
- display: block;
- margin: 1em 0 0 0;
- padding: 0;
-
- &:first-child {
- margin-top: 0;
- }
- }
- }
- }
-
- }
-
-/* XXSmall */
-
- @include breakpoint(xxsmall) {
-
- /* Basic */
-
- html, body {
- min-width: 320px;
- }
-
- /* Main */
-
- .main {
- @include padding(2em, 1em);
- }
+// Base.
- /* Header */
+ @import 'base/page';
+ @import 'base/typography';
- #header {
- @include padding(3em, 1em, (0,0,_size(element-margin),0));
- }
+// Component.
- /* Footer */
+ @import 'components/button';
+ @import 'components/form';
+ @import 'components/icon';
+ @import 'components/list';
- #footer {
- @include padding(2em, 1em, (0,0,_size(element-margin),0));
- }
+// Layout.
- }
\ No newline at end of file
+ @import 'layout/main';
+ @import 'layout/header';
+ @import 'layout/footer';
+ @import 'layout/thumbnails';
+ @import 'layout/viewer';
\ No newline at end of file
diff --git a/GiphyTV/assets/sass/noscript.scss b/assets/sass/noscript.scss
similarity index 100%
rename from GiphyTV/assets/sass/noscript.scss
rename to assets/sass/noscript.scss
diff --git a/GiphyTV/config.js b/config.js
similarity index 100%
rename from GiphyTV/config.js
rename to config.js
diff --git a/favicon/android-icon-144x144.png b/favicon/android-icon-144x144.png
index c228335..deee515 100644
Binary files a/favicon/android-icon-144x144.png and b/favicon/android-icon-144x144.png differ
diff --git a/favicon/android-icon-192x192.png b/favicon/android-icon-192x192.png
index 9f2b1a5..66077d9 100644
Binary files a/favicon/android-icon-192x192.png and b/favicon/android-icon-192x192.png differ
diff --git a/favicon/android-icon-36x36.png b/favicon/android-icon-36x36.png
index 6f55414..02ca412 100644
Binary files a/favicon/android-icon-36x36.png and b/favicon/android-icon-36x36.png differ
diff --git a/favicon/android-icon-48x48.png b/favicon/android-icon-48x48.png
index 5b11705..db64197 100644
Binary files a/favicon/android-icon-48x48.png and b/favicon/android-icon-48x48.png differ
diff --git a/favicon/android-icon-72x72.png b/favicon/android-icon-72x72.png
index 2f14533..1c89b8c 100644
Binary files a/favicon/android-icon-72x72.png and b/favicon/android-icon-72x72.png differ
diff --git a/favicon/android-icon-96x96.png b/favicon/android-icon-96x96.png
index 17bdbf2..da6bb22 100644
Binary files a/favicon/android-icon-96x96.png and b/favicon/android-icon-96x96.png differ
diff --git a/favicon/apple-icon-114x114.png b/favicon/apple-icon-114x114.png
index f785bb8..c82e1c4 100644
Binary files a/favicon/apple-icon-114x114.png and b/favicon/apple-icon-114x114.png differ
diff --git a/favicon/apple-icon-120x120.png b/favicon/apple-icon-120x120.png
index e056d46..e01935e 100644
Binary files a/favicon/apple-icon-120x120.png and b/favicon/apple-icon-120x120.png differ
diff --git a/favicon/apple-icon-144x144.png b/favicon/apple-icon-144x144.png
index c228335..deee515 100644
Binary files a/favicon/apple-icon-144x144.png and b/favicon/apple-icon-144x144.png differ
diff --git a/favicon/apple-icon-152x152.png b/favicon/apple-icon-152x152.png
index 9771d22..55d9a04 100644
Binary files a/favicon/apple-icon-152x152.png and b/favicon/apple-icon-152x152.png differ
diff --git a/favicon/apple-icon-180x180.png b/favicon/apple-icon-180x180.png
index 2b1b82b..d82b278 100644
Binary files a/favicon/apple-icon-180x180.png and b/favicon/apple-icon-180x180.png differ
diff --git a/favicon/apple-icon-57x57.png b/favicon/apple-icon-57x57.png
index 33fe20b..857d318 100644
Binary files a/favicon/apple-icon-57x57.png and b/favicon/apple-icon-57x57.png differ
diff --git a/favicon/apple-icon-60x60.png b/favicon/apple-icon-60x60.png
index 9e78ce4..39113ec 100644
Binary files a/favicon/apple-icon-60x60.png and b/favicon/apple-icon-60x60.png differ
diff --git a/favicon/apple-icon-72x72.png b/favicon/apple-icon-72x72.png
index 2f14533..1c89b8c 100644
Binary files a/favicon/apple-icon-72x72.png and b/favicon/apple-icon-72x72.png differ
diff --git a/favicon/apple-icon-76x76.png b/favicon/apple-icon-76x76.png
index 5a93e7e..7426898 100644
Binary files a/favicon/apple-icon-76x76.png and b/favicon/apple-icon-76x76.png differ
diff --git a/favicon/apple-icon-precomposed.png b/favicon/apple-icon-precomposed.png
index e2ad045..f18cf13 100644
Binary files a/favicon/apple-icon-precomposed.png and b/favicon/apple-icon-precomposed.png differ
diff --git a/favicon/apple-icon.png b/favicon/apple-icon.png
index e2ad045..f18cf13 100644
Binary files a/favicon/apple-icon.png and b/favicon/apple-icon.png differ
diff --git a/favicon/favicon-16x16.png b/favicon/favicon-16x16.png
index a738e4e..789ab34 100644
Binary files a/favicon/favicon-16x16.png and b/favicon/favicon-16x16.png differ
diff --git a/favicon/favicon-32x32.png b/favicon/favicon-32x32.png
index 3a103f0..3b26476 100644
Binary files a/favicon/favicon-32x32.png and b/favicon/favicon-32x32.png differ
diff --git a/favicon/favicon-96x96.png b/favicon/favicon-96x96.png
index 17bdbf2..da6bb22 100644
Binary files a/favicon/favicon-96x96.png and b/favicon/favicon-96x96.png differ
diff --git a/favicon/favicon.ico b/favicon/favicon.ico
index b2eba69..5df2089 100644
Binary files a/favicon/favicon.ico and b/favicon/favicon.ico differ
diff --git a/favicon/ms-icon-144x144.png b/favicon/ms-icon-144x144.png
index c228335..deee515 100644
Binary files a/favicon/ms-icon-144x144.png and b/favicon/ms-icon-144x144.png differ
diff --git a/favicon/ms-icon-150x150.png b/favicon/ms-icon-150x150.png
index f706c25..4c47b40 100644
Binary files a/favicon/ms-icon-150x150.png and b/favicon/ms-icon-150x150.png differ
diff --git a/favicon/ms-icon-310x310.png b/favicon/ms-icon-310x310.png
index 024e47d..8122e40 100644
Binary files a/favicon/ms-icon-310x310.png and b/favicon/ms-icon-310x310.png differ
diff --git a/favicon/ms-icon-70x70.png b/favicon/ms-icon-70x70.png
index 534e714..23e1ebd 100644
Binary files a/favicon/ms-icon-70x70.png and b/favicon/ms-icon-70x70.png differ
diff --git a/images/og.jpg b/images/og.jpg
deleted file mode 100644
index 816e463..0000000
Binary files a/images/og.jpg and /dev/null differ
diff --git a/images/Poweredby_100px-Black_VertLogo.png b/img/Poweredby_100px-Black_VertLogo.png
similarity index 100%
rename from images/Poweredby_100px-Black_VertLogo.png
rename to img/Poweredby_100px-Black_VertLogo.png
diff --git a/images/Poweredby_100px-White_VertLogo.png b/img/Poweredby_100px-White_VertLogo.png
similarity index 100%
rename from images/Poweredby_100px-White_VertLogo.png
rename to img/Poweredby_100px-White_VertLogo.png
diff --git a/GiphyTV/img/clear.gif b/img/clear.gif
similarity index 100%
rename from GiphyTV/img/clear.gif
rename to img/clear.gif
diff --git a/GiphyTV/img/giphytv_bug_white.gif b/img/giphytv_bug_white.gif
similarity index 100%
rename from GiphyTV/img/giphytv_bug_white.gif
rename to img/giphytv_bug_white.gif
diff --git a/images/simple_custom.jpg b/img/simple_custom.jpg
similarity index 100%
rename from images/simple_custom.jpg
rename to img/simple_custom.jpg
diff --git a/GiphyTV/img/splash.png b/img/splash.png
similarity index 100%
rename from GiphyTV/img/splash.png
rename to img/splash.png
diff --git a/index.html b/index.html
index 3d84281..9c5c343 100644
--- a/index.html
+++ b/index.html
@@ -1,27 +1,29 @@
- Giphy TV for everyone!
+ Run your own GiphyTV!!
+
-
+
-
+
@@ -41,85 +43,79 @@
+
-
+
-
-
-
+
+
-
- Hi, I'm GiphyTV, an independant project.
-
- Hi, I'm GiphyTV, an independant project.
- Create your own GIF powered TV channel!
- Simple to use, to custom and to deploy.
- No database needed, no PHP or complex stuff.
-
-
- Learn more -
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
-
-
-
+
+ gifUrl = '//giphy.com/gifs/' + id;
+ }).error(function(jqXHR, textStatus, e) { console.log(e); interval = setTimeout(slideshow, 10000); });
+ };
+ slideshow();
+
-
-
-
-
-
- GIF are fun!
-
-
- GIF are fun!
- Let's have fun!
- Everyone loves GIFs. Imagine a purfect world where you could download a zip, change some little simple things and create your own Giphy TV channel full of awesome GIFs anytime for any screens. I don't want to be rude, but, it's a reality now.
-
- 
-
-
- 