Remove design glitches, improve responsive CSS

anitab-org · Jul 25, 2020 · 257f2e7 · 257f2e7
1 parent beaf172
commit 257f2e7
Show file tree

Hide file tree

Showing 2 changed files with 100 additions and 4 deletions.
diff --git a/systers_portal/static/css/style.css b/systers_portal/static/css/style.css
@@ -170,6 +170,7 @@ body > .container-fluid {
 #signup-btn {
   background-color: #8d2165;
   right: 20%;
+  border-radius: 5px;
 }
 
 .auth-img {
@@ -650,4 +651,69 @@ table.decoration-none  tr a {
   .featurette .img-responsive {
     margin: 0 auto;
   }
+  #systers-logo {
+    height: 70px;
+    width: 298px;
+    margin: 6px;
+  }
+  #upper-nav {
+      display: none;
+  }
+}
+
+@media (max-width: 991px) {
+    .navbar-header {
+        float: none;
+    }
+    .navbar-toggle {
+        display: block;
+    }
+    .navbar-collapse {
+        border-top: 1px solid transparent;
+        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
+    }
+    .navbar-collapse.collapse {
+        display: none;
+    }
+    .navbar-nav {
+        float: none;
+        margin: 7.5px -15px;
+    }
+    .navbar-nav>li {
+        float: none;
+    }
+    .navbar-nav>li>a {
+        padding-top: 10px;
+        padding-bottom: 10px;
+    }
+    .navbar-text {
+        float: none;
+        margin: 15px 0;
+    }
+    .navbar-collapse.collapse.in {
+        display: block;
+    }
+    .collapsing {
+        overflow: hidden;
+    }
+    #log-btn {
+        margin-right: 19px;
+        margin-top: 3px;
+    }
+    #signup-btn {
+        margin-left: 19px;
+        margin-bottom: 3px;
+    }
+}
+
+@media (min-width: 769px) {
+    #log-btn-menu {
+        display: none;
+    }
+    #signup-btn-menu {
+        display: none;
+    }
+    #user-dropdown-menu {
+        display: none;
+    }
 }
diff --git a/systers_portal/templates/base.html b/systers_portal/templates/base.html
@@ -59,7 +59,7 @@
               {% url 'unapproved_community_requests' as url %}
               <li {% if url == request.path %}class="active"{% endif %}role="presentation">
                 <a role="menuitem" href="{{ url }}">
-                  View community requests </a>          
+                  View community requests </a>
               </li>
               {% endif %}
               {% if user.is_authenticated and user.is_active and user.is_staff %}
@@ -72,7 +72,7 @@
           </ul>
         </li>
         <li {% if '/meetup/' in request.path %}class="active"{% endif %} class="dropdown" id="meetup-dropdown">
-          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Meetups <span class="caret"></span></a>
+          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Meetups<span class="caret"></span></a>
           <ul class="dropdown-menu" role="menu">
             {% url 'list_meetup_location' as url %}
             <li {% if url == request.path %}class="active"{% endif %}>
@@ -86,14 +86,14 @@
             {% url 'request_meetup_location' as url %}
             <li {% if url == request.path %}class="active"{% endif %}role="presentation">
               <a role="menuitem" href="{{ url }}">
-              Request New Meetup Location</a> 
+              Request New Meetup Location</a>
             </li>
             {% endif %}
             {% if user.is_authenticated and user.is_active and user.is_staff %}
             {% url 'new_meetup_location_requests' as url %}
             <li {% if url == request.path %}class="active"{% endif %}role="presentation">
               <a role="menuitem" href="{{ url }}">
-              View meetup location requests </a>          
+              View meetup location requests </a>
             </li>
             {% endif %}
             {% if user.is_staff %}
@@ -107,6 +107,36 @@
         <li><a href="http://wiki.systers.org/open-source/doku.php/portal" target="blank_">Wiki</a></li>
         {% url 'contact' as url %}
         <li {% if url == request.path %}class="active"{% endif %}><a href="{{ url }}">Contact</a></li>
+        {% if user.is_authenticated and user.is_active %}
+        <li id='user-dropdown-menu' class="dropdown {% if '/users/' in request.path or '/accounts/' in request.path %}active{% endif %}">
+              <a role="menuitem" href="#" class="dropdown-toggle" data-toggle="dropdown">{{ user }} <span class="caret"></span></a>
+              <ul class="dropdown-menu" role="menu">
+                <li {% if '/users/' in request.path %}class="active"{% endif %}>
+                  <a role="menuitem" href="{% url 'user' user.username %}">Profile</a>
+                </li>
+                {% if user.is_staff %}
+                <li><a role="menuitem" href="{% url 'admin:index' %}">Admin Panel</a></li>
+                {% endif %}
+                {% url 'account_change_password' as url %}
+                <li {% if url == request.path %}class="active"{% endif %}>
+                  <a role="menuitem" href="{{ url }}">Change password</a>
+                </li>
+                {% url 'logout' as url %}
+                <li {% if url == request.path %}class="active"{% endif %}>
+                  <a role="menuitem" href="{{ url }}">Logout</a>
+                </li>
+              </ul>
+         </li>
+        {% else %}
+            {% url 'account_signup' as url %}
+            <li {% if url == request.path %}class="active"{% endif %}>
+              <a id="signup-btn-menu" href="{{ url }}">Sign up</a>
+            </li>
+            {% url 'account_login' as url %}
+            <li {% if url == request.path %}class="active"{% endif %}>
+              <a id="log-btn-menu" href="{{ url }}">Login</a>
+            </li>
+        {% endif %}
       </ul>
       <ul class="nav navbar-nav text-uppercase" id="upper-nav">
         {% if user.is_authenticated and user.is_active %}