]> git.ipfire.org Git - thirdparty/foundation/foundation-sites.git/commitdiff
projects / thirdparty / foundation / foundation-sites.git / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | patch | inline | side by side (parent: e42f263)
Replace `row` and `column` with XY Grid classes
authorharry <harmanmanchanda182@gmail.com>
Thu, 22 Jun 2017 06:35:07 +0000 (12:05 +0530)
committerharry <harmanmanchanda182@gmail.com>
Thu, 22 Jun 2017 06:35:07 +0000 (12:05 +0530)
test/visual/menu/advanced-nested-menu-flex.html patch | blob | blame | history
test/visual/menu/all-menus-flex.html patch | blob | blame | history
test/visual/menu/vertical-accordionmenu-alignment-flex.html patch | blob | blame | history
test/visual/menu/vertical-accordionmenu-alignment-float.html patch | blob | blame | history
test/visual/menu/vertical-drilldownmenu-alignment-flex.html patch | blob | blame | history
test/visual/menu/vertical-dropdownmenu-alignment-flex.html patch | blob | blame | history
test/visual/menu/vertical-menu-alignment-flex.html patch | blob | blame | history

diff --git a/test/visual/menu/advanced-nested-menu-flex.html b/test/visual/menu/advanced-nested-menu-flex.html
index 06c5c52f4633de9d10bb52ac5ad816fcbe9e8e1e..7fa495e0f37b211e19eb001e9a44f0d4f1e654ed 100644 (file)
--- a/test/visual/menu/advanced-nested-menu-flex.html
+++ b/test/visual/menu/advanced-nested-menu-flex.html
@@ -34,102 +34,104 @@
     </style>
   </head>
   <body>
-    <div class="row column">
-      <h1>Advanced Nested Menu's</h1>
-      <h3>Nested Form within Accordion Menu</h3>
-      <div class="example" style="max-width: 450px">
-        <ul class="menu vertical accordion-menu" data-accordion-menu>
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li>
-            <a href="#">Form</a>
-            <ul class="menu nested vertical">
-              <li>
-                <div class="card">
-                  <div class="card-section">
-                    <label> Your Name
-                      <input type="text" placeholder="Enter your Cool Name">
-                    </label>
-                    <select>
-                      <option value="husker">Husker</option>
-                      <option value="starbuck">Starbuck</option>
-                      <option value="hotdog">Hot Dog</option>
-                      <option value="apollo">Apollo</option>
-                    </select>
-                    <button class="button">Submit</button>
-                    <p><a href="#">Learn More</a>
+    <div class="grid-x grid-padding-x">
+      <div class="cell">
+        <h1>Advanced Nested Menu's</h1>
+        <h3>Nested Form within Accordion Menu</h3>
+        <div class="example" style="max-width: 450px">
+          <ul class="menu vertical accordion-menu" data-accordion-menu>
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li>
+              <a href="#">Form</a>
+              <ul class="menu nested vertical">
+                <li>
+                  <div class="card">
+                    <div class="card-section">
+                      <label> Your Name
+                        <input type="text" placeholder="Enter your Cool Name">
+                      </label>
+                      <select>
+                        <option value="husker">Husker</option>
+                        <option value="starbuck">Starbuck</option>
+                        <option value="hotdog">Hot Dog</option>
+                        <option value="apollo">Apollo</option>
+                      </select>
+                      <button class="button">Submit</button>
+                      <p><a href="#">Learn More</a>
+                    </div>
                   </div>
-                </div>
-              </li>
-            </ul>
-          </li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
+                </li>
+              </ul>
+            </li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
 
