diff --git a/src/components/Settings/ConfigLauncher.vue b/src/components/Settings/ConfigLauncher.vue
index 775fd4bb..7591d704 100644
--- a/src/components/Settings/ConfigLauncher.vue
+++ b/src/components/Settings/ConfigLauncher.vue
@@ -25,24 +25,7 @@
-
-
- -
-
- {{ $t('alternate-views.default') }}
-
-
- -
-
- {{ $t('alternate-views.minimal') }}
-
-
-
-
- {{ $t('alternate-views.workspace') }}
-
-
-
-
+
@@ -52,13 +35,11 @@ import ConfigContainer from '@/components/Configuration/ConfigContainer';
import LanguageSwitcher from '@/components/Settings/LanguageSwitcher';
import Keys from '@/utils/StoreMutations';
import { topLevelConfKeys, localStorageKeys, modalNames } from '@/utils/defaults';
+import ViewSwitcher from '@/components/Settings/ViewSwitcher';
// Import icons for config launcher buttons
import IconSpanner from '@/assets/interface-icons/config-editor.svg';
import IconInteractiveEditor from '@/assets/interface-icons/interactive-editor-edit-mode.svg';
import IconViewMode from '@/assets/interface-icons/application-change-view.svg';
-import IconHome from '@/assets/interface-icons/application-home.svg';
-import IconWorkspaceView from '@/assets/interface-icons/open-workspace.svg';
-import IconMinimalView from '@/assets/interface-icons/application-minimal.svg';
export default {
name: 'ConfigLauncher',
@@ -71,12 +52,10 @@ export default {
components: {
ConfigContainer,
LanguageSwitcher,
+ ViewSwitcher,
IconSpanner,
IconInteractiveEditor,
IconViewMode,
- IconHome,
- IconWorkspaceView,
- IconMinimalView,
},
computed: {
sections() {
@@ -149,37 +128,4 @@ export default {
min-width: 3.2rem;
}
-.view-switcher {
- position: absolute;
- right: 1rem;
- margin-top: 3rem;
- z-index: 5;
- background: var(--background);
- border: 1px solid var(--settings-text-color);
- border-radius: var(--curve-factor);
- box-shadow: var(--settings-container-shadow);
- ul {
- list-style: none;
- margin: 0;
- padding: 0;
- li {
- cursor: pointer;
- padding: 0.25rem 0.75rem;
- a {
- color: var(--settings-text-color);
- text-decoration: none;
- display: flex;
- align-items: center;
- }
- &:hover {
- background: var(--settings-text-color);
- a { color: var(--background); }
- }
- svg {
- margin: 0 0.25rem 0 0;
- border: none;
- }
- }
- }
-}
diff --git a/src/components/Settings/ViewSwitcher.vue b/src/components/Settings/ViewSwitcher.vue
new file mode 100644
index 00000000..ab920002
--- /dev/null
+++ b/src/components/Settings/ViewSwitcher.vue
@@ -0,0 +1,77 @@
+
+
+
+ -
+
+ {{ $t('alternate-views.default') }}
+
+
+ -
+
+ {{ $t('alternate-views.minimal') }}
+
+
-
+
+ {{ $t('alternate-views.workspace') }}
+
+
+
+
+
+
+
+
+
diff --git a/src/utils/SectionHelpers.js b/src/utils/SectionHelpers.js
index 21f392d8..dfad7e67 100644
--- a/src/utils/SectionHelpers.js
+++ b/src/utils/SectionHelpers.js
@@ -3,7 +3,15 @@
import { hideFurnitureOn } from '@/utils/defaults';
/* Returns false if page furniture should be hidden on said route */
-export const shouldBeVisible = (routeName) => !hideFurnitureOn.includes(routeName);
+export const shouldBeVisible = (routeName) => {
+ let shouldShow = true;
+ if (!routeName) return shouldShow; // Route name not specified.
+ hideFurnitureOn.forEach((hideOn) => {
+ // If route name on the no-show list, set visibility to false
+ if (routeName.includes(hideOn)) shouldShow = false;
+ });
+ return shouldShow;
+};
/* Based on section title, item name and index, return a string value for ID */
const makeItemId = (sectionStr, itemStr, index) => {