diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/settings_modal/settings_modal_content.vue | 9 | ||||
| -rw-r--r-- | src/components/tab_switcher/tab_switcher.js | 7 | ||||
| -rw-r--r-- | src/components/tab_switcher/tab_switcher.scss | 5 |
3 files changed, 19 insertions, 2 deletions
diff --git a/src/components/settings_modal/settings_modal_content.vue b/src/components/settings_modal/settings_modal_content.vue index 737c3637..847de1da 100644 --- a/src/components/settings_modal/settings_modal_content.vue +++ b/src/components/settings_modal/settings_modal_content.vue @@ -45,40 +45,47 @@ > <div :label="$t('settings.general')" + icon="wrench" > <GeneralTab /> </div> <div v-if="isLoggedIn" :label="$t('settings.profile_tab')" + icon="user" > <ProfileTab /> </div> <div v-if="isLoggedIn" :label="$t('settings.security_tab')" + icon="lock" > <SecurityTab /> </div> <div :label="$t('settings.filtering')" + icon="filter" > <FilteringTab /> </div> <div :label="$t('settings.theme')" + icon="brush" > <ThemeTab /> </div> <div v-if="isLoggedIn" :label="$t('settings.notifications')" + icon="chat" > <NotificationsTab /> </div> <div v-if="isLoggedIn" :label="$t('settings.data_import_export_tab')" + icon="download" > <DataImportExportTab /> </div> @@ -87,11 +94,13 @@ :label="$t('settings.mutes_and_blocks')" :fullHeight="true" class="full-height" + icon="eye-off" > <MutesAndBlocksTab /> </div> <div :label="$t('settings.version.title')" + icon="info-circled" > <VersionTab /> </div> diff --git a/src/components/tab_switcher/tab_switcher.js b/src/components/tab_switcher/tab_switcher.js index bd1f51cb..2d04e15d 100644 --- a/src/components/tab_switcher/tab_switcher.js +++ b/src/components/tab_switcher/tab_switcher.js @@ -94,8 +94,11 @@ export default Vue.component('tab-switcher', { <button disabled={slot.data.attrs.disabled} onClick={this.activateTab(index)} - class={classesTab.join(' ')}> - {slot.data.attrs.label}</button> + class={classesTab.join(' ')} + > + {!slot.data.attrs.icon ? '' : (<i class={'tab-icon icon-' + slot.data.attrs.icon}/>)} + {slot.data.attrs.label} + </button> </div> ) }) diff --git a/src/components/tab_switcher/tab_switcher.scss b/src/components/tab_switcher/tab_switcher.scss index f994380f..129a68b7 100644 --- a/src/components/tab_switcher/tab_switcher.scss +++ b/src/components/tab_switcher/tab_switcher.scss @@ -3,6 +3,11 @@ .tab-switcher { display: flex; + .tab-icon { + font-size: 2em; + display: block; + } + &.top-tabs { flex-direction: column; > .tabs { |