-      <h3>Nested Form within Dropdown Menu</h3>
-      <div class="example" style="max-width: 450px">
-        <ul class="menu vertical dropdown" data-dropdown-menu>
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li>
-            <a href="#">Form</a>
-            <ul class="menu nested vertical">
-              <li>
-                <div class="card">
-                  <div class="card-section">
-                    <label> Your Name
-                      <input type="text" placeholder="Enter your Cool Name">
-                    </label>
-                    <select>
-                      <option value="husker">Husker</option>
-                      <option value="starbuck">Starbuck</option>
-                      <option value="hotdog">Hot Dog</option>
-                      <option value="apollo">Apollo</option>
-                    </select>
-                    <button class="button">Submit</button>
-                    <p><a href="#">Learn More</a>
+        <h3>Nested Form within Dropdown Menu</h3>
+        <div class="example" style="max-width: 450px">
+          <ul class="menu vertical dropdown" data-dropdown-menu>
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li>
+              <a href="#">Form</a>
+              <ul class="menu nested vertical">
+                <li>
+                  <div class="card">
+                    <div class="card-section">
+                      <label> Your Name
+                        <input type="text" placeholder="Enter your Cool Name">
+                      </label>
+                      <select>
+                        <option value="husker">Husker</option>
+                        <option value="starbuck">Starbuck</option>
+                        <option value="hotdog">Hot Dog</option>
+                        <option value="apollo">Apollo</option>
+                      </select>
+                      <button class="button">Submit</button>
+                      <p><a href="#">Learn More</a>
+                    </div>
                   </div>
-                </div>
-              </li>
-            </ul>
-          </li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
+                </li>
+              </ul>
+            </li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
 
-      <h3>Nested Form within Drilldown Menu</h3>
-      <div class="example" style="max-width: 450px">
-        <ul class="menu vertical drilldown" data-drilldown>
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li>
-            <a href="#">Form</a>
-            <ul class="menu nested vertical">
-              <li>
-                <div class="card">
-                  <div class="card-section">
-                    <label> Your Name
-                      <input type="text" placeholder="Enter your Cool Name">
-                    </label>
-                    <select>
-                      <option value="husker">Husker</option>
-                      <option value="starbuck">Starbuck</option>
-                      <option value="hotdog">Hot Dog</option>
-                      <option value="apollo">Apollo</option>
-                    </select>
-                    <button class="button">Submit</button>
-                    <p><a href="#">Learn More</a>
+        <h3>Nested Form within Drilldown Menu</h3>
+        <div class="example" style="max-width: 450px">
+          <ul class="menu vertical drilldown" data-drilldown>
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li>
+              <a href="#">Form</a>
+              <ul class="menu nested vertical">
+                <li>
+                  <div class="card">
+                    <div class="card-section">
+                      <label> Your Name
+                        <input type="text" placeholder="Enter your Cool Name">
+                      </label>
+                      <select>
+                        <option value="husker">Husker</option>
+                        <option value="starbuck">Starbuck</option>
+                        <option value="hotdog">Hot Dog</option>
+                        <option value="apollo">Apollo</option>
+                      </select>
+                      <button class="button">Submit</button>
+                      <p><a href="#">Learn More</a>
+                    </div>
                   </div>
-                </div>
-              </li>
-            </ul>
-          </li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
+                </li>
+              </ul>
+            </li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
       </div>
     </div>
 
diff --git a/test/visual/menu/all-menus-flex.html b/test/visual/menu/all-menus-flex.html
index 9e27cb4b0207151ff4a92c79dd073ba23efd7026..f208391e269a952a0caf22f52a5d3a0e9980e22e 100644 (file)
--- a/test/visual/menu/all-menus-flex.html
+++ b/test/visual/menu/all-menus-flex.html
@@ -37,369 +37,371 @@
   </head>
 
   <body>
