updates shape with new high res images

Former-commit-id: 0f353fc65acf412e529b47ec02a3a5224e26c7df
Former-commit-id: affccaa709505654aea2a0f40f10f2d000a4a3d8

RELEASE NOTES.md

@@ -4,8 +4,12 @@ RELEASE NOTES
 
 Version 0.11 - Sep 26, 2013
 
+Updates
 -Added relaxed and very relaxed list type with increased padding
 
+Fixes
+-Connected items no longer assume 3 items per row
+-Fixes display of left corner icon labels
 
 Updates
 -Updated list docs

build/less/elements/label.less

@@ -435,6 +435,9 @@ a.ui.label:hover:before {
 
   border-top-color: inherit;
 }
+.ui.left.corner.label .icon {
+  margin: 0.4em 0em 0em -0.7em;
+}
 .ui.left.corner.label .text {
   margin: 0.5em 0em 0em -0.6em;
   -webkit-transform: rotate(-45deg);

build/less/views/item.less

@@ -109,15 +109,23 @@
   -moz-box-sizing: border-box;
   -ms-box-sizing: border-box;
   box-sizing: border-box;
+
+  -webkit-box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+  -moz-box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+  box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+
+  -webkit-border-radius: 0.2em;
+  -moz-border-radius: 0.2em;
+  border-radius: 0.2em;
 }
 .ui.items .item > .image > img {
   position: relative;
   display: block;
   width: 100%;
   overflow: hidden;
-  -webkit-border-radius: 0.22em;
-  -moz-border-radius: 0.22em;
-  border-radius: 0.22em;
+  -webkit-border-radius: 0.2em;
+  -moz-border-radius: 0.2em;
+  border-radius: 0.2em;
 }
 
 
@@ -421,6 +429,7 @@
   .ui.stackable.items .item {
     margin: 0em 2em 1em !important;
     display: block !important;
+    height: auto !important;
     width: auto !important;
     padding: 0% !important;
   }

build/less/views/list.less

