diff --git a/src/components/select/select.vue b/src/components/select/select.vue index 0fb6fcc0..2214959f 100644 --- a/src/components/select/select.vue +++ b/src/components/select/select.vue @@ -49,6 +49,7 @@ label.Select { option { background-color: transparent; + &:checked, &.-active { color: var(--selectionText); background-color: var(--selectionBackground); diff --git a/src/components/settings_modal/tabs/style_tab/style_tab.js b/src/components/settings_modal/tabs/style_tab/style_tab.js index b6fc841d..6c1ef28a 100644 --- a/src/components/settings_modal/tabs/style_tab/style_tab.js +++ b/src/components/settings_modal/tabs/style_tab/style_tab.js @@ -33,7 +33,13 @@ import { } from 'src/services/export_import/export_import.js' import { library } from '@fortawesome/fontawesome-svg-core' -import { faFloppyDisk, faFolderOpen, faFile, faArrowsRotate } from '@fortawesome/free-solid-svg-icons' +import { + faFloppyDisk, + faFolderOpen, + faFile, + faArrowsRotate, + faCheck +} from '@fortawesome/free-solid-svg-icons' // helper for debugging // eslint-disable-next-line no-unused-vars @@ -46,7 +52,8 @@ library.add( faFile, faFloppyDisk, faFolderOpen, - faArrowsRotate + faArrowsRotate, + faCheck ) export default { diff --git a/src/components/settings_modal/tabs/style_tab/style_tab.scss b/src/components/settings_modal/tabs/style_tab/style_tab.scss index 3d33d35e..33b00ec6 100644 --- a/src/components/settings_modal/tabs/style_tab/style_tab.scss +++ b/src/components/settings_modal/tabs/style_tab/style_tab.scss @@ -66,14 +66,14 @@ &.heading { display: grid; grid-template: - "meta meta preview" - "meta meta preview" - "meta meta preview" - "meta meta preview" - "new new preview" - "load save refresh"; + "meta meta preview preview" + "meta meta preview preview" + "meta meta preview preview" + "meta meta preview preview" + "new new preview preview" + "load save refresh apply"; grid-gap: 0.5em; - grid-template-columns: min-content min-content 6fr; + grid-template-columns: min-content min-content 6fr max-content; grid-template-rows: repeat(4, min-content) repeat(2, 2em); ul.setting-list { @@ -116,6 +116,10 @@ .button-refresh { grid-area: refresh; } + + .button-apply { + grid-area: apply; + } } } diff --git a/src/components/settings_modal/tabs/style_tab/style_tab.vue b/src/components/settings_modal/tabs/style_tab/style_tab.vue index 30920292..b934fa44 100644 --- a/src/components/settings_modal/tabs/style_tab/style_tab.vue +++ b/src/components/settings_modal/tabs/style_tab/style_tab.vue @@ -39,6 +39,13 @@ {{ $t('settings.style.themes3.editor.refresh_preview') }} +