diff --git a/assets/index.js b/assets/index.js
index f33710c93..61b513ef4 100755
--- a/assets/index.js
+++ b/assets/index.js
@@ -308,7 +308,7 @@ $(document).ready(() => {
     $('.nav-panel-add-tag').toggle(100);
     $('.nav-panel-menu').addClass('hidden');
     if (window.innerWidth < mobileMaxWidth) {
-      $('.side-nav').sideNav('hide');
+      $('.sidenav').sideNav('hide');
     }
     $('#tag_label').focus();
     return false;
diff --git a/assets/js/shortcuts/entry.js b/assets/js/shortcuts/entry.js
index e19800bd3..3c15f3d29 100644
--- a/assets/js/shortcuts/entry.js
+++ b/assets/js/shortcuts/entry.js
@@ -5,22 +5,22 @@ $(document).ready(() => {
   if ($('#article').length > 0) {
     /* open original article */
     Mousetrap.bind('o', () => {
-      $('ul.side-nav a.original i')[0].click();
+      $('ul.sidenav a.original i')[0].click();
     });
 
     /* mark as favorite */
     Mousetrap.bind('f', () => {
-      $('ul.side-nav a.favorite i')[0].click();
+      $('ul.sidenav a.favorite i')[0].click();
     });
 
     /* mark as read */
     Mousetrap.bind('a', () => {
-      $('ul.side-nav a.markasread i')[0].click();
+      $('ul.sidenav a.markasread i')[0].click();
     });
 
     /* delete */
     Mousetrap.bind('del', () => {
-      $('ul.side-nav a.delete i')[0].click();
+      $('ul.sidenav a.delete i')[0].click();
     });
   }
 });
diff --git a/assets/scss/_dark_theme.scss b/assets/scss/_dark_theme.scss
index ac38b566d..e5bbb0e27 100644
--- a/assets/scss/_dark_theme.scss
+++ b/assets/scss/_dark_theme.scss
@@ -12,9 +12,9 @@
   .collapsible-header,
   .collection,
   .dropdown-content,
-  .side-nav,
-  .side-nav .collapsible-body,
-  .side-nav.fixed .collapsible-body,
+  .sidenav,
+  .sidenav .collapsible-body,
+  .sidenav.fixed .collapsible-body,
   .tabs {
     background-color: #131716;
   }
@@ -61,8 +61,8 @@
   .dropdown-content li > a,
   .nav-panels .input-field input:focus,
   .results-item,
-  .side-nav li > a,
-  .side-nav li > a > i.material-icons {
+  .sidenav li > a,
+  .sidenav li > a > i.material-icons {
     color: #dfdfdf;
   }
 
@@ -81,14 +81,14 @@
     color: #dfdfdf !important;
   }
 
-  .side-nav li.active {
+  .sidenav li.active {
     background-color: #2f2f2f;
   }
 
   .mass-action-tags .mass-action-tags-input.mass-action-tags-input,
-  .side-nav li:not(.logo) > a:hover,
-  .side-nav .collapsible-header:hover,
-  .side-nav.fixed .collapsible-header:hover {
+  .sidenav li:not(.logo) > a:hover,
+  .sidenav .collapsible-header:hover,
+  .sidenav.fixed .collapsible-header:hover {
     background-color: #1d1d1d;
   }
 
diff --git a/assets/scss/_sidenav.scss b/assets/scss/_sidenav.scss
index 00e4c5c2a..b33c0218d 100644
--- a/assets/scss/_sidenav.scss
+++ b/assets/scss/_sidenav.scss
@@ -1,8 +1,8 @@
 /* ==========================================================================
-   Side-nav
+   Sidenav
    ========================================================================== */
 
-.side-nav {
+.sidenav {
   width: 240px;
 
   li {
diff --git a/templates/Entry/entries.html.twig b/templates/Entry/entries.html.twig
index 1dc4f16fd..625ef03ca 100644
--- a/templates/Entry/entries.html.twig
+++ b/templates/Entry/entries.html.twig
@@ -86,7 +86,7 @@
     {% endif %}
 
     <!-- Export -->
-    <div id="export" class="side-nav right-aligned">
+    <div id="export" class="sidenav right-aligned">
     {% set current_tag = null %}
     {% if tag is defined %}
         {% set current_tag = tag.slug %}
@@ -111,7 +111,7 @@
 
     <!-- Filters -->
     {% if form is not null and is_granted('LIST_ENTRIES') %}
-    <div id="filters" class="side-nav right-aligned">
+    <div id="filters" class="sidenav right-aligned">
         <form action="{{ path('all') }}">
 
             <h4 class="center">{{ 'entry.filters.title'|trans }}</h4>
diff --git a/templates/Entry/entry.html.twig b/templates/Entry/entry.html.twig
index 3c13b5790..81e24ce98 100644
--- a/templates/Entry/entry.html.twig
+++ b/templates/Entry/entry.html.twig
@@ -42,7 +42,7 @@
             </ul>
         </div>
     </nav>
-    <ul id="slide-out" class="left-bar collapsible side-nav fixed reader-mode" data-collapsible="accordion">
+    <ul id="slide-out" class="left-bar collapsible sidenav fixed reader-mode" data-collapsible="accordion">
         <li class="bold border-bottom hide-on-med-and-down">
             <a class="waves-effect collapsible-header" href="{{ path('homepage') }}">
                 <i class="material-icons small">arrow_back</i>
diff --git a/templates/layout.html.twig b/templates/layout.html.twig
index df23f6846..81dc00ef1 100644
--- a/templates/layout.html.twig
+++ b/templates/layout.html.twig
@@ -27,7 +27,7 @@
 
 {% block menu %}
     <nav class="cyan darken-1">
-        <ul id="slide-out" class="left-bar side-nav fixed">
+        <ul id="slide-out" class="left-bar sidenav fixed">
             {% block logo %}
                 <li class="logo border-bottom">
                     {% if is_granted('LIST_ENTRIES') %}