Refactor CSS styles for zen-theme and zen-welcome; improve responsiveness and adjust icon sizes

This commit is contained in:
mr. M 2025-02-19 10:09:00 +01:00
parent 0f442ae743
commit cc52ec2b71
No known key found for this signature in database
GPG key ID: CBD57A2AEDBDA1FB
4 changed files with 17 additions and 6 deletions

View file

@ -138,9 +138,6 @@
--fp-contextmenu-menuitem-border-radius: calc(4px + var(--fp-contextmenu-menuitem-border-width)); --fp-contextmenu-menuitem-border-radius: calc(4px + var(--fp-contextmenu-menuitem-border-width));
--fp-contextmenu-menuitem-padding-block: 6px; --fp-contextmenu-menuitem-padding-block: 6px;
--fp-contextmenu-menuitem-padding-inline: 10px; --fp-contextmenu-menuitem-padding-inline: 10px;
@media (-moz-platform: windows) {
--fp-contextmenu-menuitem-padding-inline: 8px;
}
--fp-contextmenu-menuitem-border-width: 2px; --fp-contextmenu-menuitem-border-width: 2px;
--fp-contextmenu-menuicon-margin-inline: 12px; --fp-contextmenu-menuicon-margin-inline: 12px;
--fp-contextmenu-menuitem-margin-inline: calc(4px - var(--fp-contextmenu-menuitem-border-width)); --fp-contextmenu-menuitem-margin-inline: calc(4px - var(--fp-contextmenu-menuitem-border-width));

View file

@ -60,18 +60,30 @@
box-shadow: var(--zen-big-shadow); box-shadow: var(--zen-big-shadow);
/* Small screens */ /* Small screens */
@media (max-width: 800px) { @media (max-width: 1400px) {
width: 80%; width: 80%;
height: 80%; height: 80%;
} }
@media (max-width: 1200px) {
width: 90%;
height: 90%;
}
@media (max-width: 1000px) {
width: 100%;
height: 100%;
border-radius: 0px;
}
#zen-welcome-page-sidebar { #zen-welcome-page-sidebar {
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
padding: 3.8rem; padding: 3.8rem;
width: 40%; width: 40%;
height: 100%; height: 100%;
overflow: hidden; overflow-x: hidden;
overflow-y: auto;
& #zen-welcome-heart { & #zen-welcome-heart {
width: 100%; width: 100%;

View file

@ -100,6 +100,7 @@
async _refreshPinnedTabs({ init = false } = {}) { async _refreshPinnedTabs({ init = false } = {}) {
await ZenWorkspaces.promiseSectionsInitialized; await ZenWorkspaces.promiseSectionsInitialized;
await SessionStore.promiseAllWindowsRestored;
await this._initializePinsCache(); await this._initializePinsCache();
await this._initializePinnedTabs(init); await this._initializePinnedTabs(init);
} }
@ -565,6 +566,7 @@
} }
gBrowser.pinTab(tab); gBrowser.pinTab(tab);
this.onTabIconChanged(tab); this.onTabIconChanged(tab);
this._onTabMove(tab);
} }
gZenUIManager.updateTabsToolbar(); gZenUIManager.updateTabsToolbar();
} }

View file

@ -637,7 +637,7 @@
#PanelUI-history toolbarbutton, #PanelUI-history toolbarbutton,
#unified-extensions-context-menu menuitem { #unified-extensions-context-menu menuitem {
background-image: var(--menu-image) !important; background-image: var(--menu-image) !important;
background-size: 20px !important; background-size: 16px !important;
background-position: var(--fp-contextmenu-menuitem-padding-inline) center !important; background-position: var(--fp-contextmenu-menuitem-padding-inline) center !important;
background-repeat: no-repeat !important; background-repeat: no-repeat !important;
-moz-context-properties: fill, fill-opacity !important; -moz-context-properties: fill, fill-opacity !important;