From c6d4c20982261b55b16dda59c3e657eb1feb0041 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 11 Mar 2021 16:11:44 +0200 Subject: Made Select component to make using styled selects easier --- .../settings_modal/tabs/filtering_tab.js | 12 +--- .../settings_modal/tabs/filtering_tab.vue | 38 ++++++------ src/components/settings_modal/tabs/general_tab.js | 6 +- src/components/settings_modal/tabs/general_tab.vue | 72 ++++++++-------------- .../settings_modal/tabs/theme_tab/theme_tab.js | 12 +--- .../settings_modal/tabs/theme_tab/theme_tab.vue | 70 ++++++++------------- 6 files changed, 81 insertions(+), 129 deletions(-) (limited to 'src/components/settings_modal') diff --git a/src/components/settings_modal/tabs/filtering_tab.js b/src/components/settings_modal/tabs/filtering_tab.js index 6e95f7af..89199d85 100644 --- a/src/components/settings_modal/tabs/filtering_tab.js +++ b/src/components/settings_modal/tabs/filtering_tab.js @@ -1,15 +1,8 @@ import { filter, trim } from 'lodash' import BooleanSetting from '../helpers/boolean_setting.vue' +import Select from '../../select/select.vue' import SharedComputedObject from '../helpers/shared_computed_object.js' -import { library } from '@fortawesome/fontawesome-svg-core' -import { - faChevronDown -} from '@fortawesome/free-solid-svg-icons' - -library.add( - faChevronDown -) const FilteringTab = { data () { @@ -18,7 +11,8 @@ const FilteringTab = { } }, components: { - BooleanSetting + BooleanSetting, + Select }, computed: { ...SharedComputedObject(), diff --git a/src/components/settings_modal/tabs/filtering_tab.vue b/src/components/settings_modal/tabs/filtering_tab.vue index 402c2a4a..4023fbe2 100644 --- a/src/components/settings_modal/tabs/filtering_tab.vue +++ b/src/components/settings_modal/tabs/filtering_tab.vue @@ -38,26 +38,17 @@
{{ $t('settings.replies_in_timeline') }} - + + + +
@@ -88,3 +79,12 @@
+ diff --git a/src/components/settings_modal/tabs/general_tab.js b/src/components/settings_modal/tabs/general_tab.js index 2db523be..03648d0b 100644 --- a/src/components/settings_modal/tabs/general_tab.js +++ b/src/components/settings_modal/tabs/general_tab.js @@ -1,15 +1,14 @@ import BooleanSetting from '../helpers/boolean_setting.vue' +import Select from '../../select/select.vue' import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue' import SharedComputedObject from '../helpers/shared_computed_object.js' import { library } from '@fortawesome/fontawesome-svg-core' import { - faChevronDown, faGlobe } from '@fortawesome/free-solid-svg-icons' library.add( - faChevronDown, faGlobe ) @@ -27,7 +26,8 @@ const GeneralTab = { }, components: { BooleanSetting, - InterfaceLanguageSwitcher + InterfaceLanguageSwitcher, + Select }, computed: { postFormats () { diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue index 9228c78e..a0413cfa 100644 --- a/src/components/settings_modal/tabs/general_tab.vue +++ b/src/components/settings_modal/tabs/general_tab.vue @@ -87,59 +87,41 @@
  • {{ $t('settings.subject_line_behavior') }} - + + + +
  • {{ $t('settings.post_status_content_type') }} - + {{ $t(`post_status.content_type["${postFormat}"]`) }} + {{ postContentTypeDefaultValue === postFormat ? $t('settings.instance_default_simple') : '' }} + +
  • diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.js b/src/components/settings_modal/tabs/theme_tab/theme_tab.js index 6cf75fe7..73068e19 100644 --- a/src/components/settings_modal/tabs/theme_tab/theme_tab.js +++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.js @@ -33,16 +33,9 @@ import ContrastRatio from 'src/components/contrast_ratio/contrast_ratio.vue' import TabSwitcher from 'src/components/tab_switcher/tab_switcher.js' import ExportImport from 'src/components/export_import/export_import.vue' import Checkbox from 'src/components/checkbox/checkbox.vue' +import Select from 'src/components/select/select.vue' import Preview from './preview.vue' -import { library } from '@fortawesome/fontawesome-svg-core' -import { - faChevronDown -} from '@fortawesome/free-solid-svg-icons' - -library.add( - faChevronDown -) // List of color values used in v1 const v1OnlyNames = [ @@ -384,7 +377,8 @@ export default { TabSwitcher, Preview, ExportImport, - Checkbox + Checkbox, + Select }, methods: { loadTheme ( diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue index b8add42f..2b4b8ba0 100644 --- a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue +++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue @@ -59,32 +59,23 @@ @@ -902,28 +893,19 @@
    {{ $t('settings.style.shadows.component') }} - + {{ $t('settings.style.shadows.components.' + shadow) }} + +
  • -
    - {{ $t('settings.replies_in_timeline') }} - -
    + {{ $t('settings.replies_in_timeline') }} +
    {{ $t('settings.hide_post_stats') }} diff --git a/src/components/settings_modal/tabs/general_tab.js b/src/components/settings_modal/tabs/general_tab.js index 03648d0b..07fccf57 100644 --- a/src/components/settings_modal/tabs/general_tab.js +++ b/src/components/settings_modal/tabs/general_tab.js @@ -1,5 +1,5 @@ import BooleanSetting from '../helpers/boolean_setting.vue' -import Select from '../../select/select.vue' +import ChoiceSetting from '../helpers/choice_setting.vue' import InterfaceLanguageSwitcher from 'src/components/interface_language_switcher/interface_language_switcher.vue' import SharedComputedObject from '../helpers/shared_computed_object.js' @@ -15,6 +15,11 @@ library.add( const GeneralTab = { data () { return { + subjectLineOptions: ['email', 'noop', 'masto'].map(mode => ({ + key: mode, + value: mode, + label: this.$t(`settings.subject_line_${mode === 'masto' ? 'mastodon' : mode}`) + })), loopSilentAvailable: // Firefox Object.getOwnPropertyDescriptor(HTMLVideoElement.prototype, 'mozHasAudio') || @@ -26,13 +31,20 @@ const GeneralTab = { }, components: { BooleanSetting, - InterfaceLanguageSwitcher, - Select + ChoiceSetting, + InterfaceLanguageSwitcher }, computed: { postFormats () { return this.$store.state.instance.postFormats || [] }, + postContentOptions () { + return this.postFormats.map(format => ({ + key: format, + value: format, + label: this.$t(`post_status.content_type["${format}"]`) + })) + }, instanceSpecificPanelPresent () { return this.$store.state.instance.showInstanceSpecificPanel }, instanceWallpaperUsed () { return this.$store.state.instance.background && diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue index a0413cfa..7fb82c06 100644 --- a/src/components/settings_modal/tabs/general_tab.vue +++ b/src/components/settings_modal/tabs/general_tab.vue @@ -85,44 +85,22 @@
  • -
    + {{ $t('settings.subject_line_behavior') }} - -
    +
  • -
    + {{ $t('settings.post_status_content_type') }} - -
    +
  • -- cgit v1.2.3-70-g09d2 From 8e88d8110b0e52023c7f78777bda1951a1bc8d8b Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 11 Mar 2021 17:00:58 +0200 Subject: fix for filtering tab --- src/components/settings_modal/settings_modal_content.scss | 13 ++++++++++++- src/components/settings_modal/tabs/filtering_tab.vue | 9 --------- 2 files changed, 12 insertions(+), 10 deletions(-) (limited to 'src/components/settings_modal') diff --git a/src/components/settings_modal/settings_modal_content.scss b/src/components/settings_modal/settings_modal_content.scss index f066234c..81ab434b 100644 --- a/src/components/settings_modal/settings_modal_content.scss +++ b/src/components/settings_modal/settings_modal_content.scss @@ -7,13 +7,24 @@ margin: 1em 1em 1.4em; padding-bottom: 1.4em; - > div { + > div, + > label { + display: block; margin-bottom: .5em; &:last-child { margin-bottom: 0; } } + .select-multiple { + display: flex; + + .option-list { + margin: 0; + padding-left: .5em; + } + } + &:last-child { border-bottom: none; padding-bottom: 0; diff --git a/src/components/settings_modal/tabs/filtering_tab.vue b/src/components/settings_modal/tabs/filtering_tab.vue index fb5fc375..dbd8d9af 100644 --- a/src/components/settings_modal/tabs/filtering_tab.vue +++ b/src/components/settings_modal/tabs/filtering_tab.vue @@ -72,12 +72,3 @@
  • - -- cgit v1.2.3-70-g09d2 From 2da37f15ab6a7e0c6088a6e5a0b2c2885f1cb85a Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 11 Mar 2021 17:04:31 +0200 Subject: Cleanup boolean/choice setting --- .../settings_modal/helpers/boolean_setting.vue | 38 +--------------------- .../settings_modal/helpers/choice_setting.vue | 2 +- 2 files changed, 2 insertions(+), 38 deletions(-) (limited to 'src/components/settings_modal') diff --git a/src/components/settings_modal/helpers/boolean_setting.vue b/src/components/settings_modal/helpers/boolean_setting.vue index 146ad6c1..c3ee6583 100644 --- a/src/components/settings_modal/helpers/boolean_setting.vue +++ b/src/components/settings_modal/helpers/boolean_setting.vue @@ -18,40 +18,4 @@ - - - + diff --git a/src/components/settings_modal/helpers/choice_setting.vue b/src/components/settings_modal/helpers/choice_setting.vue index 1a8275b4..fa17661b 100644 --- a/src/components/settings_modal/helpers/choice_setting.vue +++ b/src/components/settings_modal/helpers/choice_setting.vue @@ -14,7 +14,7 @@ :value="option.value" > {{ option.label }} - {{ option.value === defaultValue ? $t('settings.instance_default_simple') : '' }} + {{ option.value === defaultState ? $t('settings.instance_default_simple') : '' }} -- cgit v1.2.3-70-g09d2 From 0c77a3e1d6956c14b68078ff766c5ccfb6b086a4 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Wed, 7 Apr 2021 20:47:59 +0300 Subject: remove extra chevron post-merge --- src/components/settings_modal/tabs/theme_tab/theme_tab.vue | 4 ---- 1 file changed, 4 deletions(-) (limited to 'src/components/settings_modal') diff --git a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue index 570cd11b..548dc852 100644 --- a/src/components/settings_modal/tabs/theme_tab/theme_tab.vue +++ b/src/components/settings_modal/tabs/theme_tab/theme_tab.vue @@ -72,10 +72,6 @@ {{ style[0] || style.name }} -
    -- cgit v1.2.3-70-g09d2 From 1afda1ac6d037e477e500870fe4e05c3c1f773cb Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Wed, 7 Apr 2021 20:53:58 +0300 Subject: lost file --- .../settings_modal/helpers/boolean_setting.js | 30 ++++++++++++++++++++++ 1 file changed, 30 insertions(+) create mode 100644 src/components/settings_modal/helpers/boolean_setting.js (limited to 'src/components/settings_modal') diff --git a/src/components/settings_modal/helpers/boolean_setting.js b/src/components/settings_modal/helpers/boolean_setting.js new file mode 100644 index 00000000..1dda49f2 --- /dev/null +++ b/src/components/settings_modal/helpers/boolean_setting.js @@ -0,0 +1,30 @@ +import { get, set } from 'lodash' +import Checkbox from 'src/components/checkbox/checkbox.vue' +import ModifiedIndicator from './modified_indicator.vue' +export default { + components: { + Checkbox, + ModifiedIndicator + }, + props: [ + 'path', + 'disabled' + ], + computed: { + pathDefault () { + const [firstSegment, ...rest] = this.path.split('.') + return [firstSegment + 'DefaultValue', ...rest].join('.') + }, + state () { + return get(this.$parent, this.path) + }, + isChanged () { + return get(this.$parent, this.path) !== get(this.$parent, this.pathDefault) + } + }, + methods: { + update (e) { + set(this.$parent, this.path, e) + } + } +} -- cgit v1.2.3-70-g09d2 From c03965646027bc8ce2d4c083ea3fd0423233fa18 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Mon, 31 May 2021 14:02:36 +0300 Subject: fix warnings --- src/components/poll/poll_form.vue | 10 +++++++--- src/components/settings_modal/tabs/filtering_tab.vue | 8 ++++---- src/components/user_card/user_card.vue | 16 ++++++++++++---- 3 files changed, 23 insertions(+), 11 deletions(-) (limited to 'src/components/settings_modal') diff --git a/src/components/poll/poll_form.vue b/src/components/poll/poll_form.vue index ecbfdf41..3620075a 100644 --- a/src/components/poll/poll_form.vue +++ b/src/components/poll/poll_form.vue @@ -47,13 +47,17 @@ :title="$t('polls.type')" >
    + id="replyVisibility" + path="replyVisibility" + :options="replyVisibilityOptions" + > {{ $t('settings.replies_in_timeline') }}
    diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue index 75c08f47..53b55c01 100644 --- a/src/components/user_card/user_card.vue +++ b/src/components/user_card/user_card.vue @@ -137,10 +137,18 @@ v-model="userHighlightType" class="userHighlightSel" > - - - - + + + +
    -- cgit v1.2.3-70-g09d2