Removes quirky styles from sem-ui standard branch

Former-commit-id: 45a4c890c8
Former-commit-id: f0bb47f0ea

build/minified/modules/accordion.js

@@ -90,6 +90,14 @@ $.fn.accordion = function(parameters) {
             else {
               module.open(activeIndex);
             }
+          },
+
+          resetStyle: function() {
+            $(this)
+              .removeAttr('style')
+              .children()
+                .removeAttr('style')
+            ;
           }
 
         },
@@ -113,7 +121,7 @@ $.fn.accordion = function(parameters) {
                 .children()
                   .animate({
                     opacity: 0
-                  }, settings.speed)
+                  }, settings.speed, module.event.resetStyle)
                   .end()
                 .slideUp(settings.speed , settings.easing, function() {
                   $previousContent
@@ -161,7 +169,7 @@ $.fn.accordion = function(parameters) {
             .children()
               .animate({
                 opacity: 0
-              }, settings.speed)
+              }, settings.speed, module.event.resetStyle)
               .end()
             .slideUp(settings.speed, settings.easing, function(){
               $activeContent
@@ -329,7 +337,7 @@ $.fn.accordion.settings = {
 
   debug       : true,
   verbose     : true,
-  performance : true,
+  performance : false,
   
   exclusive   : true,
   collapsible : true,

build/minified/modules/accordion.min.css

@@ -1 +1 @@
-.ui.accordion{width:600px;max-width:100%;overflow:hidden;font-size:1rem;border-radius:.3125em;background-color:#FFF;-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.1);-moz-box-shadow:0 0 0 1px rgba(0,0,0,.1);box-shadow:0 0 0 1px rgba(0,0,0,.1)}.ui.accordion .title{cursor:pointer;margin:0;padding:.75em 1em;color:rgba(0,0,0,.6);border-top:1px solid rgba(0,0,0,.05);-webkit-transition:background-color .2s ease-out;-moz-transition:background-color .2s ease-out;-o-transition:background-color .2s ease-out;-ms-transition:background-color .2s ease-out;transition:background-color .2s ease-out}.ui.accordion .title:first-child{border-top:0}.ui.accordion .content{display:none;margin:0;padding:1.3em 1em}.ui.accordion .title:hover,.ui.accordion .title.active{color:rgba(0,0,0,.8)}.ui.accordion .title.active{background-color:rgba(0,0,0,.1);color:rgba(0,0,0,.8)}.ui.accordion .content.active{display:block}.ui.basic.accordion{background-color:transparent;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.ui.basic.accordion .title{background-color:transparent;border-top:0}.ui.basic.accordion .title,.ui.basic.accordion .content{padding-left:0;padding-right:0}
+.ui.accordion{width:600px;max-width:100%;overflow:hidden;font-size:1rem;border-radius:.3125em;background-color:#FFF;-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.1);-moz-box-shadow:0 0 0 1px rgba(0,0,0,.1);box-shadow:0 0 0 1px rgba(0,0,0,.1)}.ui.accordion .title{cursor:pointer;margin:0;padding:.75em 1em;color:rgba(0,0,0,.6);border-top:1px solid rgba(0,0,0,.05);-webkit-transition:background-color .2s ease-out;-moz-transition:background-color .2s ease-out;-o-transition:background-color .2s ease-out;-ms-transition:background-color .2s ease-out;transition:background-color .2s ease-out}.ui.accordion .title:first-child{border-top:0}.ui.accordion .content{display:none;margin:0;padding:1.3em 1em}.ui.basic.accordion.menu{background-color:#FFF;-webkit-box-shadow:0 0 0 1px rgba(0,0,0,.1);-moz-box-shadow:0 0 0 1px rgba(0,0,0,.1);box-shadow:0 0 0 1px rgba(0,0,0,.1)}.ui.basic.accordion.menu .title,.ui.basic.accordion.menu .content{padding:0}.ui.accordion .title:hover,.ui.accordion .title.active{color:rgba(0,0,0,.8)}.ui.accordion .title.active{background-color:rgba(0,0,0,.1);color:rgba(0,0,0,.8)}.ui.accordion .content.active{display:block}.ui.basic.accordion{background-color:transparent;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none}.ui.basic.accordion .title{background-color:transparent;border-top:0}.ui.basic.accordion .title,.ui.basic.accordion .content{padding-left:0;padding-right:0}

build/minified/modules/accordion.min.js

@@ -1 +1 @@
-!function(a,b,c,d){a.fn.accordion=function(b){var c,e=a(this),f=a.isPlainObject(b)?a.extend(!0,{},a.fn.accordion.settings,b):a.fn.accordion.settings,g=("."+f.namespace,"module-"+f.namespace,e.selector||""),h=(new Date).getTime(),i=[],j=arguments[0],k="string"==typeof j,l=[].slice.call(arguments,1);return e.each(function(){var b,e=a(this),m=e.find(f.selector.title),n=(e.find(f.selector.icon),e.find(f.selector.content)),o=(e.selector||"",this),p=e.data("module-"+f.namespace),q=f.className,r=(f.metadata,f.namespace),s=(f.animation,f.errors);b={initialize:function(){b.debug("Initializing accordion with bound events",e),m.on("click",b.event.click),e.data("module",b)},destroy:function(){b.debug("Destroying previous accordion for",e),e.off(r)},event:{click:function(){var c=a(this),d=m.index(c),e=c.hasClass(q.active);b.verbose("Accordion title clicked",c),e?f.collapsible?b.close(d):b.debug("Cannot close accordion content collapsing is disabled"):b.open(d)}},open:function(c){var d=m.eq(c),e=d.next(n),g=m.filter("."+q.active),h=g.next(m),i=g.size()>0;e.is(":animated")||(b.debug("Opening accordion content",d),f.exclusive&&i&&(g.removeClass(q.active),h.stop().children().animate({opacity:0},f.speed).end().slideUp(f.speed,f.easing,function(){h.removeClass(q.active).removeAttr("style").children().removeAttr("style")})),d.addClass(q.active),e.stop().children().removeAttr("style").end().slideDown(f.speed,f.easing,function(){e.addClass(q.active).removeAttr("style"),a.proxy(f.onOpen,e)(),a.proxy(f.onChange,e)()}))},close:function(c){var d=m.eq(c),e=d.next(n);b.debug("Closing accordion content",d),d.removeClass(q.active),e.removeClass(q.active).show().stop().children().animate({opacity:0},f.speed).end().slideUp(f.speed,f.easing,function(){e.removeAttr("style"),a.proxy(f.onClose,e)(),a.proxy(f.onChange,e)()})},setting:function(c,e){return b.debug("Changing setting",c,e),e===d?f[c]:(a.isPlainObject(c)?a.extend(!0,f,c):f[c]=e,void 0)},internal:function(c,e){return b.debug("Changing internal",c,e),e===d?b[c]:(a.isPlainObject(c)?a.extend(!0,b,c):b[c]=e,void 0)},debug:function(){f.debug&&(f.performance?b.performance.log(arguments):b.debug=Function.prototype.bind.call(console.info,console,f.moduleName+":"))},verbose:function(){f.verbose&&f.debug&&(f.performance?b.performance.log(arguments):b.verbose=Function.prototype.bind.call(console.info,console,f.moduleName+":"))},error:function(){b.error=Function.prototype.bind.call(console.log,console,f.moduleName+":")},performance:{log:function(a){var c,d,e;f.performance&&(c=(new Date).getTime(),e=h||c,d=c-e,h=c,i.push({Element:o,Name:a[0],Arguments:a[1]||"","Execution Time":d})),clearTimeout(b.performance.timer),b.performance.timer=setTimeout(b.performance.display,100)},display:function(){var b=f.moduleName+":",c=0;h=!1,a.each(i,function(a,b){c+=b["Execution Time"]}),b+=" "+c+"ms",g&&(b+=" '"+g+"'"),(console.group!==d||console.table!==d)&&i.length>0&&(console.groupCollapsed(b),console.table?console.table(i):a.each(i,function(a,b){console.log(b.Name+": "+b["Execution Time"]+"ms")}),console.groupEnd()),i=[]}},invoke:function(c,e,f){var g,h;return e=e||l,f=o||f,"string"==typeof c&&p!==d&&(c=c.split("."),g=c.length-1,a.each(c,function(c,e){return a.isPlainObject(p[e])&&c!=g?(p=p[e],!0):p[e]!==d?(h=p[e],!0):(b.error(s.method),!1)})),a.isFunction(h)?(p.verbose("Executing invoked function",h),h.apply(f,e)):h||!1}},k?(p===d&&b.initialize(),c=b.invoke(j)):(p!==d&&b.destroy(),b.initialize())}),c?c:this},a.fn.accordion.settings={moduleName:"Accordion",debug:!0,verbose:!0,performance:!0,exclusive:!0,collapsible:!0,onOpen:function(){},onClose:function(){},onChange:function(){},errors:{method:"The method you called is not defined"},className:{active:"active",hover:"hover"},selector:{title:".title",icon:".icon",content:".content"},speed:500,easing:"easeInOutQuint"}}(jQuery,window,document);
+!function(a,b,c,d){a.fn.accordion=function(b){var c,e=a(this),f=a.isPlainObject(b)?a.extend(!0,{},a.fn.accordion.settings,b):a.fn.accordion.settings,g=("."+f.namespace,"module-"+f.namespace,e.selector||""),h=(new Date).getTime(),i=[],j=arguments[0],k="string"==typeof j,l=[].slice.call(arguments,1);return e.each(function(){var b,e=a(this),m=e.find(f.selector.title),n=(e.find(f.selector.icon),e.find(f.selector.content)),o=(e.selector||"",this),p=e.data("module-"+f.namespace),q=f.className,r=(f.metadata,f.namespace),s=(f.animation,f.errors);b={initialize:function(){b.debug("Initializing accordion with bound events",e),m.on("click",b.event.click),e.data("module",b)},destroy:function(){b.debug("Destroying previous accordion for",e),e.off(r)},event:{click:function(){var c=a(this),d=m.index(c),e=c.hasClass(q.active);b.verbose("Accordion title clicked",c),e?f.collapsible?b.close(d):b.debug("Cannot close accordion content collapsing is disabled"):b.open(d)},resetStyle:function(){a(this).removeAttr("style").children().removeAttr("style")}},open:function(c){var d=m.eq(c),e=d.next(n),g=m.filter("."+q.active),h=g.next(m),i=g.size()>0;e.is(":animated")||(b.debug("Opening accordion content",d),f.exclusive&&i&&(g.removeClass(q.active),h.stop().children().animate({opacity:0},f.speed,b.event.resetStyle).end().slideUp(f.speed,f.easing,function(){h.removeClass(q.active).removeAttr("style").children().removeAttr("style")})),d.addClass(q.active),e.stop().children().removeAttr("style").end().slideDown(f.speed,f.easing,function(){e.addClass(q.active).removeAttr("style"),a.proxy(f.onOpen,e)(),a.proxy(f.onChange,e)()}))},close:function(c){var d=m.eq(c),e=d.next(n);b.debug("Closing accordion content",d),d.removeClass(q.active),e.removeClass(q.active).show().stop().children().animate({opacity:0},f.speed,b.event.resetStyle).end().slideUp(f.speed,f.easing,function(){e.removeAttr("style"),a.proxy(f.onClose,e)(),a.proxy(f.onChange,e)()})},setting:function(c,e){return b.debug("Changing setting",c,e),e===d?f[c]:(a.isPlainObject(c)?a.extend(!0,f,c):f[c]=e,void 0)},internal:function(c,e){return b.debug("Changing internal",c,e),e===d?b[c]:(a.isPlainObject(c)?a.extend(!0,b,c):b[c]=e,void 0)},debug:function(){f.debug&&(f.performance?b.performance.log(arguments):b.debug=Function.prototype.bind.call(console.info,console,f.moduleName+":"))},verbose:function(){f.verbose&&f.debug&&(f.performance?b.performance.log(arguments):b.verbose=Function.prototype.bind.call(console.info,console,f.moduleName+":"))},error:function(){b.error=Function.prototype.bind.call(console.log,console,f.moduleName+":")},performance:{log:function(a){var c,d,e;f.performance&&(c=(new Date).getTime(),e=h||c,d=c-e,h=c,i.push({Element:o,Name:a[0],Arguments:a[1]||"","Execution Time":d})),clearTimeout(b.performance.timer),b.performance.timer=setTimeout(b.performance.display,100)},display:function(){var b=f.moduleName+":",c=0;h=!1,a.each(i,function(a,b){c+=b["Execution Time"]}),b+=" "+c+"ms",g&&(b+=" '"+g+"'"),(console.group!==d||console.table!==d)&&i.length>0&&(console.groupCollapsed(b),console.table?console.table(i):a.each(i,function(a,b){console.log(b.Name+": "+b["Execution Time"]+"ms")}),console.groupEnd()),i=[]}},invoke:function(c,e,f){var g,h;return e=e||l,f=o||f,"string"==typeof c&&p!==d&&(c=c.split("."),g=c.length-1,a.each(c,function(c,e){return a.isPlainObject(p[e])&&c!=g?(p=p[e],!0):p[e]!==d?(h=p[e],!0):(b.error(s.method),!1)})),a.isFunction(h)?(p.verbose("Executing invoked function",h),h.apply(f,e)):h||!1}},k?(p===d&&b.initialize(),c=b.invoke(j)):(p!==d&&b.destroy(),b.initialize())}),c?c:this},a.fn.accordion.settings={moduleName:"Accordion",debug:!0,verbose:!0,performance:!1,exclusive:!0,collapsible:!0,onOpen:function(){},onClose:function(){},onChange:function(){},errors:{method:"The method you called is not defined"},className:{active:"active",hover:"hover"},selector:{title:".title",icon:".icon",content:".content"},speed:500,easing:"easeInOutQuint"}}(jQuery,window,document);

build/packaged/modules/accordion.js

@@ -90,6 +90,14 @@ $.fn.accordion = function(parameters) {
             else {
               module.open(activeIndex);
             }
+          },
+
+          resetStyle: function() {
+            $(this)
+              .removeAttr('style')
+              .children()
+                .removeAttr('style')
+            ;
           }
 
         },
@@ -113,7 +121,7 @@ $.fn.accordion = function(parameters) {
                 .children()
                   .animate({
                     opacity: 0
-                  }, settings.speed)
+                  }, settings.speed, module.event.resetStyle)
                   .end()
                 .slideUp(settings.speed , settings.easing, function() {
                   $previousContent
@@ -161,7 +169,7 @@ $.fn.accordion = function(parameters) {
             .children()
               .animate({
                 opacity: 0
-              }, settings.speed)
+              }, settings.speed, module.event.resetStyle)
               .end()
             .slideUp(settings.speed, settings.easing, function(){
               $activeContent
@@ -329,7 +337,7 @@ $.fn.accordion.settings = {
 
   debug       : true,
   verbose     : true,
-  performance : true,
+  performance : false,
   
   exclusive   : true,
   collapsible : true,

build/packaged/semantic.min.css.REMOVED.git-id

@@ -1 +1 @@
-c7a2188f54a6b10797665372e51464a682b8b458
+b064b9beab68a8b3be641d50e6fd1b43f9c22364

build/packaged/semantic.min.js.REMOVED.git-id

@@ -1 +1 @@
-29b691619ce36ba441a1b9cc80ea53b4de89e865
+961672b84f3f52255c73991920d39065c129dc63

build/uncompressed/collections/menu.css

@@ -205,7 +205,7 @@
 ---------------*/
 .ui.menu .item > .label,
 .ui.menu .item > a > .label {
-  font-size: 0.8em;
+  font-size: 0.875em;
   margin: -0.3em 0em -0.3em 0.3em;
   padding: 0.3em 0.8em;
   vertical-align: baseline;
@@ -379,7 +379,7 @@
   margin: 0em;
 }
 .ui.vertical.menu .dropdown.item .menu .item {
-  font-size: 0.9em;
+  font-size: 0.875em;
   padding: 0.75em 1em;
 }
 .ui.vertical.menu .dropdown.item .menu .item .icon {
@@ -391,7 +391,7 @@
 }
 .ui.vertical.menu .item > .menu > .item {
   padding: 0.5rem 1.5rem;
-  font-size: 0.85em;
+  font-size: 0.875em;
 }
 .ui.vertical.menu .item > .menu > .item:before {
   display: none;
@@ -422,7 +422,7 @@
   color: #FFFFFF;
 }
 .ui.tiered.menu .sub.menu .item {
-  font-size: 0.9rem;
+  font-size: 0.875rem;
 }
 .ui.tiered.menu .sub.menu .item:before {
   background-image: none;
@@ -705,7 +705,7 @@
   background-color: transparent;
   opacity: 1;
   color: rgba(50, 50, 50, 0.8);
-  font-size: 0.9rem;
+  font-size: 0.875rem;
   padding: 0em;
   text-transform: uppercase;
   font-weight: bold;
@@ -1186,16 +1186,20 @@
   transition: background 0.2s ease
   ;
 }
+/* Don't double up pointers */
+.ui.pointing.menu .active.item .menu .active.item:after {
+  display: none;
+}
 .ui.vertical.pointing.menu .active.item:after {
   position: absolute;
   top: 50%;
+  margin-top: -0.3em;
   right: -0.4em;
   bottom: auto;
   left: auto;
   border: none;
   border-top: 1px solid rgba(0, 0, 0, 0.1);
   border-right: 1px solid rgba(0, 0, 0, 0.1);
-  margin-top: -0.3em;
 }
 /* Colors */
 .ui.pointing.menu .active.item:after {

build/uncompressed/elements/label.css

@@ -531,9 +531,6 @@ a.ui.teal.tag.label:hover:before {
   top: -1em;
   left: 100%;
   margin: 0em 0em 0em -1.5em !important;
-  -webkit-box-shadow: 0px -2px 0 0px rgba(0, 0, 0, 0.1) inset;
-  -moz-box-shadow: 0px -2px 0 0px rgba(0, 0, 0, 0.1) inset;
-  box-shadow: 0px -2px 0 0px rgba(0, 0, 0, 0.1) inset;
 }
 /*-------------------
         Sizes

build/uncompressed/modules/accordion.css

@@ -44,6 +44,19 @@
   margin: 0em;
   padding: 1.3em 1em;
 }
+/*--------------
+ Loose Coupling
+---------------*/
+.ui.basic.accordion.menu {
+  background-color: #FFFFFF;
+  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
+  -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
+  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
+}
+.ui.basic.accordion.menu .title,
+.ui.basic.accordion.menu .content {
+  padding: 0em;
+}
 /*******************************
             States
 *******************************/

build/uncompressed/modules/accordion.js

@@ -90,6 +90,14 @@ $.fn.accordion = function(parameters) {
             else {
               module.open(activeIndex);
             }
+          },
+
+          resetStyle: function() {
+            $(this)
+              .removeAttr('style')
+              .children()
+                .removeAttr('style')
+            ;
           }
 
         },
@@ -113,7 +121,7 @@ $.fn.accordion = function(parameters) {
                 .children()
                   .animate({
                     opacity: 0
-                  }, settings.speed)
+                  }, settings.speed, module.event.resetStyle)
                   .end()
                 .slideUp(settings.speed , settings.easing, function() {
                   $previousContent
@@ -161,7 +169,7 @@ $.fn.accordion = function(parameters) {
             .children()
               .animate({
                 opacity: 0
-              }, settings.speed)
+              }, settings.speed, module.event.resetStyle)
               .end()
             .slideUp(settings.speed, settings.easing, function(){
               $activeContent
@@ -329,7 +337,7 @@ $.fn.accordion.settings = {
 
   debug       : true,
   verbose     : true,
-  performance : true,
+  performance : false,
   
   exclusive   : true,
   collapsible : true,

node/src/documents/quirky/card.html

@@ -1,613 +0,0 @@
----
-layout : 'default'
-css    : 'card'
-
-title  : 'Card'
-type   : 'Quirky Element'
----
-
-<script src="/javascript/card.js"></script>
-
-<script src="/overrides/views/card.js"></script>
-<link rel="stylesheet" type="text/css" class="ui" href="/overrides/quirky.css">
-<link rel="stylesheet" type="text/css" class="ui" href="/overrides/elements/button.css">
-<link rel="stylesheet" type="text/css" class="ui" href="/overrides/views/card.css">
-<link rel="stylesheet" type="text/css" class="ui" href="/overrides/views/idea.card.css">
-<link rel="stylesheet" type="text/css" class="ui" href="/overrides/views/profile.card.css">
-<link rel="stylesheet" type="text/css" class="ui" href="/overrides/views/product.card.css">
-
-<div class="segment">
-  <div class="container">
-  <h1 class="ui header">Card</h1>
-  </div>
-</div>
-<div class="main container">
-
-  <div class="peek">
-    <div class="ui vertical pointing secondary menu">
-      <a class="active item">Product</a>
-      <a class="item">Idea</a>
-      <a class="item">Profile</a>
-      <a class="item">Variations</a>
-    </div>
-  </div>
-
-  <h2 class="ui dividing header">Product</h2>
-
-  <div class="example">
-    <h4 class="ui header">Upcoming</h4>
-    <p>A card for displaying an upcoming product</p>
-    <div class="ui health product card">
-      <div class="product">
-        <div class="image">
-          <img src="/images/demo/product.jpg">
-        </div>
-        <div class="header">Dog Lotion</div>
-        <div class="description">
-          Put your dog in motion with this sleek, elegant doggie carrier. For owners on the go.
-        </div>
-      </div>
-      <div class="meta">
-        <div class="countdown">
-          <i class="icon sketchy clock"></i>
-          4 days left
-        </div>
-        <div class="influence">
-          <a href="#">Poodington</a>
-          + 1,579 influencers
-        </div>
-      </div>
-      <div class="ui bottom attached progress">
-        <div class="bar"></div>
-      </div>
-      <div class="ui dimmer">
-        <div class="content">
-          <div class="middle">
-            <i class="sketchy x circle close link icon"></i>
-            <div class="buttons">
-              <a class="ui submit button">Participate</a>
-              <a class="ui button">View Details</a>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="example">
-    <h4 class="ui header">Profile Product</h4>
-    <p>A card used on a users profile to show an influenced product</p>
-    <div class="ui travel product card">
-      <div class="product">
-        <div class="image">
-          <img src="/images/demo/product2.jpg">
-        </div>
-        <div class="header">Dog Motion</div>
-      </div>
-      <div class="meta">
-        <div class="statistic">
-          <div class="number">4.34%</div>
-          <div class="label">influence earned</div>
-        </div>
-        <div class="projects">
-          <div class="project"><i class="design phase sketchy icon"></i> Design</div>
-          <div class="project"><i class="enhance phase sketchy icon"></i> Enhance</div>
-          <a class="active project" data-html="<b>0.0016%</b> Influence Earned"><i class="style phase sketchy icon"></i> Style</a>
-          <a class="active project" data-html="<b>0.0036%</b> Influence Earned"><i class="design phase sketchy icon"></i> Design</a>
-          <div class="project"><i class="name phase sketchy icon"></i> Name</div>
-          <div class="project"><i class="research phase sketchy icon"></i> Research</div>
-          <div class="project"><i class="style phase sketchy icon"></i> Style</div>
-          <div class="project"><i class="tagline phase sketchy icon"></i> Tagline</div>
-        </div>
-      </div>
-      <div class="ui bottom attached progress">
-        <div class="bar"></div>
-      </div>
-    </div>
-
-    <div class="example">
-      <h4 class="ui header">Shop</h4>
-      <p>A product currently on sale in the shop</p>
-      <div class="ui travel product card">
-        <div class="product">
-          <div class="image">
-            <img src="/images/demo/product.jpg">
-          </div>
-          <div class="header">Dog Lotion</div>
-          <div class="description">
-            Put your dog in motion with this sleek, elegant doggie carrier. For owners on the go.
-          </div>
-        </div>
-        <div class="meta">
-          <div class="inventor">
-            Invented by Jackie S.
-          </div>
-          <div class="price">
-            $29.99
-          </div>
-        </div>
-        <div class="ui bottom attached progress">
-          <div class="bar"></div>
-        </div>
-      </div>
-    </div>
-
-  </div>
-
-  <h2 class="ui dividing header">Idea</h2>
-
-  <div class="example">
-    <h4 class="ui header">Single</h4>
-    <p>A card for displaying an idea</p>
-
-    <div class="ui idea card" data-votes="150">
-      <div class="idea">
-        <div class="ui corner vote label">
-            <i class="icon sketchy checkmark"></i>
-          </div>
-        <div class="image">
-          <img src="/images/demo/invention.jpg">
-        </div>
-        <div class="header">Dog Moods</div>
-        <div class="description">
-          Wouldn't it be nice if your dog could always be happy. Introducing a device which will help your dog maintain his mood in any situation.
-        </div>
-      </div>
-      <div class="meta">
-        <div class="countdown">
-          <i class="icon sketchy clock"></i>
-          12 days left
-        </div>
-        <div class="votes">
-          <i class="sketchy checkmark circle icon"></i>
-          <span class="count">58</span> votes to go
-        </div>
-      </div>
-      <div class="ui bottom attached progress">
-        <div class="bar"></div>
-      </div>
-      <div class="ui dimmer">
-        <div class="content">
-          <div class="middle">
-            <i class="sketchy x circle close link icon"></i>
-            <div class="buttons">
-              <div class="ui submit vote button">Vote</div>
-              <div class="ui button">Details</div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <div class="example">
-    <h4 class="ui header">Group</h4>
-    <p>A set of idea cards</p>
-    <div class="ui idea cards">
-      <div class="card" data-votes="111">
-        <div class="idea">
-          <div class="ui corner vote label">
-            <i class="icon sketchy checkmark"></i>
-          </div>
-          <div class="image">
-            <img src="/images/demo/invention.jpg">
-          </div>
-          <div class="header">Dog Moods</div>
-          <div class="description">
-            Wouldn't it be nice if your dog could always be happy. Introducing a device which will help your dog maintain his mood in any situation.
-          </div>
-        </div>
-        <div class="meta">
-          <div class="countdown">
-            <i class="icon sketchy clock"></i>
-            12 days left
-          </div>
-          <div class="votes">
-            <i class="sketchy checkmark circle icon"></i>
-            <span class="count">58</span> votes to go
-          </div>
-        </div>
-        <div class="ui bottom attached progress">
-          <div class="bar"></div>
-        </div>
-        <div class="ui dimmer">
-          <div class="content">
-            <div class="middle">
-              <i class="sketchy x circle close link icon"></i>
-              <div class="buttons">
-                <div class="ui submit vote button">Vote</div>
-                <div class="ui button">Details</div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="card" data-votes="51">
-        <div class="idea">
-          <div class="ui corner vote label">
-            <i class="icon sketchy checkmark"></i>
-          </div>
-          <div class="image">
-            <img src="/images/demo/invention2.jpg">
-          </div>
-          <div class="header">Dog Sense Box</div>
-          <div class="description">
-            Treat your dog to the luxuries of sensory deprivation. He can meditate on the nature of dogness and realize the true focus of his life.
-          </div>
-        </div>
-        <div class="meta">
-          <div class="countdown">
-            <i class="icon sketchy clock"></i>
-            12 days left
-          </div>
-          <div class="votes">
-            <i class="sketchy checkmark circle icon"></i>
-            <span class="count">58</span> votes to go
-          </div>
-        </div>
-        <div class="ui bottom attached progress">
-          <div class="bar"></div>
-        </div>
-        <div class="ui dimmer">
-          <div class="content">
-            <div class="middle">
-              <i class="sketchy x circle close link icon"></i>
-              <div class="buttons">
-                <div class="ui submit vote button">Vote</div>
-                <div class="ui button">Details</div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="card" data-votes="11">
-        <div class="idea">
-          <div class="ui corner vote label">
-            <i class="icon sketchy checkmark"></i>
-          </div>
-          <div class="image">
-            <img src="/images/demo/invention3.jpg">
-          </div>
-          <div class="header">Dog Carrying</div>
-          <div class="description">
-            I always want to take my dogs places, but then my hands get tired from carrying him. This device would allow you to walk around HANDS-FREE!
-          </div>
-        </div>
-        <div class="meta">
-          <div class="countdown">
-            <i class="icon sketchy clock"></i>
-            12 days left
-          </div>
-          <div class="votes">
-            <i class="sketchy checkmark circle icon"></i>
-            <span class="count">58</span> votes to go
-          </div>
-        </div>
-        <div class="ui bottom attached progress">
-          <div class="bar"></div>
-        </div>
-        <div class="ui dimmer">
-          <div class="content">
-            <div class="middle">
-              <i class="sketchy x circle close link icon"></i>
-              <div class="buttons">
-                <div class="ui submit vote button">Vote</div>
-                <div class="ui button">Details</div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <h3 class="ui header">States</h3>
-
-  <div class="example">
-    <h4 class="ui header">Voted</h4>
-    <p>A card showing a user has already voted on an idea</p>
-    <div class="ui voted idea card" data-votes="150">
-      <div class="ui corner vote label">
-        <i class="icon sketchy checkmark"></i>
-      </div>
-      <div class="idea">
-        <div class="ui corner vote label">
-            <i class="icon sketchy checkmark"></i>
-          </div>
-        <div class="image">
-          <img src="/images/demo/invention.jpg">
-        </div>
-        <div class="header">Dog Moods</div>
-        <div class="description">
-          Wouldn't it be nice if your dog could always be happy. Introducing a device which will help your dog maintain his mood in any situation.
-        </div>
-      </div>
-      <div class="meta">
-        <div class="countdown">
-          <i class="icon sketchy clock"></i>
-          12 days left
-        </div>
-        <div class="votes">
-          <i class="sketchy checkmark circle icon"></i>
-          <span class="count">58</span> votes to go
-        </div>
-      </div>
-      <div class="ui bottom attached progress">
-        <div class="bar"></div>
-      </div>
-      <div class="ui dimmer">
-        <div class="content">
-          <div class="middle">
-            <i class="sketchy x circle close link icon"></i>
-            <div class="buttons">
-              <div class="ui submit vote button">Vote</div>
-              <div class="ui button">Details</div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-
-  <h2 class="ui dividing header">Profile</h2>
-
-  <div class="example">
-    <h4 class="ui header">Single</h4>
-    <p>A card showing a users profile summaryh</p>
-    <div class="ui profile card">
-      <div class="ui corner vote label">
-        <i class="icon sketchy checkmark"></i>
-      </div>
-      <div class="content">
-        <div class="caption">Invented by</div>
-        <a class="name">
-          <div class="ui circular rotate reveal image">
-            <img src="/images/demo/stickfigure.jpg">
-            <img src="/images/demo/photo2.jpg">
-          </div>
-          Dog Doggington
-        </a>
-        <div class="location">
-          <i class="location icon"></i>
-          Poodle Palace
-        </div>
-      </div>
-      <div class="stats">
-        <div class="stat">
-          <div class="count">16</div>
-          <div class="text">Ideas</div>
-        </div>
-        <div class="stat">
-          <div class="count">14%</div>
-          <div class="text">Influence</div>
-        </div>
-        <div class="stat">
-          <div class="count">22</div>
-          <div class="text">Followers</div>
-        </div>
-      </div>
-      <a class="bottom attached secondary ui button">View profile</a>
-    </div>
-  </div>
-
-  <div class="example">
-    <h4 class="ui header">Groups</h4>
-    <p>A set of profile cards</p>
-    <div class="ui profile cards">
-
-      <div class="card">
-        <div class="content">
-          <div class="caption">Invented by</div>
-          <a class="name">
-            <img class="ui circular image" src="/images/demo/photo2.jpg">
-            Dog Doggington
-          </a>
-          <div class="location">
-            <i class="location icon"></i>
-            Poodle Palace
-          </div>
-        </div>
-        <div class="stats">
-          <div class="stat">
-            <div class="count">16</div>
-            <div class="text">Ideas</div>
-          </div>
-          <div class="stat">
-            <div class="count">14%</div>
-            <div class="text">Influence</div>
-          </div>
-          <div class="stat">
-            <div class="count">22</div>
-            <div class="text">Followers</div>
-          </div>
-        </div>
-        <a class="bottom attached secondary ui button">View profile</a>
-      </div>
-
-      <div class="card">
-        <div class="content">
-          <div class="caption">Invented by</div>
-          <a class="name">
-            <img class="ui circular image" src="/images/demo/avatar3.jpg">
-            Pinklebert
-          </a>
-          <div class="location">
-            <i class="location icon"></i>
-            Dogtown
-          </div>
-        </div>
-        <div class="stats">
-          <div class="stat">
-            <div class="count">1</div>
-            <div class="text">Idea</div>
-          </div>
-          <div class="stat">
-            <div class="count">0%</div>
-            <div class="text">Influence</div>
-          </div>
-          <div class="stat">
-            <div class="count">2</div>
-            <div class="text">Followers</div>
-          </div>
-        </div>
-        <a class="bottom attached secondary ui button">View profile</a>
-      </div>
-
-      <div class="card">
-        <div class="content">
-          <div class="caption">Invented by</div>
-          <a class="name">
-            <img class="ui circular image" src="/images/demo/avatar4.jpg">
-            Missy
-          </a>
-          <div class="location">
-            <i class="location icon"></i>
-            Taiwan
-          </div>
-        </div>
-        <div class="stats">
-          <div class="stat">
-            <div class="count">416</div>
-            <div class="text">Ideas</div>
-          </div>
-          <div class="stat">
-            <div class="count">54%</div>
-            <div class="text">Influence</div>
-          </div>
-          <div class="stat">
-            <div class="count">1111</div>
-            <div class="text">Followers</div>
-          </div>
-        </div>
-        <a class="bottom attached secondary ui button">View profile</a>
-      </div>
-    </div>
-
-  </div>
-
-
-  <h2 class="ui dividing header">Variations</h2>
-
-  <div class="example">
-    <h4 class="ui header">Evenly Divided</h4>
-    <p>Cards can be set to a certain amount of cards per row.</p>
-
-    <div class="ui two idea cards">
-      <div class="card" data-votes="111">
-        <div class="idea">
-          <div class="ui corner vote label">
-            <i class="icon sketchy checkmark"></i>
-          </div>
-          <div class="image">
-            <img src="/images/demo/invention.jpg">
-          </div>
-          <div class="header">Dog Moods</div>
-          <div class="description">
-            Wouldn't it be nice if your dog could always be happy. Introducing a device which will help your dog maintain his mood in any situation.
-          </div>
-        </div>
-        <div class="meta">
-          <div class="countdown">
-            <i class="icon sketchy clock"></i>
-            12 days left
-          </div>
-          <div class="votes">
-            <i class="sketchy checkmark circle icon"></i>
-            <span class="count">58</span> votes to go
-          </div>
-        </div>
-        <div class="ui bottom attached progress">
-          <div class="bar"></div>
-        </div>
-        <div class="ui dimmer">
-          <div class="content">
-            <div class="middle">
-              <i class="sketchy x circle close link icon"></i>
-              <div class="buttons">
-                <div class="ui submit vote button">Vote</div>
-                <div class="ui button">Details</div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="card" data-votes="51">
-        <div class="idea">
-          <div class="ui corner vote label">
-            <i class="icon sketchy checkmark"></i>
-          </div>
-          <div class="image">
-            <img src="/images/demo/invention2.jpg">
-          </div>
-          <div class="header">Dog Sense Box</div>
-          <div class="description">
-            Treat your dog to the luxuries of sensory deprivation. He can meditate on the nature of dogness and realize the true focus of his life.
-          </div>
-        </div>
-        <div class="meta">
-          <div class="countdown">
-            <i class="icon sketchy clock"></i>
-            12 days left
-          </div>
-          <div class="votes">
-            <i class="sketchy checkmark circle icon"></i>
-            <span class="count">58</span> votes to go
-          </div>
-        </div>
-        <div class="ui bottom attached progress">
-          <div class="bar"></div>
-        </div>
-        <div class="ui dimmer">
-          <div class="content">
-            <div class="middle">
-              <i class="sketchy x circle close link icon"></i>
-              <div class="buttons">
-                <div class="ui submit vote button">Vote</div>
-                <div class="ui button">Details</div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="card" data-votes="11">
-        <div class="idea">
-          <div class="ui corner vote label">
-            <i class="icon sketchy checkmark"></i>
-          </div>
-          <div class="image">
-            <img src="/images/demo/invention3.jpg">
-          </div>
-          <div class="header">Dog Carrying</div>
-          <div class="description">
-            I always want to take my dogs places, but then my hands get tired from carrying him. This device would allow you to walk around HANDS-FREE!
-          </div>
-        </div>
-        <div class="meta">
-          <div class="countdown">
-            <i class="icon sketchy clock"></i>
-            12 days left
-          </div>
-          <div class="votes">
-            <i class="sketchy checkmark circle icon"></i>
-            <span class="count">58</span> votes to go
-          </div>
-        </div>
-        <div class="ui bottom attached progress">
-          <div class="bar"></div>
-        </div>
-        <div class="ui dimmer">
-          <div class="content">
-            <div class="middle">
-              <i class="sketchy x circle close link icon"></i>
-              <div class="buttons">
-                <div class="ui submit vote button">Vote</div>
-                <div class="ui button">Details</div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  </div>
-
-</div>

node/src/documents/quirky/icons.html

@@ -1,152 +0,0 @@
----
-layout : 'default'
-css    : 'icon'
-title  : 'Icons'
-type   : 'Quirky Element'
----
-
-<div class="segment">
-  <div class="container">
-  <h1 class="ui header">Quirky Icons</h1>
-  </div>
-</div>
-<div class="main container">
-  
-  <div class="icon example">
-    <h4 class="ui header">Sketchy</h4>
-    <div class="ui eight column grid">
-      <div class="column"><i class="sketchy icon add"></i> Add</div>
-      <div class="column"><i class="sketchy icon alert"></i> Alert</div>
-      <div class="column"><i class="sketchy icon all"></i> All</div>
-      <div class="column"><i class="sketchy icon arrow eight"></i> Arrow Eight</div>
-      <div class="column"><i class="sketchy icon arrow eighteen"></i> Arrow Eighteen</div>
-      <div class="column"><i class="sketchy icon arrow eleven"></i> Arrow Eleven</div>
-      <div class="column"><i class="sketchy icon arrow fifteen"></i> Arrow Fifteen</div>
-      <div class="column"><i class="sketchy icon arrow five"></i> Arrow Five</div>
-      <div class="column"><i class="sketchy icon arrow four"></i> Arrow Four</div>
-      <div class="column"><i class="sketchy icon arrow fourteen"></i> Arrow Fourteen</div>
-      <div class="column"><i class="sketchy icon arrow left"></i> Arrow Left</div>
-      <div class="column"><i class="sketchy icon arrow nine"></i> Arrow Nine</div>
-      <div class="column"><i class="sketchy icon arrow one"></i> Arrow One</div>
-      <div class="column"><i class="sketchy icon arrow right"></i> Arrow Right</div>
-      <div class="column"><i class="sketchy icon arrow seven"></i> Arrow Seven</div>
-      <div class="column"><i class="sketchy icon arrow six"></i> Arrow Six</div>
-      <div class="column"><i class="sketchy icon arrow sixteen"></i> Arrow Sixteen</div>
-      <div class="column"><i class="sketchy icon arrow ten"></i> Arrow Ten</div>
-      <div class="column"><i class="sketchy icon arrow thirteen"></i> Arrow Thirteen</div>
-      <div class="column"><i class="sketchy icon arrow three"></i> Arrow Three</div>
-      <div class="column"><i class="sketchy icon arrow twelve"></i> Arrow Twelve</div>
-      <div class="column"><i class="sketchy icon arrow two"></i> Arrow Two</div>
-      <div class="column"><i class="sketchy icon browser"></i> Browser</div>
-      <div class="column"><i class="sketchy icon bullet one"></i> Bullet One</div>
-      <div class="column"><i class="sketchy icon bullet three"></i> Bullet Three</div>
-      <div class="column"><i class="sketchy icon bullet two"></i> Bullet Two</div>
-      <div class="column"><i class="sketchy icon calendar"></i> Calendar</div>
-      <div class="column"><i class="sketchy icon camera"></i> Camera</div>
-      <div class="column"><i class="sketchy icon caret down"></i> Caret Down</div>
-      <div class="column"><i class="sketchy icon caret left"></i> Caret Left</div>
-      <div class="column"><i class="sketchy icon caret right"></i> Caret Right</div>
-      <div class="column"><i class="sketchy icon caret up"></i> Caret Up</div>
-      <div class="column"><i class="sketchy icon categories"></i> Categories</div>
-      <div class="column"><i class="sketchy icon category apple"></i> Category Apple</div>
-      <div class="column"><i class="sketchy icon category electronics"></i> Category Electronics</div>
-      <div class="column"><i class="sketchy icon category health"></i> Category Health</div>
-      <div class="column"><i class="sketchy icon category home"></i> Category Home</div>
-      <div class="column"><i class="sketchy icon category kitchen"></i> Category Kitchen</div>
-      <div class="column"><i class="sketchy icon category parenting"></i> Category Parenting</div>
-      <div class="column"><i class="sketchy icon category pets"></i> Category Pets</div>
-      <div class="column"><i class="sketchy icon category play"></i> Category Play</div>
-      <div class="column"><i class="sketchy icon category power"></i> Category Power</div>
-      <div class="column"><i class="sketchy icon category travel"></i> Category Travel</div>
-      <div class="column"><i class="sketchy icon category wildcard"></i> Category Wildcard</div>
-      <div class="column"><i class="sketchy icon checkmark"></i> Checkmark</div>
-      <div class="column"><i class="sketchy icon checkmark circle"></i> Checkmark Circle</div>
-      <div class="column"><i class="sketchy icon clock"></i> Clock</div>
-      <div class="column"><i class="sketchy icon comment"></i> Comment</div>
-      <div class="column"><i class="sketchy icon compare"></i> Compare</div>
-      <div class="column"><i class="sketchy icon conversation"></i> Conversation</div>
-      <div class="column"><i class="sketchy icon dollar"></i> Dollar</div>
-      <div class="column"><i class="sketchy icon dont"></i> Dont</div>
-      <div class="column"><i class="sketchy icon eval"></i> Eval</div>
-      <div class="column"><i class="sketchy icon expert"></i> Expert</div>
-      <div class="column"><i class="sketchy icon eyeball"></i> Eyeball</div>
-      <div class="column"><i class="sketchy icon facebook"></i> Facebook</div>
-      <div class="column"><i class="sketchy icon facebook filled"></i> Facebook Filled</div>
-      <div class="column"><i class="sketchy icon googleplus"></i> Googleplus</div>
-      <div class="column"><i class="sketchy icon googleplus filled"></i> Googleplus Filled</div>
-      <div class="column"><i class="sketchy icon home"></i> Home</div>
-      <div class="column"><i class="sketchy icon how cash"></i> How Cash</div>
-      <div class="column"><i class="sketchy icon how influence"></i> How Influence</div>
-      <div class="column"><i class="sketchy icon how manufactures"></i> How Manufactures</div>
-      <div class="column"><i class="sketchy icon how submit"></i> How Submit</div>
-      <div class="column"><i class="sketchy icon how votes"></i> How Votes</div>
-      <div class="column"><i class="sketchy icon idea"></i> Idea</div>
-      <div class="column"><i class="sketchy icon improve"></i> Improve</div>
-      <div class="column"><i class="sketchy icon influence"></i> Influence</div>
-      <div class="column"><i class="sketchy icon information"></i> Information</div>
-      <div class="column"><i class="sketchy icon instagram"></i> Instagram</div>
-      <div class="column"><i class="sketchy icon invent"></i> Invent</div>
-      <div class="column"><i class="sketchy icon ip communication"></i> Ip Communication</div>
-      <div class="column"><i class="sketchy icon ip electronics"></i> Ip Electronics</div>
-      <div class="column"><i class="sketchy icon ip engine"></i> Ip Engine</div>
-      <div class="column"><i class="sketchy icon ip lighting"></i> Ip Lighting</div>
-      <div class="column"><i class="sketchy icon ip materials"></i> Ip Materials</div>
-      <div class="column"><i class="sketchy icon ip power"></i> Ip Power</div>
-      <div class="column"><i class="sketchy icon ip printing"></i> Ip Printing</div>
-      <div class="column"><i class="sketchy icon ip processes"></i> Ip Processes</div>
-      <div class="column"><i class="sketchy icon ip processing"></i> Ip Processing</div>
-      <div class="column"><i class="sketchy icon ip vehicles"></i> Ip Vehicles</div>
-      <div class="column"><i class="sketchy icon launch"></i> Launch</div>
-      <div class="column"><i class="sketchy icon linkicon"></i> Linkicon</div>
-      <div class="column"><i class="sketchy icon load"></i> Load</div>
-      <div class="column"><i class="sketchy icon location"></i> Location</div>
-      <div class="column"><i class="sketchy icon lock"></i> Lock</div>
-      <div class="column"><i class="sketchy icon logout"></i> Logout</div>
-      <div class="column"><i class="sketchy icon magnify"></i> Magnify</div>
-      <div class="column"><i class="sketchy icon mail"></i> Mail</div>
-      <div class="column"><i class="sketchy icon name"></i> Name</div>
-      <div class="column"><i class="sketchy icon newest"></i> Newest</div>
-      <div class="column"><i class="sketchy icon pencil"></i> Pencil</div>
-      <div class="column"><i class="sketchy icon phase design"></i> Phase Design</div>
-      <div class="column"><i class="sketchy icon phase enhance"></i> Phase Enhance</div>
-      <div class="column"><i class="sketchy icon phase name"></i> Phase Name</div>
-      <div class="column"><i class="sketchy icon phase research"></i> Phase Research</div>
-      <div class="column"><i class="sketchy icon phase style"></i> Phase Style</div>
-      <div class="column"><i class="sketchy icon phase tagline"></i> Phase Tagline</div>
-      <div class="column"><i class="sketchy icon photos"></i> Photos</div>
-      <div class="column"><i class="sketchy icon piechart"></i> Piechart</div>
-      <div class="column"><i class="sketchy icon pinterest"></i> Pinterest</div>
-      <div class="column"><i class="sketchy icon pinterest filled"></i> Pinterest Filled</div>
-      <div class="column"><i class="sketchy icon play"></i> Play</div>
-      <div class="column"><i class="sketchy icon portfolio"></i> Portfolio</div>
-      <div class="column"><i class="sketchy icon price"></i> Price</div>
-      <div class="column"><i class="sketchy icon problem"></i> Problem</div>
-      <div class="column"><i class="sketchy icon profile"></i> Profile</div>
-      <div class="column"><i class="sketchy icon question"></i> Question</div>
-      <div class="column"><i class="sketchy icon question circle"></i> Question Circle</div>
-      <div class="column"><i class="sketchy icon quirkylogo"></i> Quirkylogo</div>
-      <div class="column"><i class="sketchy icon quirkylogobg"></i> Quirkylogobg</div>
-      <div class="column"><i class="sketchy icon rain cloud"></i> Rain Cloud</div>
-      <div class="column"><i class="sketchy icon settings"></i> Settings</div>
-      <div class="column"><i class="sketchy icon share"></i> Share</div>
-      <div class="column"><i class="sketchy icon shop"></i> Shop</div>
-      <div class="column"><i class="sketchy icon slash"></i> Slash</div>
-      <div class="column"><i class="sketchy icon threed"></i> Threed</div>
-      <div class="column"><i class="sketchy icon timeline"></i> Timeline</div>
-      <div class="column"><i class="sketchy icon trash"></i> Trash</div>
-      <div class="column"><i class="sketchy icon trophy"></i> Trophy</div>
-      <div class="column"><i class="sketchy icon tumblr"></i> Tumblr</div>
-      <div class="column"><i class="sketchy icon tumblr filled"></i> Tumblr Filled</div>
-      <div class="column"><i class="sketchy icon twitter"></i> Twitter</div>
-      <div class="column"><i class="sketchy icon twitter filled"></i> Twitter Filled</div>
-      <div class="column"><i class="sketchy icon vine"></i> Vine</div>
-      <div class="column"><i class="sketchy icon vine filled"></i> Vine Filled</div>
-      <div class="column"><i class="sketchy icon vote down"></i> Vote Down</div>
-      <div class="column"><i class="sketchy icon vote up"></i> Vote Up</div>
-      <div class="column"><i class="sketchy icon x"></i> X</div>
-      <div class="column"><i class="sketchy icon x circle"></i> X Circle</div>
-      <div class="column"><i class="sketchy icon youtube"></i> Youtube</div>
-      <div class="column"><i class="sketchy icon youtube filled"></i> Youtube Filled</div>
-    </div>
-  </div>
-</div>

node/src/documents/quirky/ui-variations.html

@@ -1,230 +0,0 @@
----
-layout : 'default'
-css    : 'variations'
-
-title  : 'UI Variations'
-type   : 'Quirky Element'
----
-
-
-<link rel="stylesheet" type="text/css" class="ui" href="/overrides/quirky.css">
-<link rel="stylesheet" type="text/css" class="ui" href="/overrides/elements/segment.css">
-<link rel="stylesheet" type="text/css" class="ui" href="/overrides/elements/button.css">
-<link rel="stylesheet" type="text/css" class="ui" href="/overrides/elements/step.css">
-<link rel="stylesheet" type="text/css" class="ui" href="/overrides/elements/button.css">
-<link rel="stylesheet" type="text/css" class="ui" href="/overrides/collections/breadcrumb.css">
-<link rel="stylesheet" type="text/css" class="ui" href="/overrides/collections/menu.css">
-
-<div class="segment">
-  <div class="container">
-  <h1 class="ui dividing header">UI Variations</h1>
-  <p>These are overrides of elements used for Quirky.com</p>
-  </div>
-</div>
-<div class="main container">
-
-  <div class="peek">
-    <div class="ui vertical pointing secondary menu">
-      <a class="active item">Menu</a>
-      <a class="item">Segment</a>
-      <a class="item">Steps</a>
-      <a class="item">Breadcrumb</a>
-    </div>
-  </div>
-  
-  <h3 class="ui dividing header">Menu</h3>
-  
-  <div class="example">
-    <h4 class="ui header">Navigation</h4>
-    <div class="ui pointing navigation menu">
-      <a class="active item">
-        <i class="home sketchy icon"></i> Home
-      </a>
-      <a class="item">
-        <i class="sketchy pencil icon"></i> Edit
-      </a>
-      <a class="item">
-        <i class="sketchy photos icon"></i> Add Photos
-      </a>
-    </div>
-  </div>
-  
-  <div class="example">
-    <h4 class="ui header">Vertical</h4>
-    <div class="ui vertical pointing navigation menu">
-      <a class="active item">
-        <i class="home sketchy icon"></i> Home
-      </a>
-      <a class="item">
-        <i class="sketchy pencil icon"></i> Edit
-      </a>
-      <a class="item">
-        <i class="sketchy photos icon"></i> Add Photos
-      </a>
-    </div>
-  </div>
-  
-  <div class="example">
-    <h4 class="ui header">Pagination</h4>
-    <div class="ui pagination menu">
-      <a class="icon item">
-        <i class="icon left sketchy arrow"></i>
-      </a>
-      <a class="active item">
-        1
-      </a>
-      <div class="disabled item">
-        ...
-      </div>
-      <a class="item">
-        10
-      </a>
-      <a class="item">
-        11
-      </a>
-      <a class="item">
-        12
-      </a>
-      <a class="icon item">
-        <i class="icon right sketchy arrow"></i>
-      </a>
-    </div>
-  </div>
-  
-  <div class="example">
-    <h4 class="ui header">Circular</h4>
-    <div class="ui vertical sort circular text menu">
-      <a class="header item">Sort</a>
-      <a class="active item">
-        <i class="sketchy clock icon"></i>
-        Ending Soon
-      </a>
-      <a class="item">
-        <i class="sketchy newest icon"></i>
-        Newest
-      </a>
-    </div>
-  </div>
-  
-  <div class="example">
-    <h4 class="ui header">Categories</h4>
-    <div class="ui vertical categories circular text menu">
-      <a class="header item">Categories</a>
-      <a class="active all item">
-        <i class="sketchy all icon"></i>
-        All
-      </a>
-      <a class="kitchen item">
-        <i class="sketchy kitchen category icon"></i>
-        Kitchen
-      </a>
-      <a class="health item">
-        <i class="sketchy health category icon"></i>
-        Health & Fitness
-      </a>
-      <a class="home item">
-        <i class="sketchy home category icon"></i>
-        Home & Garden
-      </a>
-      <a class="electronics item">
-        <i class="sketchy electronics category icon"></i>
-        Electronics & Accessories
-      </a>
-      <a class="travel item">
-        <i class="sketchy travel category icon"></i>
-        Travel & Adventure
-      </a>
-      <a class="parenting item">
-        <i class="sketchy parenting category icon"></i>
-        Parenting
-      </a>
-      <a class="pets item">
-        <i class="sketchy pets category icon"></i>
-        Pets
-      </a>
-      <a class="pets item">
-        <i class="sketchy wildcard category icon"></i>
-        Wildcard
-      </a>
-    </div>
-  </div>
-  
-  
-  <h3 class="ui dividing header">Segment</h3>
-  <div class="example">
-    <h4 class="ui header">Segment</h4>
-    <div class="ui segment">
-      <p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
-    </div>
-  </div>
-  <div class="example">
-    <h4 class="ui header">Piled Segment</h4>
-    <div class="ui piled segment">
-      <h2>A header</h2>
-      <p>Te eum doming eirmod, nominati pertinacia argumentum ad his. Ex eam alia facete scriptorem, est autem aliquip detraxit at. Usu ocurreret referrentur at, cu epicurei appellantur vix. Cum ea laoreet recteque electram, eos choro alterum definiebas in. Vim dolorum definiebas an. Mei ex natum rebum iisque.</p>
-
-      <p>Audiam quaerendum eu sea, pro omittam definiebas ex. Te est latine definitiones. Quot wisi nulla ex duo. Vis sint solet expetenda ne, his te phaedrum referrentur consectetuer. Id vix fabulas oporteat, ei quo vide phaedrum, vim vivendum maiestatis in.</p>
-
-      <p>Eu quo homero blandit intellegebat. Incorrupte consequuntur mei id. Mei ut facer dolores adolescens, no illum aperiri quo, usu odio brute at. Qui te porro electram, ea dico facete utroque quo. Populo quodsi te eam, wisi everti eos ex, eum elitr altera utamur at. Quodsi convenire mnesarchum eu per, quas minimum postulant per id.</p>
-    </div>
-  </div>
-  
-  <h3 class="ui dividing header">Steps</h3>
-  
-  <div class="example">
-    <h4 class="ui header">Standard</h4>
-    <div class="ui steps">
-      <div class="ui completed step">
-        Shop
-      </div>
-      <div class="ui completed step">
-        Shipping
-      </div>
-      <div class="ui active step">
-        Billing
-      </div>
-      <div class="ui disabled step">
-        Confirm Order
-      </div>
-      <div class="ui disabled step">
-        Complete
-      </div>
-    </div>
-  </div>
-  
-  <div class="example">
-    <h4 class="ui header">Icon</h4>
-    <div class="ui steps">
-      <div class="ui completed step">
-        <i class="icon sketchy tagline phase"></i>
-        Elevator Pitch
-      </div>
-      <div class="ui completed step">
-        <i class="icon sketchy research phase"></i>
-        Describe Your Idea
-      </div>
-      <div class="ui active step">
-        <i class="icon sketchy photos"></i>
-        Images & Media
-      </div>
-      <div class="ui disabled step">
-        <i class="icon sketchy checkmark circle"></i>
-        Review Your Submission
-      </div>
-    </div>
-  </div>
-  
-  <h3 class="ui dividing header">Breadcrumb</h3>
-  
-  <h4 class="ui header">Standard</h4>
-  <div class="example">
-    <div class="ui breadcrumb">
-      <a class="section">Submissions</a>
-      <i class="sketchy slash icon divider"></i>
-      <a class="section">Kitchen</a>
-      <i class="sketchy slash icon divider"></i>
-      <div class="active section">Newest</div>
-    </div>  
-  </div>
-  
-</div>

node/src/files/components/semantic/collections/menu.css

@@ -205,7 +205,7 @@
 ---------------*/
 .ui.menu .item > .label,
 .ui.menu .item > a > .label {
-  font-size: 0.8em;
+  font-size: 0.875em;
   margin: -0.3em 0em -0.3em 0.3em;
   padding: 0.3em 0.8em;
   vertical-align: baseline;
@@ -379,7 +379,7 @@
   margin: 0em;
 }
 .ui.vertical.menu .dropdown.item .menu .item {
-  font-size: 0.9em;
+  font-size: 0.875em;
   padding: 0.75em 1em;
 }
 .ui.vertical.menu .dropdown.item .menu .item .icon {
@@ -391,7 +391,7 @@
 }
 .ui.vertical.menu .item > .menu > .item {
   padding: 0.5rem 1.5rem;
-  font-size: 0.85em;
+  font-size: 0.875em;
 }
 .ui.vertical.menu .item > .menu > .item:before {
   display: none;
@@ -422,7 +422,7 @@
   color: #FFFFFF;
 }
 .ui.tiered.menu .sub.menu .item {
-  font-size: 0.9rem;
+  font-size: 0.875rem;
 }
 .ui.tiered.menu .sub.menu .item:before {
   background-image: none;
@@ -705,7 +705,7 @@
   background-color: transparent;
   opacity: 1;
   color: rgba(50, 50, 50, 0.8);
-  font-size: 0.9rem;
+  font-size: 0.875rem;
   padding: 0em;
   text-transform: uppercase;
   font-weight: bold;
@@ -1186,16 +1186,20 @@
   transition: background 0.2s ease
   ;
 }
+/* Don't double up pointers */
+.ui.pointing.menu .active.item .menu .active.item:after {
+  display: none;
+}
 .ui.vertical.pointing.menu .active.item:after {
   position: absolute;
   top: 50%;
+  margin-top: -0.3em;
   right: -0.4em;
   bottom: auto;
   left: auto;
   border: none;
   border-top: 1px solid rgba(0, 0, 0, 0.1);
   border-right: 1px solid rgba(0, 0, 0, 0.1);
-  margin-top: -0.3em;
 }
 /* Colors */
 .ui.pointing.menu .active.item:after {

node/src/files/components/semantic/elements/label.css

@@ -531,9 +531,6 @@ a.ui.teal.tag.label:hover:before {
   top: -1em;
   left: 100%;
   margin: 0em 0em 0em -1.5em !important;
-  -webkit-box-shadow: 0px -2px 0 0px rgba(0, 0, 0, 0.1) inset;
-  -moz-box-shadow: 0px -2px 0 0px rgba(0, 0, 0, 0.1) inset;
-  box-shadow: 0px -2px 0 0px rgba(0, 0, 0, 0.1) inset;
 }
 /*-------------------
         Sizes

node/src/files/components/semantic/modules/accordion.css

@@ -44,6 +44,19 @@
   margin: 0em;
   padding: 1.3em 1em;
 }
+/*--------------
+ Loose Coupling
+---------------*/
+.ui.basic.accordion.menu {
+  background-color: #FFFFFF;
+  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
+  -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
+  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
+}
+.ui.basic.accordion.menu .title,
+.ui.basic.accordion.menu .content {
+  padding: 0em;
+}
 /*******************************
             States
 *******************************/

node/src/files/components/semantic/modules/accordion.js

@@ -90,6 +90,14 @@ $.fn.accordion = function(parameters) {
             else {
               module.open(activeIndex);
             }
+          },
+
+          resetStyle: function() {
+            $(this)
+              .removeAttr('style')
+              .children()
+                .removeAttr('style')
+            ;
           }
 
         },
@@ -113,7 +121,7 @@ $.fn.accordion = function(parameters) {
                 .children()
                   .animate({
                     opacity: 0
-                  }, settings.speed)
+                  }, settings.speed, module.event.resetStyle)
                   .end()
                 .slideUp(settings.speed , settings.easing, function() {
                   $previousContent
@@ -161,7 +169,7 @@ $.fn.accordion = function(parameters) {
             .children()
               .animate({
                 opacity: 0
-              }, settings.speed)
+              }, settings.speed, module.event.resetStyle)
               .end()
             .slideUp(settings.speed, settings.easing, function(){
               $activeContent
@@ -329,7 +337,7 @@ $.fn.accordion.settings = {
 
   debug       : true,
   verbose     : true,
-  performance : true,
+  performance : false,
   
   exclusive   : true,
   collapsible : true,

node/src/files/stylesheets/semantic.css

@@ -236,6 +236,7 @@ a:hover {
   -webkit-border-radius: 0px;
   -moz-border-radius: 0px;
   border-radius: 0px;
+  font-size: 0.85em;
 }
 
 #example .sidr .ui.menu {

node/src/layouts/default.html.eco

@@ -1,7 +1,6 @@
 <!DOCTYPE html>
 
 <% uiGuide           = @getCollection("documents").findAllLive({type: $in: ['UI Guide']},[{title: 1}]).toJSON() %>
-<% quirkyElements    = @getCollection("documents").findAllLive({type: $in: ['Quirky Element']},[{title: 1}]).toJSON() %>
 <% uiElements        = @getCollection("documents").findAllLive({type: $in: ['UI Element']},[{title: 1}]).toJSON() %>
 <% uiCollections     = @getCollection("documents").findAllLive({type: $in: ['UI Collection']},[{title: 1}]).toJSON() %>
 <% uiViews           = @getCollection("documents").findAllLive({type: $in: ['UI View']},[{title: 1}]).toJSON() %>
@@ -87,14 +86,6 @@
   <div class="ui large vertical inverted labeled icon menu" id="menu">
     <div class="item"><a href="/playground.html"><i class="inverted red circular lab icon"></i> <b>Playground</b></a></div>
     <div class="item"><a href="/download.html"><i class="inverted circular upload icon"></i> <b>Download</b></a></div>
-    <div class="item">
-      <b>Quirky</b>
-      <div class="menu">
-        <% for element in quirkyElements: %>
-          <a class="<%= if element.id is @document.id then 'active ' %>item" href="<%= element.url %>"><%= element.title %></a>
-        <% end %>
-      </div>
-    </div>
     <div class="item">
       <a href="/element.html"><b>Elements</b></a>
       <div class="menu">