Merge pull request #51 from imarc/nav-variants

Nav variants
imarc · Feb 10, 2017 · 06d8940 · 06d8940
2 parents ecf2604 + 8836694
commit 06d8940
Show file tree

Hide file tree

Showing 9 changed files with 641 additions and 3,209 deletions.
diff --git a/components/breadcrumbs.html b/components/breadcrumbs.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <title>Progress Component - Imarc</title>
+        <meta name="description" content="The Imarc Boilerplate is a streamlined starting point for building websites." />
+        <meta name="web_author" content="Imarc, A Digital Agency | Boston + Silicon Valley | more info at imarc.com" />
+        <meta name="viewport" content="width=device-width" />
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
+        <link rel="stylesheet" type="text/css" href="../css/styles.css" media="all" />
+    </head>
+    <body>
+        <div class="torso">
+            <main>
+                <section class="intro">
+                    <div class="container">
+                        <h1>Breadcrumbs</h1>
+                        <p>
+                            Below is an example of breadcrumbs.
+                        </p>
+                    </div>
+                </section>
+                <section>
+                    <div class="container">
+
+
+                        <!-- Begin component -->
+
+                        <nav class="breadcrumbs">
+                            <ul>
+                                <li><a href="">Nav Item 1</a></li>
+                                <li class="active"><a href="">Nav Item 2</a></li>
+                                <li><a href="">Nav Item 3</a></li>
+                            </ul>
+                        </nav>
+
+                    </div>
+                </section>
+            </main>
+        </div>
+        <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
+    </body>
+</html>
diff --git a/components/index.html b/components/index.html
@@ -43,6 +43,9 @@ <h1>Imarc Components list</h1>
                             <li>
                                 <a href="background-video.html">Background video</a>
                             </li>
+                            <li>
+                                <a href="breadcrumbs.html">Breadcrumbs</a>
+                            </li>
                             <li>
                                 <a href="carousel.html">Carousel</a>
                             </li>
@@ -76,6 +79,9 @@ <h1>Imarc Components list</h1>
                             <li>
                                 <a href="pagination.html">Pagination</a>
                             </li>
+                            <li>
+                                <a href="progress.html">Progress</a>
+                            </li>
                             <li>
                                 <a href="scroll-to-section.html">Scroll to Section</a>
                             </li>

diff --git a/components/progress.html b/components/progress.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <title>Progress Component - Imarc</title>
+        <meta name="description" content="The Imarc Boilerplate is a streamlined starting point for building websites." />
+        <meta name="web_author" content="Imarc, A Digital Agency | Boston + Silicon Valley | more info at imarc.com" />
+        <meta name="viewport" content="width=device-width" />
+        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
+        <link rel="stylesheet" type="text/css" href="../css/styles.css" media="all" />
+    </head>
+    <body>
+        <div class="torso">
+            <main>
+                <section class="intro">
+                    <div class="container">
+                        <h1>Progress Breadcrumb</h1>
+                        <p>
+                            Below is an example of a progress breadcrumb.
+                        </p>
+                    </div>
+                </section>
+                <section>
+                    <div class="container">
+
+
+                        <!-- Begin component -->
+
+                        <nav class="progress">
+                            <ul>
+                                <li class="complete"><a href="">Nav Item 1</a></li>
+                                <li class="complete"><a href="">Nav Item 2</a></li>
+                                <li class="active"><a href="">Nav Item 3</a></li>
+                                <li><a href="">Nav Item 4</a></li>
+                                <li><a href="">Nav Item 5</a></li>
+                                <li><a href="">Nav Item 6</a></li>
+                            </ul>
+                        </nav>
+
+                    </div>
+                </section>
+            </main>
+        </div>
+        <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
+    </body>
+</html>
diff --git a/components/scroll-to-section.html b/components/scroll-to-section.html
@@ -166,7 +166,7 @@ <h2>Scroll to Me</h2>
             </main>
         </div>
 
-        <script src="https://code.jquery.com/jquery-2.2.3.min.js" integrity="sha256-a23g1Nt4dtEYOj7bR+vTu7+T8VP13humZFBJNIYoEJo=" crossorigin="anonymous"></script>
+        <script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
         <script src="../js/lib/smooth-scroll.js"></script>
 
         <script>