Remove bugs from the mobile view of header

Dhruvi16 · Dhruvi16 · commit 13ff3d61fb9b · 2020-05-25T15:43:01.000+05:30
diff --git a/themes/vocabulary_theme/templates/layout.html b/themes/vocabulary_theme/templates/layout.html
@@ -2,11 +2,9 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1" />
 <link rel="shortcut icon" type="image/x-icon" href="{{ '/static/favicon.ico'|url }}">
-<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet"
-  integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
 <link rel="stylesheet" href="{{ '/static/gen/style.css'|url }}">
 <link rel="stylesheet" href="{{ get_pygments_stylesheet()|url }}">
-<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@creativecommons/vocabulary@1.0.0-beta.14/css/vocabulary.css">
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@creativecommons/vocabulary/css/vocabulary.css">
 <meta property="og:site_name" content="Creative Commons" />
 <meta property="og:title" content="{{ this.title }}" />
 {% if this.description %}
@@ -43,7 +41,7 @@
 
 <body>
   <div class="ga-script">{{ generate_google_analytics() }}</div>
-  <header class="margin-horizontal-xxl">
+  <header class="bulma">
     <nav class="navbar">
       <div class="navbar-brand">
         {% set cc_logo = site.get('/').attachments.get('open_source.svg') %}
@@ -54,13 +52,13 @@
             preserveAspectRatio="xMidYMid meet"
             viewBox="0 0 304 73" src="{{ cc_logo|url }}">
         </a>
-        <a role="button" class="navbar-burger is-active" aria-label="menu" aria-expanded="false">
+        <a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
           <span aria-hidden="true"></span>
           <span aria-hidden="true"></span>
           <span aria-hidden="true"></span>
         </a>
       </div>
-      <div class="navbar-menu is-active">
+      <div class="navbar-menu">
         <div class="navbar-end">
           <a class="navbar-item {% if this.is_child_of('/blog') %} is-active{% endif%}" href="{{ '/blog'|url }}">
             Blog
@@ -81,7 +79,7 @@
           </div>
           <div class="navbar-item has-dropdown is-hoverable">
             <a class="navbar-link is-arrowless {% if this.is_child_of('/community') %} is-active{% endif%}">Community<i class="icon caret-down"></i></a>
-            <div class="navbar-dropdown">
+            <div class="navbar-dropdown is-active">
               {% for href, title in [
                 ['/community', 'Join the Community'],
                 ['/community/community-team', 'Community Team'],
diff --git a/webpack/js/main.js b/webpack/js/main.js
@@ -9,6 +9,13 @@ $(document).ready(function () {
 
     patchAssetIntoDom('/assets/logos/cc/logomark.svg');
     patchAssetIntoDom('/assets/logos/cc/letterheart.svg');
+
+    // Check for click events on the navbar burger icon
+    $(".navbar-burger").click(function() {
+        // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
+        $(".navbar-burger").toggleClass("is-active");
+        $(".navbar-menu").toggleClass("is-active");
+    });
 });
 
 const getFullyQualifiedUrl = (path, version) => {
diff --git a/webpack/sass/main.scss b/webpack/sass/main.scss
@@ -15,10 +15,6 @@ $brand-theme-light: $orange;
 $text-color: $jet-black;
 $project-card-theme: $blue;
 
-body {
-  font-family: 'Source Sans Pro', sans-serif;
-}
-
 h2 {
   font-weight: 600;
   padding-bottom: 0.5rem;
@@ -122,3 +118,4 @@ img {
     animation:octocat-wave 560ms ease-in-out
   }
 }
+

Original file line number	Diff line number	Diff line change
`@@ -15,10 +15,6 @@ $brand-theme-light: $orange;`
`15`	`15`	`$text-color: $jet-black;`
`16`	`16`	`$project-card-theme: $blue;`
`17`	`17`
`18`		`-body {`
`19`		`- font-family: 'Source Sans Pro', sans-serif;`
`20`		`-}`
`21`		`-`
`22`	`18`	`h2 {`
`23`	`19`	`font-weight: 600;`
`24`	`20`	`padding-bottom: 0.5rem;`
`@@ -122,3 +118,4 @@ img {`
`122`	`118`	`animation:octocat-wave 560ms ease-in-out`
`123`	`119`	`}`
`124`	`120`	`}`
	`121`	`+`