@@ -494,8 +494,8 @@ ol.ui.horizontal.list li:before,
 }
 
 .ui.very.relaxed.list:not(.horizontal) .item {
-  padding-top: 0.75em;
-  padding-bottom: 0.75em;
+  padding-top: 1em;
+  padding-bottom: 1em;
 }
 .ui.horizontal.very.relaxed.list .item {
   padding-left: 2em;
@@ -508,14 +508,17 @@ ol.ui.horizontal.list li:before,
 --------------------*/
 
 .ui.mini.list .item {
-  font-size: 0.8125rem;
+  font-size: 0.7rem;
 }
 .ui.tiny.list .item {
-  font-size: 0.875rem;
+  font-size: 0.8125rem;
 }
 .ui.small.list .item {
   font-size: 0.875rem;
 }
+.ui.list .item {
+  font-size: 1em;
+}
 .ui.large.list .item {
   font-size: 1.125rem;
 }

build/uncompressed/elements/label.css

@@ -345,6 +345,9 @@ a.ui.label:hover:before {
   border-left: 0em solid transparent;
   border-top-color: inherit;
 }
+.ui.left.corner.label .icon {
+  margin: 0.4em 0em 0em -0.7em;
+}
 .ui.left.corner.label .text {
   margin: 0.5em 0em 0em -0.6em;
   -webkit-transform: rotate(-45deg);

build/uncompressed/views/item.css

@@ -89,15 +89,21 @@
   -moz-box-sizing: border-box;
   -ms-box-sizing: border-box;
   box-sizing: border-box;
+  -webkit-box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+  -moz-box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+  box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+  -webkit-border-radius: 0.2em;
+  -moz-border-radius: 0.2em;
+  border-radius: 0.2em;
 }
 .ui.items .item > .image > img {
   position: relative;
   display: block;
   width: 100%;
   overflow: hidden;
-  -webkit-border-radius: 0.22em;
-  -moz-border-radius: 0.22em;
-  border-radius: 0.22em;
+  -webkit-border-radius: 0.2em;
+  -moz-border-radius: 0.2em;
+  border-radius: 0.2em;
 }
 /*--------------
      Content
@@ -366,6 +372,7 @@
   .ui.stackable.items .item {
     margin: 0em 2em 1em !important;
     display: block !important;
+    height: auto !important;
     width: auto !important;
     padding: 0% !important;
   }

build/uncompressed/views/list.css

@@ -404,8 +404,8 @@ ol.ui.horizontal.list li:before,
   padding-right: 1.25em;
 }
 .ui.very.relaxed.list:not(.horizontal) .item {
-  padding-top: 0.75em;
-  padding-bottom: 0.75em;
+  padding-top: 1em;
+  padding-bottom: 1em;
 }
 .ui.horizontal.very.relaxed.list .item {
   padding-left: 2em;
@@ -415,14 +415,17 @@ ol.ui.horizontal.list li:before,
       Sizes
 --------------------*/
 .ui.mini.list .item {
-  font-size: 0.8125rem;
+  font-size: 0.7rem;
 }
 .ui.tiny.list .item {
-  font-size: 0.875rem;
+  font-size: 0.8125rem;
 }
 .ui.small.list .item {
   font-size: 0.875rem;
 }
+.ui.list .item {
+  font-size: 1em;
+}
 .ui.large.list .item {
   font-size: 1.125rem;
 }

node/src/documents/collections/table.html.eco

@@ -63,7 +63,7 @@ type        : 'UI Collection'
 
   <div class="example">
     <h4 class="ui header">Positive / Negative</h4>
-    <p>A cell or row may let a user know whether a value is good or bad:</p>
+    <p>A cell or row may let a user know whether a value is good or bad</p>
     <table class="ui table segment">
       <thead>
         <th>Name</th>
@@ -98,7 +98,7 @@ type        : 'UI Collection'
   <h3 class="ui header">Cells</h3>
   <div class="example">
     <h4 class="ui header">Error</h4>
-    <p>A cell or row may attention the user to an error or a negative value:</p>
+    <p>A cell or row may attention the user to an error or a negative value</p>
     <table class="ui table segment">
       <thead>
         <th>Name</th>
@@ -132,7 +132,7 @@ type        : 'UI Collection'
 
   <div class="example">
     <h4 class="ui header">Warning</h4>
-    <p>A cell or row may warn a user:</p>
+    <p>A cell or row may warn a user</p>
     <table class="ui table segment">
       <thead>
         <th>Name</th>
@@ -166,7 +166,7 @@ type        : 'UI Collection'
 
   <div class="example">
     <h4 class="ui header">Active</h4>
-    <p>A cell or row can be active:</p>
+    <p>A cell or row can be active or selected by a user</p>
     <table class="ui table segment">
       <thead>
         <th>Name</th>
@@ -199,7 +199,7 @@ type        : 'UI Collection'
   </div>
   <div class="example">
     <h4 class="ui header">Disabled</h4>
-    <p>A cell can be disabled:</p>
+    <p>A cell can be disabled</p>
     <table class="ui table segment">
       <thead>
         <th>Name</th>

node/src/documents/modules/shape.html.eco

@@ -89,7 +89,7 @@ type        : 'UI Module'
               <a class="ui like corner label">
                 <i class="like icon"></i>
               </a>
-              <img src="/images/demo/item1.jpg">
+              <img src="/images/demo/highres2.jpg">
             </div>
             <div class="content">
               <div class="name">Cute Dog</div>
@@ -105,7 +105,7 @@ type        : 'UI Module'
               <a class="ui like corner label">
                 <i class="like icon"></i>
               </a>
-              <img src="/images/demo/item3.jpg">
+              <img src="/images/demo/highres5.jpg">
             </div>
             <div class="content">
               <div class="name">Silly Dog</div>
@@ -121,7 +121,7 @@ type        : 'UI Module'
               <a class="ui like corner label">
                 <i class="like icon"></i>
               </a>
-              <img src="/images/demo/item2.jpg">
+              <img src="/images/demo/highres4.jpg">
             </div>
             <div class="content">
               <div class="meta">5 days ago</div>
@@ -143,7 +143,7 @@ type        : 'UI Module'
               <a class="ui like corner label">
                 <i class="like icon"></i>
               </a>
-              <img src="/images/demo/item4.jpg">
+              <img src="/images/demo/highres.jpg">
             </div>
             <div class="content">
               <div class="name">Cute Dog</div>
@@ -159,7 +159,7 @@ type        : 'UI Module'
               <a class="ui like corner label">
                 <i class="like icon"></i>
               </a>
-              <img src="/images/demo/item2.jpg">
+              <img src="/images/demo/highres4.jpg">
             </div>
             <div class="content">
               <div class="name">Silly Dog</div>
@@ -175,7 +175,7 @@ type        : 'UI Module'
               <a class="ui like corner label">
                 <i class="like icon"></i>
               </a>
-              <img src="/images/demo/item5.jpg">
+              <img src="/images/demo/highres6.jpg">
             </div>
             <div class="content">
               <div class="meta">5 days ago</div>

node/src/documents/views/items.html.eco

@@ -77,10 +77,39 @@ type        : 'UI View'
     </div>
   </div>
 
+  <div class="text example">
+    <div class="ui items">
+      <div class="item">
+        <div class="name">Cute Dog</div>
+        <p class="description">This dog has some things going for it. Its pretty cute and looks like it'd be fun to cuddle up with.</p>
+        <div class="extra">
+            199 votes
+        </div>
+      </div>
+      <div class="item">
+        <div class="meta">5 days ago</div>
+        <div class="name">Faithful Dog</div>
+        <p class="description">Sometimes its more important to have a dog you know you can trust. But not every dog is trustworthy, you can tell by looking at its smile.</p>
+        <div class="extra">
+            311 votes
+        </div>
+      </div>
+      <div class="item">
+        <div class="name">Silly Dog</div>
+        <p class="description">Silly dogs can be quite fun to have as companions. You never know what kind of ridiculous thing they will do.</p>
+        <div class="extra">
+            522 votes
+        </div>
+      </div>
+    </div>
+  </div>
+
+
   <h2 class="ui dividing header">Variations</h2>
 
   <div class="example">
     <h4 class="ui header">Stackable</h4>
+    <div class="ui ignored info message">Resize your browser to a smaller size to see the items stack after reaching mobile breakpoints</div>
     <p>An item view can have its items take the full width when below a browser resolution threshold to allow for content to display properly at small sizes</p>
     <div class="ui stackable items">
       <div class="item">
@@ -88,7 +117,7 @@ type        : 'UI View'
           <a class="like ui corner label">
             <i class="like icon"></i>
           </a>
-          <img src="/images/demo/highres.jpg">
+          <img src="/images/demo/highres5.jpg">
         </div>
         <div class="content">
           <div class="name">Cute Dog</div>
@@ -103,7 +132,7 @@ type        : 'UI View'
           <a class="like ui corner label">
             <i class="like icon"></i>
           </a>
-          <img src="/images/demo/highres2.jpg">
+          <img src="/images/demo/highres6.jpg">
         </div>
         <div class="content">
           <div class="meta">5 days ago</div>
@@ -154,39 +183,41 @@ type        : 'UI View'
           </div>
         </div>
       </div>
+    </div>
+  </div>
+  <div class="another text example">
+    <div class="ui connected items">
       <div class="row">
         <div class="item">
-          <div class="image">
-            <img src="/images/demo/highres2.jpg">
-          </div>
-          <div class="content">
-            <div class="name">Cute Dog</div>
-            <p class="description">This dog has some things going for it. Its pretty cute and looks like it'd be fun to cuddle up with.</p>
-          </div>
+          <div class="name">Cute Dog</div>
+          <p class="description">This dog has some things going for it. Its pretty cute and looks like it'd be fun to cuddle up with.</p>
         </div>
         <div class="item">
-          <div class="image">
-            <img src="/images/demo/highres.jpg">
-          </div>
-          <div class="content">
-            <div class="name">Faithful Dog</div>
-            <p class="description">Sometimes its more important to have a dog you know you can trust. But not every dog is trustworthy, you can tell by looking at its smile.</p>
-          </div>
+          <div class="name">Faithful Dog</div>
+          <p class="description">Sometimes its more important to have a dog you know you can trust. But not every dog is trustworthy, you can tell by looking at its smile.</p>
         </div>
         <div class="item">
-          <div class="image">
-            <img src="/images/demo/highres4.jpg">
-          </div>
-          <div class="content">
-            <div class="name">Silly Dog</div>
-            <p class="description">Silly dogs can be quite fun to have as companions. You never know what kind of ridiculous thing they will do.</p>
-          </div>
+          <div class="name">Silly Dog</div>
+          <p class="description">Silly dogs can be quite fun to have as companions. You never know what kind of ridiculous thing they will do.</p>
+        </div>
+        <div class="item">
+          <div class="name">Cute Dog</div>
+          <p class="description">This dog has some things going for it. Its pretty cute and looks like it'd be fun to cuddle up with.</p>
+        </div>
+        <div class="item">
+          <div class="name">Faithful Dog</div>
+          <p class="description">Sometimes its more important to have a dog you know you can trust. But not every dog is trustworthy, you can tell by looking at its smile.</p>
+        </div>
+        <div class="item">
+          <div class="name">Silly Dog</div>
+          <p class="description">Silly dogs can be quite fun to have as companions. You never know what kind of ridiculous thing they will do.</p>
         </div>
       </div>
     </div>
   </div>
 
 
+
   <div class="example">
     <h4 class="ui header">Column count</h4>
     <p>An item list can list how many columns should exist in a row</p>

node/src/documents/views/list.html.eco

@@ -14,7 +14,6 @@ type        : 'UI View'
     <div class="ui vertical pointing secondary menu">
       <a class="active item">Types</a>
       <a class="item">Content</a>
-      <a class="item">States</a>
       <a class="item">Variations</a>
     </div>
   </div>
@@ -273,10 +272,6 @@ type        : 'UI View'
     </div>
   </div>
 
-
-  <h2 class="ui dividing header">States</h2>
-
-
   <h2 class="ui dividing header">Variations</h2>
 
 
@@ -361,6 +356,109 @@ type        : 'UI View'
     </div>
   </div>
 
+  <div class="example">
+    <h4 class="ui header">Relaxed</h4>
+    <p>A list can relax its padding to provide more negative space</p>
+    <div class="ui relaxed divided list">
+      <div class="item">
+        <i class="map marker icon"></i>
+        <div class="content">
+          <a class="header">New York City</a>
+          <div class="description">A lovely city</div>
+        </div>
+      </div>
+      <div class="item">
+        <i class="map marker icon"></i>
+        <div class="content">
+          <a class="header">Chicago</a>
+          <div class="description">A lovely city</div>
+        </div>
+      </div>
+      <div class="item">
+        <i class="map marker icon"></i>
+        <div class="content">
+          <a class="header">Los Angeles</a>
+          <div class="description">A lovely city</div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="another example">
+    <div class="ui very relaxed divided list">
+      <div class="item">
+        <i class="map marker icon"></i>
+        <div class="content">
+          <a class="header">New York City</a>
+          <div class="description">A lovely city</div>
+        </div>
+      </div>
+      <div class="item">
+        <i class="map marker icon"></i>
+        <div class="content">
+          <a class="header">Chicago</a>
+          <div class="description">A lovely city</div>
+        </div>
+      </div>
+      <div class="item">
+        <i class="map marker icon"></i>
+        <div class="content">
+          <a class="header">Los Angeles</a>
+          <div class="description">A lovely city</div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="another example">
+    <div class="ui relaxed horizontal divided list">
+      <div class="item">
+        <i class="map marker icon"></i>
+        <div class="content">
+          <a class="header">New York City</a>
+          <div class="description">A lovely city</div>
+        </div>
+      </div>
+      <div class="item">
+        <i class="map marker icon"></i>
+        <div class="content">
+          <a class="header">Chicago</a>
+          <div class="description">A lovely city</div>
+        </div>
+      </div>
+      <div class="item">
+        <i class="map marker icon"></i>
+        <div class="content">
+          <a class="header">Los Angeles</a>
+          <div class="description">A lovely city</div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="another example">
+    <div class="ui very relaxed horizontal divided list">
+      <div class="item">
+        <i class="map marker icon"></i>
+        <div class="content">
+          <a class="header">New York City</a>
+          <div class="description">A lovely city</div>
+        </div>
+      </div>
+      <div class="item">
+        <i class="map marker icon"></i>
+        <div class="content">
+          <a class="header">Chicago</a>
+          <div class="description">A lovely city</div>
+        </div>
+      </div>
+      <div class="item">
+        <i class="map marker icon"></i>
+        <div class="content">
+          <a class="header">Los Angeles</a>
+          <div class="description">A lovely city</div>
+        </div>
+      </div>
+    </div>
+  </div>
+
   <div class="example">
     <h4 class="ui header">Divided</h4>
     <p>A list can show divisions between content</p>

node/src/files/build/less/elements/label.less

@@ -435,6 +435,9 @@ a.ui.label:hover:before {
 
   border-top-color: inherit;
 }
+.ui.left.corner.label .icon {
+  margin: 0.4em 0em 0em -0.7em;
+}
 .ui.left.corner.label .text {
   margin: 0.5em 0em 0em -0.6em;
   -webkit-transform: rotate(-45deg);

node/src/files/build/less/views/item.less

@@ -109,15 +109,23 @@
   -moz-box-sizing: border-box;
   -ms-box-sizing: border-box;
   box-sizing: border-box;
+
+  -webkit-box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+  -moz-box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+  box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+
+  -webkit-border-radius: 0.2em;
+  -moz-border-radius: 0.2em;
+  border-radius: 0.2em;
 }
 .ui.items .item > .image > img {
   position: relative;
   display: block;
   width: 100%;
   overflow: hidden;
-  -webkit-border-radius: 0.22em;
-  -moz-border-radius: 0.22em;
-  border-radius: 0.22em;
+  -webkit-border-radius: 0.2em;
+  -moz-border-radius: 0.2em;
+  border-radius: 0.2em;
 }
 
 
@@ -421,6 +429,7 @@
   .ui.stackable.items .item {
     margin: 0em 2em 1em !important;
     display: block !important;
+    height: auto !important;
     width: auto !important;
     padding: 0% !important;
   }

node/src/files/build/less/views/list.less

@@ -494,8 +494,8 @@ ol.ui.horizontal.list li:before,
 }
 
 .ui.very.relaxed.list:not(.horizontal) .item {
-  padding-top: 0.75em;
-  padding-bottom: 0.75em;
+  padding-top: 1em;
+  padding-bottom: 1em;
 }
 .ui.horizontal.very.relaxed.list .item {
   padding-left: 2em;
@@ -508,14 +508,17 @@ ol.ui.horizontal.list li:before,
 --------------------*/
 
 .ui.mini.list .item {
-  font-size: 0.8125rem;
+  font-size: 0.7rem;
 }
 .ui.tiny.list .item {
-  font-size: 0.875rem;
+  font-size: 0.8125rem;
 }
 .ui.small.list .item {
   font-size: 0.875rem;
 }
+.ui.list .item {
+  font-size: 1em;
+}
 .ui.large.list .item {
   font-size: 1.125rem;
 }

node/src/files/build/uncompressed/elements/label.css

@@ -345,6 +345,9 @@ a.ui.label:hover:before {
   border-left: 0em solid transparent;
   border-top-color: inherit;
 }
+.ui.left.corner.label .icon {
+  margin: 0.4em 0em 0em -0.7em;
+}
 .ui.left.corner.label .text {
   margin: 0.5em 0em 0em -0.6em;
   -webkit-transform: rotate(-45deg);

node/src/files/build/uncompressed/views/item.css

@@ -89,15 +89,21 @@
   -moz-box-sizing: border-box;
   -ms-box-sizing: border-box;
   box-sizing: border-box;
+  -webkit-box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+  -moz-box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+  box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+  -webkit-border-radius: 0.2em;
+  -moz-border-radius: 0.2em;
+  border-radius: 0.2em;
 }
 .ui.items .item > .image > img {
   position: relative;
   display: block;
   width: 100%;
   overflow: hidden;
-  -webkit-border-radius: 0.22em;
-  -moz-border-radius: 0.22em;
-  border-radius: 0.22em;
+  -webkit-border-radius: 0.2em;
+  -moz-border-radius: 0.2em;
+  border-radius: 0.2em;
 }
 /*--------------
      Content
@@ -366,6 +372,7 @@
   .ui.stackable.items .item {
     margin: 0em 2em 1em !important;
     display: block !important;
+    height: auto !important;
     width: auto !important;
     padding: 0% !important;
   }

node/src/files/build/uncompressed/views/list.css

@@ -404,8 +404,8 @@ ol.ui.horizontal.list li:before,
   padding-right: 1.25em;
 }
 .ui.very.relaxed.list:not(.horizontal) .item {
-  padding-top: 0.75em;
-  padding-bottom: 0.75em;
+  padding-top: 1em;
+  padding-bottom: 1em;
 }
 .ui.horizontal.very.relaxed.list .item {
   padding-left: 2em;
@@ -415,14 +415,17 @@ ol.ui.horizontal.list li:before,
       Sizes
 --------------------*/
 .ui.mini.list .item {
-  font-size: 0.8125rem;
+  font-size: 0.7rem;
 }
 .ui.tiny.list .item {
-  font-size: 0.875rem;
+  font-size: 0.8125rem;
 }
 .ui.small.list .item {
   font-size: 0.875rem;
 }
+.ui.list .item {
+  font-size: 1em;
+}
 .ui.large.list .item {
   font-size: 1.125rem;
 }

node/src/files/images/demo/highres6.jpg.REMOVED.git-id

@@ -1 +1 @@
-704e50bf835a5f01da275a6fa490e3a24ed6769f
+793f8d3d4a9bcbf31838335ea3e6613529b7c48c

node/src/files/stylesheets/semantic.css

@@ -215,6 +215,14 @@ a:hover {
   box-shadow: none;
 }
 
+/*--------------
+    Items
+---------------*/
+
+#example.item .text.example .item {
+  min-height: 150px;
+}
+
 
 /*--------------
     Masthead

src/elements/label.less

@@ -435,6 +435,9 @@ a.ui.label:hover:before {
 
   border-top-color: inherit;
 }
+.ui.left.corner.label .icon {
+  margin: 0.4em 0em 0em -0.7em;
+}
 .ui.left.corner.label .text {
   margin: 0.5em 0em 0em -0.6em;
   -webkit-transform: rotate(-45deg);

src/views/item.less

@@ -109,15 +109,23 @@
   -moz-box-sizing: border-box;
   -ms-box-sizing: border-box;
   box-sizing: border-box;
+
+  -webkit-box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+  -moz-box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+  box-shadow: 0px 0px 0px 1px rbga(0, 0, 0, 0.1);
+
+  -webkit-border-radius: 0.2em;
+  -moz-border-radius: 0.2em;
+  border-radius: 0.2em;
 }
 .ui.items .item > .image > img {
   position: relative;
   display: block;
   width: 100%;
   overflow: hidden;
-  -webkit-border-radius: 0.22em;
-  -moz-border-radius: 0.22em;
-  border-radius: 0.22em;
+  -webkit-border-radius: 0.2em;
+  -moz-border-radius: 0.2em;
+  border-radius: 0.2em;
 }
 
 
@@ -421,6 +429,7 @@
   .ui.stackable.items .item {
     margin: 0em 2em 1em !important;
     display: block !important;
+    height: auto !important;
     width: auto !important;
     padding: 0% !important;
   }

src/views/list.less

@@ -494,8 +494,8 @@ ol.ui.horizontal.list li:before,
 }
 
 .ui.very.relaxed.list:not(.horizontal) .item {
-  padding-top: 0.75em;
-  padding-bottom: 0.75em;
+  padding-top: 1em;
+  padding-bottom: 1em;
 }
 .ui.horizontal.very.relaxed.list .item {
   padding-left: 2em;
@@ -508,14 +508,17 @@ ol.ui.horizontal.list li:before,
 --------------------*/
 
 .ui.mini.list .item {
-  font-size: 0.8125rem;
+  font-size: 0.7rem;
 }
 .ui.tiny.list .item {
-  font-size: 0.875rem;
+  font-size: 0.8125rem;
 }
 .ui.small.list .item {
   font-size: 0.875rem;
 }
+.ui.list .item {
+  font-size: 1em;
+}
 .ui.large.list .item {
   font-size: 1.125rem;
 }