From c6d4c20982261b55b16dda59c3e657eb1feb0041 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 11 Mar 2021 16:11:44 +0200 Subject: [PATCH 1/9] Made Select component to make using styled selects easier --- src/App.scss | 34 +-------- src/components/font_control/font_control.js | 12 ++-- src/components/font_control/font_control.vue | 32 +++------ .../interface_language_switcher.vue | 41 ++++------- src/components/poll/poll_form.js | 6 +- src/components/poll/poll_form.vue | 51 +++++-------- .../post_status_form/post_status_form.js | 4 +- .../post_status_form/post_status_form.vue | 31 +++----- src/components/select/select.vue | 67 +++++++++++++++++ .../settings_modal/tabs/filtering_tab.js | 12 +--- .../settings_modal/tabs/filtering_tab.vue | 38 +++++----- .../settings_modal/tabs/general_tab.js | 6 +- .../settings_modal/tabs/general_tab.vue | 72 +++++++------------ .../tabs/theme_tab/theme_tab.js | 12 +--- .../tabs/theme_tab/theme_tab.vue | 70 +++++++----------- .../shadow_control/shadow_control.js | 4 +- .../shadow_control/shadow_control.vue | 32 +++------ src/components/user_card/user_card.js | 6 +- src/components/user_card/user_card.vue | 27 +++---- 19 files changed, 240 insertions(+), 317 deletions(-) create mode 100644 src/components/select/select.vue diff --git a/src/App.scss b/src/App.scss index 90d083bb..77f2ea79 100644 --- a/src/App.scss +++ b/src/App.scss @@ -187,7 +187,7 @@ a { } } -input, textarea, .select, .input { +input, textarea, .input { &.unstyled { border-radius: 0; @@ -217,11 +217,7 @@ input, textarea, .select, .input { hyphens: none; padding: 8px .5em; - &.select { - padding: 0; - } - - &:disabled, &[disabled=disabled] { + &:disabled, &[disabled=disabled], &.disabled { cursor: not-allowed; opacity: 0.5; } @@ -239,25 +235,6 @@ input, textarea, .select, .input { pointer-events: none; } - select { - -webkit-appearance: none; - -moz-appearance: none; - appearance: none; - background: transparent; - border: none; - color: $fallback--text; - color: var(--inputText, --text, $fallback--text); - margin: 0; - padding: 0 2em 0 .2em; - font-family: sans-serif; - font-family: var(--inputFont, sans-serif); - font-size: 14px; - width: 100%; - z-index: 1; - height: 28px; - line-height: 16px; - } - &[type=range] { background: none; border: none; @@ -809,13 +786,6 @@ nav { } } -.select-multiple { - display: flex; - .option-list { - margin: 0; - padding-left: .5em; - } -} .setting-list, .option-list{ list-style-type: none; diff --git a/src/components/font_control/font_control.js b/src/components/font_control/font_control.js index 6274780b..137ef9c0 100644 --- a/src/components/font_control/font_control.js +++ b/src/components/font_control/font_control.js @@ -1,14 +1,10 @@ import { set } from 'vue' -import { library } from '@fortawesome/fontawesome-svg-core' -import { - faChevronDown -} from '@fortawesome/free-solid-svg-icons' - -library.add( - faChevronDown -) +import Select from '../select/select.vue' export default { + components: { + Select + }, props: [ 'name', 'label', 'value', 'fallback', 'options', 'no-inherit' ], diff --git a/src/components/font_control/font_control.vue b/src/components/font_control/font_control.vue index dd117ec0..996ff92c 100644 --- a/src/components/font_control/font_control.vue +++ b/src/components/font_control/font_control.vue @@ -22,30 +22,20 @@ class="opt-l" :for="name + '-o'" /> - + {{ option === 'custom' ? $t('settings.style.fonts.custom') : option }} + + {{ $t('settings.interfaceLanguage') }} - + {{ lang.name }} + + @@ -32,16 +23,12 @@ import languagesObject from '../../i18n/messages' import localeService from '../../services/locale/locale.service.js' import ISO6391 from 'iso-639-1' import _ from 'lodash' -import { library } from '@fortawesome/fontawesome-svg-core' -import { - faChevronDown -} from '@fortawesome/free-solid-svg-icons' - -library.add( - faChevronDown -) +import Select from '../select/select.vue' export default { + components: { + Select + }, computed: { languages () { return _.map(languagesObject.languages, (code) => ({ code: code, name: this.getLanguageName(code) })).sort((a, b) => a.name.localeCompare(b.name)) diff --git a/src/components/poll/poll_form.js b/src/components/poll/poll_form.js index 1f8df3f9..e30645c3 100644 --- a/src/components/poll/poll_form.js +++ b/src/components/poll/poll_form.js @@ -1,19 +1,21 @@ import * as DateUtils from 'src/services/date_utils/date_utils.js' import { uniq } from 'lodash' import { library } from '@fortawesome/fontawesome-svg-core' +import Select from '../select/select.vue' import { faTimes, - faChevronDown, faPlus } from '@fortawesome/free-solid-svg-icons' library.add( faTimes, - faChevronDown, faPlus ) export default { + components: { + Select + }, name: 'PollForm', props: ['visible'], data: () => ({ diff --git a/src/components/poll/poll_form.vue b/src/components/poll/poll_form.vue index c4403210..f10d1550 100644 --- a/src/components/poll/poll_form.vue +++ b/src/components/poll/poll_form.vue @@ -46,23 +46,13 @@ class="poll-type" :title="$t('polls.type')" > - + + +
- + {{ $t(`time.${unit}_short`, ['']) }} + +
diff --git a/src/components/post_status_form/post_status_form.js b/src/components/post_status_form/post_status_form.js index e540654b..5342894f 100644 --- a/src/components/post_status_form/post_status_form.js +++ b/src/components/post_status_form/post_status_form.js @@ -11,10 +11,10 @@ import { reject, map, uniqBy, debounce } from 'lodash' import suggestor from '../emoji_input/suggestor.js' import { mapGetters, mapState } from 'vuex' import Checkbox from '../checkbox/checkbox.vue' +import Select from '../select/select.vue' import { library } from '@fortawesome/fontawesome-svg-core' import { - faChevronDown, faSmileBeam, faPollH, faUpload, @@ -24,7 +24,6 @@ import { } from '@fortawesome/free-solid-svg-icons' library.add( - faChevronDown, faSmileBeam, faPollH, faUpload, @@ -84,6 +83,7 @@ const PostStatusForm = { PollForm, ScopeSelector, Checkbox, + Select, Attachment, StatusContent }, diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue index 73f6a4f1..cc4f6251 100644 --- a/src/components/post_status_form/post_status_form.vue +++ b/src/components/post_status_form/post_status_form.vue @@ -189,28 +189,19 @@ v-if="postFormats.length > 1" class="text-format" > - + {{ $t(`post_status.content_type["${postFormat}"]`) }} + +
+ + + + + + 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) }} + +
    Date: Thu, 11 Mar 2021 16:19:11 +0200 Subject: [PATCH 2/9] ghost styles for poll form --- src/components/poll/poll_form.vue | 14 ++------------ src/components/select/select.js | 21 +++++++++++++++++++++ src/components/select/select.vue | 31 ++++++++++--------------------- 3 files changed, 33 insertions(+), 33 deletions(-) create mode 100644 src/components/select/select.js diff --git a/src/components/poll/poll_form.vue b/src/components/poll/poll_form.vue index f10d1550..f2459e45 100644 --- a/src/components/poll/poll_form.vue +++ b/src/components/poll/poll_form.vue @@ -47,6 +47,7 @@ :title="$t('polls.type')" > @@ -132,12 +134,6 @@ .poll-type { margin-right: 0.75em; flex: 1 1 60%; - .select { - border: none; - box-shadow: none; - background-color: transparent; - padding-right: 0.75em; - } } .poll-expiry { @@ -147,12 +143,6 @@ width: 3em; text-align: right; } - - .expiry-unit { - border: none; - box-shadow: none; - background-color: transparent; - } } } diff --git a/src/components/select/select.js b/src/components/select/select.js new file mode 100644 index 00000000..49535d07 --- /dev/null +++ b/src/components/select/select.js @@ -0,0 +1,21 @@ +import { library } from '@fortawesome/fontawesome-svg-core' +import { + faChevronDown +} from '@fortawesome/free-solid-svg-icons' + +library.add( + faChevronDown +) + +export default { + model: { + prop: 'value', + event: 'change' + }, + props: [ + 'value', + 'disabled', + 'unstyled', + 'kind' + ] +} diff --git a/src/components/select/select.vue b/src/components/select/select.vue index a27a2541..55474e1a 100644 --- a/src/components/select/select.vue +++ b/src/components/select/select.vue @@ -2,7 +2,7 @@ - + diff --git a/src/components/shadow_control/shadow_control.vue b/src/components/shadow_control/shadow_control.vue index 6b5acbdb..511e07f3 100644 --- a/src/components/shadow_control/shadow_control.vue +++ b/src/components/shadow_control/shadow_control.vue @@ -306,20 +306,20 @@ .id-control { align-items: stretch; - .select, .btn { + + .shadow-switcher { + flex: 1; + } + + .shadow-switcher, .btn { min-width: 1px; margin-right: 5px; } + .btn { padding: 0 .4em; margin: 0 .1em; } - .select { - flex: 1; - select { - align-self: initial; - } - } } } } diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue index c5b73fde..75c08f47 100644 --- a/src/components/user_card/user_card.vue +++ b/src/components/user_card/user_card.vue @@ -532,15 +532,11 @@ flex: 1 0 auto; } - .userHighlightSel, - .userHighlightSel.select { + .userHighlightSel { padding-top: 0; padding-bottom: 0; flex: 1 0 auto; } - .userHighlightSel.select svg { - line-height: 22px; - } .userHighlightText { width: 70px; @@ -549,9 +545,7 @@ .userHighlightCl, .userHighlightText, - .userHighlightSel, - .userHighlightSel.select { - height: 22px; + .userHighlightSel { vertical-align: top; margin-right: .5em; margin-bottom: .25em; From 1f0ac68fcd3f382eedf69d1f5fdcffdc16c3885e Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 11 Mar 2021 16:55:14 +0200 Subject: [PATCH 4/9] implement ChoiceSetting for settings modal similar to BooleanSetting --- .../settings_modal/helpers/choice_setting.js | 34 ++++++++++++++ .../settings_modal/helpers/choice_setting.vue | 29 ++++++++++++ .../settings_modal/tabs/filtering_tab.js | 11 +++-- .../settings_modal/tabs/filtering_tab.vue | 17 ++----- .../settings_modal/tabs/general_tab.js | 18 ++++++-- .../settings_modal/tabs/general_tab.vue | 46 +++++-------------- 6 files changed, 103 insertions(+), 52 deletions(-) create mode 100644 src/components/settings_modal/helpers/choice_setting.js create mode 100644 src/components/settings_modal/helpers/choice_setting.vue diff --git a/src/components/settings_modal/helpers/choice_setting.js b/src/components/settings_modal/helpers/choice_setting.js new file mode 100644 index 00000000..042e8106 --- /dev/null +++ b/src/components/settings_modal/helpers/choice_setting.js @@ -0,0 +1,34 @@ +import { get, set } from 'lodash' +import Select from 'src/components/select/select.vue' +import ModifiedIndicator from './modified_indicator.vue' +export default { + components: { + Select, + ModifiedIndicator + }, + props: [ + 'path', + 'disabled', + 'options' + ], + computed: { + pathDefault () { + const [firstSegment, ...rest] = this.path.split('.') + return [firstSegment + 'DefaultValue', ...rest].join('.') + }, + state () { + return get(this.$parent, this.path) + }, + defaultState () { + return get(this.$parent, this.pathDefault) + }, + isChanged () { + return get(this.$parent, this.path) !== get(this.$parent, this.pathDefault) + } + }, + methods: { + update (e) { + set(this.$parent, this.path, e) + } + } +} diff --git a/src/components/settings_modal/helpers/choice_setting.vue b/src/components/settings_modal/helpers/choice_setting.vue new file mode 100644 index 00000000..1a8275b4 --- /dev/null +++ b/src/components/settings_modal/helpers/choice_setting.vue @@ -0,0 +1,29 @@ + + + + + diff --git a/src/components/settings_modal/tabs/filtering_tab.js b/src/components/settings_modal/tabs/filtering_tab.js index 89199d85..4eaf4217 100644 --- a/src/components/settings_modal/tabs/filtering_tab.js +++ b/src/components/settings_modal/tabs/filtering_tab.js @@ -1,18 +1,23 @@ import { filter, trim } from 'lodash' import BooleanSetting from '../helpers/boolean_setting.vue' -import Select from '../../select/select.vue' +import ChoiceSetting from '../helpers/choice_setting.vue' import SharedComputedObject from '../helpers/shared_computed_object.js' const FilteringTab = { data () { return { - muteWordsStringLocal: this.$store.getters.mergedConfig.muteWords.join('\n') + muteWordsStringLocal: this.$store.getters.mergedConfig.muteWords.join('\n'), + replyVisibilityOptions: ['all', 'following', 'self'].map(mode => ({ + key: mode, + value: mode, + label: this.$t(`settings.reply_visibility_${mode}`) + })) } }, components: { BooleanSetting, - Select + ChoiceSetting }, computed: { ...SharedComputedObject(), diff --git a/src/components/settings_modal/tabs/filtering_tab.vue b/src/components/settings_modal/tabs/filtering_tab.vue index 4023fbe2..fb5fc375 100644 --- a/src/components/settings_modal/tabs/filtering_tab.vue +++ b/src/components/settings_modal/tabs/filtering_tab.vue @@ -36,20 +36,13 @@
  • -
    - {{ $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') }} - -
    +
  • From 8e88d8110b0e52023c7f78777bda1951a1bc8d8b Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 11 Mar 2021 17:00:58 +0200 Subject: [PATCH 5/9] fix for filtering tab --- .../settings_modal/settings_modal_content.scss | 13 ++++++++++++- .../settings_modal/tabs/filtering_tab.vue | 9 --------- 2 files changed, 12 insertions(+), 10 deletions(-) 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 @@
  • - From 2da37f15ab6a7e0c6088a6e5a0b2c2885f1cb85a Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 11 Mar 2021 17:04:31 +0200 Subject: [PATCH 6/9] Cleanup boolean/choice setting --- .../helpers/boolean_setting.vue | 38 +------------------ .../settings_modal/helpers/choice_setting.vue | 2 +- 2 files changed, 2 insertions(+), 38 deletions(-) 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') : '' }} From 0c77a3e1d6956c14b68078ff766c5ccfb6b086a4 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Wed, 7 Apr 2021 20:47:59 +0300 Subject: [PATCH 7/9] remove extra chevron post-merge --- src/components/settings_modal/tabs/theme_tab/theme_tab.vue | 4 ---- 1 file changed, 4 deletions(-) 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 }} -
    From 1afda1ac6d037e477e500870fe4e05c3c1f773cb Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Wed, 7 Apr 2021 20:53:58 +0300 Subject: [PATCH 8/9] 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 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) + } + } +} From c03965646027bc8ce2d4c083ea3fd0423233fa18 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Mon, 31 May 2021 14:02:36 +0300 Subject: [PATCH 9/9] fix warnings --- src/components/poll/poll_form.vue | 10 +++++++--- .../settings_modal/tabs/filtering_tab.vue | 8 ++++---- src/components/user_card/user_card.vue | 16 ++++++++++++---- 3 files changed, 23 insertions(+), 11 deletions(-) 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" > - - - - + + + +