mirror of
https://github.com/zen-browser/desktop.git
synced 2025-07-10 15:55:30 +02:00
chore: Update theme pill-button default value and styles
This commit is contained in:
parent
26b633553c
commit
9c6b0912a5
12 changed files with 47 additions and 17 deletions
1
.github/workflows/src/alpha-build.sh
vendored
1
.github/workflows/src/alpha-build.sh
vendored
|
@ -1,5 +1,6 @@
|
||||||
set -ex
|
set -ex
|
||||||
|
|
||||||
|
export ZEN_RELEASE=1
|
||||||
|
|
||||||
if command -v apt-get &> /dev/null
|
if command -v apt-get &> /dev/null
|
||||||
then
|
then
|
||||||
|
|
|
@ -64,6 +64,7 @@ pref('zen.welcomeScreen.seen', false);
|
||||||
pref('zen.tabs.vertical', true);
|
pref('zen.tabs.vertical', true);
|
||||||
pref('zen.theme.accent-color', "#aac7ff");
|
pref('zen.theme.accent-color', "#aac7ff");
|
||||||
pref('zen.theme.toolbar-themed', true);
|
pref('zen.theme.toolbar-themed', true);
|
||||||
|
pref('zen.theme.pill-button', false);
|
||||||
pref('zen.view.compact', false);
|
pref('zen.view.compact', false);
|
||||||
pref('zen.view.sidebar-expanded', false);
|
pref('zen.view.sidebar-expanded', false);
|
||||||
pref('zen.view.sidebar-expanded.show-button', true);
|
pref('zen.view.sidebar-expanded.show-button', true);
|
||||||
|
|
|
@ -70,8 +70,6 @@ var ZenThemeModifier = {
|
||||||
updateExtraBrowserStyles() {
|
updateExtraBrowserStyles() {
|
||||||
// If we are in the main browser window, we can add some extra styles.
|
// If we are in the main browser window, we can add some extra styles.
|
||||||
if (!this._inMainBrowserWindow) return;
|
if (!this._inMainBrowserWindow) return;
|
||||||
document.documentElement.style.setProperty("--zen-appcontent-separator-from-window-single", "0px");
|
|
||||||
document.documentElement.style.setProperty("--zen-appcontent-border-radius", "0px");
|
|
||||||
this._changeSidebarLocation();
|
this._changeSidebarLocation();
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -178,7 +176,7 @@ var ZenThemeModifier = {
|
||||||
if (document.documentElement.hasAttribute("privatebrowsingmode")) {
|
if (document.documentElement.hasAttribute("privatebrowsingmode")) {
|
||||||
avatarUrl = "chrome://global/skin/icons/indicator-private-browsing.svg";
|
avatarUrl = "chrome://global/skin/icons/indicator-private-browsing.svg";
|
||||||
}
|
}
|
||||||
console.log("ZenThemeModifier: setting avatar image to", avatarUrl);
|
// console.log("ZenThemeModifier: setting avatar image to", avatarUrl);
|
||||||
mainWindowEl.style.setProperty("--zen-avatar-image-url", `url(${avatarUrl})`);
|
mainWindowEl.style.setProperty("--zen-avatar-image-url", `url(${avatarUrl})`);
|
||||||
mainWindowEl.style.setProperty("--avatar-image-url", `var(--zen-avatar-image-url)`, "important");
|
mainWindowEl.style.setProperty("--avatar-image-url", `var(--zen-avatar-image-url)`, "important");
|
||||||
},
|
},
|
||||||
|
|
|
@ -0,0 +1,13 @@
|
||||||
|
diff --git a/browser/components/newtab/content-src/components/Search/_Search.scss b/browser/components/newtab/content-src/components/Search/_Search.scss
|
||||||
|
index 8ee4f7f13276c0aabcb1dd131307cbc6d0907fbf..dd3e22740cd4dcbb6a4b974165c3ccd1cd9cec70 100644
|
||||||
|
--- a/browser/components/newtab/content-src/components/Search/_Search.scss
|
||||||
|
+++ b/browser/components/newtab/content-src/components/Search/_Search.scss
|
||||||
|
@@ -17,6 +17,8 @@ $glyph-forward: url('chrome://browser/skin/forward.svg');
|
||||||
|
$logo-size: 82px;
|
||||||
|
$wordmark-size: 134px;
|
||||||
|
|
||||||
|
+ display: none;
|
||||||
|
+
|
||||||
|
align-items: center;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
|
@ -83,5 +83,10 @@ Preferences.addAll([
|
||||||
id: "zen.view.sidebar-expanded",
|
id: "zen.view.sidebar-expanded",
|
||||||
type: "bool",
|
type: "bool",
|
||||||
default: true,
|
default: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "zen.theme.pill-button",
|
||||||
|
type: "bool",
|
||||||
|
default: true,
|
||||||
}
|
}
|
||||||
]);
|
]);
|
||||||
|
|
|
@ -24,6 +24,13 @@
|
||||||
<checkbox id="zenLooksAndFeelUseThemedToolbar"
|
<checkbox id="zenLooksAndFeelUseThemedToolbar"
|
||||||
data-l10n-id="zen-look-and-feel-compact-view-enabled"
|
data-l10n-id="zen-look-and-feel-compact-view-enabled"
|
||||||
preference="zen.view.compact"/>
|
preference="zen.view.compact"/>
|
||||||
|
|
||||||
|
<label><html:h2 data-l10n-id="zen-look-and-feel-buttons-header"/></label>
|
||||||
|
<description class="description-deemphasized" data-l10n-id="zen-look-and-feel-buttons-description" />
|
||||||
|
|
||||||
|
<checkbox id="zenLooksAndFeelPilledButtons"
|
||||||
|
data-l10n-id="zen-look-and-feel-pilled-buttons"
|
||||||
|
preference="zen.theme.pill-button"/>
|
||||||
</groupbox>
|
</groupbox>
|
||||||
|
|
||||||
<hbox id="zenSidePanelsCategory"
|
<hbox id="zenSidePanelsCategory"
|
||||||
|
|
|
@ -21,7 +21,11 @@ zen-look-and-feel-compact-view-description = Only show the toolbars you use!
|
||||||
zen-look-and-feel-compact-view-enabled =
|
zen-look-and-feel-compact-view-enabled =
|
||||||
.label = Enable { -brand-short-name }'s compact mode
|
.label = Enable { -brand-short-name }'s compact mode
|
||||||
|
|
||||||
|
zen-look-and-feel-buttons-header = Button style
|
||||||
|
zen-look-and-feel-buttons-description = Choose the style of buttons you want to see
|
||||||
|
|
||||||
|
zen-look-and-feel-pilled-buttons =
|
||||||
|
.label = Pilled Buttons
|
||||||
|
|
||||||
pane-zen-workspaces-title = Workspaces
|
pane-zen-workspaces-title = Workspaces
|
||||||
category-zen-workspaces =
|
category-zen-workspaces =
|
||||||
|
|
|
@ -24,6 +24,8 @@
|
||||||
--input-bgcolor: var(--zen-colors-tertiary) !important;
|
--input-bgcolor: var(--zen-colors-tertiary) !important;
|
||||||
--input-border-color: var(--zen-input-border-color) !important;
|
--input-border-color: var(--zen-input-border-color) !important;
|
||||||
--zen-themed-toolbar-bg: var(--zen-colors-tertiary);
|
--zen-themed-toolbar-bg: var(--zen-colors-tertiary);
|
||||||
|
|
||||||
|
--toolbar-field-background-color: var(--zen-colors-input-bg) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media not (-moz-bool-pref: "zen.theme.toolbar-themed") {
|
@media not (-moz-bool-pref: "zen.theme.toolbar-themed") {
|
||||||
|
@ -209,13 +211,13 @@ button.popup-notification-dropmarker {
|
||||||
|
|
||||||
#navigator-toolbox {
|
#navigator-toolbox {
|
||||||
min-width: 55px;
|
min-width: 55px;
|
||||||
|
max-width: 55px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#navigator-toolbox toolbar#TabsToolbar {
|
#navigator-toolbox toolbar#TabsToolbar {
|
||||||
margin: var(--zen-appcontent-separator-from-window);
|
margin: var(--zen-appcontent-separator-from-window);
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
transition: .2s;
|
transition: .2s;
|
||||||
border-radius: var(--zen-appcontent-border-radius) !important;
|
|
||||||
flex-direction: column !important;
|
flex-direction: column !important;
|
||||||
padding: 5px 0;
|
padding: 5px 0;
|
||||||
margin-right: 0 !important;
|
margin-right: 0 !important;
|
||||||
|
|
|
@ -2,10 +2,7 @@
|
||||||
@import url("zen-fullscreen-override.css");
|
@import url("zen-fullscreen-override.css");
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--zen-main-browser-background: red;
|
--zen-main-browser-background: transparent;
|
||||||
--zen-appcontent-separator-from-window-single: 7px;
|
|
||||||
--zen-appcontent-separator-from-window: var(--zen-appcontent-separator-from-window-single);
|
|
||||||
--zen-appcontent-border-radius: var(--zen-panel-radius);
|
|
||||||
--zen-appcontent-border: 1px solid var(--zen-colors-border);
|
--zen-appcontent-border: 1px solid var(--zen-colors-border);
|
||||||
--zen-browser-border-radius: var(--zen-panel-radius);
|
--zen-browser-border-radius: var(--zen-panel-radius);
|
||||||
}
|
}
|
||||||
|
@ -24,9 +21,7 @@ html#main-window > body {
|
||||||
}
|
}
|
||||||
|
|
||||||
:not([inDOMFullscreen="true"]) #appcontent {
|
:not([inDOMFullscreen="true"]) #appcontent {
|
||||||
border-radius: var(--zen-appcontent-border-radius);
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin: var(--zen-appcontent-separator-from-window);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#appcontent {
|
#appcontent {
|
||||||
|
|
|
@ -8,13 +8,13 @@
|
||||||
xul|button {
|
xul|button {
|
||||||
border-radius: var(--zen-button-border-radius) !important;
|
border-radius: var(--zen-button-border-radius) !important;
|
||||||
padding: var(--zen-button-padding) !important;
|
padding: var(--zen-button-padding) !important;
|
||||||
transition: .2s;
|
transition: .1s;
|
||||||
min-width: 100px !important;
|
min-width: 100px !important;
|
||||||
font-weight: 500 !important;
|
font-weight: 500 !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
button:active {
|
button:active {
|
||||||
transform: scale(0.97);
|
transform: scale(0.95);
|
||||||
}
|
}
|
||||||
|
|
||||||
html|button:not(:is(
|
html|button:not(:is(
|
||||||
|
|
|
@ -74,7 +74,7 @@
|
||||||
--in-content-page-background: var(--zen-colors-tertiary) !important;
|
--in-content-page-background: var(--zen-colors-tertiary) !important;
|
||||||
--zen-in-content-dialog-background: var(--zen-colors-tertiary);
|
--zen-in-content-dialog-background: var(--zen-colors-tertiary);
|
||||||
|
|
||||||
--zen-button-border-radius: 8px;
|
--zen-button-border-radius: 7px;
|
||||||
--zen-button-padding: .6rem 1.2rem;
|
--zen-button-padding: .6rem 1.2rem;
|
||||||
|
|
||||||
/* Other colors */
|
/* Other colors */
|
||||||
|
@ -82,8 +82,6 @@
|
||||||
--zen-input-border-color: light-dark(rgb(204, 204, 204), rgb(66, 65, 77)) !important;
|
--zen-input-border-color: light-dark(rgb(204, 204, 204), rgb(66, 65, 77)) !important;
|
||||||
|
|
||||||
--zen-browser-gradient-base: color-mix(in srgb, var(--zen-primary-color) 50%, white 50%);
|
--zen-browser-gradient-base: color-mix(in srgb, var(--zen-primary-color) 50%, white 50%);
|
||||||
|
|
||||||
/* TODO: Support dark themes! */
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
@media (prefers-color-scheme: dark) {
|
||||||
|
@ -112,3 +110,9 @@ window#commonDialogWindow {
|
||||||
background-color: var(--zen-in-content-dialog-background) !important;
|
background-color: var(--zen-in-content-dialog-background) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (-moz-bool-pref: "zen.theme.pill-button") {
|
||||||
|
:host(:is(.anonymous-content-host, notification-message)),
|
||||||
|
:root {
|
||||||
|
--zen-button-border-radius: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -2,11 +2,11 @@
|
||||||
@import url("./in-content/zen-common-shared.css");
|
@import url("./in-content/zen-common-shared.css");
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--zen-panel-radius: 15px;
|
--zen-panel-radius: 9px;
|
||||||
|
|
||||||
--arrowpanel-background: var(--zen-dialog-background) !important;
|
--arrowpanel-background: var(--zen-dialog-background) !important;
|
||||||
--arrowpanel-border-color: var(--zen-dialog-border-color) !important;
|
--arrowpanel-border-color: var(--zen-dialog-border-color) !important;
|
||||||
--arrowpanel-border-radius: 12px !important;
|
--arrowpanel-border-radius: var(--zen-panel-radius) !important;
|
||||||
|
|
||||||
&:-moz-lwtheme {
|
&:-moz-lwtheme {
|
||||||
color: var(--lwt-text-color);
|
color: var(--lwt-text-color);
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue