From 8b2530f2a7c7d9da696fc4e9ed1fda6a87ea341b Mon Sep 17 00:00:00 2001
From: Yogesh Sharma <51679200+YogeshSharma01@users.noreply.github.com>
Date: Sat, 30 Jan 2021 00:17:12 +0530
Subject: [PATCH] New Navbar added with the logo of PublicLab (#420)

* New Navbar added with the logo of PublicLab

* Changes in Navbar

* Set the size of The Logo-Image in Navbar section

* fix the navbar in dark mode
---
 examples/demo.css          |  90 +++++++++++++++++++++++++++++++++++++
 examples/demo.js           |  14 +++++-
 images/Boots-ground-02.png | Bin 0 -> 8355 bytes
 index.html                 |  68 +++++++++++++++++++++++-----
 4 files changed, 161 insertions(+), 11 deletions(-)
 create mode 100644 images/Boots-ground-02.png

diff --git a/examples/demo.css b/examples/demo.css
index ae61b362..7a7a6906 100644
--- a/examples/demo.css
+++ b/examples/demo.css
@@ -14,6 +14,96 @@ body {
   background: #f8f8fa;
 }
 
+/* Navbar CSS */
+ 
+nav {
+    z-index: 100;
+}
+
+nav:after {
+    content: '';
+    clear: both;
+    display: table;
+}
+
+nav ul {
+    float: right;
+    list-style: none;
+    margin-right: 40px;
+    position: relative;
+}
+
+
+nav ul li {
+    display: inline-block;
+    margin: 0 5px;
+}
+
+nav ul li a {
+    color: #a1a1a1;
+    text-decoration: none;
+    line-height: 70px;
+    font-size: 15px;
+    padding: 8px 15px;
+}
+
+nav ul li a:hover {
+    text-decoration: none;
+    color: #669dc9;
+    box-shadow: 0 0 5px #669dc9,
+        0 0 5px #669dc9;
+}
+
+nav ul ul li{
+    background-color: #f8f8fa;
+}
+
+nav ul ul li a:hover {
+    color: #34A7C1;
+    box-shadow: none;
+}
+
+nav ul ul {
+    position: absolute;
+    top: 90px;
+    opacity: 0;
+    visibility: hidden;
+    transition: top .3s;
+    border-top: 3px solid #aaa3a3;
+}
+
+nav ul ul ul {
+    border-top: none;
+}
+
+nav ul li:hover>ul {
+    top: 70px;
+    opacity: 1;
+    visibility: visible;
+}
+
+nav ul ul li {
+    position: relative;
+    margin: 0px;
+    width: 200px;
+    float: none;
+    display: list-item;
+    border-bottom: 1px solid rgba(0, 0, 0, 0.4);
+}
+
+ul {
+    padding: 0;
+}
+
+a {
+    text-decoration: none;
+}
+
+nav ul ul li a {
+    line-height: 50px;
+}
+/* Navbar ends  */
+
 #forkMe-ribbon {
     width: 10px;
     height: 10px;
diff --git a/examples/demo.js b/examples/demo.js
index 731b8603..b34a4e7a 100644
--- a/examples/demo.js
+++ b/examples/demo.js
@@ -1,5 +1,17 @@
 document.addEventListener('DOMContentLoaded', function () {
-          
+    /* Navbar scroll to that perticular section of page */
+    $('.navbar a').on('click', function(e){
+        if(this.hash !== ''){
+            e.preventDefault();
+
+            const hash = this.hash;
+            $('html,body').animate({
+                scrollTop: $(hash).offset().top
+            },800); 
+        }
+    });
+
+
     /*Scroll to top when arrow up clicked BEGIN*/
     $(window).scroll(function() {
         let height = $(window).scrollTop();
diff --git a/images/Boots-ground-02.png b/images/Boots-ground-02.png
new file mode 100644
index 0000000000000000000000000000000000000000..f1736b8e63fe312dd6fa1b366419c94f6b866bdd
GIT binary patch
literal 8355
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
afH>IL`+JT%{O_{>KwDj3tzN}C{Qm$-@6-MO

literal 0
HcmV?d00001

diff --git a/index.html b/index.html
index 3857ed03..ed503f41 100644
--- a/index.html
+++ b/index.html
@@ -21,7 +21,6 @@
     <link rel="manifest" href="./manifest.json">
     <script src="./src/scripts/pwainit.js"></script>
 
-
     <script src="node_modules/jquery/dist/jquery.min.js"></script>
     <script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
     <script src="./node_modules/node-snackbar/dist/snackbar.min.js"></script>
@@ -42,12 +41,61 @@
     <link href="https://fonts.googleapis.com/css?family=Open+Sans&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="examples/demo.css">
     <link rel="stylesheet" href="examples/themes.css">
-
+  <!-- Navbar start -->
     <div id='container'>
-        <div id='forkMe-ribbon'><a href="https://github.com/publiclab/community-toolbox" >
-             <img src="https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png"alt="Fork me on GitHub"></a>
-        </div>
-    </div>    
+      <div id='forkMe-ribbon'><a href="https://github.com/publiclab/community-toolbox" >
+        <img src="https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png"alt="Fork me on GitHub"></a>
+      </div>
+    </div> 
+    <nav class="navbar">
+        <img id="logo-img" src="./images/Boots-ground-02.png" alt="publiclab-logo" style="height: 100px">
+        <ul>
+            <li class="list-i">
+                <a  href="#">LEARN</a>
+                <ul>
+                    <li><a class="line" href="https://github.com/publiclab/plots2/blob/master/README.md">Get Started</a>
+                    </li>
+                    <li><a class="line" href="https://github.com/publiclab/plots2/labels/support'">Assist Someone</a>
+                    </li>
+                    <li><a class="line"
+                            href="https://publiclab.org/notes/warren/10-31-2016/create-a-welcoming-first-timers-only-issue-to-invite-new-software-contributors">Create
+                            Your FTO Issue</a></li>
+                </ul>
+            </li>
+            <li class="list-i">
+                <a  href="#">ISSUES</a>
+                <ul>
+                    <li><a class="line" href="#fto-issue">FTO Issues</a></li>
+                    <li><a class="line" href="#stale-head">Stale Issues</a></li>
+                </ul>
+            </li>
+            <li class="list-i">
+                <a  href="#">PARTICIPANTS</a>
+                <ul>
+                    <li><a class="line" href="#candidate">Candidates</a></li>
+                    <li><a class="line" href="#fto-author">FTO Authors</a></li>
+                    <li><a class="line" href="#contributer">Contributers</a></li>
+                </ul>
+            </li>
+            <li class="list-i"><a  class="line" href="https://publiclab.org/chat">CHATROOM</a></li>
+            <li class="list-i">
+                <a  class="line" href="#">MORE</a>
+                <ul>
+                    <li><a class="line" href="https://github.com/publiclab/community-toolbox">Source Code</a></li>
+                    <li><a class="line" href="https://publiclab.org/conduct">Conduct</a></li>
+                    <li><a class="line" href="https://guides.github.com/activities/hello-world/">New To GitHub?</a></li>
+                    <li><a class="line" href="https://github.com/search?q=label%3Afirst-timers-only+is%3Aissue+is%3Aopen+user%3Apubliclab&ref=simplesearch">Selection of
+                            Issues</a></li>
+                    <li><a class="line"
+                            href="https://publiclab.org/notes/warren/11-08-2016/help-public-lab-s-software-grow-by-joining-a-supportive-team">Support</a>
+                    </li>
+                    <li><a class="line" href="https://github.com/search?q=label%3Ahelp-wanted+is%3Aissue+is%3Aopen+user%3Apubliclab&ref=simplesearch">Challenges</a>
+                    </li>
+                </ul>
+            </li>
+        </ul>
+    </nav>
+    <!-- Navbar ends -->
 
     <div class="container-fluid">
       <header class="text-center">
@@ -144,7 +192,7 @@ <h3>3.<br />Create a welcoming issue for someone else</h3>
 
       <br />
 
-      <h2><span class=" newcomer-issues">first timers only</span> issues</h2>
+      <h2><span class=" newcomer-issues" id="fto-issue">first timers only</span> issues</h2>
 
       <p>Here are <a  id="newcomer-issues-link" href="https://github.com/publiclab/plots2/labels/first-timers-only">a selection</a> of issues we've <a class=" guidelines-link" href="https://publiclab.org/n/13667">made especially for first-timers</a>. We're here to help, so just ask if one looks interesting, by leaving a comment!</p>
 
@@ -158,7 +206,7 @@ <h2 id="whats-next">What's next?</h2>
 
       <p>In "<span class=" newcomer-like-issues">candidates</span>" below, there are some issues we think would make good <b><span class=" newcomer-issues">first-timers-only</span></b> issues, but haven't finished formatting. They could make a good second-time contribution!</p>
 
-      <h2 class=" newcomer-like-issues">Candidates</h2>
+      <h2 class=" newcomer-like-issues" id="candidate">Candidates</h2>
 
       <p>We put a lot of work into our <span class=" newcomer-issues">first-timer-only</span> issues. But if we haven't been able to prepare any recently, here's a set of <span class=" newcomer-like-issues">candidates</span> we haven't yet had time to prepare, but which have most of the needed information. (Also: Learn how to <a  href="https://publiclab.org/n/13667">help turn these into <span class=" newcomer-issues">first-timers-only</span> issues</a> to help keep welcoming people in!</p>
 
@@ -174,7 +222,7 @@ <h2>You're now an expert on being a newcomer!</h2>
 
       <hr />
 
-      <h2>FTO Authors</h2>
+      <h2 id="fto-author">FTO Authors</h2>
 
       <p>These people took some time out of their busy schedule to help in welcoming newcomers by creating FTO issues: </p>
 
@@ -262,7 +310,7 @@ <h2 class="recent-contributors-head">Recent Contributors</h2>
         </div>
       </div>
 
-      <h2 class="contributors-head">Contributors</h2>
+      <h2 class="contributors-head" id="contributer">Contributors</h2>
       <div class="contribs">
         <div style="display: flex; justify-content: space-between">
           <p>This project was made possible by many contributors, including the following GitHub users:</p>