Improved navbar.

2 files changed, 37 insertions, 41 deletions

diff --git a/newspipe/web/static/css/custom.css b/newspipe/web/static/css/custom.css
index 8fb4eef3..01befb3e 100644
--- a/newspipe/web/static/css/custom.css
+++ b/newspipe/web/static/css/custom.css
@@ -1,7 +1,7 @@
 html {
     position: relative;
     min-height: 100%;
-    font-size: 14px;
+    font-size: 16px;
 }
 body {
     /* Margin bottom by footer height */
@@ -15,6 +15,19 @@ a {
     color: #3572B0;
 }
 
+#sidebar {
+    overflow: auto;
+    max-height: 700px;
+}
+
+#sidebar .nav li {
+  list-style-type: none;
+  padding: 0;
+  line-height: 1.0;
+  flex-direction: row;
+  flex-wrap: nowrap; /* assumes you only want one row */
+}
+
 .navbar-dark .navbar-nav .nav-link {
     color:
     rgb(255, 255, 255, 1);
@@ -48,20 +61,6 @@ a {
     color: #FFFFFF;
 }
 
-#sidebar {
-    overflow: auto;
-    max-height: 700px;
-}
-
-#sidebar .nav li {
-  list-style-type: none;
-  padding: 0;
-  line-height: 1.0;
-  flex-direction: row;
-  flex-wrap: nowrap; /* assumes you only want one row */
-}
-
-
 .input-group-inline {
     min-width: 0;
     width: 200px;
diff --git a/newspipe/web/templates/layout.html b/newspipe/web/templates/layout.html
index 9319d104..4f9e4464 100644
--- a/newspipe/web/templates/layout.html
+++ b/newspipe/web/templates/layout.html
@@ -38,33 +38,32 @@
                         </li>
                     {% endif %}
                     <li class="nav-item dropdown">
-                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBookmark" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fa fa-bookmark" aria-hidden="true"></i></a>
-                        <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBookmark">
-                            <a class="dropdown-item" href="{{ url_for('bookmarks.list_') }}">{{ _('Your bookmarks') }}</a>
-                            <a class="dropdown-item" href="{{ url_for('bookmark.form') }}">{{ _('Add a new bookmark') }}</a>
-                        </div>
-                    </li>
-
-                    <li class="nav-item dropdown">
-                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownRSS" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fa fa-rss" aria-hidden="true"></i>&nbsp;{{ _('Add a new feed') }}</a>
+                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownRSS" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fa fa-rss" aria-hidden="true"></i>&nbsp;{{ _('Feeds') }}</a>
                         <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownRSS">
-
-                            <form class="navbar-form  navbar-left px-4 py-3" action="{{ url_for('feed.bookmarklet') }}">
-                                <label class="sr-only" for="inlineFormInputGroupAPIKey">{{ _('Add a new feed') }}</label>
-                                <div class="input-group input-group-inline">
-                                    <div class="input-group-prepend">
-                                          <input class="form-control" name="url" type="url" placeholder="{{_('Site or feed url')}}" required="required"/>
-                                    </div>
-                                    <button type="submit" class="btn btn-primary"><i class="fa fa-plus" aria-hidden="true"></i></button>
-                                </div>
-                              </form>
+                              <a class="dropdown-item" href="{{ url_for('feeds.feeds') }}">{{ _('Subscribed') }}</a>
+                              <a class="dropdown-item" href="{{ url_for('feeds.inactives') }}">{{ _('Inactive') }}</a>
+                              <a class="dropdown-item" href="{{ url_for('popular') }}">{{ _('Popular') }}</a>
+                              <a class="dropdown-item" href="{{ url_for('articles.history') }}">{{ _('History') }}</a>
+                              <div class="dropdown-divider"></div>
+                              <a class="dropdown-item" href="{{ url_for('feed.form') }}">{{ _('Add a new feed') }}</a>
+                              <form class="navbar-form  navbar-left px-4 py-3" action="{{ url_for('feed.bookmarklet') }}">
+                                  <label class="sr-only" for="inlineFormInputGroupAPIKey">{{ _('Add a new feed') }}</label>
+                                  <div class="input-group input-group-inline">
+                                      <div class="input-group-prepend">
+                                            <input class="form-control" name="url" type="url" placeholder="{{_('Site or feed url')}}" required="required"/>
+                                      </div>
+                                      <button type="submit" class="btn btn-primary"><i class="fa fa-plus" aria-hidden="true"></i></button>
+                                  </div>
+                                </form>
                         </div>
                     </li>
 
                     <li class="nav-item dropdown">
-                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownCategory" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fa fa-tag" aria-hidden="true"></i>&nbsp;{{ _('Add a new category') }}</a>
+                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownCategory" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fa fa-tag" aria-hidden="true"></i>&nbsp;{{ _('Catgories') }}</a>
                         <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownCategory">
-
+                            <a class="dropdown-item" href="{{ url_for('categories.list_') }}">{{ _('Categories') }}</a>
+                            <div class="dropdown-divider"></div>
+                            <a class="dropdown-item" href="{{ url_for('category.form') }}">{{ _('Add a new category') }}</a>
                             <form class="navbar-form navbar-left px-4 py-3" action="{{ url_for('category.form') }}" method="POST" name="category">
                                 <label class="sr-only" for="inlineFormInputGroupAPIKey">{{ _('Add a new category') }}</label>
                                 <div class="input-group input-group-inline">
@@ -78,12 +77,10 @@
                     </li>
 
                     <li class="nav-item dropdown">
-                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBookmark" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{{ _('Feed') }}</a>
+                        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownBookmark" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fa fa-bookmark" aria-hidden="true"></i>&nbsp;{{ _('Bookmarks') }}</a>
                         <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdownBookmark">
-                            <a class="dropdown-item" href="{{ url_for('popular') }}">{{ _('Popular') }}</a>
-                            <a class="dropdown-item" href="{{ url_for('feeds.inactives') }}">{{ _('Inactive') }}</a>
-                            <a class="dropdown-item" href="{{ url_for('articles.history') }}">{{ _('History') }}</a>
-                            <a class="dropdown-item" href="{{ url_for('feeds.feeds') }}">{{ _('All') }}</a>
+                            <a class="dropdown-item" href="{{ url_for('bookmarks.list_') }}">{{ _('Your bookmarks') }}</a>
+                            <a class="dropdown-item" href="{{ url_for('bookmark.form') }}">{{ _('Add a new bookmark') }}</a>
                         </div>
                     </li>