iteration on feed, menu fixes for icons

build/minified/elements/header.min.css

@@ -1 +1 @@
-.ui.header{border:0;margin:1em 0 1rem;padding:0;font-size:1.33em;font-weight:700;line-height:1.33}.ui.header .ui.sub.header,.ui.header .sub.header{font-size:1rem;font-weight:400;margin:0;padding:0;line-height:1.2;color:rgba(0,0,0,.5)}.ui.header:first-child{margin-top:0}.ui.header+p{margin-top:0}h1.ui.header{min-height:1rem;line-height:1.33;font-size:2rem}h2.ui.header{line-height:1.33;font-size:1.75rem}h3.ui.header{line-height:1.33;font-size:1.33rem}h4.ui.header{line-height:1.33;font-size:1.1rem}h5.ui.header{line-height:1.2;font-size:1rem}.ui.huge.header{min-height:1em;font-size:2em}.ui.large.header{font-size:1.75em}.ui.medium.header{font-size:1.33em}.ui.small.header{font-size:1.1em}.ui.tiny.header{font-size:1em}.ui.disabled.header{opacity:.5}.ui.blue.header{color:#6ECFF5!important}.ui.black.header{color:#5C6166!important}.ui.green.header{color:#A1CF64!important}.ui.red.header{color:#EF4D6D!important}.ui.purple.header{color:#564F8A!important}.ui.teal.header{color:#00B5AD!important}.ui.blue.block.header{background-color:#E6EEF1;border-left:.2em solid #6ECFF5}.ui.black.block.header{background-color:#EAEAEA;border-left:.2em solid #5C6166}.ui.green.block.header{background-color:#EFF8E4;border-left:.2em solid #A1CF64}.ui.red.block.header{background-color:#F6E5E8;border-left:.2em solid #EF4D6D}.ui.purple.block.header{background-color:#EFEDF8;border-left:.2em solid #564F8A}.ui.teal.block.header{background-color:#E9F7F6;border-left:.2em solid #00B5AD}.ui.inverted.header{background-color:#222;color:#FFF}.ui.inverted.black.header{background-color:#5C6166!important;color:#FFF!important}.ui.inverted.blue.header{background-color:#6ECFF5!important;color:#FFF!important}.ui.inverted.green.header{background-color:#A1CF64!important;color:#FFF!important}.ui.inverted.red.header{background-color:#EF4D6D!important;color:#FFF!important}.ui.inverted.purple.header{background-color:#564F8A!important;color:#FFF!important}.ui.inverted.teal.header{background-color:#00B5AD!important;color:#FFF!important}.ui.inverted.block.header{border-left:0}.ui.left.aligned.header{text-align:left}.ui.right.aligned.header{text-align:right}.ui.center.aligned.header{text-align:center}.ui.floated.header,.ui.left.floated.header{float:left}.ui.right.floated.header{float:right}.ui.block.header{background-color:#F0F0F0;padding:.5em 1em}.ui.dividing.header{padding-bottom:.2rem;border-bottom:1px solid rgba(0,0,0,.1)}.ui.attached.header{padding:.7em 1rem;-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.top.attached.header{margin-bottom:0;-webkit-border-radius:.3125em .3125em 0 0;-moz-border-radius:.3125em .3125em 0 0;border-radius:.3125em .3125em 0 0}.ui.bottom.attached.header{margin-top:0;-webkit-border-radius:0 0 .3125em .3125em;-moz-border-radius:0 0 .3125em .3125em;border-radius:0 0 .3125em .3125em}.ui.header.icon{display:inline-block;text-align:center}.ui.header.icon .icon{display:block;font-size:4em;margin:0rem auto 2rem}
+.ui.header{border:0;margin:1em 0 1rem;padding:0;font-size:1.33em;font-weight:700;line-height:1.33}.ui.header .ui.sub.header,.ui.header .sub.header{font-size:1rem;font-weight:400;margin:0;padding:0;line-height:1.2;color:rgba(0,0,0,.5)}.ui.header:first-child{margin-top:0}.ui.header+p{margin-top:0}h1.ui.header{min-height:1rem;line-height:1.33;font-size:2rem}h2.ui.header{line-height:1.33;font-size:1.75rem}h3.ui.header{line-height:1.33;font-size:1.33rem}h4.ui.header{line-height:1.33;font-size:1.1rem}h5.ui.header{line-height:1.2;font-size:1rem}.ui.huge.header{min-height:1em;font-size:2em}.ui.large.header{font-size:1.75em}.ui.medium.header{font-size:1.33em}.ui.small.header{font-size:1.1em}.ui.tiny.header{font-size:1em}.ui.disabled.header{opacity:.5}.ui.blue.header{color:#6ECFF5!important}.ui.black.header{color:#5C6166!important}.ui.green.header{color:#A1CF64!important}.ui.red.header{color:#EF4D6D!important}.ui.purple.header{color:#564F8A!important}.ui.teal.header{color:#00B5AD!important}.ui.blue.block.header{background-color:#E6EEF1;border-left:.2em solid #6ECFF5}.ui.black.block.header{background-color:#EAEAEA;border-left:.2em solid #5C6166}.ui.green.block.header{background-color:#EFF8E4;border-left:.2em solid #A1CF64}.ui.red.block.header{background-color:#F6E5E8;border-left:.2em solid #EF4D6D}.ui.purple.block.header{background-color:#EFEDF8;border-left:.2em solid #564F8A}.ui.teal.block.header{background-color:#E9F7F6;border-left:.2em solid #00B5AD}.ui.inverted.header{background-color:#222;color:#FFF}.ui.inverted.black.header{background-color:#5C6166!important;color:#FFF!important}.ui.inverted.blue.header{background-color:#6ECFF5!important;color:#FFF!important}.ui.inverted.green.header{background-color:#A1CF64!important;color:#FFF!important}.ui.inverted.red.header{background-color:#EF4D6D!important;color:#FFF!important}.ui.inverted.purple.header{background-color:#564F8A!important;color:#FFF!important}.ui.inverted.teal.header{background-color:#00B5AD!important;color:#FFF!important}.ui.inverted.block.header{border-left:0}.ui.left.aligned.header{text-align:left}.ui.right.aligned.header{text-align:right}.ui.center.aligned.header{text-align:center}.ui.floated.header,.ui.left.floated.header{float:left}.ui.right.floated.header{float:right}.ui.fitted.header{padding:0}.ui.block.header{background-color:#F5F5F5;padding:.5em 1em}.ui.dividing.header{padding-bottom:.2rem;border-bottom:1px solid rgba(0,0,0,.1)}.ui.attached.header{padding:.7em 1rem;-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.top.attached.header{margin-bottom:0;-webkit-border-radius:.3125em .3125em 0 0;-moz-border-radius:.3125em .3125em 0 0;border-radius:.3125em .3125em 0 0}.ui.bottom.attached.header{margin-top:0;-webkit-border-radius:0 0 .3125em .3125em;-moz-border-radius:0 0 .3125em .3125em;border-radius:0 0 .3125em .3125em}.ui.header.icon{display:inline-block;text-align:center}.ui.header.icon .icon{display:block;font-size:4em;margin:0rem auto 2rem}

build/minified/views/feed.min.css

@@ -1 +1 @@
-.ui.feed a{cursor:pointer}.ui.feed .event{width:100%;display:table;border-top:1px dotted rgba(0,0,0,.1);padding:1em;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}.ui.feed .event:first-child{border-top:0}.ui.feed .label{width:3em;display:table-cell;vertical-align:top;text-align:left}.ui.feed .label .icon{font-size:1.75em;margin:0}.ui.feed .label img{width:3.25em;padding:.25em;margin:0;border-radius:50em}.ui.feed .content{display:table-cell;vertical-align:top;text-align:left;padding:1em 1em 0}.ui.feed .content .date{float:right;color:rgba(0,0,0,.4)}.ui.feed .content .summary{color:rgba(0,0,0,.75)}.ui.feed .content .summary img{display:inline-block;margin-right:.25em;width:4em;border-radius:500px}.ui.feed .content .extra{margin:1em 0 0;padding:.5em 0 0;color:rgba(0,0,0,.5)}.ui.feed .content .extra.images img{display:inline-block;margin-right:1em;width:9em}.ui.feed .content .extra.text{padding:.5em 1em;border-left:.2em solid rgba(0,0,0,.1)}
+.ui.feed a{cursor:pointer}.ui.feed .event{width:100%;display:table;padding:1em;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}.ui.feed .event:first-child{border-top:0}.ui.feed .event:last-child{margin-bottom:2em}.ui.feed .label{width:3em;display:table-cell;vertical-align:top;text-align:left}.ui.feed .label .icon{font-size:1.5em;margin:0}.ui.feed .label img{width:3em;margin:0;border-radius:50em}.ui.feed .content{display:table-cell;vertical-align:top;text-align:left;padding:1em 1em 0}.ui.feed .content .date{float:right;color:rgba(0,0,0,.4)}.ui.feed .content .summary{color:rgba(0,0,0,.75)}.ui.feed .content .summary img{display:inline-block;margin-right:.25em;width:4em;border-radius:500px}.ui.feed .content .extra{margin:1em 0 0;padding:.5em 0 0;color:rgba(0,0,0,.5)}.ui.feed .content .extra.images img{display:inline-block;margin-right:.25em;width:6em}.ui.feed .content .extra.text{padding:.5em 1em;border-left:.2em solid rgba(0,0,0,.1)}.ui.small.feed .label img{width:2.5em}.ui.small.feed .label .icon{font-size:1.25em}.ui.feed .event{padding:.75em 0}.ui.small.feed .content{padding:.5em .5em 0}.ui.small.feed .content .extra.images img{width:5em}.ui.small.feed .content .extra{margin:.5em 0 0}.ui.feed .content .extra.text{padding:.25em .5em}

build/uncompressed/collections/menu.css

@@ -854,6 +854,10 @@
 .ui.icon.menu .icon:before {
   opacity: 1;
 }
+/* Item Icon Only */
+.ui.menu .icon.item .icon {
+  margin: 0em;
+}
 /*--- inverted ---*/
 .ui.inverted.icon.menu .item {
   color: rgba(255, 255, 255, 0.8);

build/uncompressed/elements/button.css

@@ -446,7 +446,6 @@ Containing Icon
 .ui.icon.buttons .button i,
 .ui.icon.button i {
   margin: 0em;
-  vertical-align: top;
 }
 /*--------------
    Labeled Icon
@@ -532,10 +531,10 @@ Containing Icon
 /*--------------
      Bubbly
 ---------------*/
-.ui.button.bubbly {
-  -webkit-border-radius: 1em;
-  -moz-border-radius: 1em;
-  border-radius: 1em;
+.ui.circular.button {
+  -webkit-border-radius: 10em;
+  -moz-border-radius: 10em;
+  border-radius: 10em;
 }
 /*--------------
      Attached
@@ -599,64 +598,9 @@ input:focus + .ui.attached.button {
 .ui.attached.button.loading.hover {
   opacity: 1;
 }
-/*******************************
-      Buttons (Button Group)
-*******************************/
-.ui.buttons {
-  overflow: hidden;
-}
-.ui.buttons .button {
-  float: left;
-  -webkit-border-radius: 0em;
-  -moz-border-radius: 0em;
-  border-radius: 0em;
-  border-left: 1px solid rgba(0, 0, 0, 0.05);
-}
-.ui.buttons .button:first-child {
-  margin-left: 0em;
-  border-top-left-radius: 0.3125em;
-  border-bottom-left-radius: 0.3125em;
-}
-.ui.buttons .button:last-child {
-  border-top-right-radius: 0.3125em;
-  border-bottom-right-radius: 0.3125em;
-}
-/* Vertical  Style */
-.ui.buttons.vertical {
-  display: inline-block;
-}
-.ui.buttons.vertical .button {
-  display: block;
-  float: none;
-  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
-  border-left: none;
-  box-shadow: none;
-}
-.ui.buttons.vertical .button:first-child,
-.ui.buttons.vertical .mini.button:first-child,
-.ui.buttons.vertical .tiny.button:first-child,
-.ui.buttons.vertical .small.button:first-child,
-.ui.buttons.vertical .massive.button:first-child,
-.ui.buttons.vertical .huge.button:first-child {
-  margin-top: 0px;
-  -moz-border-radius: 0.3125em 0.3125em 0px 0px;
-  -webkit-border-radius: 0.3125em 0.3125em 0px 0px;
-  border-radius: 0.3125em 0.3125em 0px 0px;
-}
-.ui.buttons.vertical .button:last-child,
-.ui.buttons.vertical .mini.button:last-child,
-.ui.buttons.vertical .tiny.button:last-child,
-.ui.buttons.vertical .small.button:last-child,
-.ui.buttons.vertical .massive.button:last-child,
-.ui.buttons.vertical .huge.button:last-child,
-.ui.buttons.vertical .gigantic.button:last-child {
-  -moz-border-radius: 0px 0px 0.3125em 0.3125em;
-  -webkit-border-radius: 0px 0px 0.3125em 0.3125em;
-  border-radius: 0px 0px 0.3125em 0.3125em;
-}
-/*******************************
-       OR Button Divisions
-*******************************/
+/*-------------------
+      Or Buttons
+--------------------*/
 .ui.buttons .or {
   position: relative;
   float: left;
@@ -868,3 +812,58 @@ input:focus + .ui.attached.button {
 .ui.twelve.fluid.buttons > .button {
   height: 8.3333%;
 }
+/*******************************
+            Groups
+*******************************/
+.ui.buttons {
+  overflow: hidden;
+}
+.ui.buttons .button {
+  float: left;
+  -webkit-border-radius: 0em;
+  -moz-border-radius: 0em;
+  border-radius: 0em;
+  border-left: 1px solid rgba(0, 0, 0, 0.05);
+}
+.ui.buttons .button:first-child {
+  margin-left: 0em;
+  border-top-left-radius: 0.3125em;
+  border-bottom-left-radius: 0.3125em;
+}
+.ui.buttons .button:last-child {
+  border-top-right-radius: 0.3125em;
+  border-bottom-right-radius: 0.3125em;
+}
+/* Vertical  Style */
+.ui.buttons.vertical {
+  display: inline-block;
+}
+.ui.buttons.vertical .button {
+  display: block;
+  float: none;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
+  border-left: none;
+  box-shadow: none;
+}
+.ui.buttons.vertical .button:first-child,
+.ui.buttons.vertical .mini.button:first-child,
+.ui.buttons.vertical .tiny.button:first-child,
+.ui.buttons.vertical .small.button:first-child,
+.ui.buttons.vertical .massive.button:first-child,
+.ui.buttons.vertical .huge.button:first-child {
+  margin-top: 0px;
+  -moz-border-radius: 0.3125em 0.3125em 0px 0px;
+  -webkit-border-radius: 0.3125em 0.3125em 0px 0px;
+  border-radius: 0.3125em 0.3125em 0px 0px;
+}
+.ui.buttons.vertical .button:last-child,
+.ui.buttons.vertical .mini.button:last-child,
+.ui.buttons.vertical .tiny.button:last-child,
+.ui.buttons.vertical .small.button:last-child,
+.ui.buttons.vertical .massive.button:last-child,
+.ui.buttons.vertical .huge.button:last-child,
+.ui.buttons.vertical .gigantic.button:last-child {
+  -moz-border-radius: 0px 0px 0.3125em 0.3125em;
+  -webkit-border-radius: 0px 0px 0.3125em 0.3125em;
+  border-radius: 0px 0px 0.3125em 0.3125em;
+}

build/uncompressed/elements/header.css

@@ -193,11 +193,17 @@ h5.ui.header {
 .ui.right.floated.header {
   float: right;
 }
+/*-------------------
+       Fittted
+--------------------*/
+.ui.fitted.header {
+  padding: 0em;
+}
 /*-------------------
         Block
 --------------------*/
 .ui.block.header {
-  background-color: #F0F0F0;
+  background-color: #F5F5F5;
   padding: 0.5em 1em;
 }
 /*-------------------

build/uncompressed/views/feed.css

@@ -22,7 +22,6 @@
 .ui.feed .event {
   width: 100%;
   display: table;
-  border-top: 1px dotted rgba(0, 0, 0, 0.1);
   padding: 1em;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
@@ -32,6 +31,9 @@
 .ui.feed .event:first-child {
   border-top: 0px;
 }
+.ui.feed .event:last-child {
+  margin-bottom: 2em;
+}
 /* Event Label */
 .ui.feed .label {
   width: 3em;
@@ -40,12 +42,11 @@
   text-align: left;
 }
 .ui.feed .label .icon {
-  font-size: 1.75em;
+  font-size: 1.5em;
   margin: 0em;
 }
 .ui.feed .label img {
-  width: 3.25em;
-  padding: 0.25em;
+  width: 3em;
   margin: 0em;
   border-radius: 50em;
 }
@@ -79,10 +80,34 @@
 }
 .ui.feed .content .extra.images img {
   display: inline-block;
-  margin-right: 1em;
-  width: 9em;
+  margin-right: 0.25em;
+  width: 6em;
 }
 .ui.feed .content .extra.text {
   padding: 0.5em 1em;
   border-left: 0.2em solid rgba(0, 0, 0, 0.1);
 }
+/*******************************
+            Variations
+*******************************/
+.ui.small.feed .label img {
+  width: 2.5em;
+}
+.ui.small.feed .label .icon {
+  font-size: 1.25em;
+}
+.ui.feed .event {
+  padding: 0.75em 0em;
+}
+.ui.small.feed .content {
+  padding: 0.5em 0.5em 0;
+}
+.ui.small.feed .content .extra.images img {
+  width: 5em;
+}
+.ui.small.feed .content .extra {
+  margin: 0.5em 0em 0em;
+}
+.ui.feed .content .extra.text {
+  padding: 0.25em 0.5em;
+}

node/src/documents/elements/button.html

@@ -163,9 +163,10 @@ type   : 'UI Element'
   </div>
 
   <div class="example">
-    <h4 class="ui header">Bubbly</h4>
-    <p>Can be bubbly:</p>
-    <div class="bubbly ui button">More bubbly</div>
+    <h4 class="ui header">Circular</h4>
+    <p>Can be circular:</p>
+    <div class="circular ui button">Rounded</div>
+    <div class="circular ui icon button"><i class="icon settings"></i></div>
   </div>
 
   <div class="example">

node/src/documents/views/feed.html

@@ -24,9 +24,8 @@ type   : 'UI View'
   <h2 class="ui dividing header">Standard</h2>
 
   <div class="example">
-    <h4 class="ui header">Feed</h4>
-    <div class="ui fitted feed segment">
-
+    <div class="ui red feed segment">
+      <h3 class="ui header">Recent Activity</h3>
       <div class="event">
         <div class="label">
           <img src="/images/demo/avatar2.jpg">
@@ -168,4 +167,94 @@ type   : 'UI View'
   </div>
 
 
+  <h2 class="ui dividing header">Variations</h2>
+
+
+  <div class="example">
+    <h4 class="ui header">Sizes</h4>
+    <p>A feed can have different sizes</p>
+
+    <div class="ui small blue feed segment" style="width: 540px;">
+      <h4 class="ui header">Recent Activity</h4>
+      <div class="event">
+        <div class="label">
+          <img src="/images/demo/avatar2.jpg">
+        </div>
+        <div class="content">
+          <div class="date">
+            Just moments ago
+          </div>
+          <div class="summary">
+             <a>Sally Poodle</a> added you as a friend
+          </div>
+        </div>
+      </div>
+      <div class="event">
+        <div class="label">
+          <i class="icon circular idea"></i>
+        </div>
+        <div class="content">
+          <div class="date">
+            3 days ago
+          </div>
+          <div class="summary">
+            You submitted a new post to the page
+          </div>
+          <div class="extra text">
+            I am a dog and I do not know how to make a post
+          </div>
+        </div>
+      </div>
+      <div class="event">
+        <div class="label">
+          <i class="icon circular photos"></i>
+        </div>
+        <div class="content">
+          <div class="date">
+            3 days ago
+          </div>
+          <div class="summary">
+            <a>Sally Poodle</a> added <a>2 new photos</a> of you
+          </div>
+          <div class="extra images">
+            <img src="/images/demo/item1.jpg">
+            <img src="/images/demo/item2.jpg">
+          </div>
+        </div>
+      </div>
+      <div class="event">
+        <div class="label">
+          <img src="/images/demo/avatar.jpg">
+        </div>
+        <div class="content">
+          <div class="date">
+            Just moments ago
+          </div>
+          <div class="summary">
+            <a>James Doggington</a> added you as a friend
+          </div>
+        </div>
+      </div>
+      <div class="event">
+        <div class="label">
+          <i class="icon circular idea"></i>
+        </div>
+        <div class="content">
+          <div class="date">
+            3 days ago
+          </div>
+          <div class="summary">
+            You submitted a new post to the page
+          </div>
+          <div class="extra text">
+            I am a dog and I do not know how to make a post
+          </div>
+        </div>
+      </div>
+    </div>
+
+
+  </div>
+
+
 </div>

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

@@ -854,6 +854,10 @@
 .ui.icon.menu .icon:before {
   opacity: 1;
 }
+/* Item Icon Only */
+.ui.menu .icon.item .icon {
+  margin: 0em;
+}
 /*--- inverted ---*/
 .ui.inverted.icon.menu .item {
   color: rgba(255, 255, 255, 0.8);

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

@@ -446,7 +446,6 @@ Containing Icon
 .ui.icon.buttons .button i,
 .ui.icon.button i {
   margin: 0em;
-  vertical-align: top;
 }
 /*--------------
    Labeled Icon
@@ -532,10 +531,10 @@ Containing Icon
 /*--------------
      Bubbly
 ---------------*/
-.ui.button.bubbly {
-  -webkit-border-radius: 1em;
-  -moz-border-radius: 1em;
-  border-radius: 1em;
+.ui.circular.button {
+  -webkit-border-radius: 10em;
+  -moz-border-radius: 10em;
+  border-radius: 10em;
 }
 /*--------------
      Attached
@@ -599,64 +598,9 @@ input:focus + .ui.attached.button {
 .ui.attached.button.loading.hover {
   opacity: 1;
 }
-/*******************************
-      Buttons (Button Group)
-*******************************/
-.ui.buttons {
-  overflow: hidden;
-}
-.ui.buttons .button {
-  float: left;
-  -webkit-border-radius: 0em;
-  -moz-border-radius: 0em;
-  border-radius: 0em;
-  border-left: 1px solid rgba(0, 0, 0, 0.05);
-}
-.ui.buttons .button:first-child {
-  margin-left: 0em;
-  border-top-left-radius: 0.3125em;
-  border-bottom-left-radius: 0.3125em;
-}
-.ui.buttons .button:last-child {
-  border-top-right-radius: 0.3125em;
-  border-bottom-right-radius: 0.3125em;
-}
-/* Vertical  Style */
-.ui.buttons.vertical {
-  display: inline-block;
-}
-.ui.buttons.vertical .button {
-  display: block;
-  float: none;
-  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
-  border-left: none;
-  box-shadow: none;
-}
-.ui.buttons.vertical .button:first-child,
-.ui.buttons.vertical .mini.button:first-child,
-.ui.buttons.vertical .tiny.button:first-child,
-.ui.buttons.vertical .small.button:first-child,
-.ui.buttons.vertical .massive.button:first-child,
-.ui.buttons.vertical .huge.button:first-child {
-  margin-top: 0px;
-  -moz-border-radius: 0.3125em 0.3125em 0px 0px;
-  -webkit-border-radius: 0.3125em 0.3125em 0px 0px;
-  border-radius: 0.3125em 0.3125em 0px 0px;
-}
-.ui.buttons.vertical .button:last-child,
-.ui.buttons.vertical .mini.button:last-child,
-.ui.buttons.vertical .tiny.button:last-child,
-.ui.buttons.vertical .small.button:last-child,
-.ui.buttons.vertical .massive.button:last-child,
-.ui.buttons.vertical .huge.button:last-child,
-.ui.buttons.vertical .gigantic.button:last-child {
-  -moz-border-radius: 0px 0px 0.3125em 0.3125em;
-  -webkit-border-radius: 0px 0px 0.3125em 0.3125em;
-  border-radius: 0px 0px 0.3125em 0.3125em;
-}
-/*******************************
-       OR Button Divisions
-*******************************/
+/*-------------------
+      Or Buttons
+--------------------*/
 .ui.buttons .or {
   position: relative;
   float: left;
@@ -868,3 +812,58 @@ input:focus + .ui.attached.button {
 .ui.twelve.fluid.buttons > .button {
   height: 8.3333%;
 }
+/*******************************
+            Groups
+*******************************/
+.ui.buttons {
+  overflow: hidden;
+}
+.ui.buttons .button {
+  float: left;
+  -webkit-border-radius: 0em;
+  -moz-border-radius: 0em;
+  border-radius: 0em;
+  border-left: 1px solid rgba(0, 0, 0, 0.05);
+}
+.ui.buttons .button:first-child {
+  margin-left: 0em;
+  border-top-left-radius: 0.3125em;
+  border-bottom-left-radius: 0.3125em;
+}
+.ui.buttons .button:last-child {
+  border-top-right-radius: 0.3125em;
+  border-bottom-right-radius: 0.3125em;
+}
+/* Vertical  Style */
+.ui.buttons.vertical {
+  display: inline-block;
+}
+.ui.buttons.vertical .button {
+  display: block;
+  float: none;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
+  border-left: none;
+  box-shadow: none;
+}
+.ui.buttons.vertical .button:first-child,
+.ui.buttons.vertical .mini.button:first-child,
+.ui.buttons.vertical .tiny.button:first-child,
+.ui.buttons.vertical .small.button:first-child,
+.ui.buttons.vertical .massive.button:first-child,
+.ui.buttons.vertical .huge.button:first-child {
+  margin-top: 0px;
+  -moz-border-radius: 0.3125em 0.3125em 0px 0px;
+  -webkit-border-radius: 0.3125em 0.3125em 0px 0px;
+  border-radius: 0.3125em 0.3125em 0px 0px;
+}
+.ui.buttons.vertical .button:last-child,
+.ui.buttons.vertical .mini.button:last-child,
+.ui.buttons.vertical .tiny.button:last-child,
+.ui.buttons.vertical .small.button:last-child,
+.ui.buttons.vertical .massive.button:last-child,
+.ui.buttons.vertical .huge.button:last-child,
+.ui.buttons.vertical .gigantic.button:last-child {
+  -moz-border-radius: 0px 0px 0.3125em 0.3125em;
+  -webkit-border-radius: 0px 0px 0.3125em 0.3125em;
+  border-radius: 0px 0px 0.3125em 0.3125em;
+}

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

@@ -193,11 +193,17 @@ h5.ui.header {
 .ui.right.floated.header {
   float: right;
 }
+/*-------------------
+       Fittted
+--------------------*/
+.ui.fitted.header {
+  padding: 0em;
+}
 /*-------------------
         Block
 --------------------*/
 .ui.block.header {
-  background-color: #F0F0F0;
+  background-color: #F5F5F5;
   padding: 0.5em 1em;
 }
 /*-------------------

node/src/files/components/semantic/views/feed.css

@@ -22,7 +22,6 @@
 .ui.feed .event {
   width: 100%;
   display: table;
-  border-top: 1px dotted rgba(0, 0, 0, 0.1);
   padding: 1em;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
@@ -32,6 +31,9 @@
 .ui.feed .event:first-child {
   border-top: 0px;
 }
+.ui.feed .event:last-child {
+  margin-bottom: 2em;
+}
 /* Event Label */
 .ui.feed .label {
   width: 3em;
@@ -40,12 +42,11 @@
   text-align: left;
 }
 .ui.feed .label .icon {
-  font-size: 1.75em;
+  font-size: 1.5em;
   margin: 0em;
 }
 .ui.feed .label img {
-  width: 3.25em;
-  padding: 0.25em;
+  width: 3em;
   margin: 0em;
   border-radius: 50em;
 }
@@ -79,10 +80,34 @@
 }
 .ui.feed .content .extra.images img {
   display: inline-block;
-  margin-right: 1em;
-  width: 9em;
+  margin-right: 0.25em;
+  width: 6em;
 }
 .ui.feed .content .extra.text {
   padding: 0.5em 1em;
   border-left: 0.2em solid rgba(0, 0, 0, 0.1);
 }
+/*******************************
+            Variations
+*******************************/
+.ui.small.feed .label img {
+  width: 2.5em;
+}
+.ui.small.feed .label .icon {
+  font-size: 1.25em;
+}
+.ui.feed .event {
+  padding: 0.75em 0em;
+}
+.ui.small.feed .content {
+  padding: 0.5em 0.5em 0;
+}
+.ui.small.feed .content .extra.images img {
+  width: 5em;
+}
+.ui.small.feed .content .extra {
+  margin: 0.5em 0em 0em;
+}
+.ui.feed .content .extra.text {
+  padding: 0.25em 0.5em;
+}

node/src/files/stylesheets/semantic.css

@@ -765,7 +765,7 @@ box-shadow: 3px 0px 2px rgba(0, 0, 0, 0.2); */
 #example h4 + .example i.code {
   top: 0px;
 }
-#example .example h4 {
+#example .example > h4 {
   margin-bottom: 0em;
 }
 #example .example {

node/src/files/stylesheets/shape.css

@@ -3,6 +3,12 @@
         Shapes Example
 *******************************/
 
+
+#example.shape .ui.header {
+  clear: both;
+  margin-top: 1rem;
+}
+
 #example .dog.shape {
   float: left;
   margin: 0 1em 3em 0;
@@ -41,11 +47,6 @@
   width: 140px;
 }
 
-#example .ui.header {
-  clear: both;
-  margin-top: 1rem;
-}
-
 
 #example .demo.shape {
 

src/collections/menu.less

@@ -1111,6 +1111,11 @@
   opacity: 1;
 }
 
+/* Item Icon Only */
+.ui.menu .icon.item .icon {
+  margin: 0em;
+}
+
 /*--- inverted ---*/
 .ui.inverted.icon.menu .item {
   color: rgba(255, 255, 255, 0.8);

src/elements/button.less

@@ -545,7 +545,6 @@ Containing Icon
 .ui.icon.buttons .button i,
 .ui.icon.button i {
   margin: 0em;
-  vertical-align: top;
 }
 
 
@@ -654,10 +653,10 @@ Containing Icon
      Bubbly
 ---------------*/
 
-.ui.button.bubbly {
-  -webkit-border-radius: 1em;
-  -moz-border-radius: 1em;
-  border-radius: 1em;
+.ui.circular.button {
+  -webkit-border-radius: 10em;
+  -moz-border-radius: 10em;
+  border-radius: 10em;
 }
 
 
@@ -738,67 +737,9 @@ input:focus + .ui.attached.button {
 
 
 
-/*******************************
-      Buttons (Button Group)
-*******************************/
-
-.ui.buttons {
-  overflow: hidden;
-}
-.ui.buttons .button {
-  float: left;
-  -webkit-border-radius: 0em;
-  -moz-border-radius: 0em;
-  border-radius: 0em;
-  border-left: 1px solid rgba(0, 0, 0, 0.05);
-}
-.ui.buttons .button:first-child  {
-  margin-left: 0em;
-  border-top-left-radius: 0.3125em;
-  border-bottom-left-radius: 0.3125em;
-}
-.ui.buttons .button:last-child {
-  border-top-right-radius: 0.3125em;
-  border-bottom-right-radius: 0.3125em;
-}
-
-/* Vertical  Style */
-.ui.buttons.vertical {
-  display: inline-block;
-}
-.ui.buttons.vertical .button {
-  display: block;
-  float: none;
-  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
-  border-left: none;
-  box-shadow: none;
-}
-.ui.buttons.vertical .button:first-child,
-.ui.buttons.vertical .mini.button:first-child,
-.ui.buttons.vertical .tiny.button:first-child,
-.ui.buttons.vertical .small.button:first-child,
-.ui.buttons.vertical .massive.button:first-child,
-.ui.buttons.vertical .huge.button:first-child {
-  margin-top: 0px;
-  -moz-border-radius: 0.3125em 0.3125em 0px 0px;
-  -webkit-border-radius: 0.3125em 0.3125em 0px 0px;
-  border-radius: 0.3125em 0.3125em 0px 0px;
-}
-.ui.buttons.vertical .button:last-child,
-.ui.buttons.vertical .mini.button:last-child,
-.ui.buttons.vertical .tiny.button:last-child,
-.ui.buttons.vertical .small.button:last-child,
-.ui.buttons.vertical .massive.button:last-child,
-.ui.buttons.vertical .huge.button:last-child,
-.ui.buttons.vertical .gigantic.button:last-child {
-  -moz-border-radius: 0px 0px 0.3125em 0.3125em;
-  -webkit-border-radius: 0px 0px 0.3125em 0.3125em;
-  border-radius: 0px 0px 0.3125em 0.3125em;
-}
-
-/*******************************
-       OR Button Divisions
-*******************************/
+/*-------------------
+      Or Buttons
+--------------------*/
 
 .ui.buttons .or {
   position: relative;
@@ -1028,4 +969,64 @@ input:focus + .ui.attached.button {
 }
 .ui.twelve.fluid.buttons > .button {
   height: 8.3333%;
+}
+
+
+
+/*******************************
+            Groups
+*******************************/
+
+.ui.buttons {
+  overflow: hidden;
+}
+.ui.buttons .button {
+  float: left;
+  -webkit-border-radius: 0em;
+  -moz-border-radius: 0em;
+  border-radius: 0em;
+  border-left: 1px solid rgba(0, 0, 0, 0.05);
+}
+.ui.buttons .button:first-child  {
+  margin-left: 0em;
+  border-top-left-radius: 0.3125em;
+  border-bottom-left-radius: 0.3125em;
+}
+.ui.buttons .button:last-child {
+  border-top-right-radius: 0.3125em;
+  border-bottom-right-radius: 0.3125em;
+}
+
+/* Vertical  Style */
+.ui.buttons.vertical {
+  display: inline-block;
+}
+.ui.buttons.vertical .button {
+  display: block;
+  float: none;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
+  border-left: none;
+  box-shadow: none;
+}
+.ui.buttons.vertical .button:first-child,
+.ui.buttons.vertical .mini.button:first-child,
+.ui.buttons.vertical .tiny.button:first-child,
+.ui.buttons.vertical .small.button:first-child,
+.ui.buttons.vertical .massive.button:first-child,
+.ui.buttons.vertical .huge.button:first-child {
+  margin-top: 0px;
+  -moz-border-radius: 0.3125em 0.3125em 0px 0px;
+  -webkit-border-radius: 0.3125em 0.3125em 0px 0px;
+  border-radius: 0.3125em 0.3125em 0px 0px;
+}
+.ui.buttons.vertical .button:last-child,
+.ui.buttons.vertical .mini.button:last-child,
+.ui.buttons.vertical .tiny.button:last-child,
+.ui.buttons.vertical .small.button:last-child,
+.ui.buttons.vertical .massive.button:last-child,
+.ui.buttons.vertical .huge.button:last-child,
+.ui.buttons.vertical .gigantic.button:last-child {
+  -moz-border-radius: 0px 0px 0.3125em 0.3125em;
+  -webkit-border-radius: 0px 0px 0.3125em 0.3125em;
+  border-radius: 0px 0px 0.3125em 0.3125em;
 }

src/elements/header.less

@@ -223,12 +223,21 @@ h5.ui.header {
   float: right;
 }
 
+/*-------------------
+       Fittted
+--------------------*/
+
+.ui.fitted.header {
+  padding: 0em;
+}
+
+
 /*-------------------
         Block
 --------------------*/
 
 .ui.block.header {
-  background-color: #F0F0F0;
+  background-color: #F5F5F5;
   padding: 0.5em 1em;  
 }
 

src/views/feed.less

@@ -32,7 +32,6 @@
 .ui.feed .event {
   width: 100%;
   display: table;
-  border-top: 1px dotted rgba(0, 0, 0, 0.1);
   padding: 1em;
 
   -webkit-box-sizing: border-box;
@@ -43,6 +42,9 @@
 .ui.feed .event:first-child {
   border-top: 0px;
 }
+.ui.feed .event:last-child {
+  margin-bottom: 2em;
+}
 
 /* Event Label */
 .ui.feed .label {
@@ -52,12 +54,11 @@
   text-align: left;
 }
 .ui.feed .label .icon {
-  font-size: 1.75em;
+  font-size: 1.5em;
   margin: 0em;
 }
 .ui.feed .label img {
-  width: 3.25em;
-  padding: 0.25em;
+  width: 3em;
   margin: 0em;
   border-radius: 50em;
 }
@@ -94,17 +95,44 @@
   color: rgba(0, 0, 0, 0.5);
 }
 
-
 .ui.feed .content .extra.images {
 
 }
 .ui.feed .content .extra.images img {
   display: inline-block;
-  margin-right: 1em;
-  width: 9em;
+  margin-right: 0.25em;
+  width: 6em;
 }
 
 .ui.feed .content .extra.text {
   padding: 0.5em 1em;
   border-left: 0.2em solid rgba(0, 0, 0, 0.1);
 }
+
+
+
+/*******************************
+            Variations
+*******************************/
+
+.ui.small.feed .label img {
+  width: 2.5em;
+}
+.ui.small.feed .label .icon {
+  font-size: 1.25em;
+}
+.ui.feed .event {
+  padding: 0.75em 0em;
+}
+.ui.small.feed .content {
+  padding: 0.5em 0.5em 0;
+}
+.ui.small.feed .content .extra.images img {
+  width: 5em;
+}
+.ui.small.feed .content .extra {
+  margin: 0.5em 0em 0em;
+}
+.ui.feed .content .extra.text {
+  padding: 0.25em 0.5em;
+}