-    <div class="row column">
-      <h1>Basic Menus</h1>
-
-      <h3>Default Menu</h3>
-      <div class="example">
-        <ul class="menu">
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Horizontal Menu</h3>
-      <div class="example">
-        <ul class="menu horizontal">
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Vertical Menu</h3>
-      <div class="example">
-        <ul class="menu vertical">
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Vertical, Horizontal, Vertical Menu</h3>
-      <div class="example">
-        <ul class="menu vertical medium-horizontal large-vertical">
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Horizontal, Vertical, Horizontal Menu</h3>
-      <div class="example">
-        <ul class="menu horizontal medium-vertical large-horizontal">
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h1>Basic Menu Styles</h1>
-
-      <h3>Nested Menu</h3>
-      <div class="example">
-        <ul class="menu vertical">
-          <li><a href="#">One</a></li>
-          <li>
-            <a href="#">Two</a>
-            <ul class="menu vertical nested">
-              <li><a href="#">Two A</a></li>
-              <li><a href="#">Two B</a></li>
-              <li><a href="#">Two C</a></li>
-              <li><a href="#">Two D</a></li>
-            </ul>
-          </li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Nested Menu - Align Right</h3>
-      <div class="example">
-        <ul class="menu vertical align-right">
-          <li><a href="#">One</a></li>
-          <li>
-            <a href="#">Two</a>
-            <ul class="menu vertical nested">
-              <li><a href="#">Two A</a></li>
-              <li><a href="#">Two B</a></li>
-              <li><a href="#">Two C</a></li>
-              <li><a href="#">Two D</a></li>
-            </ul>
-          </li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
+    <div class="grid-x grid-padding-x">
+      <div class="cell">
+        <h1>Basic Menus</h1>
+
+        <h3>Default Menu</h3>
+        <div class="example">
+          <ul class="menu">
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Horizontal Menu</h3>
+        <div class="example">
+          <ul class="menu horizontal">
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Vertical Menu</h3>
+        <div class="example">
+          <ul class="menu vertical">
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Vertical, Horizontal, Vertical Menu</h3>
+        <div class="example">
+          <ul class="menu vertical medium-horizontal large-vertical">
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Horizontal, Vertical, Horizontal Menu</h3>
+        <div class="example">
+          <ul class="menu horizontal medium-vertical large-horizontal">
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h1>Basic Menu Styles</h1>
+
+        <h3>Nested Menu</h3>
+        <div class="example">
+          <ul class="menu vertical">
+            <li><a href="#">One</a></li>
+            <li>
+              <a href="#">Two</a>
+              <ul class="menu vertical nested">
+                <li><a href="#">Two A</a></li>
+                <li><a href="#">Two B</a></li>
+                <li><a href="#">Two C</a></li>
+                <li><a href="#">Two D</a></li>
+              </ul>
+            </li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Nested Menu - Align Right</h3>
+        <div class="example">
+          <ul class="menu vertical align-right">
+            <li><a href="#">One</a></li>
+            <li>
+              <a href="#">Two</a>
+              <ul class="menu vertical nested">
+                <li><a href="#">Two A</a></li>
+                <li><a href="#">Two B</a></li>
+                <li><a href="#">Two C</a></li>
+                <li><a href="#">Two D</a></li>
+              </ul>
+            </li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Simple Menu</h3>
+        <div class="example">
+          <ul class="menu simple">
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Expanded Menu</h3>
+        <div class="example">
+          <ul class="menu expanded">
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Menu Text</h3>
+        <div class="example">
+          <ul class="menu simple">
+            <li class="menu-text">Site Title</li>
+            <li><a href="#">Two</a></li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Menu with Icons left</h3>
+        <div class="example">
+          <ul class="menu icons icon-left">
+            <li><a href="#"><i class="fi-list"></i>One</a></li>
+            <li><a href="#"><i class="fi-list"></i>Two</a></li>
+            <li><a href="#"><i class="fi-list"></i>Three</a></li>
+            <li><a href="#"><i class="fi-list"></i>Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Menu with Icons Right</h3>
+        <div class="example">
+          <ul class="menu icons icon-right">
+            <li><a href="#">One<i class="fi-list"></i></a></li>
+            <li><a href="#">Two<i class="fi-list"></i></a></li>
+            <li><a href="#">Three<i class="fi-list"></i></a></li>
+            <li><a href="#">Four<i class="fi-list"></i></a></li>
+          </ul>
+        </div>
+
+        <h3>Menu with Icon Top</h3>
+        <div class="example">
+          <ul class="menu icons icon-top">
+            <li><a href="#"><i class="fi-list"></i>One</a></li>
+            <li><a href="#"><i class="fi-list"></i>Two</a></li>
+            <li><a href="#"><i class="fi-list"></i>Three</a></li>
+            <li><a href="#"><i class="fi-list"></i>Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Menu with Icon Bottom</h3>
+        <div class="example">
+          <ul class="menu icons icon-bottom">
+            <li><a href="#">One<i class="fi-list"></i></a></li>
+            <li><a href="#">Two<i class="fi-list"></i></a></li>
+            <li><a href="#">Three<i class="fi-list"></i></a></li>
+            <li><a href="#">Four<i class="fi-list"></i></a></li>
+          </ul>
+        </div>
+
+        <h3>Menu with input, select and buttons</h3>
+        <div class="example">
+          <ul class="menu horizontal">
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+            <li>
+              <select>
+                <option value="husker">Husker</option>
+                <option value="starbuck">Starbuck</option>
+                <option value="hotdog">Hot Dog</option>
+                <option value="apollo">Apollo</option>
+              </select>
+            </li>
+            <li><input type="text" placeholder="Text input"></li>
+            <li><button class="button">button (native)</button></li>
+            <li><a class="button" href="#">button</a></li>
+          </ul>
+        </div>
+
+        <h3>Active Menu Item Class</h3>
+        <div class="example">
+          <ul class="menu">
+            <li><a href="#">One</a></li>
+            <li class="active"><a href="#">Two (.active)</a></li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h1>Menu Alignment Classes</h1>
+
+        <h3>Right Aligned Menu</h3>
+        <div class="example">
+          <ul class="menu align-right">
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Centered Menu</h3>
+        <div class="example">
+          <ul class="menu align-center">
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h1>Menu Plugin Styles</h1>
+
+        <h3>Dropdown Menu</h3>
+        <div class="example">
+          <ul class="menu dropdown" data-dropdown-menu>
+            <li><a href="#">One</a></li>
+            <li>
+              <a href="#">Two</a>
+              <ul class="menu nested vertical">
+                <li><a href="#">Two A</a></li>
+                <li><a href="#">Two B</a></li>
+                <li><a href="#">Two C</a></li>
+                <li><a href="#">Two D</a></li>
+              </ul>
+            </li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Vertical Dropdown Menu</h3>
+        <div class="example">
+          <ul class="vertical menu dropdown" data-dropdown-menu style="max-width: 250px">
+            <li><a href="#">One</a></li>
+            <li>
+              <a href="#">Two</a>
+              <ul class="menu nested vertical">
+                <li><a href="#">Two A</a></li>
+                <li><a href="#">Two B</a></li>
+                <li><a href="#">Two C</a></li>
+                <li><a href="#">Two D</a></li>
+              </ul>
+            </li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Dropdown Menu - Align Right</h3>
+        <div class="example">
+          <ul class="menu align-right dropdown" data-dropdown-menu>
+            <li><a href="#">One</a></li>
+            <li>
+              <a href="#">Two</a>
+              <ul class="menu nested vertical">
+                <li><a href="#">Two A</a></li>
+                <li><a href="#">Two B</a></li>
+                <li><a href="#">Two C</a></li>
+                <li><a href="#">Two D</a></li>
+              </ul>
+            </li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Accordion Menu</h3>
+        <div class="example">
+          <ul class="menu vertical accordion-menu" data-accordion-menu style="max-width: 250px">
+            <li><a href="#">One</a></li>
+            <li><a href="#">Two</a></li>
+            <li>
+              <a href="#">Two</a>
+              <ul class="menu nested vertical">
+                <li><a href="#">Two A</a></li>
+                <li><a href="#">Two B</a></li>
+                <li><a href="#">Two C</a></li>
+                <li><a href="#">Two D</a></li>
+              </ul>
+            </li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Drilldown Menu</h3>
+        <div class="example">
+          <ul class="menu vertical drilldown" data-drilldown style="max-width: 250px">
+            <li><a href="#">One</a></li>
+            <li>
+              <a href="#">Two</a>
+              <ul class="menu nested vertical">
+                <li><a href="#">Two A</a></li>
+                <li><a href="#">Two B</a></li>
+                <li><a href="#">Two C</a></li>
+                <li><a href="#">Two D</a></li>
+              </ul>
+            </li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h1>Responsive Menus</h1>
+
+        <h3>Accordion to Dropdown Menu</h3>
+        <div class="example">
+          <ul class="menu vertical medium-horizontal" data-responsive-menu="accordion medium-dropdown">
+            <li><a href="#">One</a></li>
+            <li>
+              <a href="#">Two</a>
+              <ul class="menu nested vertical">
+                <li><a href="#">Two A</a></li>
+                <li><a href="#">Two B</a></li>
+                <li><a href="#">Two C</a></li>
+                <li><a href="#">Two D</a></li>
+              </ul>
+            </li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Drilldown to Dropdown Menu</h3>
+        <div class="example">
+          <ul class="menu vertical medium-horizontal" data-responsive-menu="drilldown medium-dropdown">
+            <li><a href="#">One</a></li>
+            <li>
+              <a href="#">Two</a>
+              <ul class="menu nested vertical">
+                <li><a href="#">Two A</a></li>
+                <li><a href="#">Two B</a></li>
+                <li><a href="#">Two C</a></li>
+                <li><a href="#">Two D</a></li>
+              </ul>
+            </li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
+
+        <h3>Drilldown to Accordion to Dropdown Menu</h3>
+        <div class="example">
+          <ul class="menu vertical large-horizontal" data-responsive-menu="drilldown medium-accordion large-dropdown">
+            <li><a href="#">One</a></li>
+            <li>
+              <a href="#">Two</a>
+              <ul class="menu nested vertical">
+                <li><a href="#">Two A</a></li>
+                <li><a href="#">Two B</a></li>
+                <li><a href="#">Two C</a></li>
+                <li><a href="#">Two D</a></li>
+              </ul>
+            </li>
+            <li><a href="#">Three</a></li>
+            <li><a href="#">Four</a></li>
+          </ul>
+        </div>
 
