Merge branch 'master' into extension-es6

Author: caffeinum

chrome-ext/popup/popup.html

@@ -37,8 +37,8 @@
 </head>
 
 <style>
-  .logged_in {
-      display: 'none';
+  .hide {
+      display: none;
   }
 
 </style>
@@ -53,15 +53,15 @@
       </div>
     </div>
 
-    <div class="row logged_in">
+    <div class="row logged_in hide">
       <div class="col-sm mb-1 text-center">
         <button type="button" class="btn btn-outline-info" style="width: 100%" disabled>
           @
           <span class="username-field"></span>
         </button>
       </div>
     </div>
-    <div class="row logged_in">
+    <div class="row logged_in hide">
       <div class="col-sm text-center">
 
         <a class="btn btn-outline-primary" href="https://instagrambot.github.io/web/" target="_blank">

chrome-ext/popup/popup.js

@@ -41,13 +41,17 @@ const updateView = async () => {
 }
 
 const setView = ({ logged_in, user = {}} = {}) => {
+  const changeDisplay = (elem, isShown) => isShown
+    ? elem.classList.remove("hide")
+    : elem.classList.add("hide")
+
   if (logged_in) {
-    document.querySelectorAll('.logged_in')    .forEach(elem => elem.style.display = '')
-    document.querySelectorAll('.not_logged_in').forEach(elem => elem.style.display = 'none')
+    document.querySelectorAll('.logged_in')    .forEach(elem => changeDisplay(elem, true))
+    document.querySelectorAll('.not_logged_in').forEach(elem => changeDisplay(elem, false))
   }
   else {
-    document.querySelectorAll('.logged_in')    .forEach(elem => elem.style.display = 'none')
-    document.querySelectorAll('.not_logged_in').forEach(elem => elem.style.display = '')
+    document.querySelectorAll('.logged_in')    .forEach(elem => changeDisplay(elem, false))
+    document.querySelectorAll('.not_logged_in').forEach(elem => changeDisplay(elem, true))
   }
 
   if (user) {