improve settings components and scss
This commit is contained in:
Simon Vieille
+231
-232
@@ -19,23 +19,22 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
v-if="config"
|
||||
app-name="side_menu"
|
||||
>
|
||||
<NcAppContent class="side-menu-setting-app">
|
||||
<div class="side-menu-setting">
|
||||
<NcButton
|
||||
v-for="item in menu"
|
||||
:key="item.label"
|
||||
:variant="item.section === section ? 'primary' : 'secondary'"
|
||||
@click="setSection(item.section)"
|
||||
>{{ trans(item.label) }}</NcButton
|
||||
>
|
||||
</div>
|
||||
|
||||
<TableContainer :class="sectionClass('panel')">
|
||||
<NcAppNavigation class="cm-settings-nav">
|
||||
<NcAppNavigationItem
|
||||
v-for="item in menu"
|
||||
:key="item.label"
|
||||
:name="item.label"
|
||||
:active="item.section === section"
|
||||
@click="setSection(item.section)"
|
||||
>
|
||||
</NcAppNavigationItem>
|
||||
</NcAppNavigation>
|
||||
<NcAppContent class="cm-settings cm-settings--nav">
|
||||
<SettingsSection :class="sectionClass('panel')">
|
||||
<SectionTitle label="Panel" />
|
||||
|
||||
<TableRow>
|
||||
<TableLabel label="Display" />
|
||||
<TableValue>
|
||||
<SettingItem>
|
||||
<SettingValue>
|
||||
<FormDisplayPicker
|
||||
:always-displayed="config['always-displayed']"
|
||||
:top-wide-menu="config['big-menu']"
|
||||
@@ -44,95 +43,95 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
@update:top-wide-menu="(value) => (config['big-menu'] = value)"
|
||||
@update:side-menu-with-categories="(value) => (config['side-with-categories'] = value)"
|
||||
/>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow :disabled="config['big-menu'] || config['always-displayed'] || config['side-with-categories']">
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem :disabled="config['big-menu'] || config['always-displayed'] || config['side-with-categories']">
|
||||
<SettingLabel
|
||||
label="Display the logo"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormYesNo v-model="config['display-logo']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow :disabled="config['big-menu'] || config['always-displayed'] || config['side-with-categories']">
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem :disabled="config['big-menu'] || config['always-displayed'] || config['side-with-categories']">
|
||||
<SettingLabel
|
||||
label="Use the avatar instead of the logo"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormYesNo v-model="config['use-avatar']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow :disabled="config['big-menu'] || config['always-displayed'] || config['side-with-categories']">
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem :disabled="config['big-menu'] || config['always-displayed'] || config['side-with-categories']">
|
||||
<SettingLabel
|
||||
label="The logo is a link to the default app"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormYesNo v-model="config['add-logo-link']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Show the link to settings"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormYesNo v-model="config['show-settings']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Icons"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormSize v-model="config['size-icon']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Texts"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormSize v-model="config['size-text']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<AdminSaveButton :config="config" />
|
||||
</TableContainer>
|
||||
</SettingsSection>
|
||||
|
||||
<TableContainer :class="sectionClass('topMenu')">
|
||||
<SettingsSection :class="sectionClass('topMenu')">
|
||||
<SectionTitle label="Top menu" />
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Applications kept in the top menu"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormAppPicker v-model="config['top-menu-apps']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Applications kept in the top menu but also shown in side menu"
|
||||
help="These applications must be selected in the previous option."
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormAppPicker v-model="config['top-side-menu-apps']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Hide labels on mouse over"
|
||||
:top="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormSelect
|
||||
v-model="config['top-menu-mouse-over-hidden-label']"
|
||||
:expanded="true"
|
||||
@@ -142,53 +141,53 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
{ id: 2, label: 'Except the hovered app' },
|
||||
]"
|
||||
/>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<AdminSaveButton :config="config" />
|
||||
</TableContainer>
|
||||
</SettingsSection>
|
||||
|
||||
<TableContainer :class="sectionClass('apps')">
|
||||
<SettingsSection :class="sectionClass('apps')">
|
||||
<SectionTitle label="Applications" />
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Apps that should not be displayed in the menu"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormAppPicker v-model="config['big-menu-hidden-apps']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Open apps in new tab"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormAppPicker v-model="config['target-blank-apps']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Customize sorting"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormAppSort v-model="config['apps-order']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<AdminSaveButton :config="config" />
|
||||
</TableContainer>
|
||||
</SettingsSection>
|
||||
|
||||
<TableContainer :class="sectionClass('cats')">
|
||||
<SettingsSection :class="sectionClass('cats')">
|
||||
<SectionTitle label="Categories" />
|
||||
|
||||
<TableRow :disabled="!(config['big-menu'] || config['always-displayed'] || config['side-with-categories'])">
|
||||
<TableLabel
|
||||
<SettingItem :disabled="!(config['big-menu'] || config['always-displayed'] || config['side-with-categories'])">
|
||||
<SettingLabel
|
||||
label="Order by"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormSelect
|
||||
v-model="config['categories-order-type']"
|
||||
:options="[
|
||||
@@ -196,24 +195,24 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
{ id: 'custom', label: 'Custom' },
|
||||
]"
|
||||
/>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow :disabled="!(config['big-menu'] || config['always-displayed'] || config['side-with-categories'])">
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem :disabled="!(config['big-menu'] || config['always-displayed'] || config['side-with-categories'])">
|
||||
<SettingLabel
|
||||
label="Customize sorting"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormCatSort v-model="config['categories-order']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow :disabled="!(config['big-menu'] || config['always-displayed'] || config['side-with-categories'])">
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem :disabled="!(config['big-menu'] || config['always-displayed'] || config['side-with-categories'])">
|
||||
<SettingLabel
|
||||
label="Customize application categories"
|
||||
:top="true"
|
||||
>
|
||||
</TableLabel>
|
||||
<TableValue>
|
||||
</SettingLabel>
|
||||
<SettingValue>
|
||||
<FormAppCategory
|
||||
:langs="config['langs']"
|
||||
:categories-custom="config['categories-custom']"
|
||||
@@ -221,39 +220,39 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
@update:categories-custom="(value) => (config['categories-custom'] = value)"
|
||||
@update:apps-categories-custom="(value) => (config['apps-categories-custom'] = value)"
|
||||
/>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<AdminSaveButton :config="config" />
|
||||
</TableContainer>
|
||||
</SettingsSection>
|
||||
|
||||
<TableContainer :class="sectionClass('opener')">
|
||||
<SettingsSection :class="sectionClass('opener')">
|
||||
<SectionTitle label="Opener" />
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Opener"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormOpener v-model="config['opener']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Dark mode opener"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormOpener v-model="config['dark-mode-opener']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Position"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormSelect
|
||||
v-model="config['opener-position']"
|
||||
:options="[
|
||||
@@ -261,38 +260,38 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
{ id: 'after', label: 'After the logo' },
|
||||
]"
|
||||
/>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Show only the opener (hidden logo)"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormYesNo v-model="config['opener-only']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Open the menu when the mouse is hover the opener (automatically disabled on touch screens)"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormYesNo v-model="config['opener-hover']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<AdminSaveButton :config="config" />
|
||||
</TableContainer>
|
||||
</SettingsSection>
|
||||
|
||||
<TableContainer :class="sectionClass('colors')">
|
||||
<SettingsSection :class="sectionClass('colors')">
|
||||
<SectionTitle label="Colors" />
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Background color"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormColorPicker v-model="config['background-color']" />
|
||||
<FormColorPicker v-model="config['background-color-to']" />
|
||||
<FormRange
|
||||
@@ -300,45 +299,45 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
prepend="Transparent"
|
||||
append="Opaque"
|
||||
/>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Background color of current app"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormColorPicker v-model="config['current-app-background-color']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Text color"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormColorPicker v-model="config['text-color']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Loader"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormColorPicker v-model="config['loader-color']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Icon"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormRange
|
||||
v-model="config['icon-invert-filter']"
|
||||
prepend="Same color"
|
||||
@@ -349,17 +348,17 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
prepend="Transparent"
|
||||
append="Opaque"
|
||||
/>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<SectionTitle label="Dark mode colors" />
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Background color"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormColorPicker v-model="config['dark-mode-background-color']" />
|
||||
<FormColorPicker v-model="config['dark-mode-background-color-to']" />
|
||||
<FormRange
|
||||
@@ -367,45 +366,45 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
prepend="Transparent"
|
||||
append="Opaque"
|
||||
/>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Background color of current app"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormColorPicker v-model="config['dark-mode-current-app-background-color']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Text color"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormColorPicker v-model="config['dark-mode-text-color']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Loader"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormColorPicker v-model="config['dark-mode-loader-color']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Icon"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormRange
|
||||
v-model="config['dark-mode-icon-invert-filter']"
|
||||
prepend="Same color"
|
||||
@@ -416,60 +415,60 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
prepend="Transparent"
|
||||
append="Opaque"
|
||||
/>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<AdminSaveButton :config="config" />
|
||||
</TableContainer>
|
||||
</SettingsSection>
|
||||
|
||||
<TableContainer :class="sectionClass('global')">
|
||||
<p class="side-menu-tips">
|
||||
<SettingsSection :class="sectionClass('global')">
|
||||
<p class="cm-settings-tips">
|
||||
<em>{{ t('side_menu', 'Use the shortcut Ctrl+o to open and to hide the side menu. Use tab key to navigate.') }}</em>
|
||||
</p>
|
||||
|
||||
<SectionTitle label="Global" />
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="The menu is enabled by default for users"
|
||||
help="Except when the configuration is forced."
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormYesNo v-model="config['default-enabled']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Force this configuration to users"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormYesNo v-model="config['force']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Loader enabled"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormYesNo v-model="config['loader-enabled']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<AdminSaveButton :config="config" />
|
||||
</TableContainer>
|
||||
</SettingsSection>
|
||||
|
||||
<TableContainer :class="sectionClass('support')">
|
||||
<SettingsSection :class="sectionClass('support')">
|
||||
<SectionTitle label="Support" />
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="You like this app and you want to support me?"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<a
|
||||
target="_blank"
|
||||
href="https://www.buymeacoffee.com/deblan"
|
||||
@@ -477,12 +476,12 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
>
|
||||
<NcButton variant="secondary">{{ trans('Buy me a coffee ☕') }}</NcButton>
|
||||
</a>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel label="Need help" />
|
||||
<TableValue class="button-inline">
|
||||
<SettingItem>
|
||||
<SettingLabel label="Need help" />
|
||||
<SettingValue class="button-inline">
|
||||
<a
|
||||
target="_blank"
|
||||
href="https://deblan.gitnet.page/side_menu_doc/"
|
||||
@@ -497,15 +496,15 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
>
|
||||
<NcButton variant="secondary">{{ trans('Ask the developer') }}</NcButton>
|
||||
</a>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="I would like a new feature"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<a
|
||||
target="_blank"
|
||||
href="https://gitnet.fr/deblan/side_menu/issues/new?template=.gitea%2fissue_template%2fFEATURE_TEMPLATE.yml"
|
||||
@@ -513,15 +512,15 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
>
|
||||
<NcButton variant="secondary">{{ trans('New request') }}</NcButton>
|
||||
</a>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Something went wrong"
|
||||
:top="true"
|
||||
/>
|
||||
<TableValue class="button-inline">
|
||||
<SettingValue class="button-inline">
|
||||
<a
|
||||
target="_blank"
|
||||
href="https://gitnet.fr/deblan/side_menu/issues/new?template=.gitea%2fissue_template%2fISSUE_TEMPLATE.yml"
|
||||
@@ -564,23 +563,23 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
</div>
|
||||
</div>
|
||||
</NcModal>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<AdminSaveButton :config="config" />
|
||||
</TableContainer>
|
||||
</SettingsSection>
|
||||
</NcAppContent>
|
||||
</NcContent>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { NcContent, NcAppContent, NcButton, NcModal } from '@nextcloud/vue'
|
||||
import { NcContent, NcAppContent, NcButton, NcModal, NcAppNavigation, NcAppNavigationItem } from '@nextcloud/vue'
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { useConfigStore } from '../store/config.js'
|
||||
|
||||
import TableContainer from '../components/settings/TableContainer'
|
||||
import TableRow from '../components/settings/TableRow'
|
||||
import TableLabel from '../components/settings/TableLabel'
|
||||
import TableValue from '../components/settings/TableValue'
|
||||
import SettingsSection from '../components/settings/SettingsSection'
|
||||
import SettingItem from '../components/settings/SettingItem'
|
||||
import SettingLabel from '../components/settings/SettingLabel'
|
||||
import SettingValue from '../components/settings/SettingValue'
|
||||
import SectionTitle from '../components/settings/SectionTitle'
|
||||
import AdminSaveButton from '../components/settings/AdminSaveButton'
|
||||
import FormRange from '../components/settings/form/FormRange'
|
||||
@@ -596,14 +595,14 @@ import FormDisplayPicker from '../components/settings/form/FormDisplayPicker'
|
||||
import FormAppCategory from '../components/settings/form/FormAppCategory'
|
||||
|
||||
const menu = [
|
||||
{ label: 'Global', section: 'global' },
|
||||
{ label: 'Panel', section: 'panel' },
|
||||
{ label: 'Colors', section: 'colors' },
|
||||
{ label: 'Opener', section: 'opener' },
|
||||
{ label: 'Applications', section: 'apps' },
|
||||
{ label: 'Categories', section: 'cats' },
|
||||
{ label: 'Top menu', section: 'topMenu' },
|
||||
{ label: 'Support', section: 'support' },
|
||||
{ label: 'Global', section: 'global', icon: '' },
|
||||
{ label: 'Panel', section: 'panel', icon: '' },
|
||||
{ label: 'Colors', section: 'colors', icon: '' },
|
||||
{ label: 'Opener', section: 'opener', icon: '' },
|
||||
{ label: 'Applications', section: 'apps', icon: '' },
|
||||
{ label: 'Categories', section: 'cats', icon: '' },
|
||||
{ label: 'Top menu', section: 'topMenu', icon: '' },
|
||||
{ label: 'Support', section: 'support', icon: '' },
|
||||
]
|
||||
|
||||
const config = ref(null)
|
||||
|
||||
+43
-43
@@ -21,55 +21,55 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
>
|
||||
<NcAppContent
|
||||
v-if="config['force']"
|
||||
class="side-menu-setting-app"
|
||||
class="cm-settings"
|
||||
>
|
||||
<TableContainer>
|
||||
<TableLabel label="You do not have permission to change the settings." />
|
||||
</TableContainer>
|
||||
<SettingsSection>
|
||||
<SettingLabel label="You do not have permission to change the settings." />
|
||||
</SettingsSection>
|
||||
</NcAppContent>
|
||||
<NcAppContent
|
||||
v-else
|
||||
class="side-menu-setting-app side-menu-setting-app--user"
|
||||
class="cm-settings"
|
||||
>
|
||||
<TableContainer>
|
||||
<SettingsSection>
|
||||
<SectionTitle label="Menu" />
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Enable the custom menu"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormYesNo v-model="config['enabled']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Applications kept in the top menu"
|
||||
help="If there is no selection then the global configuration is applied."
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormAppPicker v-model="config['top-menu-apps']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Applications kept in the top menu but also shown in side menu"
|
||||
help="These applications must be selected in the previous option."
|
||||
help2="If there is no selection then the global configuration is applied"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormAppPicker v-model="config['top-side-menu-apps']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Open apps in new tab"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormSelect
|
||||
v-model="config['target-blank-mode']"
|
||||
:options="[
|
||||
@@ -81,28 +81,28 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
v-if="config['target-blank-mode'] === 2"
|
||||
v-model="config['target-blank-apps']"
|
||||
/>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="Customize sorting"
|
||||
:top="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<FormAppSort v-model="config['apps-order']" />
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</TableContainer>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
</SettingsSection>
|
||||
|
||||
<TableContainer>
|
||||
<SettingsSection>
|
||||
<SectionTitle label="Support" />
|
||||
|
||||
<TableRow>
|
||||
<TableLabel
|
||||
<SettingItem>
|
||||
<SettingLabel
|
||||
label="You like this app and you want to support me?"
|
||||
:middle="true"
|
||||
/>
|
||||
<TableValue>
|
||||
<SettingValue>
|
||||
<a
|
||||
target="_blank"
|
||||
href="https://www.buymeacoffee.com/deblan"
|
||||
@@ -110,11 +110,11 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
>
|
||||
<NcButton variant="secondary">{{ trans('Buy me a coffee ☕') }}</NcButton>
|
||||
</a>
|
||||
</TableValue>
|
||||
</TableRow>
|
||||
</SettingValue>
|
||||
</SettingItem>
|
||||
|
||||
<UserSaveButton :config="config" />
|
||||
</TableContainer>
|
||||
</SettingsSection>
|
||||
</NcAppContent>
|
||||
</NcContent>
|
||||
</template>
|
||||
@@ -124,10 +124,10 @@ import { NcContent, NcAppContent, NcButton } from '@nextcloud/vue'
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { useConfigStore } from '../store/config.js'
|
||||
|
||||
import TableContainer from '../components/settings/TableContainer'
|
||||
import TableRow from '../components/settings/TableRow'
|
||||
import TableLabel from '../components/settings/TableLabel'
|
||||
import TableValue from '../components/settings/TableValue'
|
||||
import SettingsSection from '../components/settings/SettingsSection'
|
||||
import SettingItem from '../components/settings/SettingItem'
|
||||
import SettingLabel from '../components/settings/SettingLabel'
|
||||
import SettingValue from '../components/settings/SettingValue'
|
||||
import SectionTitle from '../components/settings/SectionTitle'
|
||||
import UserSaveButton from '../components/settings/UserSaveButton'
|
||||
import FormYesNo from '../components/settings/form/FormYesNo'
|
||||
|
||||
Reference in New Issue
Block a user