]> git.ipfire.org Git - thirdparty/foundation/foundation-sites.git/commitdiff
adds kitchen sink example for magellan
authorRafiBomb <rafi@zurb.com>
Tue, 21 Jun 2016 17:33:18 +0000 (10:33 -0700)
committerRafiBomb <rafi@zurb.com>
Tue, 21 Jun 2016 17:33:18 +0000 (10:33 -0700)
docs/pages/cheatsheet.md
docs/pages/kitchen-sink.md
test/visual/sticky/menus-with-anchors.html

index 676b16bee754cdd32c14d90d1d73933bfc298ea5..9929e8f60677c3f504ffce432f7464e7e18fe0e8 100644 (file)
@@ -262,49 +262,7 @@ description: Get coding faster with this cheatsheet. It contains CSS classes, ac
   </div>
 </div>
 
-
-Add the `.badge` class to an element to create a badge. In the below example, we're using `<span>`, but any tag will work fine.
-
-```html_example
-<span class="badge">1</span>
-```
-
-<br>
-
-A badge will typically be describing another element on the page. To bind the two elements together, give the badge a unique ID, and reference that ID in an `aria-describedby` attribute on the main element.
-
-```html
-<h1 aria-describedby="messageCount">Unread Messages</h1>
-<span class="badge" id="messageCount">1<span>
-```
-
-Finally, the content itself might need more context for users that use screen readers. You can add extra text inside the badge using the `.show-for-sr` class.
-
-```html
-<span class="badge" id="messageCount">1 <span class="show-for-sr">unread message</span></span>
-```
-
 ---
 
-## Coloring
-
-Badges can be colored with the same classes used for buttons and other components.
-
-```html_example
-<span class="secondary badge">2</span>
-<span class="success badge">3</span>
-<span class="alert badge">A</span>
-<span class="warning badge">B</span>
-```
-
----
-
-### With Icons
-
-An icon can be used in place of text. We're using the [Foundation icon font](http://zurb.com/playground/foundation-icon-fonts-3) here, but any icon fonts or image-based icons will work fine.
+## Breakpoints and Media Queries
 
-```html_example
-<span class="info badge"><i class="fi-share"></i></span>
-<span class="success badge"><i class="fi-check"></i></span>
-<span class="warning badge"><i class="fi-wrench"></i></span>
-```
\ No newline at end of file
index 0b9d173767668f51bd6e8b78d608d078b08a2a7d..64c91d7153cca7933597bec08b8f93a7e601d8b2 100644 (file)
@@ -568,7 +568,7 @@ description: Everything but.
 
 ## Magellan
 
-```html
+```html_example
 <ul class="horizontal menu" data-magellan>
   <li><a href="#first">First Arrival</a></li>
   <li><a href="#second">Second Arrival</a></li>
@@ -590,12 +590,6 @@ description: Everything but.
 </div>
 ```
 
-<ul class="horizontal menu" data-magellan>
-  <li><a href="#first">First Arrival</a></li>
-  <li><a href="#second">Second Arrival</a></li>
-  <li><a href="#third">Third Arrival</a></li>
-</ul>
-
 ---
 
 ## Media Object
index 815e60525f12481c2db31c40b659c0fe7fa2e12c..d5272a98465c5464fcba8556b1371ee944fe14e0 100644 (file)
     $(document).foundation();
   </script>
 </body>
-</html>
\ No newline at end of file
+</html>
+
+
+
+        <div class="row">
+          <div class="xsmall-4 medium-6 columns">
+            
+          </div>
+          <div class="xsmall-8 medium-6 columns">
+            
+          </div>
+        </div>
+
+
+
+
+
+
+
+
+
+
+