mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2026-08-26 08:21:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: Apply essentials icons to the entire tab to avoid removing the background when cloning, b=no-bug, c=tabs, welcome, workspaces

Browse Source
This commit is contained in:
mr. m
2025-06-09 01:12:22 +02:00
parent 872f7bdcbe
commit ba4eef0db9
5 changed files with 13 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/zen/welcome/ZenWelcome.mjs
View File

@@ -537,47 +537,47 @@
<html:div></html:div>
</hbox>
<html:div id="zen-welcome-initial-essentials-browser-sidebar-essentials">
<html:div class="tabbrowser-tab" fadein="" data-url="https://obsidian.md" style="--zen-tab-icon: url('chrome://browser/content/zen-images/favicons/obsidian.ico');">
<html:div class="tabbrowser-tab" fadein="" data-url="https://obsidian.md" style="--zen-essential-tab-icon: url('chrome://browser/content/zen-images/favicons/obsidian.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://discord.com" style="--zen-tab-icon: url('chrome://browser/content/zen-images/favicons/discord.ico');">
<html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://discord.com" style="--zen-essential-tab-icon: url('chrome://browser/content/zen-images/favicons/discord.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" data-url="https://trello.com" style="--zen-tab-icon: url('chrome://browser/content/zen-images/favicons/trello.ico');">
<html:div class="tabbrowser-tab" fadein="" data-url="https://trello.com" style="--zen-essential-tab-icon: url('chrome://browser/content/zen-images/favicons/trello.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" data-url="https://slack.com/" style="--zen-tab-icon: url('chrome://browser/content/zen-images/favicons/slack.ico');">
<html:div class="tabbrowser-tab" fadein="" data-url="https://slack.com/" style="--zen-essential-tab-icon: url('chrome://browser/content/zen-images/favicons/slack.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://github.com" style="--zen-tab-icon: url('chrome://browser/content/zen-images/favicons/github.ico');">
<html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://github.com" style="--zen-essential-tab-icon: url('chrome://browser/content/zen-images/favicons/github.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" data-url="https://twitter.com" style="--zen-tab-icon: url('chrome://browser/content/zen-images/favicons/x.ico');">
<html:div class="tabbrowser-tab" fadein="" data-url="https://twitter.com" style="--zen-essential-tab-icon: url('chrome://browser/content/zen-images/favicons/x.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://notion.com" style="--zen-tab-icon: url('chrome://browser/content/zen-images/favicons/notion.ico');">
<html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://notion.com" style="--zen-essential-tab-icon: url('chrome://browser/content/zen-images/favicons/notion.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" data-url="https://calendar.google.com" style="--zen-tab-icon: url('chrome://browser/content/zen-images/favicons/calendar.ico');">
<html:div class="tabbrowser-tab" fadein="" data-url="https://calendar.google.com" style="--zen-essential-tab-icon: url('chrome://browser/content/zen-images/favicons/calendar.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" data-url="https://figma.com" style="--zen-tab-icon: url('chrome://browser/content/zen-images/favicons/figma.ico');">
<html:div class="tabbrowser-tab" fadein="" data-url="https://figma.com" style="--zen-essential-tab-icon: url('chrome://browser/content/zen-images/favicons/figma.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
@@ -624,7 +624,7 @@
inBackground: true,
createLazyBrowser: true,
});
let essentialIconUrl = tab.style.getPropertyValue('--zen-tab-icon');
let essentialIconUrl = tab.style.getPropertyValue('--zen-essential-tab-icon');
// Remove url() from the icon URL
essentialIconUrl = essentialIconUrl.replace(/url\(['"]?/, '').replace(/['"]?\)/, '');
essentialIconUrl = await getIconData(essentialIconUrl);

2
src/zen/welcome/zen-welcome.css
View File

@@ -273,7 +273,7 @@
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: var(--zen-tab-icon);
background: var(--zen-essential-tab-icon);
background-position: center;
background-size: cover;
background-repeat: no-repeat;