-      <h3>Simple Menu</h3>
-      <div class="example">
-        <ul class="menu simple">
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
       </div>
-
-      <h3>Expanded Menu</h3>
-      <div class="example">
-        <ul class="menu expanded">
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Menu Text</h3>
-      <div class="example">
-        <ul class="menu simple">
-          <li class="menu-text">Site Title</li>
-          <li><a href="#">Two</a></li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Menu with Icons left</h3>
-      <div class="example">
-        <ul class="menu icons icon-left">
-          <li><a href="#"><i class="fi-list"></i>One</a></li>
-          <li><a href="#"><i class="fi-list"></i>Two</a></li>
-          <li><a href="#"><i class="fi-list"></i>Three</a></li>
-          <li><a href="#"><i class="fi-list"></i>Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Menu with Icons Right</h3>
-      <div class="example">
-        <ul class="menu icons icon-right">
-          <li><a href="#">One<i class="fi-list"></i></a></li>
-          <li><a href="#">Two<i class="fi-list"></i></a></li>
-          <li><a href="#">Three<i class="fi-list"></i></a></li>
-          <li><a href="#">Four<i class="fi-list"></i></a></li>
-        </ul>
-      </div>
-
-      <h3>Menu with Icon Top</h3>
-      <div class="example">
-        <ul class="menu icons icon-top">
-          <li><a href="#"><i class="fi-list"></i>One</a></li>
-          <li><a href="#"><i class="fi-list"></i>Two</a></li>
-          <li><a href="#"><i class="fi-list"></i>Three</a></li>
-          <li><a href="#"><i class="fi-list"></i>Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Menu with Icon Bottom</h3>
-      <div class="example">
-        <ul class="menu icons icon-bottom">
-          <li><a href="#">One<i class="fi-list"></i></a></li>
-          <li><a href="#">Two<i class="fi-list"></i></a></li>
-          <li><a href="#">Three<i class="fi-list"></i></a></li>
-          <li><a href="#">Four<i class="fi-list"></i></a></li>
-        </ul>
-      </div>
-
-      <h3>Menu with input, select and buttons</h3>
-      <div class="example">
-        <ul class="menu horizontal">
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-          <li>
-            <select>
-              <option value="husker">Husker</option>
-              <option value="starbuck">Starbuck</option>
-              <option value="hotdog">Hot Dog</option>
-              <option value="apollo">Apollo</option>
-            </select>
-          </li>
-          <li><input type="text" placeholder="Text input"></li>
-          <li><button class="button">button (native)</button></li>
-          <li><a class="button" href="#">button</a></li>
-        </ul>
-      </div>
-
-      <h3>Active Menu Item Class</h3>
-      <div class="example">
-        <ul class="menu">
-          <li><a href="#">One</a></li>
-          <li class="active"><a href="#">Two (.active)</a></li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h1>Menu Alignment Classes</h1>
-
-      <h3>Right Aligned Menu</h3>
-      <div class="example">
-        <ul class="menu align-right">
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Centered Menu</h3>
-      <div class="example">
-        <ul class="menu align-center">
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h1>Menu Plugin Styles</h1>
-
-      <h3>Dropdown Menu</h3>
-      <div class="example">
-        <ul class="menu dropdown" data-dropdown-menu>
-          <li><a href="#">One</a></li>
-          <li>
-            <a href="#">Two</a>
-            <ul class="menu nested vertical">
-              <li><a href="#">Two A</a></li>
-              <li><a href="#">Two B</a></li>
-              <li><a href="#">Two C</a></li>
-              <li><a href="#">Two D</a></li>
-            </ul>
-          </li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Vertical Dropdown Menu</h3>
-      <div class="example">
-        <ul class="vertical menu dropdown" data-dropdown-menu style="max-width: 250px">
-          <li><a href="#">One</a></li>
-          <li>
-            <a href="#">Two</a>
-            <ul class="menu nested vertical">
-              <li><a href="#">Two A</a></li>
-              <li><a href="#">Two B</a></li>
-              <li><a href="#">Two C</a></li>
-              <li><a href="#">Two D</a></li>
-            </ul>
-          </li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Dropdown Menu - Align Right</h3>
-      <div class="example">
-        <ul class="menu align-right dropdown" data-dropdown-menu>
-          <li><a href="#">One</a></li>
-          <li>
-            <a href="#">Two</a>
-            <ul class="menu nested vertical">
-              <li><a href="#">Two A</a></li>
-              <li><a href="#">Two B</a></li>
-              <li><a href="#">Two C</a></li>
-              <li><a href="#">Two D</a></li>
-            </ul>
-          </li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Accordion Menu</h3>
-      <div class="example">
-        <ul class="menu vertical accordion-menu" data-accordion-menu style="max-width: 250px">
-          <li><a href="#">One</a></li>
-          <li><a href="#">Two</a></li>
-          <li>
-            <a href="#">Two</a>
-            <ul class="menu nested vertical">
-              <li><a href="#">Two A</a></li>
-              <li><a href="#">Two B</a></li>
-              <li><a href="#">Two C</a></li>
-              <li><a href="#">Two D</a></li>
-            </ul>
-          </li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Drilldown Menu</h3>
-      <div class="example">
-        <ul class="menu vertical drilldown" data-drilldown style="max-width: 250px">
-          <li><a href="#">One</a></li>
-          <li>
-            <a href="#">Two</a>
-            <ul class="menu nested vertical">
-              <li><a href="#">Two A</a></li>
-              <li><a href="#">Two B</a></li>
-              <li><a href="#">Two C</a></li>
-              <li><a href="#">Two D</a></li>
-            </ul>
-          </li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h1>Responsive Menus</h1>
-
-      <h3>Accordion to Dropdown Menu</h3>
-      <div class="example">
-        <ul class="menu vertical medium-horizontal" data-responsive-menu="accordion medium-dropdown">
-          <li><a href="#">One</a></li>
-          <li>
-            <a href="#">Two</a>
-            <ul class="menu nested vertical">
-              <li><a href="#">Two A</a></li>
-              <li><a href="#">Two B</a></li>
-              <li><a href="#">Two C</a></li>
-              <li><a href="#">Two D</a></li>
-            </ul>
-          </li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Drilldown to Dropdown Menu</h3>
-      <div class="example">
-        <ul class="menu vertical medium-horizontal" data-responsive-menu="drilldown medium-dropdown">
-          <li><a href="#">One</a></li>
-          <li>
-            <a href="#">Two</a>
-            <ul class="menu nested vertical">
-              <li><a href="#">Two A</a></li>
-              <li><a href="#">Two B</a></li>
-              <li><a href="#">Two C</a></li>
-              <li><a href="#">Two D</a></li>
-            </ul>
-          </li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
-      <h3>Drilldown to Accordion to Dropdown Menu</h3>
-      <div class="example">
-        <ul class="menu vertical large-horizontal" data-responsive-menu="drilldown medium-accordion large-dropdown">
-          <li><a href="#">One</a></li>
-          <li>
-            <a href="#">Two</a>
-            <ul class="menu nested vertical">
-              <li><a href="#">Two A</a></li>
-              <li><a href="#">Two B</a></li>
-              <li><a href="#">Two C</a></li>
-              <li><a href="#">Two D</a></li>
-            </ul>
-          </li>
-          <li><a href="#">Three</a></li>
-          <li><a href="#">Four</a></li>
-        </ul>
-      </div>
-
     </div>
 
     <script src="../assets/js/vendor.js"></script>
