Merge pull request #140 from ECE444-2023Fall/rahul-navbar-update-UI

Updated Nav Bar UI to match colour scheme
ECE444-2023Fall · Nov 11, 2023 · c7b0452 · c7b0452
2 parents 75e462f + 4605106
commit c7b0452
Show file tree

Hide file tree

Showing 6 changed files with 70 additions and 52 deletions.
diff --git a/app/static/style.css b/app/static/style.css
@@ -90,6 +90,16 @@ h2{
 .nav-link{
     color: #333333 !important;
     font-size:18px;
+    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+}
+
+.nav-dropdown{
+  color: #333333;
+  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+}
+
+.nav-item-left {
+  margin-right: auto;
 }
 
 .nav-item::after {
@@ -105,16 +115,17 @@ h2{
   width: 100%
 }
 .custom-navbar {
-  background-color: #ffffff !important;
-  box-shadow: 0px 15px 10px -15px #111;    
+  background-color: #fff7eb !important;
+  box-shadow: none;    
   border-radius: 0%;
-
+  box-shadow: 0px 10px 10px -15px #000000;
+  height: 80px;
 }
 
 ul.navbar-nav {
   color: #cb1010 !important;
   font-weight: 600;
-  background-color: #ffffff;
+  background-color: #fff7eb;
   font-family: Georgia, serif;
 }
 

diff --git a/app/templates/base.html b/app/templates/base.html
@@ -1,6 +1,5 @@
 <!DOCTYPE html>
 <html>
-
 <head>
   <meta charset="utf-8" />
   <!-- <link rel="icon" href="/favicon.ico" /> -->
@@ -20,8 +19,8 @@
   <link rel="shortcut icon" href="{{ url_for('static', filename='favicon.png') }}">
 
 </head>
- 
-<body>  
+<body>
+
     {% block navbar %}
     <nav class="navbar navbar-expand-lg navbar-light bg-light custom-navbar">
         <a class="navbar-brand" href="/">
@@ -31,26 +30,32 @@ <h3 class="nav-logo"> UofT Event<span class="hub">Hub</span>  </h3>
             <span class="navbar-toggler-icon"></span>
         </button>
         <div class="collapse navbar-collapse" id="navbarNavDropdown">
+            <ul class="navbar-nav mb-2 mb-lg-0" style="padding-right: 5vw;">
+                <li class="nav-item active">
+                    <a class="nav-link" href="/">Home <span class="sr-only"></span></a>
+                </li>
+                <li class="nav-item active">
+                    <a class="nav-link" href="/myevents">My Events <span class="sr-only"></span></a>
+                </li>
+                <li class="nav-item active">
+                    <a class="nav-link" href="/user/organizers">Organizer List <span class="sr-only"></span></a>
+                </li>
+            </ul>
             <ul class="navbar-nav ms-auto mb-2 mb-lg-0" style="padding-right: 5vw;" >
-            <li class="nav-item active">
-                <a class="nav-link" href="/">Home <span class="sr-only"></span></a>
-            </li>
 
-            <li class="nav-item dropdown">
-                <a class="nav-link dropdown-toggle" href="/" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                Profile
-                </a>
-                <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
-                <a class="dropdown-item" href="/account/show">My Account</a>
-                <a class="dropdown-item" href="/myevents">My Events</a>
-                <a class="dropdown-item" href="/logout">Logout</a>
-                </div>
-            </li>
+                <li class="nav-item dropdown">
+                    <a class="nav-link dropdown-toggle" href="/" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                    Profile
+                    </a>
+                    <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
+                        <a class="dropdown-item nav-dropdown" href="/account/show">My Account</a>
+                        <a class="dropdown-item nav-dropdown" href="/logout">Logout</a>
+                    </div>
+                </li>
             </ul>
         </div>
     </nav>
-
-    {% endblock %} 
+    {% endblock %}
 
     {% block content %}
     <div class="container welcome-card">
@@ -93,11 +98,10 @@ <h3 class="nav-logo"> UofT Event<span class="hub">Hub</span>  </h3>
     </div>
     {% endblock %}
 
-    <script src="https://kit.fontawesome.com/f94828e930.js" crossorigin="anonymous"></script> <!-- For cool icons -->
-    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
-    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
-    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
+      <script src="https://kit.fontawesome.com/f94828e930.js" crossorigin="anonymous"></script> <!-- For cool icons -->
+      <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
+      <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
+      <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
 
     </body>
-
-</html>
+</html>
diff --git a/app/templates/event_admin.html b/app/templates/event_admin.html
@@ -12,19 +12,21 @@ <h3 class="nav-logo"> UofT Event<span class="hub">Hub</span>  </h3>
             <span class="navbar-toggler-icon"></span>
         </button>
         <div class="collapse navbar-collapse" id="navbarNavDropdown">
+            <ul class="navbar-nav mb-2 mb-lg-0" style="padding-right: 5vw;">
+                <li class="nav-item active">
+                    <a class="nav-link" href="/">Home <span class="sr-only"></span></a>
+                </li>
+            </ul>
             <ul class="navbar-nav ms-auto mb-2 mb-lg-0" style="padding-right: 5vw;" >
-            <li class="nav-item active">
-                <a class="nav-link" href="/">Home <span class="sr-only"></span></a>
-            </li>
 
-            <li class="nav-item dropdown">
-                <a class="nav-link dropdown-toggle" href="/" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                Profile
-                </a>
-                <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
-                <a class="dropdown-item" href="/logout">Logout</a>
-                </div>
-            </li>
+                <li class="nav-item dropdown">
+                    <a class="nav-link dropdown-toggle" href="/" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                    Profile
+                    </a>
+                    <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
+                        <a class="dropdown-item nav-dropdown" href="/logout">Logout</a>
+                    </div>
+                </li>
             </ul>
         </div>
     </nav>

diff --git a/app/templates/organizer_main.html b/app/templates/organizer_main.html
@@ -10,19 +10,21 @@ <h3 class="nav-logo"> UofT Event<span class="hub">Hub</span>  </h3>
             <span class="navbar-toggler-icon"></span>
         </button>
         <div class="collapse navbar-collapse" id="navbarNavDropdown">
+            <ul class="navbar-nav mb-2 mb-lg-0" style="padding-right: 5vw;">
+                <li class="nav-item active">
+                    <a class="nav-link" href="/">Home <span class="sr-only"></span></a>
+                </li>
+            </ul>
             <ul class="navbar-nav ms-auto mb-2 mb-lg-0" style="padding-right: 5vw;" >
-            <li class="nav-item active">
-                <a class="nav-link" href="/">Home <span class="sr-only"></span></a>
-            </li>
 
-            <li class="nav-item dropdown">
-                <a class="nav-link dropdown-toggle" href="/" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                Profile
-                </a>
-                <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
-                <a class="dropdown-item" href="/logout">Logout</a>
-                </div>
-            </li>
+                <li class="nav-item dropdown">
+                    <a class="nav-link dropdown-toggle" href="/" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                    Profile
+                    </a>
+                    <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
+                        <a class="dropdown-item nav-dropdown" href="/logout">Logout</a>
+                    </div>
+                </li>
             </ul>
         </div>
     </nav>

diff --git a/app/templates/user_organizer_page.html b/app/templates/user_organizer_page.html
@@ -35,7 +35,7 @@ <h4 class="card-title">
                             </a>
                           </h4>
                           <p class="">
-                              {{ event.description }}
+                              {{ event.short_description }}
                           </p>
                       </div>
                       <div class="card-read-more">

diff --git a/app/templates/user_organizers_list.html b/app/templates/user_organizers_list.html
@@ -13,7 +13,6 @@
     {% endfor %}
     {% endif %}
     {% endwith %}
-    {% block page_content %}
     {% block page_content %}
         <div class="page-header">
             <h1>List of Organizers</h1>