Merged in mk200789/django-hackathon-starter (pull request DrkSephy#28)

documented instagram.py
dereklarmstrong · Apr 14, 2015 · fce1755 · fce1755
2 parents 96e26f7 + 797bc7c
commit fce1755
Show file tree

Hide file tree

Showing 11 changed files with 740 additions and 94 deletions.
diff --git a/angular/addons/footer.html b/angular/addons/footer.html
@@ -0,0 +1,35 @@
+<!-- Main jumbotron for a primary marketing message or call to action -->
+<div class="jumbotron">
+  <div class="container">
+    <h1>Hello, world!</h1>
+    <p>This is a template for a simple marketing or informational website. It includes a large callout called the hero unit and three supporting pieces of content. Use it as a starting point to create something more unique.</p>
+    <p><a class="btn btn-primary btn-lg">Learn more &raquo;</a></p>
+  </div>
+</div>
+
+<div class="container">
+  <!-- Example row of columns -->
+  <div class="row">
+    <div class="col-lg-4">
+      <h2>Heading</h2>
+      <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+      <p><a class="btn btn-default" href="#">View details &raquo;</a></p>
+    </div>
+    <div class="col-lg-4">
+      <h2>Heading</h2>
+      <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
+      <p><a class="btn btn-default" href="#">View details &raquo;</a></p>
+   </div>
+    <div class="col-lg-4">
+      <h2>Heading</h2>
+      <p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
+      <p><a class="btn btn-default" href="#">View details &raquo;</a></p>
+    </div>
+  </div>
+
+  <hr>
+
+  <footer>
+    <p>&copy; Company 2013</p>
+  </footer>
+</div> <!-- /container -->
diff --git a/angular/addons/nav.html b/angular/addons/nav.html
@@ -0,0 +1,18 @@
+<nav>
+    <ul class="list-unstyled main-menu">
+      <li><a href="#/snippets">Snippets <span class="icon"></span></a></li>
+      <li><a href="#/steamSales">Steam Sales <span class="icon"></span></a></li>
+      <li><a href="#/githubUser">Github User <span class="icon"></span></a></li>
+      <li><a href="#/githubTopContributions">Github Resume <span class="icon"></span></a></li>
+      <li><a href="#">Dropdown</a>
+        <ul class="list-unstyled">
+            <li class="sub-nav"><a href="#">Sub Menu One <span class="icon"></span></a></li>
+            <li class="sub-nav"><a href="#">Sub Menu Two <span class="icon"></span></a></li>
+            <li class="sub-nav"><a href="#">Sub Menu Three <span class="icon"></span></a></li>
+            <li class="sub-nav"><a href="#">Sub Menu Four <span class="icon"></span></a></li>
+            <li class="sub-nav"><a href="#">Sub Menu Five <span class="icon"></span></a></li>
+        </ul>
+      </li>
+    </ul>
+</nav>
+
diff --git a/angular/css/main.css b/angular/css/main.css
@@ -0,0 +1,176 @@
+
+
+/* ==========================================================================
+   Author's custom styles
+   ========================================================================== */
+
+a.nav-expander {
+  background: none repeat scroll 0 0 #000000;
+  color: #FFFFFF;
+  display: block;
+  font-size: 15px;
+  font-weight: 400;
+  height: 50px;
+  margin-right: 0;
+  padding: 1em 1.6em 2em;
+  position: absolute;
+  right: 0;
+  text-decoration: none;
+  text-transform: uppercase;
+  top: 0;
+  transition: right 0.3s ease-in-out 0s;
+  width: 130px;
+  z-index: 12;
+
+  transition: right 0.3s ease-in-out 0s;
+  -webkit-transition: right 0.3s ease-in-out 0s;
+  -moz-transition: right 0.3s ease-in-out 0s;
+  -o-transition: right 0.3s ease-in-out 0s;
+
+}
+
+a.nav-expander:hover {
+  cursor: pointer;
+}
+
+a.nav-expander.fixed {
+  position: fixed;
+}
+
+.nav-expanded a.nav-expander.fixed {
+    right: 20em;
+}
+
+nav {
+  background: #2d2f33;
+  display: block;
+  height: 100%;
+  overflow: auto;
+  position: fixed;
+  right: -20em;
+  font-size: 15px;
+  top: 0;
+  width: 20em;
+  z-index: 2000;
+
+  transition: right 0.3s ease-in-out 0s;
+  -webkit-transition: right 0.3s ease-in-out 0s;
+  -moz-transition: right 0.3s ease-in-out 0s;
+  -o-transition: right 0.3s ease-in-out 0s;
+
+}
+.nav-expanded nav {
+  right: 0;
+}
+
+body.nav-expanded {
+  margin-left: 0em;
+  transition: right 0.4s ease-in-out 0s;
+  -webkit-transition: right 0.4s ease-in-out 0s;
+  -moz-transition: right 0.4s ease-in-out 0s;
+  -o-transition: right 0.4s ease-in-out 0s;
+}
+
+#nav-close {
+  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
+  font-weight: 300;
+  font-size: 24px;
+  padding-right: 10px;
+}
+
+.main-menu {
+  padding-top: 12px;
+}
+
+.main-menu li {
+  border-bottom: 1px solid #323949;
+  margin-left: 20px;
+  font-size: 18px;
+  padding: 12px;
+}
+
+.main-menu li a {
+  color: #6F7D8C;
+  text-decoration: none;
+}
+
+.main-menu li a:hover {
+  color: #FFFFFF;
+  text-decoration: none;
+}
+
+.main-menu li .sub-nav {
+  border-bottom: 0px;
+  padding: 4px;
+}
+
+.main-menu a .caret {
+	width: 0;
+	height: 0;
+	display: inline-block;
+	vertical-align: top;
+	border-top: 4px solid #4f5963;
+	border-right: 4px solid transparent;
+	border-left: 4px solid transparent;
+	content: "";
+    margin-top: 8px;
+}
+
+.main-menu a:hover .caret {
+	border-top-color: #4f5963;
+}
+
+.main-menu li.open > a > .caret {
+	border-top: none;
+	border-bottom: 4px solid #4f5963;
+	border-right: 4px solid transparent;
+	border-left: 4px solid transparent;
+}
+
+.main-menu li.open > a:hover > .caret {
+	border-bottom-color: #4f5963;
+}
+
+.icon:before {
+  font-family: 'FontAwesome';
+  font-style: normal;
+  font-variant: normal;
+  font-weight: normal;
+  line-height: 1;
+  text-transform: none;
+  content: '\f105';
+}
+
+.main-menu li > a > span.icon {
+  float: right;
+  margin: 0.1em 1.7em -0.1em 0;
+  opacity: 0;
+  -webkit-transition: all 0.2s ease-in-out;
+  -moz-transition: all 0.2s ease-in-out;
+  -o-transition: all 0.2s ease-in-out;
+  transition: all 0.2s ease-in-out;
+
+}
+
+.main-menu li > a:hover > span.icon {
+  float: right;
+  margin: 0.1em 0.8em -0.1em 0;
+  opacity: 1;
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/angular/index.html b/angular/index.html
@@ -12,12 +12,53 @@
         <!-- Bootstrap Core CSS -->
         <link href="vendor/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
 
+        <!-- Styles -->
+        <link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">
+        <link rel="stylesheet" href="css/main.css">
+
         <!-- jQuery -->
         <script src="vendor/jquery/dist/jquery.min.js"></script>
 
         <!-- Bootstrap Core JavaScript -->
         <script src="vendor/bootstrap/dist/js/bootstrap.min.js"></script>
 
+        <!-- Front-end JavaScript -->
+        <script src="jquery.navgoco.js"></script>
+        <script>
+        $(document).ready(function(){                       
+
+           //Navigation Menu Slider
+            $('#nav-expander').on('click',function(e){
+              e.preventDefault();
+              $('body').toggleClass('nav-expanded');
+            });
+            $('#nav-close').on('click',function(e){
+              e.preventDefault();
+              $('body').removeClass('nav-expanded');
+            });
+
+
+            // Initialize navgoco with default options
+            $(".main-menu").navgoco({
+                caret: '<span class="caret"></span>',
+                accordion: false,
+                openClass: 'open',
+                save: true,
+                cookie: {
+                    name: 'navgoco',
+                    expires: false,
+                    path: '/'
+                },
+                slide: {
+                    duration: 300,
+                    easing: 'swing'
+                }
+            });
+
+
+          });
+          </script>
+
         <!-- Main application file -->
         <script src="scripts/app.js"></script>
 
@@ -40,5 +81,18 @@
 
     <body>
         <div data-ui-view></div>
+
+        <div ng-include="'addons/nav.html'"></div>
+
+        <div class="navbar navbar-inverse navbar-fixed-top">      
+            <!--Include your brand here-->
+            <a class="navbar-brand" href="#">Django-AngularJS</a>
+            <div class="navbar-header pull-right">
+              <a id="nav-expander" class="nav-expander fixed">
+                Apps &nbsp;<i class="fa fa-bars fa-lg white"></i>
+              </a>
+            </div>
+        </div>
+
     </body>
 </html>