diff --git a/test/visual/menu/vertical-accordionmenu-alignment-flex.html b/test/visual/menu/vertical-accordionmenu-alignment-flex.html
index 3696e674aade9df8afd83c8b9ea1dd94998c1a10..9f5ad45d887b2c40120a86afa6cea0fa651e7ae2 100644 (file)
--- a/test/visual/menu/vertical-accordionmenu-alignment-flex.html
+++ b/test/visual/menu/vertical-accordionmenu-alignment-flex.html
@@ -37,8 +37,8 @@
   </head>
 
   <body>
-    <div class="row">
-      <div class="column">
+    <div class="grid-x grid-padding-x">
+      <div class="cell">
         <h1>Vertical Accordion Menu Alignment</h1>
 
         <h3>Left Aligned Accordion Menu (Default) - Vertical</h3>
diff --git a/test/visual/menu/vertical-accordionmenu-alignment-float.html b/test/visual/menu/vertical-accordionmenu-alignment-float.html
index 3696e674aade9df8afd83c8b9ea1dd94998c1a10..a369c44d965528e4fe2dd24634c498f770817c55 100644 (file)
--- a/test/visual/menu/vertical-accordionmenu-alignment-float.html
+++ b/test/visual/menu/vertical-accordionmenu-alignment-float.html
@@ -6,7 +6,7 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <title>All Foundation Menu Options - Flexbox</title>
     <link href="../motion-ui/dist/motion-ui.css" rel="stylesheet" />
