Merge remote-tracking branch 'origin/develop' into migrate/vuex-to-pinia

src/components/desktop_nav/desktop_nav.js

@@ -108,7 +108,10 @@ export default {
       this.searchBarHidden = hidden
     },
     openSettingsModal () {
-      useInterfaceStore().openSettingsModal()
+      useInterfaceStore().openSettingsModal('user')
+    },
+    openAdminModal () {
+      useInterfaceStore().openSettingsModal('admin')
     }
   }
 }

src/components/desktop_nav/desktop_nav.scss

@@ -1,5 +1,3 @@
-@import "../../variables";
-
 .DesktopNav {
   width: 100%;
   z-index: var(--ZI_navbar);
@@ -8,10 +6,6 @@
     color: var(--inputTopbarText, var(--inputText));
   }
 
-  a {
-    color: var(--topBarLink, $fallback--link);
-  }
-
   .inner-nav {
     display: grid;
     grid-template-rows: var(--navbar-height);
@@ -54,27 +48,7 @@
   .button-default {
     &,
     svg {
-      color: $fallback--text;
-      color: var(--btnTopBarText, $fallback--text);
-    }
-
-    &:active {
-      background-color: $fallback--fg;
-      background-color: var(--btnPressedTopBar, $fallback--fg);
-      color: $fallback--text;
-      color: var(--btnPressedTopBarText, $fallback--text);
-    }
-
-    &:disabled {
-      color: $fallback--text;
-      color: var(--btnDisabledTopBarText, $fallback--text);
-    }
-
-    &.toggled {
-      color: $fallback--text;
-      color: var(--btnToggledTopBarText, $fallback--text);
-      background-color: $fallback--fg;
-      background-color: var(--btnToggledTopBar, $fallback--fg);
+      color: var(--text);
     }
   }
 
@@ -94,8 +68,7 @@
       mask-repeat: no-repeat;
       mask-position: center;
       mask-size: contain;
-      background-color: $fallback--fg;
-      background-color: var(--topBarText, $fallback--fg);
+      background-color: var(--text);
       position: absolute;
       top: 0;
       bottom: 0;
@@ -114,11 +87,6 @@
     width: 2em;
     height: 100%;
     text-align: center;
-
-    .svg-inline--fa {
-      color: $fallback--link;
-      color: var(--topBarLink, $fallback--link);
-    }
   }
 
   .sitename {

src/components/desktop_nav/desktop_nav.vue

@@ -48,20 +48,19 @@
             icon="cog"
           />
         </button>
-        <a
+        <button
           v-if="currentUser && currentUser.role === 'admin'"
-          href="/pleroma/admin/#/login-pleroma"
-          class="nav-icon"
+          class="button-unstyled nav-icon"
           target="_blank"
           :title="$t('nav.administration')"
-          @click.stop
+          @click.stop="openAdminModal"
         >
           <FAIcon
             fixed-width
             class="fa-scale-110 fa-old-padding"
             icon="tachometer-alt"
           />
-        </a>
+        </button>
         <span class="spacer" />
         <button
           v-if="currentUser"