From 879f520b75bcb379790317627bc2a8d2b739a2fb Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 22 Feb 2024 00:02:24 +0200 Subject: tabs support + cleanup --- src/components/tab_switcher/tab_switcher.scss | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) (limited to 'src/components/tab_switcher/tab_switcher.scss') diff --git a/src/components/tab_switcher/tab_switcher.scss b/src/components/tab_switcher/tab_switcher.scss index 705925c8..a90a13ed 100644 --- a/src/components/tab_switcher/tab_switcher.scss +++ b/src/components/tab_switcher/tab_switcher.scss @@ -25,8 +25,7 @@ content: ""; flex: 1 1 auto; border-bottom: 1px solid; - border-bottom-color: $fallback--border; - border-bottom-color: var(--border, $fallback--border); + border-bottom-color: var(--border); } .tab-wrapper { @@ -37,8 +36,7 @@ right: 0; bottom: 0; border-bottom: 1px solid; - border-bottom-color: $fallback--border; - border-bottom-color: var(--border, $fallback--border); + border-bottom-color: var(--border); } } @@ -173,6 +171,14 @@ } .tab { + user-select: none; + color: var(--text); + border: none; + cursor: pointer; + box-shadow: var(--shadow); + font-size: 1em; + font-family: var(--interfaceFont, sans-serif); + border-radius: var(--roundness); position: relative; white-space: nowrap; padding: 6px 1em; -- cgit v1.2.3-70-g09d2 From 7d2faccd4f62e8ff6c2f6cc9b8b11d890a6ab974 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Thu, 22 Feb 2024 18:04:28 +0200 Subject: fonts support, cleanup --- src/App.scss | 36 ++---- src/components/input.style.js | 1 + src/components/rich_content/rich_content.scss | 8 +- src/components/rich_content/rich_content.style.js | 2 + src/components/root.style.js | 7 ++ src/components/select/select.vue | 8 +- .../tabs/security_tab/mfa_backup_codes.vue | 5 +- src/components/status_body/status_body.scss | 5 +- src/components/tab_switcher/tab_switcher.scss | 2 +- src/services/style_setter/style_setter.js | 15 +-- src/services/theme_data/css_utils.js | 125 +++++++++++---------- src/services/theme_data/theme2_to_theme3.js | 43 ++++++- src/services/theme_data/theme_data_3.service.js | 11 +- 13 files changed, 154 insertions(+), 114 deletions(-) (limited to 'src/components/tab_switcher/tab_switcher.scss') diff --git a/src/App.scss b/src/App.scss index dd790c6a..41e445d2 100644 --- a/src/App.scss +++ b/src/App.scss @@ -22,7 +22,7 @@ html { body { font-family: sans-serif; - font-family: var(--interfaceFont, sans-serif); + font-family: var(--font); margin: 0; color: var(--text); -webkit-font-smoothing: antialiased; @@ -130,12 +130,7 @@ i[class*="icon-"], nav { z-index: var(--ZI_navbar); - background-color: $fallback--fg; - background-color: var(--topBar, $fallback--fg); - color: $fallback--faint; - color: var(--faint, $fallback--faint); - box-shadow: 0 0 4px rgb(0 0 0 / 60%); - box-shadow: var(--topBarShadow); + box-shadow: var(--shadow); box-sizing: border-box; height: var(--navbar-height); position: fixed; @@ -359,7 +354,7 @@ nav { box-shadow: var(--shadow); font-size: 1em; font-family: sans-serif; - font-family: var(--interfaceFont, sans-serif); + font-family: var(--font); &::-moz-focus-inner { border: none; @@ -409,11 +404,8 @@ nav { color: inherit; &.-link { - color: var(--link); - } - - &.-fullwidth { - width: 100%; + /* stylelint-disable-next-line declaration-no-important */ + color: var(--link) !important; } } @@ -437,8 +429,7 @@ textarea { border: none; border-radius: var(--roundness); box-shadow: var(--shadow); - font-family: sans-serif; - font-family: var(--inputFont, sans-serif); + font-family: var(--font); font-size: 1em; margin: 0; box-sizing: border-box; @@ -466,9 +457,8 @@ textarea { display: none; &:checked + label::before { - box-shadow: 0 0 2px black inset, 0 0 0 4px $fallback--fg inset; - box-shadow: var(--inputShadow), 0 0 0 4px var(--fg, $fallback--fg) inset; - background-color: var(--accent, $fallback--link); + box-shadow: var(--shadow); + background-color: var(--background); } &:disabled { @@ -523,11 +513,8 @@ textarea { width: 1.1em; height: 1.1em; border-radius: var(--roundness); - box-shadow: 0 0 2px black inset; - box-shadow: var(--inputShadow); + box-shadow: var(--shadow); margin-right: 0.5em; - background-color: $fallback--fg; - background-color: var(--input, $fallback--fg); vertical-align: top; text-align: center; line-height: 1.1; @@ -551,7 +538,7 @@ textarea { option { color: var(--text); - background-color: var(--bg, $fallback--bg); + background-color: var(--background); } .hide-number-spinner { @@ -667,8 +654,7 @@ option { .visibility-notice { padding: 0.5em; - border: 1px solid $fallback--faint; - border: 1px solid var(--faint, $fallback--faint); + border: 1px solid var(--textFaint); border-radius: var(--roundness); } diff --git a/src/components/input.style.js b/src/components/input.style.js index 70c775ad..139a0034 100644 --- a/src/components/input.style.js +++ b/src/components/input.style.js @@ -37,6 +37,7 @@ export default { }, { directives: { + '--font': 'generic | inherit', background: '--fg, -5', roundness: 3, shadow: [{ diff --git a/src/components/rich_content/rich_content.scss b/src/components/rich_content/rich_content.scss index 3bb5b16b..73eb07e9 100644 --- a/src/components/rich_content/rich_content.scss +++ b/src/components/rich_content/rich_content.scss @@ -1,10 +1,10 @@ -@import "../../variables"; - .RichContent { + font-family: var(--font); + blockquote { margin: 0.2em 0 0.2em 0.2em; font-style: italic; - border-left: 0.2em solid var(--faint, $fallback--faint); + border-left: 0.2em solid var(--textFaint); padding-left: 1em; } @@ -17,7 +17,7 @@ kbd, var, pre { - font-family: var(--postCodeFont, monospace); + font-family: var(--monoFont); } p { diff --git a/src/components/rich_content/rich_content.style.js b/src/components/rich_content/rich_content.style.js index 7acc9d4f..c8314000 100644 --- a/src/components/rich_content/rich_content.style.js +++ b/src/components/rich_content/rich_content.style.js @@ -9,6 +9,8 @@ export default { defaultRules: [ { directives: { + '--font': 'generic | inherit', + '--monoFont': 'generic | monospace', textNoCssColor: 'yes' } } diff --git a/src/components/root.style.js b/src/components/root.style.js index 8ddb8038..053d984b 100644 --- a/src/components/root.style.js +++ b/src/components/root.style.js @@ -9,5 +9,12 @@ export default { 'Scrollbar', 'ScrollbarElement', 'MobileDrawer' + ], + defaultRules: [ + { + directives: { + '--font': 'generic | sans-serif' + } + } ] } diff --git a/src/components/select/select.vue b/src/components/select/select.vue index 1797afc8..30fd0bb0 100644 --- a/src/components/select/select.vue +++ b/src/components/select/select.vue @@ -32,12 +32,10 @@ label.Select { appearance: none; background: transparent; border: none; - color: $fallback--text; - color: var(--inputText, --text, $fallback--text); + color: var(--text); margin: 0; padding: 0 2em 0 0.2em; - font-family: sans-serif; - font-family: var(--inputFont, sans-serif); + font-family: var(--font); font-size: 1em; width: 100%; z-index: 1; @@ -53,7 +51,7 @@ label.Select { height: 100%; width: 0.875em; color: $fallback--text; - color: var(--inputText, $fallback--text); + font-family: var(--font); line-height: 2; z-index: 0; pointer-events: none; diff --git a/src/components/settings_modal/tabs/security_tab/mfa_backup_codes.vue b/src/components/settings_modal/tabs/security_tab/mfa_backup_codes.vue index 923161b2..002f1bb2 100644 --- a/src/components/settings_modal/tabs/security_tab/mfa_backup_codes.vue +++ b/src/components/settings_modal/tabs/security_tab/mfa_backup_codes.vue @@ -25,12 +25,11 @@ .mfa-backup-codes { .warning { - color: $fallback--cOrange; - color: var(--cOrange, $fallback--cOrange); + color: var(--cOrange); } .backup-codes { - font-family: var(--postCodeFont, monospace); + font-family: var(--monoFont); } } diff --git a/src/components/status_body/status_body.scss b/src/components/status_body/status_body.scss index 930ed803..0a467b4f 100644 --- a/src/components/status_body/status_body.scss +++ b/src/components/status_body/status_body.scss @@ -1,5 +1,3 @@ -@import "../../variables"; - .StatusBody { display: flex; flex-direction: column; @@ -14,7 +12,6 @@ & .text, & .summary { - font-family: var(--postFont, sans-serif); white-space: pre-wrap; overflow-wrap: break-word; word-wrap: break-word; @@ -41,7 +38,7 @@ margin-bottom: 0.5em; border-style: solid; border-width: 0 0 1px; - border-color: var(--border, $fallback--border); + border-color: var(--border); flex-grow: 0; &.-tall { diff --git a/src/components/tab_switcher/tab_switcher.scss b/src/components/tab_switcher/tab_switcher.scss index a90a13ed..489407cb 100644 --- a/src/components/tab_switcher/tab_switcher.scss +++ b/src/components/tab_switcher/tab_switcher.scss @@ -177,7 +177,7 @@ cursor: pointer; box-shadow: var(--shadow); font-size: 1em; - font-family: var(--interfaceFont, sans-serif); + font-family: var(--font); border-radius: var(--roundness); position: relative; white-space: nowrap; diff --git a/src/services/style_setter/style_setter.js b/src/services/style_setter/style_setter.js index ed6c8505..1cda7213 100644 --- a/src/services/style_setter/style_setter.js +++ b/src/services/style_setter/style_setter.js @@ -6,25 +6,22 @@ import { getCssRules } from '../theme_data/css_utils.js' import { defaultState } from '../../modules/config.js' export const applyTheme = (input) => { - console.log({ ...input }) let extraRules - let fonts if (input.themeType !== 1) { const t0 = performance.now() - const { rules, theme } = generatePreset(input) - fonts = rules.fonts + const { theme } = generatePreset(input) const t1 = performance.now() - console.log('Themes 2 initialization took ' + (t1 - t0) + 'ms') + console.debug('Themes 2 initialization took ' + (t1 - t0) + 'ms') extraRules = convertTheme2To3(theme) } else { - console.log(input) + console.debug(input) extraRules = convertTheme2To3(input) } const t1 = performance.now() const themes3 = init(extraRules, '#FFFFFF') const t2 = performance.now() - console.log('Themes 3 initialization took ' + (t2 - t1) + 'ms') + console.debug('Themes 3 (eager) initialization took ' + (t2 - t1) + 'ms') const head = document.head const body = document.body body.classList.add('hidden') @@ -33,8 +30,6 @@ export const applyTheme = (input) => { head.appendChild(styleEl) const styleSheet = styleEl.sheet - styleSheet.toString() - styleSheet.insertRule(`:root { ${fonts} }`, 'index-max') getCssRules(themes3.eager, themes3.staticVars).forEach(rule => { // Hack to support multiple selectors on same component if (rule.match(/::-webkit-scrollbar-button/)) { @@ -58,7 +53,7 @@ export const applyTheme = (input) => { styleSheet.insertRule(rule, 'index-max') }) const t3 = performance.now() - console.log('Themes 3 finalization took ' + (t3 - t2) + 'ms') + console.debug('Themes 3 finalization (lazy) took ' + (t3 - t2) + 'ms') }) } diff --git a/src/services/theme_data/css_utils.js b/src/services/theme_data/css_utils.js index b83b90bf..f04fed42 100644 --- a/src/services/theme_data/css_utils.js +++ b/src/services/theme_data/css_utils.js @@ -1,6 +1,6 @@ import { convert } from 'chromatism' -import { rgba2css } from '../color_convert/color_convert.js' +import { hex2rgb, rgba2css } from '../color_convert/color_convert.js' // This changes what backgrounds are used to "stacked" solid colors so you can see // what theme engine "thinks" is actual background color is for purposes of text color @@ -78,72 +78,79 @@ export const getCssRules = (rules) => rules.map(rule => { return ' ' + k + ': ' + v }).join(';\n') - let directives - if (rule.component !== 'Root') { - directives = Object.entries(rule.directives).map(([k, v]) => { - switch (k) { - case 'roundness': { - return ' ' + [ - '--roundness: ' + v + 'px' - ].join(';\n ') + const directives = Object.entries(rule.directives).map(([k, v]) => { + switch (k) { + case 'roundness': { + return ' ' + [ + '--roundness: ' + v + 'px' + ].join(';\n ') + } + case 'shadow': { + return ' ' + [ + '--shadow: ' + getCssShadow(rule.dynamicVars.shadow), + '--shadowFilter: ' + getCssShadowFilter(rule.dynamicVars.shadow), + '--shadowInset: ' + getCssShadow(rule.dynamicVars.shadow, true) + ].join(';\n ') + } + case 'background': { + if (DEBUG) { + return ` + --background: ${getCssColorString(rule.dynamicVars.stacked)}; + background-color: ${getCssColorString(rule.dynamicVars.stacked)}; + ` } - case 'shadow': { - return ' ' + [ - '--shadow: ' + getCssShadow(rule.dynamicVars.shadow), - '--shadowFilter: ' + getCssShadowFilter(rule.dynamicVars.shadow), - '--shadowInset: ' + getCssShadow(rule.dynamicVars.shadow, true) - ].join(';\n ') + if (v === 'transparent') { + if (rule.component === 'Root') return [] + return [ + rule.directives.backgroundNoCssColor !== 'yes' ? ('background-color: ' + v) : '', + ' --background: ' + v + ].filter(x => x).join(';\n') } - case 'background': { - if (DEBUG) { - return ` - --background: ${getCssColorString(rule.dynamicVars.stacked)}; - background-color: ${getCssColorString(rule.dynamicVars.stacked)}; - ` - } - if (v === 'transparent') { - return [ - rule.directives.backgroundNoCssColor !== 'yes' ? ('background-color: ' + v) : '', - ' --background: ' + v - ].filter(x => x).join(';\n') - } - const color = getCssColorString(rule.dynamicVars.background, rule.directives.opacity) - const cssDirectives = ['--background: ' + color] + const color = getCssColorString(rule.dynamicVars.background, rule.directives.opacity) + const cssDirectives = ['--background: ' + color] + if (rule.directives.backgroundNoCssColor !== 'yes') { + cssDirectives.push('background-color: ' + color) + } + return cssDirectives.filter(x => x).join(';\n') + } + case 'blur': { + const cssDirectives = [] + if (rule.directives.opacity < 1) { + cssDirectives.push(`--backdrop-filter: blur(${v}) `) if (rule.directives.backgroundNoCssColor !== 'yes') { - cssDirectives.push('background-color: ' + color) + cssDirectives.push(`backdrop-filter: blur(${v}) `) } - return cssDirectives.filter(x => x).join(';\n') } - case 'blur': { - const cssDirectives = [] - if (rule.directives.opacity < 1) { - cssDirectives.push(`--backdrop-filter: blur(${v}) `) - if (rule.directives.backgroundNoCssColor !== 'yes') { - cssDirectives.push(`backdrop-filter: blur(${v}) `) + return cssDirectives.join(';\n') + } + case 'font': { + return 'font-family: ' + v + } + case 'textColor': { + if (rule.directives.textNoCssColor === 'yes') { return '' } + return 'color: ' + v + } + default: + if (k.startsWith('--')) { + const [type, value] = v.split('|').map(x => x.trim()) // woah, Extreme! + switch (type) { + case 'color': { + const color = rule.dynamicVars[k] + if (typeof color === 'string') { + return k + ': ' + rgba2css(hex2rgb(color)) + } else { + return k + ': ' + rgba2css(color) + } } + case 'generic': + return k + ': ' + value + default: + return '' } - return cssDirectives.join(';\n') } - case 'textColor': { - if (rule.directives.textNoCssColor === 'yes') { return '' } - return 'color: ' + v - } - default: - if (k.startsWith('--')) { - const [type] = v.split('|').map(x => x.trim()) // woah, Extreme! - switch (type) { - case 'color': - return k + ': ' + rgba2css(rule.dynamicVars[k]) - default: - return '' - } - } - return '' - } - }).filter(x => x).map(x => ' ' + x).join(';\n') - } else { - directives = {} - } + return '' + } + }).filter(x => x).map(x => ' ' + x).join(';\n') return [ header, diff --git a/src/services/theme_data/theme2_to_theme3.js b/src/services/theme_data/theme2_to_theme3.js index 7adbbd42..11f517c6 100644 --- a/src/services/theme_data/theme2_to_theme3.js +++ b/src/services/theme_data/theme2_to_theme3.js @@ -14,6 +14,13 @@ export const basePaletteKeys = new Set([ 'cOrange' ]) +export const fontsKeys = new Set([ + 'interface', + 'input', + 'post', + 'postCode' +]) + export const opacityKeys = new Set([ 'alert', 'alertPopup', @@ -249,6 +256,40 @@ export const convertTheme2To3 = (data) => { return newRules } + const convertFonts = () => { + const newRules = [] + Object.keys(data.fonts).forEach(key => { + if (!fontsKeys.has(key)) return + const originalFont = data.fonts[key].family + const rule = {} + + switch (key) { + case 'interface': + case 'postCode': + rule.component = 'Root' + break + case 'input': + rule.component = 'Input' + break + case 'post': + rule.component = 'RichContent' + break + } + switch (key) { + case 'interface': + case 'input': + case 'post': + rule.directives = { '--font': 'generic | ' + originalFont } + break + case 'postCode': + rule.directives = { '--monoFont': 'generic | ' + originalFont } + newRules.push({ ...rule, component: 'RichContent' }) + break + } + newRules.push(rule) + }) + return newRules + } const convertShadows = () => { const newRules = [] Object.keys(data.shadows).forEach(key => { @@ -457,5 +498,5 @@ export const convertTheme2To3 = (data) => { const flatExtRules = extendedRules.filter(x => x).reduce((acc, x) => [...acc, ...x], []).filter(x => x).reduce((acc, x) => [...acc, ...x], []) - return [generateRoot(), ...convertShadows(), ...convertRadii(), ...convertOpacity(), ...flatExtRules] + return [generateRoot(), ...convertShadows(), ...convertRadii(), ...convertOpacity(), ...convertFonts(), ...flatExtRules] } diff --git a/src/services/theme_data/theme_data_3.service.js b/src/services/theme_data/theme_data_3.service.js index 0133dfe4..13caef9e 100644 --- a/src/services/theme_data/theme_data_3.service.js +++ b/src/services/theme_data/theme_data_3.service.js @@ -411,6 +411,13 @@ export const init = (extraRuleset, ultimateBackgroundColor) => { } break } + case 'generic': { + dynamicVars[k] = value + if (component.name === 'Root') { + staticVars[k.substring(2)] = value + } + break + } } }) @@ -454,9 +461,9 @@ export const init = (extraRuleset, ultimateBackgroundColor) => { } processInnerComponent(components.Root, eagerRules) - console.log('TOTAL COMBOS: ' + counter) + console.debug('Eager combinations processed:' + counter) const lazyExec = Promise.all(promises).then(() => { - console.log('TOTAL COMBOS: ' + counter) + console.debug('Total combinations processed: ' + counter) }).then(() => lazyRules) return { -- cgit v1.2.3-70-g09d2 From 075f2cb903fa45ea8e7a52098fd7091b0b14a9fd Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Mon, 4 Mar 2024 19:45:42 +0200 Subject: remove all "fallback variables" --- src/App.scss | 1 - src/_variables.scss | 36 ----------------- src/components/account_actions/account_actions.vue | 2 - src/components/announcement/announcement.vue | 8 ++-- .../announcements_page/announcements_page.vue | 6 +-- src/components/attachment/attachment.scss | 18 +-------- src/components/autosuggest/autosuggest.vue | 6 +-- src/components/avatar_list/avatar_list.vue | 5 +-- src/components/chat/chat.vue | 1 - src/components/chat_list/chat_list.vue | 5 +-- src/components/chat_list_item/chat_list_item.vue | 1 - src/components/chat_new/chat_new.vue | 1 - src/components/chat_title/chat_title.vue | 5 +-- src/components/checkbox/checkbox.vue | 1 - src/components/color_input/color_input.scss | 4 -- src/components/conversation/conversation.vue | 34 ++++++++-------- src/components/desktop_nav/desktop_nav.scss | 2 - src/components/dialog_modal/dialog_modal.vue | 11 +----- src/components/emoji_input/emoji_input.vue | 2 - src/components/emoji_picker/emoji_picker.scss | 5 +-- src/components/emoji_reactions/emoji_reactions.vue | 16 +++----- src/components/extra_buttons/extra_buttons.vue | 4 +- .../extra_notifications/extra_notifications.vue | 5 +-- src/components/favorite_button/favorite_button.vue | 4 +- src/components/flash/flash.vue | 2 - src/components/font_control/font_control.vue | 2 - src/components/gallery/gallery.vue | 2 - .../global_notice_list/global_notice_list.vue | 2 - .../interface_language_switcher.vue | 2 - src/components/link-preview/link-preview.vue | 7 +--- src/components/lists_edit/lists_edit.vue | 2 - .../lists_user_search/lists_user_search.vue | 2 - src/components/login_form/login_form.vue | 2 - src/components/media_upload/media_upload.vue | 2 - src/components/mention_link/mention_link.scss | 10 ++--- src/components/mobile_nav/mobile_nav.vue | 8 +--- .../mobile_post_status_button.vue | 5 +-- .../moderation_tools/moderation_tools.vue | 2 - .../mrf_transparency_panel.vue | 1 - src/components/nav_panel/nav_panel.vue | 2 - src/components/navigation/navigation_pins.vue | 2 - src/components/notifications/notifications.scss | 2 - src/components/panel_loading/panel_loading.vue | 8 +--- src/components/password_reset/password_reset.vue | 9 +---- src/components/poll/poll.vue | 5 +-- src/components/poll/poll_form.vue | 2 - .../post_status_form/post_status_form.vue | 29 +++++--------- src/components/react_button/react_button.vue | 8 +--- src/components/registration/registration.vue | 6 +-- src/components/reply_button/reply_button.vue | 4 +- src/components/report/report.scss | 2 - src/components/retweet_button/retweet_button.vue | 4 +- src/components/scope_selector/scope_selector.vue | 2 - src/components/search_bar/search_bar.vue | 5 +-- src/components/select/select.vue | 3 -- src/components/settings_modal/settings_modal.scss | 2 - .../settings_modal_admin_content.scss | 7 +--- .../settings_modal_user_content.scss | 7 +--- .../settings_modal/tabs/profile_tab.scss | 2 - .../settings_modal/tabs/security_tab/mfa.vue | 5 +-- .../tabs/security_tab/mfa_backup_codes.vue | 2 - .../settings_modal/tabs/theme_tab/theme_tab.scss | 10 ++--- src/components/shout_panel/shout_panel.vue | 5 +-- src/components/side_drawer/side_drawer.vue | 2 - src/components/status/status.scss | 45 +++++++--------------- src/components/status_popover/status_popover.vue | 2 - src/components/sticker_picker/sticker_picker.vue | 4 +- src/components/still-image/still-image.vue | 5 +-- src/components/tab_switcher/tab_switcher.scss | 15 ++------ src/components/thread_tree/thread_tree.vue | 8 ++-- src/components/timeline/timeline.scss | 2 - src/components/timeline_menu/timeline_menu.vue | 2 - .../update_notification/update_notification.scss | 4 +- src/components/user_avatar/user_avatar.vue | 2 - src/components/user_card/user_card.scss | 2 - src/components/user_note/user_note.vue | 4 +- src/components/user_popover/user_popover.vue | 2 - src/components/user_profile/user_profile.vue | 2 - .../user_reporting_modal/user_reporting_modal.vue | 8 +--- src/hocs/with_load_more/with_load_more.scss | 5 +-- 80 files changed, 99 insertions(+), 382 deletions(-) delete mode 100644 src/_variables.scss (limited to 'src/components/tab_switcher/tab_switcher.scss') diff --git a/src/App.scss b/src/App.scss index 289add77..97d3f516 100644 --- a/src/App.scss +++ b/src/App.scss @@ -1,6 +1,5 @@ // stylelint-disable rscss/class-format /* stylelint-disable no-descending-specificity */ -@import "./variables"; @import "./panel"; :root { diff --git a/src/_variables.scss b/src/_variables.scss deleted file mode 100644 index 751fc9a4..00000000 --- a/src/_variables.scss +++ /dev/null @@ -1,36 +0,0 @@ -$main-color: #f58d2c; -$main-background: white; -$darkened-background: whitesmoke; - -$fallback--bg: #121a24; -$fallback--fg: #182230; -$fallback--faint: rgb(185 185 186 / 50%); -$fallback--text: #b9b9ba; -$fallback--link: #d8a070; -$fallback--icon: #666; -$fallback--lightBg: rgb(21 30 42); -$fallback--lightText: #b9b9ba; -$fallback--border: #222; -$fallback--cRed: #f00; -$fallback--cBlue: #0095ff; -$fallback--cGreen: #0fa00f; -$fallback--cOrange: orange; - -$fallback--alertError: rgb(211 16 20 / 50%); -$fallback--alertWarning: rgb(111 111 20 / 50%); - -$fallback--panelRadius: 10px; -$fallback--checkboxRadius: 2px; -$fallback--btnRadius: 4px; -$fallback--inputRadius: 4px; -$fallback--tooltipRadius: 5px; -$fallback--avatarRadius: 4px; -$fallback--avatarAltRadius: 10px; -$fallback--attachmentRadius: 10px; -$fallback--chatMessageRadius: 10px; - -$fallback--buttonShadow: 0 0 2px 0 rgb(0 0 0 / 100%), - 0 1px 0 0 rgb(255 255 255 / 20%) inset, - 0 -1px 0 0 rgb(0 0 0 / 20%) inset; - -$status-margin: 0.75em; diff --git a/src/components/account_actions/account_actions.vue b/src/components/account_actions/account_actions.vue index cca7121c..9a7c6824 100644 --- a/src/components/account_actions/account_actions.vue +++ b/src/components/account_actions/account_actions.vue @@ -122,8 +122,6 @@ diff --git a/src/components/chat_list/chat_list.vue b/src/components/chat_list/chat_list.vue index 27a475ed..b33ea67e 100644 --- a/src/components/chat_list/chat_list.vue +++ b/src/components/chat_list/chat_list.vue @@ -45,8 +45,6 @@ diff --git a/src/components/chat_list_item/chat_list_item.vue b/src/components/chat_list_item/chat_list_item.vue index cbae2d11..0f9d5c5f 100644 --- a/src/components/chat_list_item/chat_list_item.vue +++ b/src/components/chat_list_item/chat_list_item.vue @@ -48,6 +48,5 @@ diff --git a/src/components/chat_new/chat_new.vue b/src/components/chat_new/chat_new.vue index 5a872b66..673ba56b 100644 --- a/src/components/chat_new/chat_new.vue +++ b/src/components/chat_new/chat_new.vue @@ -48,6 +48,5 @@ diff --git a/src/components/chat_title/chat_title.vue b/src/components/chat_title/chat_title.vue index 93db4fa7..68ee7a5a 100644 --- a/src/components/chat_title/chat_title.vue +++ b/src/components/chat_title/chat_title.vue @@ -26,8 +26,6 @@ diff --git a/src/components/desktop_nav/desktop_nav.scss b/src/components/desktop_nav/desktop_nav.scss index 373cb2f2..61d2541c 100644 --- a/src/components/desktop_nav/desktop_nav.scss +++ b/src/components/desktop_nav/desktop_nav.scss @@ -1,5 +1,3 @@ -@import "../../variables"; - .DesktopNav { width: 100%; z-index: var(--ZI_navbar); diff --git a/src/components/dialog_modal/dialog_modal.vue b/src/components/dialog_modal/dialog_modal.vue index 341cf105..b917c637 100644 --- a/src/components/dialog_modal/dialog_modal.vue +++ b/src/components/dialog_modal/dialog_modal.vue @@ -25,8 +25,6 @@ diff --git a/src/components/lists_edit/lists_edit.vue b/src/components/lists_edit/lists_edit.vue index 3c44579a..3c2066f6 100644 --- a/src/components/lists_edit/lists_edit.vue +++ b/src/components/lists_edit/lists_edit.vue @@ -165,8 +165,6 @@ diff --git a/src/components/nav_panel/nav_panel.vue b/src/components/nav_panel/nav_panel.vue index 6380deac..bf608936 100644 --- a/src/components/nav_panel/nav_panel.vue +++ b/src/components/nav_panel/nav_panel.vue @@ -103,8 +103,6 @@ diff --git a/src/components/password_reset/password_reset.vue b/src/components/password_reset/password_reset.vue index 7ac6db74..037b859e 100644 --- a/src/components/password_reset/password_reset.vue +++ b/src/components/password_reset/password_reset.vue @@ -30,7 +30,7 @@

{{ $t('password_reset.password_reset_required') }}

@@ -77,8 +77,6 @@ diff --git a/src/components/react_button/react_button.vue b/src/components/react_button/react_button.vue index 1b0674e6..e648e7e3 100644 --- a/src/components/react_button/react_button.vue +++ b/src/components/react_button/react_button.vue @@ -41,7 +41,6 @@ diff --git a/src/components/user_popover/user_popover.vue b/src/components/user_popover/user_popover.vue index 3b2bbc45..413b254c 100644 --- a/src/components/user_popover/user_popover.vue +++ b/src/components/user_popover/user_popover.vue @@ -24,8 +24,6 @@