-    <link href="../assets/css/foundation.css" rel="stylesheet" />
+    <link href="../assets/css/foundation-float.css" rel="stylesheet" />
     <link href="//cdnjs.cloudflare.com/ajax/libs/foundicons/3.0.0/foundation-icons.css" rel="stylesheet">
 
     <style>
diff --git a/test/visual/menu/vertical-drilldownmenu-alignment-flex.html b/test/visual/menu/vertical-drilldownmenu-alignment-flex.html
index 18bcfe77dfff3550388a083ede32bdd6fc5709a6..6ff0d9faa34410fa49559230194009bae54cd561 100644 (file)
--- a/test/visual/menu/vertical-drilldownmenu-alignment-flex.html
+++ b/test/visual/menu/vertical-drilldownmenu-alignment-flex.html
@@ -37,8 +37,8 @@
   </head>
 
   <body>
-    <div class="row">
-      <div class="column">
+    <div class="grid-x grid-padding-x">
+      <div class="cell">
         <h1>Vertical Accordion Menu Alignment</h1>
 
         <h3>Left Aligned Drilldown Menu (Default) - Vertical</h3>
diff --git a/test/visual/menu/vertical-dropdownmenu-alignment-flex.html b/test/visual/menu/vertical-dropdownmenu-alignment-flex.html
index 6c98900426cfebf8116af75901c4203a3aeb62d3..1c8120d18d51261b93fc4f5499370706aa89df03 100644 (file)
--- a/test/visual/menu/vertical-dropdownmenu-alignment-flex.html
+++ b/test/visual/menu/vertical-dropdownmenu-alignment-flex.html
@@ -37,8 +37,8 @@
   </head>
 
   <body>
-    <div class="row">
-      <div class="column">
+    <div class="grid-x grid-padding-x">
+      <div class="cell">
         <h1>Vertical Dropdown Menu Alignment</h1>
 
         <h3>Left Aligned Dropdown Menu (Default) - Vertical</h3>
diff --git a/test/visual/menu/vertical-menu-alignment-flex.html b/test/visual/menu/vertical-menu-alignment-flex.html
index 65baa2a9484a4c45e094b5021782a4feeec4f90e..6a5346a934100861213ce59d327ca8c50c9f1f2d 100644 (file)
--- a/test/visual/menu/vertical-menu-alignment-flex.html
+++ b/test/visual/menu/vertical-menu-alignment-flex.html
@@ -37,8 +37,8 @@
   </head>
 
   <body>
-    <div class="row">
-      <div class="column">
+    <div class="grid-x grid-padding-x">
+      <div class="cell">
         <h1>Vertical Menu Alignment</h1>
 
         <h3>Left Aligned Menu (Default) - Vertical</h3>
Mirror of https://github.com/foundation/foundation-sites.git