diff --git a/changelog.d/weight-loss.change b/changelog.d/weight-loss.change new file mode 100644 index 000000000..8c1322bf9 --- /dev/null +++ b/changelog.d/weight-loss.change @@ -0,0 +1 @@ +Reduced time taken processing theme by half diff --git a/src/components/attachment/attachment.style.js b/src/components/attachment/attachment.style.js deleted file mode 100644 index a9455e367..000000000 --- a/src/components/attachment/attachment.style.js +++ /dev/null @@ -1,27 +0,0 @@ -export default { - name: 'Attachment', - selector: '.Attachment', - notEditable: true, - validInnerComponents: [ - 'Border', - 'Button', - 'Input' - ], - defaultRules: [ - { - directives: { - roundness: 3 - } - }, - { - component: 'Button', - parent: { - component: 'Attachment' - }, - directives: { - background: '#FFFFFF', - opacity: 0.5 - } - } - ] -} diff --git a/src/components/chat_message/chat_message.style.js b/src/components/chat_message/chat_message.style.js index 9b57ad371..76b565823 100644 --- a/src/components/chat_message/chat_message.style.js +++ b/src/components/chat_message/chat_message.style.js @@ -8,9 +8,6 @@ export default { 'Text', 'Icon', 'Border', - 'Button', - 'RichContent', - 'Attachment', 'PollGraph' ], defaultRules: [ diff --git a/src/components/list/list_item.style.js b/src/components/list/list_item.style.js deleted file mode 100644 index 49b2b035f..000000000 --- a/src/components/list/list_item.style.js +++ /dev/null @@ -1,48 +0,0 @@ -export default { - name: 'ListItem', - selector: '.list-item', - states: { - active: '.-active', - hover: ':is(:hover, :focus-visible, :has(:focus-visible)):not(.-non-interactive)' - }, - validInnerComponents: [ - 'Text', - 'Link', - 'Icon', - 'Border', - 'Button', - 'ButtonUnstyled', - 'RichContent', - 'Input', - 'Avatar' - ], - defaultRules: [ - { - directives: { - background: '--bg', - opacity: 0 - } - }, - { - state: ['active'], - directives: { - background: '--inheritedBackground, 10', - opacity: 1 - } - }, - { - state: ['hover'], - directives: { - background: '--inheritedBackground, 10', - opacity: 1 - } - }, - { - state: ['hover', 'active'], - directives: { - background: '--inheritedBackground, 20', - opacity: 1 - } - } - ] -} diff --git a/src/components/menu_item.style.js b/src/components/menu_item.style.js index 883355efa..859932062 100644 --- a/src/components/menu_item.style.js +++ b/src/components/menu_item.style.js @@ -4,11 +4,7 @@ export default { validInnerComponents: [ 'Text', 'Icon', - 'Input', - 'Border', - 'ButtonUnstyled', - 'Badge', - 'Avatar' + 'Border' ], states: { hover: ':is(:hover, :focus-visible, :has(:focus-visible)):not(.disabled)', diff --git a/src/components/mobile_drawer.style.js b/src/components/mobile_drawer.style.js index 398bc186e..0f2cf4e59 100644 --- a/src/components/mobile_drawer.style.js +++ b/src/components/mobile_drawer.style.js @@ -2,18 +2,7 @@ export default { name: 'MobileDrawer', selector: '.mobile-drawer', validInnerComponents: [ - 'Text', - 'Link', - 'Icon', - 'Border', - 'Button', - 'ButtonUnstyled', - 'Input', - 'PanelHeader', - 'MenuItem', - 'Notification', - 'Alert', - 'UserCard' + 'MenuItem' ], defaultRules: [ { @@ -21,21 +10,6 @@ export default { background: '--bg', backgroundNoCssColor: 'yes' } - }, - { - component: 'PanelHeader', - parent: { component: 'MobileDrawer' }, - directives: { - background: '--fg', - shadow: [{ - x: 0, - y: 0, - blur: 4, - spread: 0, - color: '#000000', - alpha: 0.6 - }] - } } ] } diff --git a/src/components/notification/notification.style.js b/src/components/notification/notification.style.js index c6d317d1c..05c1f6f23 100644 --- a/src/components/notification/notification.style.js +++ b/src/components/notification/notification.style.js @@ -6,12 +6,7 @@ export default { 'Link', 'Icon', 'Border', - 'Button', - 'ButtonUnstyled', - 'RichContent', - 'Input', 'Avatar', - 'Attachment', 'PollGraph' ], defaultRules: [] diff --git a/src/components/panel.style.js b/src/components/panel.style.js index a017a52bc..2c8956ae1 100644 --- a/src/components/panel.style.js +++ b/src/components/panel.style.js @@ -6,29 +6,17 @@ export default { 'Link', 'Icon', 'Border', - 'Button', - 'ButtonUnstyled', - 'Input', 'PanelHeader', - 'MenuItem', 'Post', 'Notification', - 'Alert', - 'UserCard', - 'Chat', - 'Attachment', - 'Tab', - 'ListItem' + 'MenuItem' ], validInnerComponentsLite: [ 'Text', 'Link', 'Icon', 'Border', - 'Button', - 'Input', - 'PanelHeader', - 'Alert' + 'PanelHeader' ], defaultRules: [ { diff --git a/src/components/panel_header.style.js b/src/components/panel_header.style.js index 226ff9e16..4e5f97760 100644 --- a/src/components/panel_header.style.js +++ b/src/components/panel_header.style.js @@ -7,9 +7,7 @@ export default { 'Icon', 'Button', 'ButtonUnstyled', - 'Badge', - 'Alert', - 'Avatar' + 'Alert' ], defaultRules: [ { diff --git a/src/components/popover.style.js b/src/components/popover.style.js index 0197271b9..455b5f5e0 100644 --- a/src/components/popover.style.js +++ b/src/components/popover.style.js @@ -6,16 +6,7 @@ export default { modal: '.modal' }, validInnerComponents: [ - 'Text', - 'Link', - 'Icon', - 'Border', - 'Button', - 'ButtonUnstyled', - 'Input', - 'MenuItem', - 'Post', - 'UserCard' + 'MenuItem' ], defaultRules: [ { diff --git a/src/components/rich_content/rich_content.scss b/src/components/rich_content/rich_content.scss index 140be2f98..6b70d1356 100644 --- a/src/components/rich_content/rich_content.scss +++ b/src/components/rich_content/rich_content.scss @@ -2,6 +2,7 @@ font-family: var(--font); &.-faint { + color: var(--text); /* stylelint-disable declaration-no-important */ --text: var(--textFaint) !important; --link: var(--linkFaint) !important; diff --git a/src/components/rich_content/rich_content.style.js b/src/components/rich_content/rich_content.style.js deleted file mode 100644 index eaba9c4b1..000000000 --- a/src/components/rich_content/rich_content.style.js +++ /dev/null @@ -1,20 +0,0 @@ -export default { - name: 'RichContent', - selector: '.RichContent', - notEditable: true, - transparent: true, - validInnerComponents: [ - 'Text', - 'FunText', - 'Link' - ], - defaultRules: [ - { - directives: { - '--font': 'generic | inherit', - '--monoFont': 'generic | monospace', - textNoCssColor: 'yes' - } - } - ] -} diff --git a/src/components/status/post.style.js b/src/components/status/post.style.js index d0038424e..43e21a16e 100644 --- a/src/components/status/post.style.js +++ b/src/components/status/post.style.js @@ -9,23 +9,9 @@ export default { 'Link', 'Icon', 'Border', - 'Button', - 'ButtonUnstyled', - 'RichContent', - 'Input', 'Avatar', - 'Attachment', 'PollGraph' ], - validInnerComponentsLite: [ - 'Text', - 'Link', - 'Icon', - 'Border', - 'ButtonUnstyled', - 'RichContent', - 'Avatar' - ], defaultRules: [ { directives: { diff --git a/src/components/top_bar.style.js b/src/components/top_bar.style.js index 945ae7781..89c5243db 100644 --- a/src/components/top_bar.style.js +++ b/src/components/top_bar.style.js @@ -5,6 +5,7 @@ export default { 'Link', 'Text', 'Icon', + // Optimization: don't put heavy components unless needed 'Button', 'ButtonUnstyled', 'Input', diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss index 58eb66d5c..4fdc73777 100644 --- a/src/components/user_card/user_card.scss +++ b/src/components/user_card/user_card.scss @@ -111,15 +111,20 @@ } } - .banner-overlay, - .banner-image { + .header-overlay { position: absolute; inset: 0; right: -1.2em; left: -1.2em; top: -1.4em; - padding: 0; mask: linear-gradient(to top, transparent 0, white 5em) bottom no-repeat; + } + + .banner-overlay, + .banner-image { + position: absolute; + inset: 0; + padding: 0; border-top-left-radius: calc(var(--roundness) - 1px); border-top-right-radius: calc(var(--roundness) - 1px); } @@ -136,6 +141,7 @@ .banner-overlay { background-color: var(--profileTint); + opacity: 0.5; pointer-events: none; // let user copy bg url z-index: -1; } diff --git a/src/components/user_card/user_card.style.js b/src/components/user_card/user_card.style.js index 3d5bb2989..b6e256392 100644 --- a/src/components/user_card/user_card.style.js +++ b/src/components/user_card/user_card.style.js @@ -2,40 +2,10 @@ export default { name: 'UserCard', selector: '.user-card', notEditable: true, - validInnerComponents: [ - 'Text', - 'Link', - 'Icon', - 'Button', - 'ButtonUnstyled', - 'Input', - 'RichContent', - 'Alert' - ], defaultRules: [ { directives: { - background: '--bg', - opacity: 0, - roundness: 3, - shadow: [{ - x: 1, - y: 1, - blur: 4, - spread: 0, - color: '#000000', - alpha: 0.6 - }], - '--profileTint': 'color | $alpha(--background 0.5)' - } - }, - { - parent: { - component: 'UserCard' - }, - component: 'RichContent', - directives: { - opacity: 0 + '--profileTint': 'color | $alpha(--background 1)' } } ] diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue index 52dab5069..d6edc021f 100644 --- a/src/components/user_card/user_card.vue +++ b/src/components/user_card/user_card.vue @@ -3,16 +3,18 @@
-