diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml new file mode 100644 index 0000000..3bbad13 --- /dev/null +++ b/.github/FUNDING.yml @@ -0,0 +1,17 @@ +# These are supported funding model platforms + +## Example +# https://docs.github.com/en/repositories/managing-your-repositorys-settings-and-features/customizing-your-repository/displaying-a-sponsor-button-in-your-repository +# github: # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2] +# patreon: # Replace with a single Patreon username +# open_collective: # Replace with a single Open Collective username +# ko_fi: # Replace with a single Ko-fi username +# tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel +# community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry +# liberapay: # Replace with a single Liberapay username +# issuehunt: # Replace with a single IssueHunt username +# otechie: # Replace with a single Otechie username +# lfx_crowdfunding: # Replace with a single LFX Crowdfunding project-name e.g., cloud-foundry +# custom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2'] + +github: [black7375] diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 260829a..06d708a 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -41,21 +41,3 @@ jobs: - name: Test run: yarn test - - prettier: - runs-on: ubuntu-latest - - steps: - - name: Checkout - uses: actions/checkout@v2 - with: - # Make sure the actual branch is checked out when running on pull requests - ref: ${{ github.head_ref }} - - - name: Prettify code - uses: creyD/prettier_action@v4.1.1 - with: - # This part is also where you can pass other options, for example: - prettier_options: --write . - only_changed: True - commit_message: "Clean: Prettified Code!" diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index 3747116..9788e49 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -55,12 +55,20 @@ jobs: - name: Release Structure run: | + # Remove unnecessary files + rm -rf ./.git ./.github ./__tests__ ./docs ./src + rm -rf ./.gitattributes ./.gitignore ./.prettierignore ./.prettierrc.json + rm -rf ./package.json ./yarn.lock ./waterfox.sh + rm -rf ./CODE_OF_CONDUCT.md ./CONTRIBUTING.md ./README.org + + # Move to ./chrome/ mkdir -v chrome shopt -s extglob - mv -v !(chrome|user.js|install.sh) chrome/ + mv -v !(chrome|CREDITS|LICENSE|user.js|install.sh|install.ps1) chrome/ - zip -rv ${{ matrix.name }}.zip chrome user.js install.sh + # Zip files + zip -rv ${{ matrix.name }}.zip chrome CREDITS LICENSE user.js install.sh install.ps1 - uses: softprops/action-gh-release@v1 # actions/create-release, actions/upload-release-asset is deprecated if: startsWith(github.ref, 'refs/tags/') diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..e79a5cb --- /dev/null +++ b/.gitignore @@ -0,0 +1,130 @@ +# See https://help.github.com/articles/ignoring-files/ for more about ignoring files. + +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +lerna-debug.log* +.pnpm-debug.log* + +# Diagnostic reports (https://nodejs.org/api/report.html) +report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json + +# Runtime data +pids +*.pid +*.seed +*.pid.lock + +# Directory for instrumented libs generated by jscoverage/JSCover +lib-cov + +# Coverage directory used by tools like istanbul +coverage +*.lcov + +# nyc test coverage +.nyc_output + +# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) +.grunt + +# Bower dependency directory (https://bower.io/) +bower_components + +# node-waf configuration +.lock-wscript + +# Compiled binary addons (https://nodejs.org/api/addons.html) +build/Release + +# Dependency directories +node_modules/ +jspm_packages/ + +# TypeScript v1 declaration files +typings/ + +# TypeScript cache +*.tsbuildinfo + +# Optional npm cache directory +.npm + +# Optional eslint cache +.eslintcache + +# Microbundle cache +.rpt2_cache/ +.rts2_cache_cjs/ +.rts2_cache_es/ +.rts2_cache_umd/ + +# Optional REPL history +.node_repl_history + +# Output of 'npm pack' +*.tgz + +# Yarn Integrity file +.yarn-integrity + +# dotenv environment variables file +.env +.env.test +.env.local +.env.development.local +.env.test.local +.env.production.local + +# parcel-bundler cache (https://parceljs.org/) +.cache + +# Next.js build output +.next +out +build + +# Nuxt.js build / generate output +.nuxt +dist + +# Gatsby files +.cache/ +# Comment in the public line in if your project uses Gatsby and *not* Next.js +# https://nextjs.org/blog/next-9-1#public-directory-support +# public + +# vuepress build output +.vuepress/dist + +# Serverless directories +.serverless/ + +# FuseBox cache +.fusebox/ + +# DynamoDB Local files +.dynamodb/ + +# TernJS port file +.tern-port + +# Zero install +# .pnp.* # If not zero install +.yarn/* +!.yarn/cache +!.yarn/patches +!.yarn/plugins +!.yarn/releases +!.yarn/sdks +!.yarn/versions + +# Turborepo +.turbo + +# misc +.DS_Store +*.pem diff --git a/.prettierignore b/.prettierignore index 682b771..64a1b0a 100644 --- a/.prettierignore +++ b/.prettierignore @@ -5,7 +5,7 @@ # User.js user.js -# Prettier error exeption +# Prettier error exception src/utils/_each.scss # [error] src/utils/_each.scss: SyntaxError: CssSyntaxError: At-rule without name (28:7) # [error] 26 | } diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 282649a..a7abba4 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -90,7 +90,7 @@ Even if you copy the code snippet, it is recommended that you leave a link. **FAQ** -If you have any questions about other licenses, please see [Moailla's MPL 2.0 FAQ](https://www.mozilla.org/en-US/MPL/2.0/FAQ/). +If you have any questions about other licenses, please see [Mozilla's MPL 2.0 FAQ](https://www.mozilla.org/en-US/MPL/2.0/FAQ/). ## References diff --git a/CREDITS b/CREDITS index fe8b8b5..5041612 100644 --- a/CREDITS +++ b/CREDITS @@ -19,9 +19,23 @@ N: Yunsup Sim E: pedogunu@gmail.com W: https://ethansup.net +---------- + Sponsors + +N: Jani Haiko +E: haiko.jani@gmail.com +W: https://github.com/ojaha065 + +N: nikkehtine +E: nikkehtine@int.pl +W: https://github.com/nikkehtine + ---------- Contributors +N: 2641a40fd44383320adde4b027a1d0b03bd550 +W: https://github.com/2641a40fd44383320adde4b027a1d0b03bd550 + N: 7k5x E: 7k5xlp0onfire@gmail.com W: https://github.com/7k5x @@ -30,6 +44,9 @@ N: Ajith-stark E: ajith.kum.12342@gmail.com W: https://github.com/Ajith-stark +N: akay +W: https://github.com/akay + N: Andmagdo W: https://github.com/andmagdo @@ -89,6 +106,9 @@ N: Roel E: Nyubis@gmail.com W: https://github.com/Nyubis +N: roland-rollo +W: https://github.com/roland-rollo + N: SanderTheDragon E: sanderthedragon@zoho.com W: https://gitlab.com/SanderTheDragon @@ -126,6 +146,11 @@ W: https://gist.github.com/mmis1000/08d8de4bbe70c04423f0b966bcc286b1 C: Copyright (c) 2021 Mmis1000 L: MIT +N: edge-frfox +W: https://github.com/bmFtZQ/edge-frfox +C: Copyright (c) 2021 bmFtZQ +L: MIT + N: Feather W: https://github.com/feathericons/feather C: Copyright (c) 2013-2017 Cole Bemis @@ -216,3 +241,8 @@ N: Waterfox W: https://github.com/WaterfoxCo/Waterfox C: Copyright (c) 2012 Waterfox Limited L: MPL 2.0 + +N: WaveFox +W: https://github.com/QNetITQ/WaveFox +C: Copyright (c) 2021 QNetITQ +L: MIT diff --git a/README.org b/README.org index 197f3c1..e2a2181 100644 --- a/README.org +++ b/README.org @@ -18,14 +18,14 @@ ----- -🔔🔔 Did you set a custom, but not work? +🔔🔔 Does the theme not work after installation? You should copy [[./user.js][ ~user.js~ ]] file before the theme works. The option system depends on user configuration, and nothing applies without settings. \\ -Also, real-time changes are difficult for [[./docs/Restrictions.md#supports][technical limitations]] and require restarts. +Also, real-time changes are difficult because of [[./docs/Restrictions.md#supports][technical limitations]] and require a restart. -Some settings [[https://github.com/black7375/Firefox-UI-Fix/wiki/Options#using-userjs][can be conflict]] and should be explicitly =false=. +Some settings [[https://github.com/black7375/Firefox-UI-Fix/wiki/Options#using-userjs][can be conflicted]] and should be explicitly set to =false=. ----- @@ -39,8 +39,8 @@ Some settings [[https://github.com/black7375/Firefox-UI-Fix/wiki/Options#using-u Lepton's photon styled is preserve Photon's feeling while keep [[https://github.com/black7375/Firefox-UI-Fix][Original Lepton]].'s strengths. /Disclaimer:/ It works on *Firefox 89* and above!! - | *Wiki* | | | | | - | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Installation-Guide][Installation Guide]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Screenshots][Screenshots]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Options][Options]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Compatibility-Issues-Solution][Compatibility Issues Solution]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Tips][Tips]] | + | *Wiki* | | | | | | | + | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Installation-Guide][Installation Guide]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Screenshots][Screenshots]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Tutorial][Tutorial]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Options][Options]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Compatibility-Issues-Solution][Compatibility Issues Solution]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Tips][Tips]] | [[https://github.com/black7375/Firefox-UI-Fix/wiki/Show-Off-Your-Config][Show Off Your Config]] | [[https://user-images.githubusercontent.com/25581533/120091976-41ea4e00-c0ff-11eb-88ca-a204cfcebe72.png]] @@ -52,10 +52,8 @@ Some settings [[https://github.com/black7375/Firefox-UI-Fix/wiki/Options#using-u - Default light/dark theme contrast enhancement - Colorful context menu - More dark mode support - - GTK system theme support - - Windows system theme support - - Mac system theme support - - Windows7 compatibility + - Windows/Mac/Linux system theme support + - Windows 7 compatibility - *Icons* - Panel: like Photon - Context Menu @@ -68,13 +66,13 @@ Some settings [[https://github.com/black7375/Firefox-UI-Fix/wiki/Options#using-u - Menu - Density - Others... - - *Tabbar Layouts* + - *Tab Bar Layouts* - Tabs on Bottom - One Liner - Vertical Tab Support - *Tab Design* - General: - - Connect with toolbar(Buttons like tabs): like Photon + - Connect with toolbar (buttons like tabs): like Photon - Selected: - Context Line: like Photon - Bottom Rounding: Natural @@ -100,7 +98,7 @@ Some settings [[https://github.com/black7375/Firefox-UI-Fix/wiki/Options#using-u - Focused Shadow: Same as the accent color - Hand off to Awesomebar - Icons: - - Size: Fill(Changes dynamically to your size) + - Size: Fill (Changes dynamically to your size) - *Error Page Design* - Illustrations: Restore error page illustrations - *Video Player* @@ -118,9 +116,9 @@ Some settings [[https://github.com/black7375/Firefox-UI-Fix/wiki/Options#using-u ** Installation Guide - *Script Installation (experimental)* + *Installation script (experimental)* - Linux, mac users: + Linux/Mac users: #+BEGIN_SRC bash bash -c "$(curl -fsSL https://raw.githubusercontent.com/black7375/Firefox-UI-Fix/master/install.sh)" #+END_SRC @@ -135,8 +133,8 @@ Windows users: Run with powershell ([[https://github.com/black7375/Firefox-UI-Fi You can see the [[https://github.com/black7375/Firefox-UI-Fix/wiki/Installation-Guide][installation guide]] with screenshots on the wiki. 1. Download files - - Click the green ":arrow_down: Code"-button above - - Select ":package: Download Zip" + - Click the green ":arrow_down: Code" button above + - Select ":package: Download ZIP" 2. Find your profile directory - Open =about:support= in a new tab - Find the =Profile Folder= entry and click the =Open Folder= button diff --git a/__tests__/_has.test.scss b/__tests__/_has.test.scss new file mode 100644 index 0000000..57837b1 --- /dev/null +++ b/__tests__/_has.test.scss @@ -0,0 +1,34 @@ +@use "true" as *; +@use "example" as *; +@use "../src/utils/has" as *; + +@include test-module("`:has()` selector test [mix]") { + @include test("exist `:has()`") { + @include assert { + @include output { + @include Has { + @include example; + } + } + @include expect { + @supports selector(:has(a)) { + @include example; + } + } + } + } + @include test("don't exist `:has()`") { + @include assert { + @include output { + @include NotHas { + @include example; + } + } + @include expect { + @supports not selector(:has(a)) { + @include example; + } + } + } + } +} diff --git a/__tests__/accent_color.test.scss b/__tests__/accent_color.test.scss index fe22ef8..206760e 100644 --- a/__tests__/accent_color.test.scss +++ b/__tests__/accent_color.test.scss @@ -59,4 +59,28 @@ } } } + @include test("Highlight") { + @include assert { + @include output { + @include AccentColor("Highlight") { + body { + background-color: $accentColor; + color: $accentTextColor; + } + } + } + @include expect { + body { + background-color: AccentColor; + color: AccentColorText; + } + @supports -moz-bool-pref("userChrome.compatibility.accent_color") { + body { + background-color: Highlight; + color: HighlightText; + } + } + } + } + } } diff --git a/__tests__/color_scheme.test.scss b/__tests__/color_scheme.test.scss index 1a89859..1555ab1 100644 --- a/__tests__/color_scheme.test.scss +++ b/__tests__/color_scheme.test.scss @@ -1,4 +1,4 @@ -@use 'true' as *; +@use "true" as *; @use "example" as *; @use "../src/utils/color_scheme"; diff --git a/__tests__/each.test.scss b/__tests__/each.test.scss index 353d93d..9838760 100644 --- a/__tests__/each.test.scss +++ b/__tests__/each.test.scss @@ -1,4 +1,4 @@ -@use 'true' as *; +@use "true" as *; @use "example" as *; @use "../src/utils/each"; @@ -68,7 +68,7 @@ @include test("prefix custom option") { @include assert { @include output { - @include each.AtEach("supports", "userChrome.tab.photon", "-moz-bool-pref", ("seperator": " or ", "quoted": true)) { + @include each.AtEach("supports", "userChrome.tab.photon", "-moz-bool-pref", ("separator": " or ", "quoted": true)) { @include example; } } @@ -84,7 +84,7 @@ @include assert { @include output { $input: "userChrome.tab.photon" "userChrome.padding.photon"; - @include each.AtEach("supports", $input, "-moz-bool-pref", ("seperator": " or ", "quoted": true)) { + @include each.AtEach("supports", $input, "-moz-bool-pref", ("separator": " or ", "quoted": true)) { @include example; } } diff --git a/__tests__/list.test.scss b/__tests__/list.test.scss index 751ac07..85d920d 100644 --- a/__tests__/list.test.scss +++ b/__tests__/list.test.scss @@ -1,4 +1,4 @@ -@use 'true' as *; +@use "true" as *; @use "../src/utils/list"; // TODO: Need more tests.. diff --git a/__tests__/media.test.scss b/__tests__/media.test.scss index e65a57b..fd53b2f 100644 --- a/__tests__/media.test.scss +++ b/__tests__/media.test.scss @@ -1,4 +1,4 @@ -@use 'true' as *; +@use "true" as *; @use "example" as *; @use "../src/utils/media"; diff --git a/__tests__/native_menu.test.scss b/__tests__/native_menu.test.scss index aeefbe7..05e6f44 100644 --- a/__tests__/native_menu.test.scss +++ b/__tests__/native_menu.test.scss @@ -1,4 +1,4 @@ -@use 'true' as *; +@use "true" as *; @use "example" as *; @use "../src/utils/native_menu"; diff --git a/__tests__/one_liner.test.scss b/__tests__/one_liner.test.scss index e59f49d..b410737 100644 --- a/__tests__/one_liner.test.scss +++ b/__tests__/one_liner.test.scss @@ -1,4 +1,4 @@ -@use 'true' as *; +@use "true" as *; @use "example" as *; @use "../src/utils/one_liner"; diff --git a/__tests__/option.test.scss b/__tests__/option.test.scss index d9ff029..5cf2a6d 100644 --- a/__tests__/option.test.scss +++ b/__tests__/option.test.scss @@ -1,4 +1,4 @@ -@use 'true' as *; +@use "true" as *; @use "example" as *; @use "../src/utils/option"; diff --git a/__tests__/os.test.scss b/__tests__/os.test.scss index 6b90fab..7294c84 100644 --- a/__tests__/os.test.scss +++ b/__tests__/os.test.scss @@ -1,4 +1,4 @@ -@use 'true' as *; +@use "true" as *; @use "example" as *; @use "../src/utils/os" as *; diff --git a/__tests__/theme.test.scss b/__tests__/theme.test.scss index 579e536..0e964c8 100644 --- a/__tests__/theme.test.scss +++ b/__tests__/theme.test.scss @@ -1,4 +1,4 @@ -@use 'true' as *; +@use "true" as *; @use "example" as *; @use "sass:selector"; @use "../src/utils/theme"; diff --git a/css/leptonChrome.css b/css/leptonChrome.css index 06f3a6c..40a3f0d 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -1,14 +1,13 @@ +@charset "UTF-8"; @namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"; @namespace html "http://www.w3.org/1999/xhtml"; -/** Default Thme - Contrast ***************************************************/ +/** Default Theme - Contrast **************************************************/ @supports -moz-bool-pref("userChrome.theme.built_in_contrast") { /*= Lightmode - Color darker =================================================*/ :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]), :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] { - --lwt-accent-color: rgb(229, 229, 235) !important; - /* Original: rgb(240, 240, 244) */ + --lwt-accent-color: rgb(229, 229, 235) !important; /* Original: rgb(240, 240, 244) */ } - @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]) #navigator-toolbox, :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"] #navigator-toolbox { @@ -24,8 +23,7 @@ /*= Darkmode - Color lighter =================================================*/ :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] { - --toolbar-bgcolor: rgba(43, 42, 51, 5) !important; - /* Original: rgba(43, 42, 51, 1) */ + --toolbar-bgcolor: rgba(43, 42, 51, 5) !important; /* Original: rgba(43, 42, 51, 1) */ } } /** Compatibility Fixes *******************************************************/ @@ -37,24 +35,20 @@ margin-inline: 8px; border-radius: 4px; } - /*= Remote Tabs Panel's Bottom Padding =======================================*/ #PanelUI-remotetabs #PanelUI-remotetabs-main { margin-bottom: 6px; } - /*= Identity Popup Icon Crop =================================================*/ .identity-popup-security-connection.identity-button { padding-block: 1px !important; } - /*= Zoom in button's plus icon horizontal rate ===============================*/ #customization-palette-container #zoom-in-button > .toolbarbutton-icon, #customization-panel-container #zoom-in-button > .toolbarbutton-icon, #widget-overflow-mainView #zoom-in-button > .toolbarbutton-icon { padding-inline-start: 0px !important; } - /*= Icon Fill Color ==========================================================*/ :root:-moz-lwtheme { /* Auto create --lwt-toolbarbutton-icon-fill-attention, fix for nightly default theme @@ -62,18 +56,15 @@ */ --lwt-toolbarbutton-icon-fill-attention: var(--button-primary-bgcolor, rgb(0, 120, 215)); } - /*= First visible tab margin at maximized #332 ===============================*/ :root[tabsintitlebar="true"][sizemode="maximized"] #TabsToolbar { margin-left: -1px; } - /*= Disabled menu background color ===========================================*/ menuitem[disabled="true"], menu[disabled="true"] { background-color: transparent !important; } - /*= Remove Tab Border ========================================================*/ @supports -moz-bool-pref("userChrome.tab.connect_to_window") { /* TARGET: original, photon */ @@ -87,25 +78,27 @@ .tabbrowser-tab:is([visuallyselected="true"], [multiselected]) > .tab-stack > .tab-background { - /* Nigtly 96: 1px solid var(--tab-line-color, rgba(128,128,142,0.9)); */ + /* Nightly 96: 1px solid var(--tab-line-color, rgba(128,128,142,0.9)); */ border: unset !important; } - #TabsToolbar #firefox-view-button[open] > .toolbarbutton-icon:-moz-lwtheme, .tab-background[selected]:-moz-lwtheme { outline-color: transparent !important; } - .keyboard-focused-tab > .tab-stack > .tab-background, .tabbrowser-tab:focus:not([aria-activedescendant]) > .tab-stack > .tab-background { outline: var(--focus-outline) !important; } } + /*= Tab Separator Color ======================================================*/ + #TabsToolbar, + #nav-bar { + --toolbarseparator-color: color-mix(in srgb, currentColor 20%, transparent); /* 60% at v105 */ + } /*= Light Weight Theme =======================================================*/ /* Header Image */ :root[lwtheme-image] { - background-image: var(--lwt-header-image) !important; - /* Original: var(--lwt-header-image) */ + background-image: var(--lwt-header-image) !important; /* Original: var(--lwt-header-image) */ background-repeat: no-repeat !important; background-position: right top !important; } @@ -123,21 +116,68 @@ background-image: var(--lwt-header-image), var(--lwt-additional-images) !important; background-repeat: var(--lwt-background-tiling) !important; background-position: var(--lwt-background-alignment) !important; - background-color: unset !important; - /* Original: var(--lwt-accent-color) */ + background-color: unset !important; /* Original: var(--lwt-accent-color) */ } - /* Navbar Border */ #navigator-toolbox:-moz-lwtheme { - --tabs-border-color: rgba(0, 0, 0, 0.3); - /* Legacy: v96 */ - --lwt-tabs-border-color: rgba(0, 0, 0, 0.3); + --tabs-border-color: rgba(0, 0, 0, 0.4); /* Legacy: v96, (0, 0, 0, 0.3) -> (0, 0, 0, 0.4) */ + --lwt-tabs-border-color: rgba(0, 0, 0, 0.4); } - /*= Findbar Border Color =====================================================*/ html|input.findbar-textbox { - border: 1px solid var(--input-border-color, var(--toolbar-field-border-color, ThreeDShadow)) !important; - /* Original: 1px solid var(--input-border-color, var(--toolbar-field-border-color)) */ + border: 1px solid var(--input-border-color, var(--toolbar-field-border-color, ThreeDShadow)) !important; /* Original: 1px solid var(--input-border-color, var(--toolbar-field-border-color)) */ + } + /*= Drop Indicator Color #473 ================================================*/ + treechildren::-moz-tree-cell-text(primary, dropOn), + treechildren::-moz-tree-drop-feedback, + vbox[part="drop-indicator-bar"] > image[part="drop-indicator"] { + background-color: var( + --button-primary-bgcolor, + var(--focus-outline-color) + ) !important; /* Original: SelectedItem or AccentColor*/ + } + #bookmarksPanel[lwt-sidebar="true"] { + --focus-outline-color: var(--in-content-focus-outline-color, AccentColor) !important; + } + /*= Menu color #477 ==========================================================*/ + @media (-moz-windows-non-native-menus) { + :root { + /* Override some menu color variables for light browser themes. */ + --menuitem-hover-background-color: #e0e0e6; + --menu-background-color: #f9f9fb; + --menu-color: #15141a; + --menuitem-disabled-hover-background-color: rgba(224, 224, 230, 0.4); + --menu-disabled-color: rgba(21, 20, 26, 0.4); + --menu-border-color: #cfcfd8; + --menu-icon-opacity: 0.7; + /* Declare menu colors for dark themes, but don't override anything yet. */ + --dark-menuitem-hover-background-color: #52525e; + --dark-menu-background-color: #2b2a33; + --dark-menu-color: #fbfbfe; + --dark-menuitem-disabled-hover-background-color: rgba(82, 82, 94, 0.4); + --dark-menu-disabled-color: rgba(251, 251, 254, 0.4); + --dark-menu-border-color: #5b5b66; + --dark-menu-icon-opacity: 1; + } + /* Override the menu color variables for dark browser themes. */ + } + @media (-moz-windows-non-native-menus) and (-moz-toolbar-prefers-color-scheme: dark), + (-moz-windows-non-native-menus) and (prefers-color-scheme: dark) { + :root { + --menuitem-hover-background-color: var(--dark-menuitem-hover-background-color); + --menu-background-color: var(--dark-menu-background-color); + --menu-color: var(--dark-menu-color); + --menuitem-disabled-hover-background-color: var(--dark-menuitem-disabled-hover-background-color); + --menu-disabled-color: var(--dark-menu-disabled-color); + --menu-border-color: var(--dark-menu-border-color); + --menu-icon-opacity: var(--dark-menu-icon-opacity); + } + } + /*= Firefox View Border #498 =================================================*/ + :root:not([privatebrowsingmode="temporary"])[firefoxviewhidden] #firefox-view-button + #tabbrowser-tabs { + border-inline-start: none !important; + padding-inline-start: var(--tab-overflow-pinned-tabs-width) !important; + margin-inline-start: 0 !important; } } /*= OS - Compatibility =======================================================*/ @@ -145,10 +185,10 @@ /*= Windows 10 - Top border of accent color at ESR #358 ======================*/ @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { :root[sizemode="normal"][tabsintitlebar] #navigator-toolbox { - border-top: 0.5px solid #2f2f2f !important; + border-top: 0.5px solid rgb(47, 47, 47) !important; } :root[sizemode="normal"][tabsintitlebar]:-moz-window-inactive #navigator-toolbox { - border-top-color: #393939 !important; + border-top-color: rgb(57, 57, 57) !important; } @media (-moz-windows-accent-color-in-titlebar) { :root[sizemode="normal"][tabsintitlebar] #navigator-toolbox { @@ -196,36 +236,27 @@ menupopup > menu, menupopup > menuitem, #context-navigation > menuitem { - border: 1px solid transparent; - /* Need reduce 2px at menu */ + border: 1px solid transparent; /* Need reduce 2px at menu */ } - #main-menubar > menu[open="true"], #main-menubar > menu[_moz-menuactive="true"] { - background-color: -moz-menuhover !important; - /* Make to original */ + background-color: -moz-menuhover !important; /* Make to original */ } - :root:-moz-lwtheme #main-menubar > menu[open="true"], :root:-moz-lwtheme #main-menubar > menu[_moz-menuactive="true"] { - color: inherit !important; - /* Original: -moz-menubarhovertext */ - background-color: color-mix(in srgb, currentColor 20%, transparent) !important; - /* Original: -moz-menuhover */ + color: inherit !important; /* Original: -moz-menubarhovertext */ + background-color: color-mix(in srgb, currentColor 20%, transparent) !important; /* Original: -moz-menuhover */ } - menulist > menupopup > menuitem[_moz-menuactive="true"], menulist > menupopup > menu[_moz-menuactive="true"] { background-color: highlight !important; color: highlighttext !important; } - #PlacesToolbar menu, #PlacesToolbar menuitem, #BMB_bookmarksPopup menu, #BMB_bookmarksPopup menuitem { - border: none !important; - /* Remove border */ + border: none !important; /* Remove border */ } #PlacesToolbar menu:not([disabled], :active)[_moz-menuactive="true"], #PlacesToolbar menuitem:not([disabled], :active)[_moz-menuactive="true"], @@ -245,19 +276,15 @@ background-color: color-mix(in srgb, currentColor 5%, transparent) !important; border-color: color-mix(in srgb, currentColor 60%, transparent) !important; } - /* Remove text shadow */ :root:-moz-lwtheme #toolbar-menubar { text-shadow: unset !important; /* Original: 0 0 .5em white, 0 0 .5em white, 0 1px 0 rgba(255, 255, 255, .4) */ } - /* Remove Color */ :root:-moz-lwtheme #main-menubar:not(:-moz-window-inactive) { - background-color: unset !important; - /* Original: rgba(255, 255, 255, .5) */ - color: unset !important; - /* Original: black */ + background-color: unset !important; /* Original: rgba(255, 255, 255, .5) */ + color: unset !important; /* Original: black */ } } @media (-moz-os-version: windows-win8), (-moz-platform: windows-win8) { @@ -276,25 +303,20 @@ /*= Linux - Global Menubar Active Color ====================================*/ #main-menubar > menu[open="true"], #main-menubar > menu[_moz-menuactive="true"] { - color: inherit !important; - /* Original: -moz-menubarhovertext */ - background-color: color-mix(in srgb, currentColor 20%, transparent) !important; - /* Original: -moz-menuhover */ + color: inherit !important; /* Original: -moz-menubarhovertext */ + background-color: color-mix(in srgb, currentColor 20%, transparent) !important; /* Original: -moz-menuhover */ } - /*= Linux - Titlebar button at lwtheme =====================================*/ - @supports not -moz-bool-pref("userChrome.compatiblity.os.linux_non_native_titlebar_button") { + @supports not -moz-bool-pref("userChrome.compatibility.os.linux_non_native_titlebar_button") { .titlebar-button:-moz-lwtheme { appearance: auto !important; } - .titlebar-min:-moz-lwtheme, .titlebar-max:-moz-lwtheme, .titlebar-restore:-moz-lwtheme, .titlebar-close:-moz-lwtheme { list-style-image: none !important; } - .titlebar-button:-moz-lwtheme:hover, .titlebar-button:-moz-lwtheme:hover:active { background-color: unset !important; @@ -317,7 +339,6 @@ > .tab-background:not(:-moz-lwtheme) { box-shadow: 0 0 4px rgba(128, 128, 142, 0.5) !important; } - #TabsToolbar:not([brighttext]) #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected="true"], [multiselected]) @@ -328,16 +349,29 @@ } } /*= Titlebar Container Size at maximized #384 ================================*/ - @supports -moz-bool-pref("userChrome.compatibility.os.windows_maximized") { - @media (-moz-os-version: windows-win7), - (-moz-platform: windows-win7), - (-moz-os-version: windows-win8), - (-moz-platform: windows-win8), - (-moz-os-version: windows-win10), - (-moz-platform: windows-win10) { - :root[tabsintitlebar][sizemode="maximized"] #titlebar { + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + @supports not -moz-bool-pref("userChrome.compatibility.os.windows_maximized") { + :root[tabsintitlebar] #titlebar { /* -moz-default-appearance: -moz-window-titlebar */ appearance: none !important; + } + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8) { + :root[tabsintitlebar][sizemode="maximized"] #titlebar { + padding-top: 8px; + } + } + } + @supports -moz-bool-pref("userChrome.compatibility.os.windows_maximized") { + :root[tabsintitlebar][sizemode="maximized"] #titlebar { + appearance: none !important; padding-top: 8px; } } @@ -346,8 +380,7 @@ /*= Others - Compatibility ===================================================*/ @supports -moz-bool-pref("userChrome.compatibility.panel_cutoff") { #appMenu-popup panelview { - width: 24.5em !important; - /* can modify panel width, Original: 22.5em */ + width: 24.5em !important; /* can modify panel width, Original: 22.5em */ } } @supports -moz-bool-pref("userChrome.compatibility.navbar_top_border") { @@ -365,27 +398,30 @@ :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) { --focus-outline-color: AccentColor !important; } - :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #urlbar[open] > #urlbar-background, :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) #urlbar[open] > #urlbar-background { - border-color: color-mix(in srgb, AccentColor 50%, transparent) !important; - /* Like: --toolbar-field-focus-border-color */ + border-color: color-mix( + in srgb, + AccentColor 50%, + transparent + ) !important; /* Like: --toolbar-field-focus-border-color */ } - @supports -moz-bool-pref("userChrome.compatibility.accent_color") { :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme), :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) { --focus-outline-color: -moz-accent-color !important; } - :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #urlbar[open] > #urlbar-background, :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) #urlbar[open] > #urlbar-background { - border-color: color-mix(in srgb, -moz-accent-color 50%, transparent) !important; - /* Like: --toolbar-field-focus-border-color */ + border-color: color-mix( + in srgb, + -moz-accent-color 50%, + transparent + ) !important; /* Like: --toolbar-field-focus-border-color */ } } } @@ -395,7 +431,6 @@ --background-color: rgb(229, 229, 235); --toolbarseparator-color: transparent; } - #TabsToolbar:not(:-moz-lwtheme) .tabbrowser-tab > .tab-stack @@ -403,15 +438,16 @@ color: var(--background-color); background-color: color-mix(in srgb, currentColor 60%, transparent); } - #TabsToolbar:not(:-moz-lwtheme) .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"], [multiselected]) { - background-color: color-mix(in srgb, currentColor 85%, transparent) !important; - /* Original: color-mix(in srgb, currentColor 11%, transparent) */ + background-color: color-mix( + in srgb, + currentColor 85%, + transparent + ) !important; /* Original: color-mix(in srgb, currentColor 11%, transparent) */ } - #scrollbutton-up:not(:-moz-lwtheme), #scrollbutton-down:not(:-moz-lwtheme), #alltabs-button:not(:-moz-lwtheme) > .toolbarbutton-badge-stack, @@ -427,25 +463,23 @@ --win-bgcolor: rgb(204, 204, 204); --win-disabled-color: rgb(145, 145, 145); --win-disabled-bgcolor: transparent; - --win-hover-bgcolor: rgb(218, 218, 218); - /* also button-bgcolor */ - --win-hover-active-bgcolor: #c2c2c2; - /* also button-hover-bgcolor */ + --win-hover-bgcolor: rgb(218, 218, 218); /* also button-bgcolor */ + --win-hover-active-bgcolor: #c2c2c2; /* also button-hover-bgcolor */ --win-button-hover-bgcolor: rgba(218, 218, 218, 0.66); --win-button-active-bgcolor: #aaaaaa; --win-field-bgcolor: #ffffff; --win-component-bgcolor: #f2f2f2; --win-border-color: #8a8a8a; - --win-tab-seperator-color: #a3a3a3; + --win-tab-separator-color: #a3a3a3; --win-sidebar-bgcolor: #e6e6e6; --win-sidebar-hover-bgcolor: #cfcfcf; --win-sidebar-button-hover-bgcolor: #b8b8b8; --win-sidebar-button-hover-active-bgcolor: #a3a3a3; --win-button-border: #747474; - --win-shorcut-text-color: #757575; + --win-shortcut-text-color: #757575; --win-error-color: #b31616; --win-red-border-color: #ff4343; - --win-accent-forground-color: AccentColorText; + --win-accent-foreground-color: AccentColorText; --win-accent-color: color-mix(in srgb, rgba(0, 0, 0, 0.8) 10%, AccentColor); --win-accent-content-color: color-mix(in srgb, rgba(255, 255, 255, 0.8) 15%, AccentColor); --win-accent-hover-color: color-mix(in srgb, rgba(255, 255, 255, 0.8) 27%, AccentColor); @@ -453,14 +487,13 @@ } @supports -moz-bool-pref("userChrome.compatibility.accent_color") { :root:not(:-moz-lwtheme) { - --win-accent-forground-color: -moz-accent-color-foreground; + --win-accent-foreground-color: -moz-accent-color-foreground; --win-accent-color: color-mix(in srgb, rgba(0, 0, 0, 0.8) 10%, -moz-accent-color); --win-accent-content-color: color-mix(in srgb, rgba(255, 255, 255, 0.8) 15%, -moz-accent-color); --win-accent-hover-color: color-mix(in srgb, rgba(255, 255, 255, 0.8) 27%, -moz-accent-color); --win-accent-active-color: -moz-accent-color; } } - @media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) { :root:not(:-moz-lwtheme), :root[lwt-default-theme-in-dark-mode] { @@ -468,22 +501,20 @@ --win-bgcolor: #2b2b2b; --win-disabled-color: #747474; --win-disabled-bgcolor: transparent; - --win-hover-bgcolor: #2e2e2e; - /* also button-bgcolor */ - --win-hover-active-bgcolor: #454545; - /* also button-active-color */ + --win-hover-bgcolor: #2e2e2e; /* also button-bgcolor */ + --win-hover-active-bgcolor: #454545; /* also button-active-color */ --win-button-hover-bgcolor: rgba(46, 46, 46, 0.66); --win-button-active-bgcolor: #515151; --win-field-bgcolor: #373737; --win-component-bgcolor: #171717; --win-border-color: #5b5b5b; - --win-tab-seperator-color: #555555; + --win-tab-separator-color: #555555; --win-sidebar-bgcolor: #1f1f1f; --win-sidebar-hover-bgcolor: #353535; --win-sidebar-button-hover-bgcolor: #353535; --win-sidebar-button-hover-active-bgcolor: #4c4c4c; --win-button-border: #8f8f8f; - --win-shorcut-text-color: #adadad; + --win-shortcut-text-color: #adadad; --win-error-color: #ffb900; --win-red-border-color: #ff4343; --win-accent-color: color-mix(in srgb, rgba(255, 255, 255, 0.8) 20%, AccentColor); @@ -525,8 +556,8 @@ --panel-disabled-color: var(--win-disabled-color) !important; --download-progress-paused-color: var(--win-disabled-color) !important; /* Text Shortcut Color */ - --panel-shortcut-color: var(--win-shorcut-text-color) !important; - --panel-description-color: var(--win-shorcut-text-color) !important; + --panel-shortcut-color: var(--win-shortcut-text-color) !important; + --panel-description-color: var(--win-shortcut-text-color) !important; /* Title Background */ --lwt-accent-color: var(--win-bgcolor) !important; --toolbar-field-border-color: var(--win-bgcolor) !important; @@ -538,9 +569,9 @@ --arrowpanel-background: var(--win-component-bgcolor) !important; --autocomplete-popup-background: var(--win-component-bgcolor) !important; /* Border Color */ - /* Seperator */ - --toolbarseparator-color: var(--win-tab-seperator-color) !important; - /* Field Backround Color */ + /* Separator */ + --toolbarseparator-color: var(--win-tab-separator-color) !important; + /* Field Background Color */ --input-bgcolor: var(--win-field-bgcolor) !important; --toolbar-field-background-color: var(--win-field-bgcolor) !important; --toolbar-field-focus-background-color: var(--win-field-bgcolor) !important; @@ -572,9 +603,9 @@ --checkbox-border-color: var(--win-button-border) !important; --input-border-color: var(--win-button-border) !important; --autocomplete-popup-separator-color: var(--win-button-border) !important; - /* Accent Forground Color */ - --button-primary-color: var(--win-accent-forground-color) !important; - --checkbox-checked-color: var(--win-accent-forground-color) !important; + /* Accent Foreground Color */ + --button-primary-color: var(--win-accent-foreground-color) !important; + --checkbox-checked-color: var(--win-accent-foreground-color) !important; /* Accent Color */ --button-primary-bgcolor: var(--win-accent-color) !important; --focus-outline-color: var(--win-accent-color) !important; @@ -604,28 +635,23 @@ --download-progress-flare-color: rgba(255, 255, 255, 0.75) !important; --panelview-toolbarbutton-focus-box-shadow: inset 0 0 0 2px var(--focus-outline-color) !important; } - #navigator-toolbox:not(:-moz-lwtheme) { background: var(--lwt-accent-color) !important; } - /*- Separator --------------------------------------------------------------*/ :root:not(:-moz-lwtheme) { --arrowpanel-border-color: var(--win-bgcolor) !important; --panel-separator-color: var(--win-bgcolor) !important; } - :root[lwt-default-theme-in-dark-mode] { --arrowpanel-border-color: var(--win-border-color) !important; --panel-separator-color: var(--win-border-color) !important; } - @supports -moz-bool-pref("userChrome.theme.system_default") { @media (-moz-windows-accent-color-in-titlebar) { :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme), :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) { - --toolbarseparator-color: color-mix(in srgb, currentColor 20%, transparent) !important; - /* As default */ + --toolbarseparator-color: color-mix(in srgb, currentColor 20%, transparent) !important; /* As default */ } } } @@ -635,11 +661,9 @@ :root[lwt-default-theme-in-dark-mode] { --win-proton-tab-selected-bgcolor: color-mix(in srgb, var(--win-bgcolor) 5%, var(--win-component-bgcolor)); } - :root:not(:-moz-lwtheme) { --tab-selected-color: var(--win-proton-tab-selected-bgcolor) !important; } - :root[lwt-default-theme-in-dark-mode] { --lwt-selected-tab-background-color: var(--win-proton-tab-selected-bgcolor) !important; } @@ -653,7 +677,6 @@ --menu-disabled-color: var(--win-disabled-color) !important; --menuitem-disabled-hover-background-color: var(--win-disabled-bgcolor) !important; } - /*- Toolbar ----------------------------------------------------------------*/ :root:not(:-moz-lwtheme) #titlebar, :root[lwt-default-theme-in-dark-mode] #titlebar { @@ -662,19 +685,16 @@ --toolbarbutton-hover-background: var(--win-sidebar-button-hover-bgcolor); --toolbarbutton-active-background: var(--win-sidebar-button-hover-active-bgcolor); } - /*- Sidebar ----------------------------------------------------------------*/ #sidebar-box:not([lwt-sidebar]) { appearance: none !important; } - :root:not(:-moz-lwtheme) #sidebar-box, :root[lwt-default-theme-in-dark-mode] #sidebar-box { --sidebar-background-color: var(--win-sidebar-bgcolor) !important; --sidebar-text-color: var(--win-text-color) !important; --sidebar-border-color: var(--win-border-color) !important; } - @media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) { .sidebar-panel[style="--newtab-background-color: rgba(43, 42, 51, 1); --newtab-text-primary-color: rgba(251, 251, 254, 1); --lwt-sidebar-background-color: rgb(56, 56, 61); --lwt-sidebar-text-color: rgba(249, 249, 250, 1);"], body[lwt-sidebar][style="--newtab-background-color: rgba(43, 42, 51, 1); --newtab-text-primary-color: rgba(251, 251, 254, 1); --lwt-sidebar-background-color: rgb(56, 56, 61); --lwt-sidebar-text-color: rgba(249, 249, 250, 1);"], @@ -691,21 +711,18 @@ --button-hover-bgcolor: var(--win-hover-active-bgcolor) !important; --button-active-bgcolor: var(--win-button-active-bgcolor) !important; } - :root:not(:-moz-lwtheme) toolbarbutton.subviewbutton:not([disabled], [open], :active, #appMenu-fxa-label2, #appMenu-zoomReduce-button2, #appMenu-zoomReset-button2, #appMenu-zoomEnlarge-button2, #appMenu-fullscreen-button2):is(:hover), :root[lwt-default-theme-in-dark-mode] toolbarbutton.subviewbutton:not([disabled], [open], :active, #appMenu-fxa-label2, #appMenu-zoomReduce-button2, #appMenu-zoomReset-button2, #appMenu-zoomEnlarge-button2, #appMenu-fullscreen-button2):is(:hover) { background-color: var(--win-hover-bgcolor) !important; } - :root:not(:-moz-lwtheme) toolbarbutton.subviewbutton:not([disabled], #appMenu-fxa-label2, #appMenu-zoomReduce-button2, #appMenu-zoomReset-button2, #appMenu-zoomEnlarge-button2, #appMenu-fullscreen-button2):is([open], :hover:active), :root[lwt-default-theme-in-dark-mode] toolbarbutton.subviewbutton:not([disabled], #appMenu-fxa-label2, #appMenu-zoomReduce-button2, #appMenu-zoomReset-button2, #appMenu-zoomEnlarge-button2, #appMenu-fullscreen-button2):is([open], :hover:active) { background-color: var(--win-hover-active-bgcolor) !important; } - /*- Others -----------------------------------------------------------------*/ /* For overwrite */ :root[lwtheme-mozlightdark]:not([lwthemetextcolor="bright"]):not(:-moz-lwtheme), @@ -713,11 +730,9 @@ /* Light Theme */ --lwt-accent-color: var(--win-bgcolor) !important; } - @media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) { :root[lwt-default-theme-in-dark-mode][lwthemetextcolor="bright"] { - --toolbar-bgcolor: var(--win-component-bgcolor) !important; - /* Original: rgba(43, 42, 51, 1) */ + --toolbar-bgcolor: var(--win-component-bgcolor) !important; /* Original: rgba(43, 42, 51, 1) */ } } #tabbrowser-tabs:not([movingtab]) @@ -783,13 +798,10 @@ --urlbar-popup-url-color: -moz-accent-color; } } - /* Nightly Compatibility */ :root:not(:-moz-lwtheme) #urlbar { - --toolbar-field-focus-color: var(--toolbar-field-color); - /* Nightly: rgba(0, 0, 0, 1) */ - --toolbar-field-focus-background-color: var(--toolbar-field-background-color); - /* Nightly: white */ + --toolbar-field-focus-color: var(--toolbar-field-color); /* Nightly: rgba(0, 0, 0, 1) */ + --toolbar-field-focus-background-color: var(--toolbar-field-background-color); /* Nightly: white */ } } /*= Mac - Default like color =================================================*/ @@ -807,15 +819,15 @@ --mac-sidebar-hover-bgcolor: color-mix(in srgb, ButtonFace 60%, var(--mac-sidebar-bgcolor)); --mac-hover-bgcolor: Window; --mac-disabled-bgcolor: transparent; - --mac-primary-button-color: AccentColorText; - /* or -moz-mac-menutextselect */ - --mac-accent-color: AccentColor; - /* or LinkText */ + --mac-primary-button-color: AccentColorText; /* or -moz-mac-menutextselect */ + --mac-accent-color: AccentColor; /* or LinkText */ --mac-accent-content-color: color-mix(in srgb, rgb(255, 255, 255) 15%, AccentColor); - --mac-accent-hover-color: color-mix(in srgb, rgb(0, 0, 0) 10%, AccentColor); - /* or -moz-mac-menuselect, Highlight */ - --mac-accent-active-color: color-mix(in srgb, rgb(0, 0, 0) 20%, AccentColor); - /* or ActiveBorder */ + --mac-accent-hover-color: color-mix( + in srgb, + rgb(0, 0, 0) 10%, + AccentColor + ); /* or -moz-mac-menuselect, Highlight */ + --mac-accent-active-color: color-mix(in srgb, rgb(0, 0, 0) 20%, AccentColor); /* or ActiveBorder */ /* Text, Icon Color */ --menu-color: var(--mac-text-color) !important; --lwt-text-color: var(--mac-text-color) !important; @@ -847,11 +859,11 @@ /* Selected Background Color */ --toolbar-bgcolor: var(--mac-selected-bgcolor) !important; --toolbar-non-lwt-bgcolor: var(--mac-selected-bgcolor) !important; - /* Field Backround Color */ + /* Field Background Color */ --input-bgcolor: var(--mac-field-bgcolor) !important; --toolbar-field-background-color: var(--mac-field-bgcolor) !important; --tab-icon-overlay-stroke: var(--mac-field-bgcolor) !important; - /* Panel Backround Color */ + /* Panel Background Color */ --arrowpanel-background: var(--mac-panel-bgcolor) !important; /* Hover Background Color */ --menuitem-hover-background-color: var(--mac-hover-bgcolor) !important; @@ -888,7 +900,7 @@ --input-border-color: var(--mac-bgcolor) !important; --autocomplete-popup-separator-color: var(--mac-bgcolor) !important; */ - /* Accent Color Forground */ + /* Accent Color Foreground */ --button-primary-color: var(--mac-primary-button-color) !important; --checkbox-checked-color: var(--mac-primary-button-color) !important; /* Accent Color */ @@ -924,18 +936,17 @@ @supports -moz-bool-pref("userChrome.compatibility.accent_color") { :root:not(:-moz-lwtheme), :root[lwt-default-theme-in-dark-mode] { - --mac-primary-button-color: -moz-accent-color-foreground; - /* or -moz-mac-menutextselect */ - --mac-accent-color: -moz-accent-color; - /* or LinkText */ + --mac-primary-button-color: -moz-accent-color-foreground; /* or -moz-mac-menutextselect */ + --mac-accent-color: -moz-accent-color; /* or LinkText */ --mac-accent-content-color: color-mix(in srgb, rgb(255, 255, 255) 15%, -moz-accent-color); - --mac-accent-hover-color: color-mix(in srgb, rgb(0, 0, 0) 10%, -moz-accent-color); - /* or -moz-mac-menuselect, Highlight */ - --mac-accent-active-color: color-mix(in srgb, rgb(0, 0, 0) 20%, -moz-accent-color); - /* or ActiveBorder */ + --mac-accent-hover-color: color-mix( + in srgb, + rgb(0, 0, 0) 10%, + -moz-accent-color + ); /* or -moz-mac-menuselect, Highlight */ + --mac-accent-active-color: color-mix(in srgb, rgb(0, 0, 0) 20%, -moz-accent-color); /* or ActiveBorder */ } } - @media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) { :root:not(:-moz-lwtheme), :root[lwt-default-theme-in-dark-mode] { @@ -952,11 +963,9 @@ :root[lwt-default-theme-in-dark-mode] { --mac-proton-tab-selected-bgcolor: color-mix(in srgb, rgb(255, 255, 255) 20%, -moz-dialog); } - :root:not(:-moz-lwtheme) { --tab-selected-color: var(--mac-proton-tab-selected-bgcolor) !important; } - :root[lwt-default-theme-in-dark-mode] { --lwt-selected-tab-background-color: var(--mac-proton-tab-selected-bgcolor) !important; } @@ -966,11 +975,9 @@ :root[lwt-default-theme-in-dark-mode] #navigator-toolbox { background-color: var(--mac-bgcolor) !important; } - :root:not(:-moz-lwtheme) #titlebar { --mac-hover-bgcolor: ButtonFace; } - :root:not(:-moz-lwtheme) #titlebar, :root[lwt-default-theme-in-dark-mode] #titlebar { --button-hover-bgcolor: var(--mac-hover-bgcolor); @@ -980,24 +987,20 @@ /* Prevent transparent tabbar at fullscreen hover #312 */ background: var(--mac-bgcolor); } - :root[lwt-default-theme-in-dark-mode] #urlbar { --autocomplete-popup-highlight-background: var(--mac-hover-bgcolor) !important; --autocomplete-popup-hover-background: var(--mac-hover-bgcolor) !important; } - /*- Sidebar ----------------------------------------------------------------*/ #sidebar-box:not([lwt-sidebar]) { appearance: none !important; } - :root:not(:-moz-lwtheme) #sidebar-box, :root[lwt-default-theme-in-dark-mode] #sidebar-box { --sidebar-background-color: var(--mac-sidebar-bgcolor) !important; --sidebar-text-color: var(--mac-text-color) !important; /* --sidebar-border-color: var(--win-sidebar-border-color) !important; */ } - @media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) { .sidebar-panel[style="--newtab-background-color: rgba(43, 42, 51, 1); --newtab-text-primary-color: rgba(251, 251, 254, 1); --lwt-sidebar-background-color: rgb(56, 56, 61); --lwt-sidebar-text-color: rgba(249, 249, 250, 1);"], body[lwt-sidebar][style="--newtab-background-color: rgba(43, 42, 51, 1); --newtab-text-primary-color: rgba(251, 251, 254, 1); --lwt-sidebar-background-color: rgb(56, 56, 61); --lwt-sidebar-text-color: rgba(249, 249, 250, 1);"], @@ -1012,7 +1015,6 @@ --button-hover-bgcolor: var(--mac-sidebar-hover-bgcolor); --button-active-bgcolor: var(--mac-sidebar-hover-bgcolor); } - /*- Others -----------------------------------------------------------------*/ /* For Overwrite */ @media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) { @@ -1034,14 +1036,14 @@ > .tabbrowser-tab > .tab-stack > .tab-background[selected="true"] { - background: color-mix(in srgb, white 15%, -moz-dialog) !important; + background: color-mix(in srgb, rgb(255, 255, 255) 15%, -moz-dialog) !important; } } :root:not(:-moz-lwtheme):not([customizing="true"]) tab[visuallyselected] > stack::before, :root:not(:-moz-lwtheme):not([customizing="true"]) tab[visuallyselected] > stack::after, :root[lwt-default-theme-in-dark-mode]:not([customizing="true"]) tab[visuallyselected] > stack::before, :root[lwt-default-theme-in-dark-mode]:not([customizing="true"]) tab[visuallyselected] > stack::after { - fill: color-mix(in srgb, white 15%, -moz-dialog) !important; + fill: color-mix(in srgb, rgb(255, 255, 255) 15%, -moz-dialog) !important; } } } @@ -1056,8 +1058,7 @@ --in-content-text-color: var(--in-content-page-color); --in-content-deemphasized-text: rgb(91, 91, 102); --in-content-box-background: #fff; - --in-content-box-background-odd: rgba(12, 12, 13, 0.05); - /* grey 90 a05 */ + --in-content-box-background-odd: rgba(12, 12, 13, 0.05); /* grey 90 a05 */ --in-content-box-border-color: color-mix(in srgb, currentColor 41%, transparent); --in-content-box-info-background: #f0f0f4; --in-content-item-hover: color-mix(in srgb, var(--in-content-primary-button-background) 20%, transparent); @@ -1075,7 +1076,7 @@ --in-content-link-color-hover: var(--blue-70); --in-content-link-color-active: var(--blue-80); --in-content-link-color-visited: var(--blue-60); - /* button background states are also used for checkboxes and radiobuttons */ + /* button background states are also used for checkboxes and radio buttons */ --in-content-button-text-color: var(--in-content-text-color); --in-content-button-text-color-hover: var(--in-content-text-color); --in-content-button-background: rgba(207, 207, 216, 0.33); @@ -1096,13 +1097,14 @@ --in-content-button-horizontal-padding: 15px; --in-content-button-vertical-padding: 7px; --in-content-table-background: #f8f8fa; - --in-content-table-border-color: var(--in-content-box-border-color); - /* Legacy: #d1d1d1; rgba(249, 249, 250, 0.2) */ + --in-content-table-border-color: var(--in-content-box-border-color); /* Legacy: #d1d1d1; rgba(249, 249, 250, 0.2) */ --in-content-table-border-dark-color: var(--in-content-table-border-color); - --in-content-table-header-background: var(--in-content-primary-button-background); - /* Legacy: #0a84ff; rgb(5, 64, 150); */ - --in-content-table-header-color: var(--in-content-primary-button-text-color); - /* Legacy: #ffffff; var(--in-content-page-color); */ + --in-content-table-header-background: var( + --in-content-primary-button-background + ); /* Legacy: #0a84ff; rgb(5, 64, 150); */ + --in-content-table-header-color: var( + --in-content-primary-button-text-color + ); /* Legacy: #ffffff; var(--in-content-page-color); */ --in-content-sidebar-width: 240px; --dialog-warning-text-color: var(--red-60); --checkbox-border-color: var(--in-content-box-border-color); @@ -1151,7 +1153,6 @@ --card-outline-color: var(--grey-30); --card-shadow-hover: var(--card-shadow), 0 0 0 5px var(--card-outline-color); } - @media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) { :host, :root { @@ -1222,12 +1223,9 @@ darken(#0060df, 15.5%): #003e90; darken(#0060df, 28.1%): #002250; */ - --blue-20: #b6d6ff; - /* lighten(#0060df, 42%) - rgb(182, 214, 255), Add for link active color*/ - --blue-30: #74c0ff; - /* rgb(116, 192, 255), Add for active color */ + --blue-20: #b6d6ff; /* lighten(#0060df, 42%) - rgb(182, 214, 255), Add for link active color*/ + --blue-30: #74c0ff; /* rgb(116, 192, 255), Add for active color */ } - :host, :root, dialog { @@ -1247,7 +1245,6 @@ --in-content-link-color-active: var(--blue-20) !important; --in-content-link-color-visited: var(--blue-40) !important; } - :root[lwtheme-mozlightdark][lwthemetextcolor="bright"], :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] { --button-primary-color: var(--in-content-page-color) !important; @@ -1258,10 +1255,8 @@ --lwt-toolbarbutton-icon-fill-attention: var(--blue-40) !important; --download-progress-fill-color: var(--blue-40) !important; --panel-banner-item-info-icon-bgcolor: var(--blue-30) !important; - --lwt-brighttext-url-color: var(--blue-30) !important; - /* Original: as primary bgcolor */ + --lwt-brighttext-url-color: var(--blue-30) !important; /* Original: as primary bgcolor */ } - @supports -moz-bool-pref("userChrome.decoration.download_panel") { :root[lwtheme-mozlightdark][lwthemetextcolor="bright"] #downloadsListBox, :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] #downloadsListBox { @@ -1293,23 +1288,69 @@ transparent ) !important; } - + @media (-moz-windows-non-native-menus) { + html#main-window menupopup:not(.in-menulist) { + /* Above FF v105 #466 */ + --panel-color: var(--menu-color) !important; + --panel-background: var(--menu-background-color) !important; + --panel-border-color: var(--menu-border-color) !important; + } + html#main-window menupopup:not(.in-menulist) menuseparator { + border-top: 1px solid var(--menu-border-color); + } + html#main-window menupopup:not(.in-menulist) menu[disabled="true"], + html#main-window menupopup:not(.in-menulist) menu[_moz-menuactive="true"][disabled="true"], + html#main-window menupopup:not(.in-menulist) menuitem[disabled="true"], + html#main-window menupopup:not(.in-menulist) menuitem[_moz-menuactive="true"][disabled="true"] { + color: var(--menu-disabled-color) !important; + } + html#main-window menupopup:not(.in-menulist) menu[_moz-menuactive="true"]:not([disabled="true"]), + html#main-window menupopup:not(.in-menulist) menuitem[_moz-menuactive="true"]:not([disabled="true"]) { + background-color: var(--menuitem-hover-background-color) !important; + color: var(--menu-color) !important; + } + html#main-window + menupopup + #context-navigation + > .menuitem-iconic[_moz-menuactive="true"] + > .menu-iconic-left + > .menu-iconic-icon { + background-color: var(--menuitem-hover-background-color) !important; + } + html#main-window menupopup #context-navigation > .menuitem-iconic[_moz-menuactive="true"], + html#main-window + menupopup + #context-navigation + > .menuitem-iconic[_moz-menuactive="true"][disabled="true"] + > .menu-iconic-left + > .menu-iconic-icon { + background-color: transparent !important; + } + } + @media (-moz-windows-non-native-menus) and (-moz-toolbar-prefers-color-scheme: light), + (-moz-windows-non-native-menus) and (prefers-color-scheme: light) { + :root[style*="background-noodles-right"] menupopup { + --toolbarbutton-hover-background: rgba(232, 224, 255, 0.11999999731779099) !important; + } + } @media not all and (-moz-gtk-csd-available) { window:is(#bookmarksPanel, #history-panel)[lwt-sidebar="true"] menupopup { --panel-color: var(--lwt-sidebar-text-color, var(--menu-color)) !important; --panel-background: var(--lwt-sidebar-background-color, var(--menu-background-color)) !important; } - window:is(#bookmarksPanel, #history-panel)[lwt-sidebar="true"] menu[_moz-menuactive="true"]:not([disabled="true"]), window:is(#bookmarksPanel, #history-panel)[lwt-sidebar="true"] menuitem[_moz-menuactive="true"]:not([disabled="true"]) { - --menuitem-hover-background-color: color-mix(in srgb, currentColor 17%, transparent); - /* Looks like toolbar button */ + --menuitem-hover-background-color: color-mix( + in srgb, + currentColor 17%, + transparent + ); /* Looks like toolbar button */ /* or var(--lwt-sidebar-highlight-background-color) If this value is used, unset is required in the default theme. */ + background-color: var(--menuitem-hover-background-color) !important; } - /* Fallback background - Set to Legacy. It will be removed Next update menupopup:not(.cui-widget-panel.cui-widget-panelview, [placespopup="true"]) { background-color: var(--lwt-accent-color, var(--in-content-page-background)) !important; @@ -1324,48 +1365,44 @@ :root:is([style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) { --menu-color: var(--toolbar-color, var(--in-content-page-color)) !important; - --arrowpanel-background: var(--toolbar-bgcolor, var(--in-content-button-background)) !important; - /* --menu-background-color */ + --arrowpanel-background: var( + --toolbar-bgcolor, + var(--in-content-button-background) + ) !important; /* --menu-background-color */ } - @media not all and (-moz-gtk-csd-available) { window:is(#bookmarksPanel, #history-panel)[style*="--newtab-background-color: rgba(249, 249, 251, 1);"] menupopup, window:is(#bookmarksPanel, #history-panel)[style*="--newtab-background-color: rgba(43, 42, 51, 1);"] menupopup { /* Default Dark Mode */ --panel-color: var(--menu-color) !important; - --panel-background: var(--menu-background-color) !important; + --panel-background: var(--menu-background-color, -moz-menuhover) !important; } } /*== Info Bar Color ==========================================================*/ .container.infobar { - background-color: var(--urlbar-box-bgcolor); + background-color: var(--urlbar-box-bgcolor) !important; } - .notification-button { - background-color: var(--button-bgcolor); + background-color: var(--button-bgcolor) !important; } .notification-button:hover { - background-color: var(--button-hover-bgcolor); + background-color: var(--button-hover-bgcolor) !important; } .notification-button:hover:active { - background-color: var(--button-active-bgcolor); + background-color: var(--button-active-bgcolor) !important; } - html|button.ghost-button:not(.semi-transparent):enabled:hover { background-color: var(--button-hover-bgcolor) !important; } - html|button.ghost-button:not(.semi-transparent):enabled:hover:active { background-color: var(--in-content-button-background-active) !important; } - /*== Bookmark Popup Color ====================================================*/ #editBMPanel_folderTree:-moz-lwtheme, #editBMPanel_tagsSelector:-moz-lwtheme { appearance: none !important; border: 0.5px solid var(--button-active-bgcolor, color-mix(in srgb, currentColor 30%, transparent)) !important; } - #editBMPanel_folderTree:-moz-lwtheme, #editBMPanel_folderTree:-moz-lwtheme > treechildren, #editBMPanel_folderTree:-moz-lwtheme > treechildren::-moz-tree-image, @@ -1375,32 +1412,26 @@ #editBMPanel_tagsSelector:-moz-lwtheme > richlistitem { color: var(--lwt-text-color, fieldtext) !important; } - #editBMPanel_folderTree:-moz-lwtheme > treechildren::-moz-tree-cell-text(selected) { font-weight: 600 !important; } - #editBMPanel_folderTree:-moz-lwtheme > treechildren, #editBMPanel_tagsSelector:-moz-lwtheme { background-color: color-mix(in srgb, var(--arrowpanel-background) 35%, var(--in-content-box-background)) !important; } - #editBMPanel_folderTree:-moz-lwtheme > treechildren::-moz-tree-row(hover), #editBMPanel_tagsSelector > richlistitem:hover { background-color: var(--button-hover-bgcolor, color-mix(in srgb, currentColor 17%, transparent)) !important; } - #editBMPanel_folderTree:-moz-lwtheme > treechildren::-moz-tree-row(selected), #editBMPanel_tagsSelector > richlistitem[selected="true"] { background-color: var(--button-active-bgcolor, color-mix(in srgb, currentColor 30%, transparent)) !important; } - #editBMPanel_namePicker, #editBMPanel_tagsField { --input-bgcolor: var(--arrowpanel-background, Field); --input-color: var(--arrowpanel-color, FieldText); } - /*== Sidebar - Field Color ===================================================*/ .sidebar-panel #search-box, xul|search-textbox.tabsFilter { @@ -1412,44 +1443,38 @@ background-color: var(--lwt-sidebar-background-color, Field) !important; color: var(--lwt-sidebar-text-color, FieldText) !important; } - .sidebar-panel:not([lwt-sidebar]) #search-box { --input-bgcolor: ThreeDShadow; } - .sidebar-panel #search-box[focused="true"], xul|search-textbox.tabsFilter[focused="true"] { outline: 1px solid var(--input-bgcolor); } - .sidebar-panel[lwt-sidebar] #search-box[focused="true"], body[lwt-sidebar] xul|search-textbox.tabsFilter[focused="true"] { --input-bgcolor: var(--lwt-sidebar-highlight-background-color, Highlight) !important; } - .sidebar-panel:not([lwt-sidebar]) #search-box[focused="true"], body:not([lwt-sidebar]) xul|search-textbox.tabsFilter[focused="true"] { - border-color: AccentColor !important; - /* Hard Coded */ + border-color: AccentColor !important; /* Hard Coded */ outline-color: AccentColor !important; } @supports -moz-bool-pref("userChrome.compatibility.accent_color") { .sidebar-panel:not([lwt-sidebar]) #search-box[focused="true"], body:not([lwt-sidebar]) xul|search-textbox.tabsFilter[focused="true"] { - border-color: -moz-accent-color !important; - /* Hard Coded */ + border-color: -moz-accent-color !important; /* Hard Coded */ outline-color: -moz-accent-color !important; } } - /*= PopupAutoComplete ========================================================*/ #PopupAutoComplete { --panel-bgcolor: var(--arrowpanel-background, var(--in-content-button-background)); /* overwrite */ - --panel-border-radius: 4px !important; - /* Original: 0 */ - --panel-border-color: var(--arrowpanel-border-color, var(--menu-border-color)) !important; - /* Original: ThreeDShadow */ + --panel-border-radius: 4px !important; /* Original: 0 */ + --panel-border-color: var( + --arrowpanel-border-color, + var(--menu-border-color) + ) !important; /* Original: ThreeDShadow */ appearance: none !important; background: transparent !important; border: none !important; @@ -1457,16 +1482,12 @@ } #PopupAutoComplete > richlistbox { border-radius: var(--panel-border-radius) !important; - background-color: var(--panel-bgcolor) !important; - /* Original: Field */ - color: var(--arrowpanel-color, var(--in-content-page-color)) !important; - /* Original: FiledText */ + background-color: var(--panel-bgcolor) !important; /* Original: Field */ + color: var(--arrowpanel-color, var(--in-content-page-color)) !important; /* Original: FiledText */ } - .autocomplete-richlistitem:hover { background-color: var(--arrowpanel-dimmed) !important; } - #PopupAutoComplete > richlistbox > richlistitem[originaltype="generatedPassword"] > .two-line-wrapper > .ac-site-icon, #PopupAutoComplete > richlistbox > richlistitem[originaltype="loginWithOrigin"] > .two-line-wrapper > .ac-site-icon, #PopupAutoComplete > richlistbox > richlistitem[originaltype="login"] > .ac-site-icon { @@ -1474,17 +1495,38 @@ } #PopupAutoComplete > richlistbox > richlistitem[originaltype="loginsFooter"] { --panel-border-color: var(--panel-bgcolor); - color: var(--arrowpanel-color, var(--in-content-page-color)) !important; - /* Original: FieldText */ - background-color: var(--arrowpanel-dimmed, rgba(204, 204, 204, 0.35)) !important; - /* Original: hsla(0,0%,80%,.35) */ - border-color: var(--panel-border-color) !important; - /* Original: rgba(38,38,38,.15) */ + color: var(--arrowpanel-color, var(--in-content-page-color)) !important; /* Original: FieldText */ + background-color: var(--arrowpanel-dimmed, hsla(0deg, 0%, 80%, 0.35)) !important; /* Original: hsla(0,0%,80%,.35) */ + border-color: var(--panel-border-color) !important; /* Original: rgba(38,38,38,.15) */ } #PopupAutoComplete > richlistbox > richlistitem[originaltype="loginsFooter"]:hover, #PopupAutoComplete > richlistbox > richlistitem[originaltype="loginsFooter"][selected] { - background-color: var(--arrowpanel-dimmed-further, rgba(204, 204, 204, 0.5)) !important; - /* Original: hsla(0,0%,80%,.5), match arrowpanel-dimmed-further */ + background-color: var( + --arrowpanel-dimmed-further, + hsla(0deg, 0%, 80%, 0.5) + ) !important; /* Original: hsla(0,0%,80%,.5), match arrowpanel-dimmed-further */ + } + /* New Folder Button */ + #editBMPanel_newFolderButton { + appearance: none; + border: 0; + border-radius: 4px; + background-color: var(--button-bgcolor); + color: var(--button-color, inherit); + font-weight: 600; + min-width: 0; + padding: 8px 16px; + /* This button is deeper in the visual hierarchy than others (notably the + buttons at the bottom of the panel), so it should be slightly smaller. */ + font-size: 90%; + /* This button needs to align with the tree above it. */ + margin-inline-start: 4px; + } + #editBMPanel_newFolderButton:hover { + background-color: var(--button-hover-bgcolor); + } + #editBMPanel_newFolderButton:hover:active { + background-color: var(--button-active-bgcolor); } } /*= Fully Dark Mode ==========================================================*/ @@ -1496,7 +1538,6 @@ browser[type="content"] > html { background: var(--in-content-page-background) !important; } - /*= Notification =============================================================*/ @-moz-document url("chrome://global/content/alerts/alert.xhtml") { @@ -1507,7 +1548,6 @@ --menu-border-color: #cfcfd8; --menuitem-hover-background-color: #e0e0e6; } - @media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) { :root { --menu-border-color: rgba(107, 107, 107, 0.3); @@ -1515,16 +1555,14 @@ --menu-background-color: #2b2a33; --menuitem-hover-background-color: #52525e; } - #alertSourceLabel { - color: #05d1f1 !important; + color: rgb(5, 209, 241) !important; } } /* line below removes background from the notification "window" on linux */ #alertNotification { background: transparent !important; } - #alertBox { color: var(--menu-color) !important; background-color: var(--menu-background-color) !important; @@ -1532,7 +1570,6 @@ border-radius: 6px !important; -moz-window-shadow: cliprounded !important; } - #alertSettings { fill: currentColor !important; color: inherit !important; @@ -1540,17 +1577,14 @@ margin-inline: 0 !important; margin-bottom: -4px !important; } - .close-icon, #alertSettings { background: transparent !important; } - .close-icon:hover > .toolbarbutton-icon, #alertSettings:is(:hover, [open]) > .button-box > .box-inherit { background-color: var(--menuitem-hover-background-color, #e0e0e6) !important; } - /* Shape */ .close-icon > .toolbarbutton-icon, #alertSettings > .button-box > .box-inherit { @@ -1558,7 +1592,6 @@ padding: 2px !important; margin: 2px 2px -2px 0 !important; } - #alertSettings > .button-box > .box-inherit { margin: -4px 4px 3px 0 !important; } @@ -1594,7 +1627,6 @@ --checkbox-checked-hover-bgcolor: var(--in-content-primary-button-background-hover) !important; --checkbox-checked-active-bgcolor: var(--in-content-primary-button-background-active) !important; } - /*- Dialog -----------------------------------------------------------------*/ #commonDialog, #editCaCert, @@ -1604,13 +1636,11 @@ #app-picker, #topBar, #mainDeck { - -moz-appearance: none !important; - /* For Mac */ + -moz-appearance: none !important; /* For Mac */ color: var(--in-content-page-color) !important; background-color: var(--in-content-page-background) !important; /* border-radius: 0 0 8px 8px !important; */ } - /*- Button -----------------------------------------------------------------*/ button { -moz-appearance: none !important; @@ -1620,8 +1650,7 @@ font-size: 1em !important; font-weight: 600 !important; min-height: 32px !important; - border: 1px solid transparent !important; - /* shows up in high-contrast mode */ + border: 1px solid transparent !important; /* shows up in high-contrast mode */ border-radius: var(--in-content-button-border-radius) !important; padding: var(--in-content-button-vertical-padding) var(--in-content-button-horizontal-padding) !important; min-height: 32px !important; @@ -1641,60 +1670,49 @@ min-height: 24px !important; font-size: 0.9em !important; } - /* Remove margin added by button.css */ xul|button > .button-box > .button-text { margin: 0 !important; } - button:not([disabled="true"]):hover { background-color: var(--in-content-button-background-hover) !important; color: var(--in-content-button-text-color-hover) !important; border-color: transparent !important; } - xul|button:not([disabled="true"]):hover:active, xul|button[open], xul|button[open]:hover, xul|menulist[open="true"]:not([disabled="true"]) { background-color: var(--in-content-button-background-active) !important; } - xul|button[default] { background-color: var(--in-content-primary-button-background) !important; color: var(--in-content-primary-button-text-color) !important; } - xul|button[default]:not([disabled="true"]):hover { background-color: var(--in-content-primary-button-background-hover) !important; color: var(--in-content-primary-button-text-color) !important; } - xul|button[default]:not([disabled="true"]):hover:active { background-color: var(--in-content-primary-button-background-active) !important; } - xul|button[disabled="true"], xul|menulist[disabled="true"] { opacity: 0.4 !important; } - xul|button:not([disabled="true"]):hover, xul|menulist:not([disabled="true"]):hover { background-color: var(--in-content-button-background-hover) !important; color: var(--in-content-button-text-color-hover) !important; border-color: transparent !important; } - @media (prefers-contrast) { xul|button[default]:not([disabled="true"]):hover { border-color: currentColor !important; } - button:focus { color: var(--in-content-button-text-color) !important; } - xul|button[default]:focus, button.primary:focus { color: var(--in-content-primary-button-text-color) !important; @@ -1708,13 +1726,11 @@ outline: 2px solid var(--in-content-focus-outline-color) !important; outline-offset: 2px !important; } - /*- Radio Button -----------------------------------------------------------*/ xul|radio { /* margin-inline-start: 0 !important; */ appearance: none !important; } - xul|*.radio-check { appearance: none !important; width: 16px !important; @@ -1723,14 +1739,11 @@ border-radius: 100% !important; padding: 0 !important; margin-inline: 0 6px !important; - margin-block: 2px !important; - /* extend the vertical clicktarget */ + margin-block: 2px !important; /* extend the vertical clicktarget */ background-color: var(--in-content-button-background) !important; background-position: center !important; - flex-shrink: 0 !important; - /* avoid shrinking inside flex container */ + flex-shrink: 0 !important; /* avoid shrinking inside flex container */ } - xul|*.radio-check[selected] { -moz-context-properties: fill !important; fill: currentColor !important; @@ -1741,7 +1754,6 @@ /* Style the button also when printing with "Print Backgrounds" unchecked */ color-adjust: exact !important; } - xul|radio:not([disabled="true"]):hover > xul|*.radio-check { background-color: var(--in-content-button-background-hover) !important; color: var(--in-content-button-text-color-hover) !important; @@ -1749,7 +1761,6 @@ xul|radio:not([disabled="true"]):hover:active > xul|*.radio-check { background-color: var(--in-content-button-background-active) !important; } - xul|radio:not([disabled="true"])[selected]:hover > xul|*.radio-check { background-color: var(--in-content-primary-button-background-hover) !important; color: var(--in-content-primary-button-text-color-hover) !important; @@ -1757,12 +1768,10 @@ xul|radio:not([disabled="true"])[selected]:hover:active > xul|*.radio-check { background-color: var(--in-content-primary-button-background-active) !important; } - xul|*.radio-label-box { margin-inline: 0 8px !important; padding-inline-start: 0 !important; } - /* Disabled checkboxes, radios and labels */ xul|checkbox[disabled="true"], xul|radio[disabled="true"], @@ -1770,7 +1779,6 @@ color: inherit !important; opacity: 0.5 !important; } - /*- Check Box --------------------------------------------------------------*/ /* From checkbox.css */ checkbox { @@ -1778,7 +1786,6 @@ -moz-box-align: center !important; margin: 4px 2px !important; } - .checkbox-check { appearance: none !important; width: 16px !important; @@ -1787,12 +1794,9 @@ border-radius: 2px !important; color: var(--checkbox-border-color, ThreeDDarkShadow) !important; background-color: var(--checkbox-unchecked-bgcolor, Field) !important; - margin-inline-end: 6px !important; - /* or 2px */ - margin-block: 2px !important; - /* From common.css */ + margin-inline-end: 6px !important; /* or 2px */ + margin-block: 2px !important; /* From common.css */ } - .checkbox-check[checked] { -moz-context-properties: fill !important; fill: currentColor !important; @@ -1811,7 +1815,6 @@ background-color: var(--checkbox-checked-bgcolor, -moz-accent-color) !important; } } - checkbox:not([disabled="true"]):hover > .checkbox-check { background-color: var(--checkbox-unchecked-hover-bgcolor, color-mix(in srgb, AccentColor 4%, Field)) !important; } @@ -1862,7 +1865,6 @@ ) !important; } } - checkbox:-moz-focusring > .checkbox-check { outline: 2px solid var(--focus-outline-color, AccentColor) !important; outline-offset: var(--focus-outline-offset, 2px) !important; @@ -1872,7 +1874,6 @@ outline: 2px solid var(--focus-outline-color, -moz-accent-color) !important; } } - @media (prefers-contrast) { checkbox:not([disabled="true"]):hover > .checkbox-check { /* color will set the border-color on the check due to how HCM works for in-content pages. */ @@ -1884,7 +1885,6 @@ color: var(--checkbox-checked-border-color, color-mix(in srgb, -moz-accent-color 4%, Field)) !important; } } - .checkbox-check[checked] { color: var(--checkbox-checked-border-color, currentColor) !important; fill: var(--checkbox-checked-color, AccentColorText) !important; @@ -1894,7 +1894,6 @@ fill: var(--checkbox-checked-color, -moz-accent-color-foreground) !important; } } - checkbox:not([disabled="true"]):hover:active > .checkbox-check[checked] > .checkbox-check[checked], checkbox:not([disabled="true"]):hover > .checkbox-check[checked] > .checkbox-check[checked] { color: var(--checkbox-checked-border-color-hover, AccentColorText) !important; @@ -1911,20 +1910,16 @@ .checkbox-icon[src] { margin-inline-end: 2px !important; } - .checkbox-label { margin: 1px 0 !important; } - checkbox[disabled="true"] { opacity: 0.4 !important; } - /* From common.css */ xul|richlistitem > xul|*.checkbox-check { margin: 3px 6px !important; } - /*- Menulist ---------------------------------------------------------------*/ /* From mulist.css */ xul|menulist { @@ -1959,13 +1954,11 @@ outline: 2px solid var(--focus-outline-color, -moz-accent-color) !important; } } - #label-box { -moz-box-align: center !important; -moz-box-pack: center !important; font-weight: 600 !important; } - dropmarker { display: -moz-box !important; appearance: none !important; @@ -1980,16 +1973,13 @@ -moz-context-properties: fill !important; fill: currentColor !important; } - #highlightable-label:not([highlightable="true"]), #label[highlightable="true"] { display: none !important; } - xul|menuitem > label:not(.menu-text) { margin: 0 3px !important; } - /* From common.css */ xul|menulist > xul|menupopup { appearance: none !important; @@ -2002,7 +1992,6 @@ --panel-color: var(--in-content-text-color) !important; --panel-padding: 0 !important; } - xul|menulist > xul|menupopup xul|menu, xul|menulist > xul|menupopup xul|menuitem { appearance: none !important; @@ -2010,7 +1999,6 @@ padding-block: 0.2em !important; padding-inline: 10px 30px !important; } - xul|menulist > xul|menupopup > xul|menu:not([disabled="true"])[_moz-menuactive="true"], xul|menulist > xul|menupopup > xul|menuitem:not([disabled="true"])[_moz-menuactive="true"] { color: var(--in-content-item-hover-text) !important; @@ -2028,7 +2016,6 @@ global/menu.css */ background-color: transparent !important; } - xul|menulist > xul|menupopup xul|menuseparator { appearance: none !important; margin: 0 !important; @@ -2036,20 +2023,16 @@ border-top: 1px solid var(--in-content-box-border-color) !important; border-bottom: none !important; } - xul|menulist::part(dropmarker) { margin-block: 1px !important; } - /* Override menulist.css */ xul|menulist[disabled="true"] { background-color: var(--in-content-button-background) !important; } - xul|menulist:-moz-focusring > xul|*.menulist-label-box { outline: none !important; } - /*- List Boxes -------------------------------------------------------------*/ html|select[size][multiple], xul|listheader, @@ -2061,24 +2044,20 @@ border-radius: 4px !important; color: var(--in-content-text-color) !important; } - xul|listheader { border-bottom: none !important; border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; padding-bottom: 1px !important; box-shadow: inset 0 -1px var(--in-content-table-border-color) !important; - overflow: clip !important; - /* Clip border-radius */ + overflow: clip !important; /* Clip border-radius */ } - xul|listheader + xul|richlistbox { margin-top: 0 !important; border-top: none !important; border-top-left-radius: 0 !important; border-top-right-radius: 0 !important; } - html|select[size][multiple] > html|option, xul|treechildren::-moz-tree-row { padding: 0.3em inherit !important; @@ -2087,24 +2066,20 @@ border-radius: 0 !important; background-image: none !important; } - xul|treechildren::-moz-tree-row(multicol, odd) { background-color: var(--in-content-box-background-odd); } - html|select[size][multiple] > html|option:hover, xul|richlistbox > xul|richlistitem:not([disabled="true"], [selected]):hover, xul|treechildren::-moz-tree-row(hover) { background-color: var(--in-content-item-hover) !important; color: var(--in-content-item-hover-text) !important; } - xul|richlistbox > xul|richlistitem[selected], xul|treechildren::-moz-tree-row(selected) { background-color: var(--in-content-item-selected) !important; color: var(--in-content-item-selected-text) !important; } - xul|richlistbox:not(#categories) > xul|richlistitem[selected] { /* Ensure buttons/menulists inside richlistitems (containers, applications) look OK */ --in-content-button-background: color-mix(in srgb, currentColor 15%, transparent) !important; @@ -2114,11 +2089,9 @@ --in-content-button-text-color-hover: var(--in-content-item-selected-text) !important; --in-content-focus-outline-color: var(--in-content-item-selected-text) !important; } - xul|richlistitem[selected] xul|menulist:focus-visible { outline-offset: -2px !important; } - /* Use a 2px border so that selected row highlight is still visible behind an existing high-contrast border that uses the background color */ @media (prefers-contrast) { @@ -2132,7 +2105,6 @@ border: 1px solid var(--in-content-box-border-color) !important; color: var(--in-content-text-color) !important; } - /*- Each OS ----------------------------------------------------------------*/ @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7), @@ -2144,12 +2116,10 @@ xul|radio { padding-inline-start: 0 !important; } - /* Override menulist.css */ xul|menulist[disabled="true"] { background-color: var(--in-content-button-background) !important; } - xul|menulist:-moz-focusring > xul|*.menulist-label-box { outline: none !important; } @@ -2162,20 +2132,16 @@ xul|*.checkbox-label-box { appearance: none !important; } - xul|button[type="menu"] > xul|*.button-box > xul|*.button-menu-dropmarker { appearance: none !important; } - xul|menulist { font-size: inherit !important; } - xul|menulist::part(dropmarker) { display: -moz-box; margin-block: 6px !important; } - xul|menulist:-moz-focusring::part(label-box) { outline: none !important; } @@ -2185,22 +2151,18 @@ xul|menulist > xul|menupopup > xul|menuitem[selected="true"]::before { display: none !important; } - xul|menulist::part(dropmarker) { display: -moz-box !important; margin-block: 1px !important; } - xul|menulist > xul|menupopup xul|menu, xul|menulist > xul|menupopup xul|menuitem { padding-inline-end: 34px !important; } - xul|*.checkbox-icon, xul|*.radio-icon { margin-inline-end: 0 !important; } - xul|*.text-link:-moz-focusring { box-shadow: none !important; } @@ -2214,7 +2176,7 @@ border-radius: 4px !important; } } - /*= Cert Exeption Dialog =====================================================*/ + /*= Cert Exception Dialog ====================================================*/ @-moz-document url("chrome://pippki/content/exceptionDialog.xhtml") { #locationTextBox { @@ -2231,19 +2193,16 @@ #locationTextBox:focus { border-color: transparent !important; outline: 2px solid var(--in-content-focus-outline-color) !important; - outline-offset: -1px !important; - /* Prevents antialising around the corners */ + outline-offset: -1px !important; /* Prevents antialiasing around the corners */ } #locationTextBox:-moz-ui-invalid { border-color: transparent !important; outline: 2px solid var(--in-content-border-invalid) !important; - outline-offset: -1px !important; - /* Prevents antialising around the corners */ + outline-offset: -1px !important; /* Prevents antialiasing around the corners */ } #locationTextBox:disabled { opacity: 0.4 !important; } - #exceptiondialog:first-child > hbox > vbox:not([flex="1"]) { width: 48px !important; height: 48px !important; @@ -2263,7 +2222,6 @@ :root { --in-content-border-color: color-mix(in srgb, currentColor 41%, transparent) !important; } - #viewGroup > radio { border-radius: 8px !important; padding: var(--in-content-button-vertical-padding) var(--in-content-button-horizontal-padding) !important; @@ -2275,36 +2233,27 @@ background-size: 32px !important; -moz-context-properties: fill !important; fill: currentColor !important; - color: var(--in-content-deemphasized-text) !important; - /* FieldText */ + color: var(--in-content-deemphasized-text) !important; /* FieldText */ } #viewGroup > radio:hover { - background-color: var(--in-content-button-background-hover) !important; - /* #E0E8F6; */ + background-color: var(--in-content-button-background-hover) !important; /* #E0E8F6; */ } #viewGroup > radio[selected="true"] { - color: var(--in-content-button-text-color) !important; - /* SelectedItemText */ - background-color: var(--in-content-button-background-active) !important; - /* #C1D2EE; */ + color: var(--in-content-button-text-color) !important; /* SelectedItemText */ + background-color: var(--in-content-button-background-active) !important; /* #C1D2EE; */ } - #generalTab { --viewgroup-image: url(chrome://global/skin/icons/page-portrait.svg); } - #mediaTab { --viewgroup-image: url(chrome://browser/skin/canvas.svg); } - #permTab { --viewgroup-image: url(chrome://browser/skin/permissions.svg); } - #securityTab { --viewgroup-image: url(chrome://global/skin/icons/security.svg); } - #viewGroup > radio > .radio-label-box { /* Overwrite */ margin: 0 !important; @@ -2312,30 +2261,24 @@ } @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { #viewGroup > radio > .radio-label-box { - padding-top: 32px !important; - /* as -moz-image-region: rect(0px, 32px, 32px, 0px); */ + padding-top: 32px !important; /* as -moz-image-region: rect(0px, 32px, 32px, 0px); */ } } - #mainDeck input { color: var(--in-content-page-color) !important; } - #permList { -moz-appearance: none !important; color: var(--in-content-page-color) !important; background-color: var(--in-content-box-background) !important; } - .permission:hover { color: var(--in-content-text-color) !important; background-color: var(--in-content-button-background-hover) !important; } - .permission radio[disabled] { color: var(--in-content-deemphasized-text) !important; } - treecols { -moz-appearance: none !important; background: var(--in-content-table-header-background) !important; @@ -2351,7 +2294,6 @@ border-spacing: 0; text-align: center !important; } - tree, treechildren::-moz-tree-row { -moz-appearance: none !important; @@ -2359,7 +2301,6 @@ background-color: var(--in-content-table-background) !important; border: 1px solid var(--in-content-table-border-color) !important; } - treechildren::-moz-tree-row(odd) { background-color: var(--in-content-box-background-odd) !important; } @@ -2383,23 +2324,19 @@ font-weight: 600 !important; color: var(--in-content-item-selected-text) !important; } - #imagecontainerbox { background-color: var(--in-content-box-background) !important; } - #metatree, #imagetree, #imagecontainerbox, #permList { border-radius: 4px !important; } - #metatree, #imagetree { overflow: hidden !important; } - #topBar, #imagecontainerbox, #permList { @@ -2434,10 +2371,8 @@ :root { --organizer-color: var(--in-content-page-color); --organizer-deemphasized-color: var(--in-content-deemphasized-text); - --organizer-toolbar-background: rgb(249, 249, 251); - /* --toolbar-bgcolor */ - --organizer-pane-background: rgb(229, 229, 235); - /* --lwt-accent-color */ + --organizer-toolbar-background: rgb(249, 249, 251); /* --toolbar-bgcolor */ + --organizer-pane-background: rgb(229, 229, 235); /* --lwt-accent-color */ --organizer-content-background: var(--in-content-page-background); --organizer-hover-background: var(--in-content-button-background-hover); --organizer-hover-color: var(--organizer-color); @@ -2446,8 +2381,7 @@ --organizer-outline-color: var(--in-content-focus-outline-color); --organizer-separator-color: var(--organizer-pane-field-border-color); --organizer-border-color: var(--in-content-border-color); - --organizer-toolbar-field-background: rgb(240, 240, 244); - /* --lwt-accent-color */ + --organizer-toolbar-field-background: rgb(240, 240, 244); /* --lwt-accent-color */ --organizer-toolbar-field-background-focused: Field; --organizer-toolbar-field-border-color: transparent; --organizer-toolbar-field-focus-border-color: color-mix( @@ -2473,7 +2407,6 @@ } } } - /*- Toolbar & Menus ------------------------------------------------------*/ #placesToolbar { appearance: none !important; @@ -2498,14 +2431,12 @@ #placesToolbar > toolbarbutton:not([disabled]):hover:active { background-color: var(--organizer-selected-background) !important; } - #placesToolbar > toolbarbutton > .toolbarbutton-icon, #placesMenu > menu > image, #placesMenu > menu > .menubar-text { -moz-context-properties: fill !important; fill: currentColor !important; } - #placesMenu { margin-inline-start: 6px !important; } @@ -2528,11 +2459,9 @@ color: var(--organizer-selected-color) !important; } #placesMenu > menu > .menubar-text { - margin-block: 0 !important; - /* override menu.css */ + margin-block: 0 !important; /* override menu.css */ padding-inline-end: 4px !important; } - /*- Search Bar & Input ---------------------------------------------------*/ #searchFilter, #detailsPane html|input { @@ -2545,7 +2474,6 @@ padding-block: 2px !important; min-height: 24px !important; } - #searchFilter[focused] { box-shadow: var(--organizer-toolbar-field-focus-box-shadow) !important; background-color: var(--organizer-toolbar-field-background-focused) !important; @@ -2553,12 +2481,10 @@ outline: 2px solid var(--organizer-toolbar-field-focus-border-color) !important; outline-offset: -2px !important; } - /*- Sidebar & Splitter ---------------------------------------------------*/ #placesList { background-color: var(--organizer-pane-background) !important; } - #placesView > splitter { border: 0 !important; border-inline-end: 1px solid var(--organizer-border-color) !important; @@ -2568,28 +2494,23 @@ margin-inline-start: -3px !important; position: relative !important; } - /*- Downloads Pane -------------------------------------------------------*/ #downloadsRichListBox, #downloadsListBox { color: var(--organizer-color) !important; background-color: var(--organizer-content-background) !important; } - #clearDownloadsButton:focus-visible { outline: 2px solid var(--organizer-outline-color) !important; } - richlistitem[selected="true"], richlistitem:hover { background-color: var(--organizer-hover-background) !important; color: var(--organizer-color) !important; } - richlistbox:where(:focus) > richlistitem[selected="true"] { background-color: var(--organizer-selected-background) !important; } - /*- Tree -----------------------------------------------------------------*/ #contentView treecol { /* Use box-shadow to draw a bottom border instead of border-bottom @@ -2597,12 +2518,10 @@ * aligned with the items on the sidebar. */ box-shadow: inset 0 -1px var(--organizer-border-color) !important; } - tree { background-color: var(--organizer-content-background) !important; color: var(--organizer-color) !important; } - treecol:not([hideheader="true"]), treecolpicker { appearance: none !important; @@ -2611,7 +2530,6 @@ color: var(--organizer-color, inherit) !important; padding: 5px 10px !important; } - treecol:not([hideheader="true"], [sortable="false"]):hover, treecolpicker:hover { background-color: var(--organizer-hover-background) !important; @@ -2621,7 +2539,6 @@ treecolpicker:hover:active { background-color: var(--organizer-selected-background) !important; } - treecol:not([hideheader="true"], :first-child), treecolpicker { padding-left: 10px !important; @@ -2637,13 +2554,11 @@ ) 1 1 !important; } - treecol[sortDirection]:not([hideheader="true"]) > xul|*.treecol-sortdirection { fill: currentColor !important; width: 18px !important; height: 18px !important; } - treechildren::-moz-tree-row { background-color: transparent !important; } @@ -2675,7 +2590,10 @@ treechildren::-moz-tree-separator(selected) { border-color: var(--organizer-selected-color) !important; } - + treechildren::-moz-tree-cell-text(primary, dropOn), + treechildren::-moz-tree-drop-feedback { + background-color: var(--organizer-outline-color) !important; + } /*- Info Box -------------------------------------------------------------*/ #detailsPane { background-color: var(--organizer-pane-background) !important; @@ -2683,7 +2601,6 @@ padding: 5px !important; border-top: 1px solid var(--organizer-border-color) !important; } - #editBookmarkPanelRows .expander-up, #editBookmarkPanelRows .expander-down { appearance: none !important; @@ -2717,14 +2634,12 @@ #editBookmarkPanelRows .expander-down > .button-box { padding: 0 !important; } - #editBookmarkPanelRows .expander-up { list-style-image: url("chrome://global/skin/icons/arrow-up-12.svg"); } #editBookmarkPanelRows .expander-down { list-style-image: url("chrome://global/skin/icons/arrow-down-12.svg"); } - #places input { border: 1px solid var(--organizer-pane-field-border-color) !important; border-radius: 4px !important; @@ -2740,12 +2655,10 @@ #places input:not(:read-write):focus { outline: none !important; } - .caption-label { margin-inline-start: 8px !important; color: var(--organizer-deemphasized-color) !important; } - #editBMPanel_tagsSelectorRow > richlistbox { appearance: none !important; color: var(--organizer-color) !important; @@ -2799,10 +2712,11 @@ #protections-popup-footer .protections-popup-footer-button, #protections-popup-multiView .panel-subview-footer-button, #identity-popup-clear-sitedata-button, - #identity-popup-more-info { + #identity-popup-more-info, + #unified-extensions-manage-extensions, + .unified-extensions-item-open-menu { cursor: pointer !important; } - /* TODO: For now, fxa-menu doesn't show any status. (JS required, observe .syncNowBtn status) #PanelUI-fxa-menu-syncnow-button[syncstatus="active"] { @@ -2810,6 +2724,43 @@ } */ } +/*= Panel UI Button Separator ================================================*/ +@supports -moz-bool-pref("userChrome.decoration.panel_button_separator") { + :root:not([chromehidden~="toolbar"]) #PanelUI-button { + margin-inline-start: 3px; + padding-inline-start: 2px; + border-inline-start: 1px solid; + border-image: linear-gradient( + transparent 4px, + var(--toolbarseparator-color) 4px, + var(--toolbarseparator-color) calc(100% - 4px), + transparent calc(100% - 4px) + ); + border-image-slice: 1; + } +} +/*= Panel UI Arrow ===========================================================*/ +@supports -moz-bool-pref("userChrome.decoration.panel_arrow") { + #appMenu-popup { + background-image: url("../icons/panelarrow-vertical.svg"); + background-repeat: no-repeat; + background-position-x: right 10px; + background-position-y: top; + -moz-context-properties: fill, stroke; + fill: var(--panel-background); + stroke: var(--panel-border-color); + } + #appMenu-popup[side="top"] { + margin-top: -8px !important; /* Original: -4px */ + padding-top: 4px; + } + #appMenu-popup[side="bottom"] { + background-image: url("../icons/panelarrow-vertical-reverse.svg"); + background-position-y: bottom; + margin-bottom: -8px !important; /* Original: -4px */ + padding-bottom: 4px; + } +} @media (prefers-reduced-motion: no-preference) { /*= Field Border ===========================================================*/ @supports -moz-bool-pref("userChrome.decoration.field_border") { @@ -2818,14 +2769,21 @@ #searchbar:hover:not(:focus-within) { --toolbar-field-border-color: var(--toolbar-field-focus-border-color); } - + @supports -moz-bool-pref("userChrome.combined.urlbar_with_reload") { + #nav-bar-customization-target + > #stop-reload-button:hover + ~ #urlbar-container + #urlbar:not([focused="true"]) + > #urlbar-background { + --toolbar-field-border-color: var(--toolbar-field-focus-border-color); + } + } /*- Other Fields -----------------------------------------------------------*/ /* Sidebar */ .sidebar-panel[lwt-sidebar] #search-box:hover, body[lwt-sidebar] xul|search-textbox.tabsFilter:hover { border-color: var(--lwt-sidebar-highlight-background-color, Highlight) !important; } - .sidebar-panel:not([lwt-sidebar]) #search-box:hover, body:not([lwt-sidebar]) xul|search-textbox.tabsFilter:hover { border-color: AccentColor !important; @@ -2836,7 +2794,6 @@ border-color: -moz-accent-color !important; } } - /* Others */ #editBMPanel_namePicker:hover, #editBMPanel_tagsField:hover, @@ -2860,7 +2817,6 @@ #downloadsListBox .download-state[exists] .downloadDetails.downloadDetailsHover { color: var(--button-primary-hover-bgcolor); } - /* File moved or missing */ #downloadsListBox .download-state:not([exists], [state="0"]) .downloadTarget { text-decoration: line-through; @@ -2884,7 +2840,6 @@ #tabs-newtab-button > .toolbarbutton-icon { transition: background-color 1s var(--animation-easing-function) !important; } - button:hover, toolbarbutton:hover, stack:hover, @@ -2893,7 +2848,6 @@ #tabs-newtab-button:hover > .toolbarbutton-icon { transition: background-color 0.25s var(--animation-easing-function) !important; } - @media (-moz-gtk-csd-available) { .tabbrowser-tab:is([visuallyselected], [multiselected], [selected]) .tab-background:not(:-moz-lwtheme) { transition: background-image 0.25s var(--animation-easing-function) !important; @@ -2908,7 +2862,6 @@ .subviewbutton:hover { transition: background-color 0.1s var(--animation-easing-function) !important; } - /*- Pinned Tab -------------------------------------------------------------*/ #tabbrowser-tabs:not([movingtab]) .tabbrowser-tab:not([collapsed]) { /* -moz-box-flex may be caused #tabbrowser-tabs[closebuttons] */ @@ -2916,8 +2869,8 @@ margin-inline-start 0.2s var(--animation-easing-function), min-width 0.1s ease-out, max-width 0.1s ease-out !important; } #tabbrowser-tabs:not([movingtab]) .tabbrowser-tab[pinned] { - transition: -moz-box-flex 0.2s var(--animation-easing-function), - margin-inline-start 0.2s var(--animation-easing-function) !important; + transition: margin-inline-start 0.2s var(--animation-easing-function), min-width 0.1s ease-out, + max-width 0.1s ease-out !important; } #tabbrowser-tabs:not([movingtab]) .tab-content::before, #tabbrowser-tabs:not([movingtab]) .tab-content::after { @@ -2929,7 +2882,6 @@ #tabbrowser-tabs:not([movingtab]) .tab-content .tab-icon-image { transition: all 0.3s var(--animation-easing-function) !important; } - /*- URL / Search Bar -------------------------------------------------------*/ #urlbar-background, #searchbar { @@ -2941,7 +2893,6 @@ transition: border-color 0.5s var(--animation-easing-function), background-color 1s var(--animation-easing-function) !important; } - /* Buttons in URL bar */ #tracking-protection-icon-container, #identity-icon-box, @@ -2957,7 +2908,14 @@ #page-action-buttons > .urlbar-page-action:hover { transition: background-color 1.25s var(--animation-easing-function) !important; } - + @supports -moz-bool-pref("userChrome.combined.urlbar_with_reload") { + #nav-bar-customization-target > #stop-reload-button .toolbarbutton-icon { + transition: background-color 2.5s var(--animation-easing-function) !important; + } + #nav-bar-customization-target > #stop-reload-button .toolbarbutton-icon:hover { + transition: background-color 1.25s var(--animation-easing-function) !important; + } + } /*- Border - Other Fields --------------------------------------------------*/ #search-box, xul|search-textbox.tabsFilter, @@ -2973,7 +2931,6 @@ .findbar-container .findbar-textbox:hover { transition: border-color 0.5s var(--animation-easing-function) !important; } - /*- Sidebar ----------------------------------------------------------------*/ @supports not -moz-bool-pref("userChrome.decoration.disable_sidebar_animate") { #sidebar-box { @@ -3011,12 +2968,11 @@ #navigator-toolbox[inFullscreen="true"]:hover { margin-top: 0 !important; } - @keyframes fullscreen { from { margin-top: 0; } - /* Dont' use `to`: Depending on density */ + /* Don't use `to`: Depending on density */ } /*- Expand - Synced Tabs ---------------------------------------------------*/ @-moz-document url("chrome://browser/content/syncedtabs/sidebar.xhtml") @@ -3027,7 +2983,6 @@ opacity: 1; max-height: 100%; } - .item.client.closed .item-tabs-list { display: flex !important; transition: transform 0.2s ease-out, opacity 0.2s ease-out, @@ -3058,7 +3013,6 @@ #editBookmarkPanelRows .expander-down .button-icon { transition: transform 0.1s var(--animation-easing-function) !important; } - #editBookmarkPanelRows .expander-up { list-style-image: url("chrome://global/skin/icons/arrow-down.svg") !important; } @@ -3068,8 +3022,7 @@ } @supports -moz-bool-pref("userChrome.decoration.disable_panel_animate") { :root { - --panelui-subview-transition-duration: 1ms !important; - /* Disable top right corner menu sliding animation (0ms will not work!) */ + --panelui-subview-transition-duration: 1ms !important; /* Disable top right corner menu sliding animation (0ms will not work!) */ } } } @@ -3077,27 +3030,35 @@ /** Rounding ******************************************************************/ @supports -moz-bool-pref("userChrome.rounding.square_tab") { :root { - --tab-border-radius: 0 !important; - /* Original: 4px */ + --tab-border-radius: 0 !important; /* Original: 4px */ } } @supports -moz-bool-pref("userChrome.rounding.square_button") { :root { - --toolbarbutton-border-radius: 0 !important; - /* Original: 4px */ + --urlbar-icon-border-radius: 0 !important; /* Original: calc(var(--toolbarbutton-border-radius) - 1px); */ } - - button { + .toolbarbutton-1, + .toolbarbutton-icon, + .panel-info-button, + .searchbar-engine-one-off-item, + .urlbarView-button, + .urlbarView-tip-button, + .urlbarView-action, + toolbarbutton.bookmark-item:not(.subviewbutton), + #sidebar-switcher-target { + --toolbarbutton-border-radius: 0; /* Original: 4px */ + } + button, + findbar toolbarbutton, + .notification-button { border-radius: 0 !important; } } -@supports -moz-bool-pref("userChrome.rounding.square_tab") or -moz-bool-pref("userChrome.round.square_button") { - /* Fix Tab bar button radious */ - #TabsToolbar .toolbarbutton-1:not(#tabs-newtab-button) > .toolbarbutton-icon, - #TabsToolbar .toolbarbutton-1:not(#tabs-newtab-button) > .toolbarbutton-text, - #TabsToolbar .toolbarbutton-1:not(#tabs-newtab-button) > .toolbarbutton-badge-stack, +@supports -moz-bool-pref("userChrome.rounding.square_tab") or -moz-bool-pref("userChrome.rounding.square_button") { + /* Fix Tab bar button radius */ + #TabsToolbar .toolbarbutton-1:not(#tabs-newtab-button), .tab-close-button { - --tab-border-radius: var(--toolbarbutton-border-radius) !important; + --tab-border-radius: var(--toolbarbutton-border-radius); } } @supports -moz-bool-pref("userChrome.rounding.square_panel") { @@ -3131,6 +3092,16 @@ html|input { border-radius: 0 !important; } + #urlbar-input-container, + #urlbar-background, + #searchbar { + --toolbarbutton-border-radius: 0; + } +} +@supports -moz-bool-pref("userChrome.rounding.square_urlView_item") { + .urlbarView-row-inner { + --toolbarbutton-border-radius: 0; + } } @supports -moz-bool-pref("userChrome.rounding.square_checklabel") { .checkbox-check, @@ -3145,10 +3116,8 @@ /*= Tab Bar - Distribution padding, radius ===================================*/ @supports -moz-bool-pref("userChrome.tab.lepton_like_padding") or -moz-bool-pref("userChrome.tab.photon_like_padding") { :root { - --proton-tab-block-margin: var(--tab-block-margin) !important; - /* Original: 4px, Legacy */ + --proton-tab-block-margin: var(--tab-block-margin) !important; /* Original: 4px, Legacy */ } - :root[uidensity="touch"] { /* Like Original */ --tab-block-margin: 4px !important; @@ -3156,8 +3125,7 @@ } @supports -moz-bool-pref("userChrome.tab.lepton_like_padding") { :root { - --tab-block-margin: 2px !important; - /* New version of --proton-tab-block-margin */ + --tab-block-margin: 2px !important; /* New version of --proton-tab-block-margin */ } } @supports -moz-bool-pref("userChrome.tab.photon_like_padding") { @@ -3169,38 +3137,77 @@ @supports -moz-bool-pref("userChrome.padding.first_tab") { /* for First Tab Space */ :root { - --space-left-tabbar: 8px; - /* If the option is not specified, it is equivalent to 0px. */ + --uc-space-left-tabbar: 8px; /* If the option is not specified, it is equivalent to 0px. */ } - - :root:not([tabsintitlebar]) #tabbrowser-tabs:not([positionpinnedtabs]), - :root:is([sizemode="maximized"], [sizemode="fullscreen"]) #tabbrowser-tabs:not([positionpinnedtabs]) { - padding-inline-start: var(--space-left-tabbar) !important; + @supports not -moz-bool-pref("userChrome.padding.first_tab.always") { + :root:not([tabsintitlebar]) #tabbrowser-tabs:not([positionpinnedtabs]), + :root:is([sizemode="maximized"], [sizemode="fullscreen"]) #tabbrowser-tabs:not([positionpinnedtabs]) { + padding-inline-start: var(--uc-space-left-tabbar) !important; + } + } + @supports -moz-bool-pref("userChrome.padding.first_tab.always") { + :root:not([tabsintitlebar]) #tabbrowser-tabs, + :root:is([sizemode="maximized"], [sizemode="fullscreen"]) #tabbrowser-tabs { + padding-inline-start: calc(var(--tab-overflow-pinned-tabs-width, 0px) + var(--uc-space-left-tabbar)) !important; + } } } @supports -moz-bool-pref("userChrome.padding.tabbar_width") { /* Titlebar Space */ :root { - --uc-title-pre-spacer: 30px; - /* Original: 40px */ - --uc-title-post-spacer: 25px; - /* Original: 40px */ + --uc-title-pre-spacer: 30px; /* Original: 40px */ + --uc-title-post-spacer: 25px; /* Original: 40px */ } - - .titlebar-spacer[type="pre-tabs"] { - width: var(--uc-title-pre-spacer) !important; + :root:-moz-locale-dir(rtl) { + --uc-title-pre-spacer: 25px; + --uc-title-post-spacer: 30px; } - - .titlebar-spacer[type="post-tabs"] { - width: var(--uc-title-post-spacer) !important; + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-spacer[type="pre-tabs"] { + width: var(--uc-title-pre-spacer) !important; + } + .titlebar-spacer[type="post-tabs"] { + width: var(--uc-title-post-spacer) !important; + } + } + @media (-moz-gtk-csd-available) { + @media (-moz-gtk-csd-reversed-placement) { + .titlebar-spacer[type="pre-tabs"] { + width: var(--uc-title-pre-spacer) !important; + } + .titlebar-spacer[type="post-tabs"] { + width: var(--uc-title-post-spacer) !important; + } + } + } + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + .titlebar-spacer[type="pre-tabs"] { + width: var(--uc-title-post-spacer) !important; + } + .titlebar-spacer[type="post-tabs"] { + width: var(--uc-title-pre-spacer) !important; + } + } + @media (-moz-gtk-csd-available) { + @media (-moz-gtk-csd-reversed-placement: 0) { + .titlebar-spacer[type="pre-tabs"] { + width: var(--uc-title-post-spacer) !important; + } + .titlebar-spacer[type="post-tabs"] { + width: var(--uc-title-pre-spacer) !important; + } + } } - /* Tabbar Buttons */ :root { --newtab-button-minus-width-padding: 2px; --newtab-button-width-padding: calc(var(--toolbarbutton-inner-padding) - var(--newtab-button-minus-width-padding)); } - #new-tab-button > .toolbarbutton-icon, #alltabs-button > .toolbarbutton-badge-stack { /* Original: calc(2 * var(--toolbarbutton-inner-padding) + 16px) */ @@ -3209,7 +3216,6 @@ padding-left: var(--newtab-button-width-padding) !important; padding-right: var(--newtab-button-width-padding) !important; } - @supports not -moz-bool-pref("userChrome.tab.photon_like_padding") { #tabbrowser-tabs[haspinnedtabs]:not([positionpinnedtabs]) > #tabbrowser-arrowscrollbox @@ -3228,25 +3234,18 @@ --scrollbtn-inner-padding: 1px; --scrollbtn-outer-padding: 3px; } - #scrollbutton-up { - padding-left: var(--scrollbtn-inner-padding, 4px) !important; - /* Original: 4px */ + padding-left: var(--scrollbtn-inner-padding, 4px) !important; /* Original: 4px */ padding-right: var(--scrollbtn-outer-padding, 4px) !important; } - #scrollbutton-down { - padding-left: var(--scrollbtn-outer-padding, 4px) !important; - /* Original: 4px */ + padding-left: var(--scrollbtn-outer-padding, 4px) !important; /* Original: 4px */ padding-right: var(--scrollbtn-inner-padding, 4px) !important; } - :root:not([uidensity="touch"]) #new-tab-button, #alltabs-button { - --toolbarbutton-outer-padding: 1px; - /* Original: 2px*/ + --toolbarbutton-outer-padding: 1px; /* Original: 2px*/ } - /* Tab - Max Size */ @supports not -moz-bool-pref("userChrome.tab.photon_like_padding") { :root { @@ -3272,12 +3271,9 @@ } } } - .tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]) { - max-width: var(--tab-max-width) !important; - /* Original: 225px */ + max-width: var(--tab-max-width) !important; /* Original: 225px */ } - /* neighbouring tabs should "pinch" together */ @supports not -moz-bool-pref("userChrome.tab.photon_like_padding") { @supports -moz-bool-pref("userChrome.tab.lepton_like_padding") { @@ -3285,8 +3281,10 @@ padding-inline: 1px !important; } } - .tabbrowser-tab:not([last-visible-tab]) { - margin-inline-end: -1px !important; + @supports not -moz-bool-pref("userChrome.tabbar.multi_row") { + #TabsToolbar:not([multibar]) .tabbrowser-tab:not([last-visible-tab]) { + margin-inline-end: -1px !important; + } } } @supports -moz-bool-pref("userChrome.tab.photon_like_padding") { @@ -3299,18 +3297,15 @@ @supports -moz-bool-pref("userChrome.padding.drag_space") { /* for Extra Drag Space */ :root { - --space-above-tabbar: 8px; - /* If the option is not specified, it is equivalent to 0px. */ + --uc-space-above-tabbar: 8px; /* If the option is not specified, it is equivalent to 0px. */ } - @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { :root[tabsintitlebar][sizemode="normal"] #toolbar-menubar[autohide="true"] { - height: calc(var(--tab-min-height) + var(--space-above-tabbar) - var(--tabs-navbar-shadow-size)); + height: calc(var(--tab-min-height) + var(--uc-space-above-tabbar) - var(--tabs-navbar-shadow-size)); } - @supports -moz-bool-pref("userChrome.padding.drag_space.maximized") { :root[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[autohide="true"] { - height: calc(var(--tab-min-height) + var(--space-above-tabbar) - var(--tabs-navbar-shadow-size)); + height: calc(var(--tab-min-height) + var(--uc-space-above-tabbar) - var(--tabs-navbar-shadow-size)); } } } @@ -3320,18 +3315,17 @@ (-moz-platform: windows-win8), (-moz-gtk-csd-available) { :root[tabsintitlebar][sizemode="normal"] #toolbar-menubar[autohide="true"] { - height: calc(var(--tab-min-height) + var(--space-above-tabbar)); + height: calc(var(--tab-min-height) + var(--uc-space-above-tabbar)); } - @supports -moz-bool-pref("userChrome.padding.drag_space.maximized") { :root[tabsintitlebar][sizemode="maximized"] #toolbar-menubar[autohide="true"] { - height: calc(var(--tab-min-height) + var(--space-above-tabbar)); + height: calc(var(--tab-min-height) + var(--uc-space-above-tabbar)); } } } @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { #TabsToolbar > .toolbar-items { - padding-top: var(--space-above-tabbar) !important; + padding-top: var(--uc-space-above-tabbar) !important; } } @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7) { @@ -3339,13 +3333,12 @@ /* Add extra space to titlebar for dragging */ :root[sizemode="normal"][chromehidden~="menubar"] #TabsToolbar > .toolbar-items, :root[sizemode="normal"] #toolbar-menubar[autohide="true"][inactive] + #TabsToolbar > .toolbar-items { - padding-top: calc(var(--space-above-tabbar) + 4px) !important; + padding-top: calc(var(--uc-space-above-tabbar) + 4px) !important; } - @supports -moz-bool-pref("userChrome.padding.drag_space.maximized") { :root[sizemode="maximized"][chromehidden~="menubar"] #TabsToolbar > .toolbar-items, :root[sizemode="maximized"] #toolbar-menubar[autohide="true"][inactive] + #TabsToolbar > .toolbar-items { - padding-top: calc(var(--space-above-tabbar) + 4px) !important; + padding-top: calc(var(--uc-space-above-tabbar) + 4px) !important; } } } @@ -3357,13 +3350,12 @@ /* Add extra space to titlebar for dragging */ :root[sizemode="normal"][chromehidden~="menubar"] #TabsToolbar > .toolbar-items, :root[sizemode="normal"] #toolbar-menubar[autohide="true"][inactive] + #TabsToolbar > .toolbar-items { - padding-top: var(--space-above-tabbar) !important; + padding-top: var(--uc-space-above-tabbar) !important; } - @supports -moz-bool-pref("userChrome.padding.drag_space.maximized") { :root[sizemode="maximized"][chromehidden~="menubar"] #TabsToolbar > .toolbar-items, :root[sizemode="maximized"] #toolbar-menubar[autohide="true"][inactive] + #TabsToolbar > .toolbar-items { - padding-top: var(--space-above-tabbar) !important; + padding-top: var(--uc-space-above-tabbar) !important; } } } @@ -3391,7 +3383,6 @@ :root[uidensity="touch"] { --tab-min-height: 41px !important; } - /* Top Margin */ .tab-background, .tab-content { @@ -3401,31 +3392,49 @@ @supports not -moz-bool-pref("userChrome.tab.lepton_like_padding") { @supports not -moz-bool-pref("userChrome.tab.photon_like_padding") { :root:not([uidensity]) { - --tab-min-height: 36px !important; - /* 38px -> 36px */ + --tab-min-height: 36px !important; /* 38px -> 36px */ } :root[uidensity="compact"] { - --tab-min-height: 29px !important; - /* 36px -> 29px */ + --tab-min-height: 29px !important; /* 36px -> 29px */ } } } + :root { + /* Works with TabMixPlus */ + --tab-min-height_mlt: calc( + var(--tab-min-height) + 2 * (var(--tab-block-margin, var(--proton-tab-block-margin, 0px))) + ) !important; + } + #TabsToolbar[multibar] .tabbrowser-tab { + height: unset !important; /* Original: var(--tab-min-height_mlt) */ + } @supports -moz-bool-pref("userChrome.tab.connect_to_window") { + :root { + --tab-min-height_mlt: calc( + var(--tab-min-height) + var(--tab-block-margin, var(--proton-tab-block-margin, 0px)) + ) !important; + } #TabsToolbar { - --toolbarbutton-inner-padding: calc((var(--tab-min-height) - 18px) / 2) !important; - /* Prevent overflow pinned tab bottom margin */ + --toolbarbutton-inner-padding: calc( + (var(--tab-min-height) - 18px) / 2 + ) !important; /* Prevent overflow pinned tab bottom margin */ } - - :root:not([uidensity="compact"]) #tabbrowser-arrowscrollbox, - #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"], - #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"] .tab-stack, - #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"] .tab-content { - max-height: var(--tab-min-height) !important; - /* Force apply height */ - } - - :root[uidensity="compact"] #tabbrowser-arrowscrollbox { - height: var(--tab-min-height) !important; + @supports not -moz-bool-pref("userChrome.tabbar.multi_row") { + :root:not([uidensity="compact"]) #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox, + #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"], + #TabsToolbar:not([multibar]) + #tabbrowser-arrowscrollbox[overflowing="true"] + > .tabbrowser-tab[pinned="true"] + .tab-stack, + #TabsToolbar:not([multibar]) + #tabbrowser-arrowscrollbox[overflowing="true"] + > .tabbrowser-tab[pinned="true"] + .tab-content { + max-height: var(--tab-min-height) !important; /* Force apply height */ + } + :root[uidensity="compact"] #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox { + height: var(--tab-min-height) !important; + } } } /* Scroll Button - Size Fix */ @@ -3434,7 +3443,6 @@ --scrollbtn-vertical-border: 2px; --scrollbtn-border-radius: 7px; } - #scrollbutton-up, #scrollbutton-down { /* Original: var(--toolbarbutton-inner-padding) calc(var(--toolbarbutton-inner-padding) - 6px) = 9px */ @@ -3447,17 +3455,16 @@ /* Original: calc(var(--tab-border-radius) + 4px) = 8px */ border-radius: var(--scrollbtn-border-radius, calc(var(--tab-border-radius) + 4px)) !important; } - :root[tabsintitlebar]:not([uidensity="compact"]) #toolbar-menubar[autohide="true"] { - height: calc(var(--tab-min-height) - var(--tabs-navbar-shadow-size) - 2px); - /* Compact: 28px, Normal: 33px, Touch: 38px */ + height: calc( + var(--tab-min-height) - var(--tabs-navbar-shadow-size) - 2px + ); /* Compact: 28px, Normal: 33px, Touch: 38px */ } } /*= Tool Bar - Button Padding ================================================*/ @supports -moz-bool-pref("userChrome.padding.toolbar_button") { :root[uidensity="compact"] { - --toolbarbutton-outer-padding: 2px !important; - /* Original: 3px, General is 2px */ + --toolbarbutton-outer-padding: 2px !important; /* Original: 3px, General is 2px */ } } /*= Nav Bar - Reduce Width ===================================================*/ @@ -3468,52 +3475,44 @@ } } /*= URL Bar - Reduce Padding =================================================*/ -@supports -moz-bool-pref("userChrome.padding.urlbar") { - :root:not([uidensity="touch"]) #urlbar-container, - :root:not([uidensity="touch"]) #search-container { - padding-block: 3px !important; - /* Original: 4px */ - margin-inline: 5px !important; - /* Original: 5px */ - } - - :root:not([uidensity="compact"]) #urlbar-container, - :root:not([uidensity="compact"]) #search-container { - padding-block: 2px !important; - } - - /* spread menu */ - :root:not([uidensity]) .urlbarView-row { - padding-block: 1px !important; - /* Original: 2px */ - } - - :root[uidensity="compact"] .urlbarView-row { - padding-block: 0px !important; - } - - :root:not([uidensity]) #urlbar .search-one-offs:not([hidden]) { - padding-block: 8px !important; - /* Original: 10px */ - } - - :root[uidensity="compact"] #urlbar .search-one-offs:not([hidden]) { - padding-block: 2px !important; +@supports not -moz-bool-pref("userChrome.urlView.as_commandbar") { + @supports -moz-bool-pref("userChrome.padding.urlbar") { + :root:not([uidensity="touch"]) #urlbar-container, + :root:not([uidensity="touch"]) #search-container { + padding-block: 3px !important; /* Original: 4px */ + } + :root:not([uidensity="compact"]) #urlbar-container, + :root:not([uidensity="compact"]) #search-container { + padding-block: 2px !important; + } + /* spread menu */ + :root:not([uidensity]) .urlbarView-row { + padding-block: 1px !important; /* Original: 2px */ + } + :root[uidensity="compact"] .urlbarView-row { + padding-block: 0px !important; + } + :root:not([uidensity]) #urlbar .search-one-offs:not([hidden]) { + padding-block: 8px !important; /* Original: 10px */ + } + :root[uidensity="compact"] #urlbar .search-one-offs:not([hidden]) { + padding-block: 2px !important; + } } } -@supports -moz-bool-pref("userChrome.padding.urlView_expanding") { +@supports -moz-bool-pref("userChrome.padding.urlView_expanding") or -moz-bool-pref("userChrome.urlView.as_commandbar") { #urlbar[breakout][breakout-extend] { top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important; left: 0 !important; width: 100% !important; } - #urlbar[breakout][breakout-extend] > #urlbar-input-container { height: var(--urlbar-height) !important; padding-block: 0 !important; - padding-inline: 0 !important; + padding-inline: var(--urlbar-container-padding, 0px) !important; } - +} +@supports -moz-bool-pref("userChrome.padding.urlView_expanding") { #urlbar[breakout][breakout-extend] > #urlbar-background { animation-name: none !important; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05) !important; @@ -3524,7 +3523,6 @@ margin-inline: 0 !important; width: 100% !important; } - .urlbarView-row { padding-block: 0 !important; } @@ -3532,8 +3530,7 @@ /*= BookMark Bar - Reduce Height =============================================*/ @supports -moz-bool-pref("userChrome.padding.bookmarkbar") { :root[uidensity="compact"] #PersonalToolbar toolbarbutton { - margin-top: 0px; - /* Original: 2px */ + margin-top: 0px !important; /* Original: 2px */ } } /*= Info Bar - Reduce Padding ================================================*/ @@ -3543,44 +3540,33 @@ } } @supports -moz-bool-pref("userChrome.padding.infobar") { - :root:not([uidensity]) #tab-notification-deck { + :root:not([uidensity]) notification-message { --infobar-message-vertical-margin: 3px; --infobar-vertical-margin: 7px; --infobar-button-vertical-margin: 3px; } - - :root[uidensity="compact"] #tab-notification-deck { + :root[uidensity="compact"] notification-message { --infobar-message-vertical-margin: 2px; --infobar-vertical-margin: 6px; --infobar-button-vertical-margin: 2px; } - - :root[uidensity="touch"] #tab-notification-deck { + :root[uidensity="touch"] notification-message { --infobar-message-vertical-margin: 4px; --infobar-vertical-margin: 8px; --infobar-button-vertical-margin: 4px; } - .infobar > .icon { - margin-block: var(--infobar-vertical-margin) !important; - /* Original: 8px */ + margin-block: var(--infobar-vertical-margin) !important; /* Original: 8px */ } - .notification-message { - padding-block: var(--infobar-vertical-margin) !important; - /* Original: 8px */ + padding-block: var(--infobar-vertical-margin) !important; /* Original: 8px */ } - .notification-button-container > .notification-button { - margin-block: var(--infobar-button-vertical-margin) !important; - /* Original: 4px */ + margin-block: var(--infobar-button-vertical-margin) !important; /* Original: 4px */ } - .notification-close { - margin: var(--infobar-button-vertical-margin) 8px !important; - /* Original: 4px 8px */ + margin: var(--infobar-button-vertical-margin) 8px !important; /* Original: 4px 8px */ } - /* Hard coded for compatibility - Disappearing phenomenon */ .container.infobar::before { content: ""; @@ -3598,23 +3584,18 @@ /*= Menu - Reduce Padding ====================================================*/ @supports -moz-bool-pref("userChrome.padding.menu") { :root { - --menu-padding: 0.35em; - /* Win7, 8: 0px */ + --menu-padding: 0.35em; /* Win7, 8: 0px */ } - :root[uidensity="compact"] { --menu-padding: 0.25em; } - :root[uidensity="touch"] { --menu-padding: 0.5em; } - @supports -moz-bool-pref("userChrome.padding.menu_compact") { :root { --menu-padding: 2px; } - :root[uidensity="compact"] { --menu-padding: 0px; } @@ -3624,7 +3605,6 @@ /* Original: 0.5em */ padding-block: var(--menu-padding) !important; } - #ContentSelectDropdown > menupopup > menucaption, #ContentSelectDropdown > menupopup > menuitem { padding-block: 0 !important; @@ -3635,27 +3615,19 @@ padding-block: var(--menu-padding) !important; } } - @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { :root:not([uidensity="touch"]) .menu-text, :root:not([uidensity="touch"]) .menu-iconic-text { - padding-inline-end: 0 !important; - /* Original: 2px */ + padding-inline-end: 0 !important; /* Original: 2px */ } - :root:not([uidensity="touch"]) .menupopup-arrowscrollbox { - padding-block: 1px !important; - /* Original: 4px*/ + padding-block: 1px !important; /* Original: 4px*/ } - :root:not([uidensity="touch"]) #context-navigation:not([hidden]) { - padding: 0 0 1px !important; - /* Original: 0 0 4px*/ + padding: 0 0 1px !important; /* Original: 0 0 4px*/ } - :root:not([uidensity="touch"]) .menu-right { - margin-right: 6px !important; - /* Original: 12px */ + margin-right: 6px !important; /* Original: 12px */ } } @media (-moz-os-version: windows-win7), @@ -3667,7 +3639,6 @@ menupopup > menu { padding-block: calc(var(--menu-padding) - 2px) !important; } - /* Make to original */ :root:not([uidensity="touch"]) #context-navigation:not([hidden]) { padding: 0 0 4px !important; @@ -3688,16 +3659,13 @@ :root { --bookmark-menu-padding: 3px; } - :root[uidensity="compact"] { --bookmark-menu-padding: 1.5px; } - @supports -moz-bool-pref("userChrome.padding.menu_compact") { :root { --bookmark-menu-padding: 2px; } - :root[uidensity="compact"] { --bookmark-menu-padding: 0px; } @@ -3707,12 +3675,10 @@ :root:not([uidensity="touch"]) #PlacesToolbar menupopup[placespopup] .openintabs-menuitem { padding-block: var(--bookmark-menu-padding) !important; } - @supports -moz-bool-pref("userChrome.padding.menu_compact") or -moz-bool-pref("userChrome.padding.bookmark_menu.compact") { :root:not([uidensity="touch"]) #BMB_bookmarksPopup .bookmark-item, :root:not([uidensity="touch"]) #PlacesToolbar menupopup[placespopup] .bookmark-item { - min-height: unset !important; - /* Original: 24px */ + min-height: unset !important; /* Original: 24px */ } } } @@ -3722,29 +3688,23 @@ #main-menubar { -moz-box-flex: 1 !important; } - /* Rounding */ #main-menubar > menu { border-radius: 4px; } - /* Menubar item padding */ :root { --global-menubar-padding: 2px; } - :root[uidensity="compact"] { --global-menubar-padding: 1px; } - :root[uidensity="touch"] { --global-menubar-padding: 4px; } - #main-menubar > menu { padding-block: var(--global-menubar-padding) !important; } - /* Reduce items */ #main-menubar > menu > menupopup menuitem, #main-menubar > menu > menupopup menu { @@ -3754,28 +3714,26 @@ /*= Panel - Reduce padding ===================================================*/ @supports -moz-bool-pref("userChrome.padding.panel") { :root { - --arrowpanel-menuitem-margin: 0 var(--arrowpanel-menuicon-padding) !important; - /* Original: 0 8px */ - --arrowpanel-menuitem-padding-block: 5px !important; - /* Original: 8px */ - --arrowpanel-menuitem-padding-inline: 5px !important; - /* Original: 8px */ - --arrowpanel-menuitem-padding: var(--arrowpanel-menuitem-padding-block) var(--arrowpanel-menuitem-padding-inline) !important; - /* Compatibility */ - --arrowpanel-padding: 0.8em !important; - /* Original: 16px or .cui-widget-panel, .cui-widget-panel::part(arrowcontent) => 4px 0 */ + --arrowpanel-menuitem-margin: 0 var(--arrowpanel-menuicon-padding, 8px) !important; /* Original: 0 8px */ + --arrowpanel-menuitem-padding-block: 5px !important; /* Original: 8px */ + --arrowpanel-menuitem-padding-inline: 5px !important; /* Original: 8px */ + --arrowpanel-menuitem-padding: var(--arrowpanel-menuitem-padding-block) var(--arrowpanel-menuitem-padding-inline) !important; /* Compatibility */ + --arrowpanel-padding: 0.8em !important; /* Original: 16px or .cui-widget-panel, .cui-widget-panel::part(arrowcontent) => 4px 0 */ } - :root[uidensity="compact"] { --arrowpanel-menuitem-padding-block: 3px !important; --arrowpanel-menuitem-padding-inline: 3px !important; } - :root[uidensity="touch"] { - --arrowpanel-menuitem-padding-block: 8px !important; - /* Original: 8px */ - --arrowpanel-menuitem-padding-inline: 8px !important; - /* Original: 8px */ + --arrowpanel-menuitem-padding-block: 8px !important; /* Original: 8px */ + --arrowpanel-menuitem-padding-inline: 8px !important; /* Original: 8px */ + } + @supports not -moz-bool-pref("userChrome.icon.disabled") { + @supports not -moz-bool-pref("userChrome.icon.panel") { + .subviewbutton { + min-height: calc(16px + var(--arrowpanel-menuitem-padding-block) * 2) !important; + } + } } } @supports -moz-bool-pref("userChrome.padding.panel_header") { @@ -3787,62 +3745,49 @@ /*= Popup Panel - Reduce padding =============================================*/ @supports -moz-bool-pref("userChrome.padding.popup_panel") { #protections-popup-main-header-label { - height: unset !important; - /* Original: 37.6px */ + height: unset !important; /* Original: 37.6px */ } - #identity-popup, #permission-popup, #protections-popup { - --vertical-section-padding: 0.8em; - /* Original: 0.9em */ + --vertical-section-padding: 0.8em; /* Original: 0.9em */ } - .protections-popup-footer-button, .protections-popup-category { - min-height: 24px; - /* Original: 32px */ + min-height: 24px; /* Original: 32px */ height: unset !important; } - /** Popup panel - Compact mode */ /* Footer Button Height */ :root[uidensity="compact"] .panel-footer.panel-footer-menulike > button { padding: 3px 8px !important; } - /* Footer Button Height */ :root[uidensity="compact"] #protections-popup-trackersView-settings-button { margin: 4px 8px 0 !important; } - /* not cut off for Protection popup Footer on windows */ :root[uidensity="compact"] #protections-popup-multiView #protections-popup-footer { - padding: 3px 0 10px !important; + padding: 0 !important; } - /* Button and disabled category in Protection popup */ :root[uidensity="compact"] #protections-popup-multiView .protections-popup-footer-button, :root[uidensity="compact"] #protections-popup-multiView .protections-popup-category { height: 20px !important; min-height: 20px !important; } - /* Footer Button in Tracking Content Panel */ :root[uidensity="compact"] #protections-popup-multiView .panel-footer.panel-footer-menulike { margin: 0 0 3px !important; } - /* Identity popup header padding */ :root[uidensity="compact"] #identity-popup-multiView #identity-popup-mainView-panel-header { padding: 2px 5px !important; } - /* Text When There is no trackers */ :root[uidensity="compact"] #protections-popup-no-trackers-found-description { margin: 2em 4em !important; } - /* Download Item margin */ :root[uidensity="compact"] #downloadsListBox { margin: 0 !important; @@ -3853,11 +3798,9 @@ @supports -moz-bool-pref("userChrome.tabbar.on_bottom") or -moz-bool-pref("userChrome.fullscreen.overlap") { /* Don't use display: flex at not fullscreen!! side effect #372 */ :root[sizemode="fullscreen"] #navigator-toolbox { - display: flex !important; - /* Needed for content to take up entire height, compatibility with tabs on bottom */ + display: flex !important; /* Needed for content to take up entire height, compatibility with tabs on bottom */ flex-wrap: wrap; } - :root[sizemode="fullscreen"] #titlebar, :root[sizemode="fullscreen"] #nav-bar, :root[sizemode="fullscreen"] #PersonalToolbar, @@ -3865,7 +3808,6 @@ :root[sizemode="fullscreen"] #tab-notification-deck-template { flex-basis: 100%; } - /* -moz-default-appearance: -moz-window-titlebar */ :root[sizemode="fullscreen"] #titlebar { -moz-appearance: none !important; @@ -3877,30 +3819,23 @@ See the above repository for updates as well as full license text. */ /*= Tabbar - Move to bottom ==================================================*/ #titlebar { - order: 2; - /* When userChrome.fullscreen.overlap */ + order: 2; /* When userChrome.fullscreen.overlap */ -moz-box-ordinal-group: 2; --tabs-navbar-shadow-size: 0px; } - #tab-notification-deck { - order: 2; - /* When userChrome.fullscreen.overlap */ + order: 2; /* When userChrome.fullscreen.overlap */ -moz-box-ordinal-group: 2; } - #TabsToolbar .titlebar-spacer { display: none; } - #TabsToolbar-customization-target > .toolbarbutton-1:last-child { padding-inline-end: var(--toolbar-start-end-padding, 8px); } - @supports -moz-bool-pref("userChrome.tabbar.on_bottom.above_bookmark") { #PersonalToolbar { - order: 2; - /* When userChrome.fullscreen.overlap */ + order: 2; /* When userChrome.fullscreen.overlap */ -moz-box-ordinal-group: 2; } } @@ -3908,24 +3843,23 @@ @supports -moz-bool-pref("userChrome.tab.connect_to_window") { @supports -moz-bool-pref("userChrome.tab.color_like_toolbar") { #navigator-toolbox { - border-bottom-color: var(--toolbar-bgcolor) !important; - /* Original: 1px solid var(--chrome-content-separator-color); */ + border-bottom-color: var( + --toolbar-bgcolor + ) !important; /* Original: 1px solid var(--chrome-content-separator-color); */ } } } } - /*= Tabbar - Hidden at singgle tab ===========================================*/ + /*= Tabbar - Hidden at single tab ===========================================*/ @supports -moz-bool-pref("userChrome.tabbar.on_bottom.hidden_single_tab") { #tabbrowser-tabs .tabbrowser-tab:only-of-type { display: none !important; } - #tabbrowser-tabs, #tabbrowser-tabs arrowscrollbox { height: auto !important; min-height: auto !important; } - @media (prefers-reduced-motion: no-preference) { #tabbrowser-tabs { transition: height 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay); @@ -3936,38 +3870,21 @@ @supports -moz-bool-pref("userChrome.tabbar.on_bottom.menubar_on_top") { /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ - :root { - /* height if native titlebar is enabled, assumes empty menubar */ - --uc-menubar-height: 20px; - --uc-menubar-padding: 1px; - /* FF's menubar padding */ - --uc-menubar-container-height: calc(var(--uc-menubar-height) - (2 * var(--uc-menubar-padding))); - } - - :root[tabsintitlebar] { - /* height when native titlebar is disabled, more roomy so can fit buttons etc. */ - --uc-menubar-height: 30px; - } - /* Menubar on top patch - use with tabs_on_bottom.css */ /* Only really useful if menubar is ALWAYS visible */ :root:not([sizemode="fullscreen"]) { --uc-window-control-width: 0px !important; } - /* Since menubar is statically at top, remove fake drag-space that might be set by window_control_placeholder_support.css */ :root:not([sizemode="fullscreen"]) #nav-bar { border-inline-width: 0; } - #navigator-toolbox { -moz-window-dragging: drag; } - :root[sizemode="fullscreen"] #navigator-toolbox { padding-top: 0px !important; } - #toolbar-menubar { position: fixed; display: flex; @@ -3976,43 +3893,30 @@ width: 100%; overflow: hidden; } - :root[tabsintitlebar] #toolbar-menubar[autohide="true"]:not([inactive="true"]) { - height: var(--uc-menubar-height) !important; - /* calc(var(--tab-min-height) + 2 * var(--tab-block-margin)) */ + height: var(--uc-menubar-height) !important; /* calc(var(--tab-min-height) + 2 * var(--tab-block-margin)) */ } - #toolbar-menubar > .titlebar-buttonbox-container { height: 100%; order: 100; } - #toolbar-menubar > [flex] { flex-grow: 100; } - #toolbar-menubar > spacer[flex] { order: 99; flex-grow: 1; min-width: var(--uc-window-drag-space-post); } - #toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px; } - - #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, - #TabsToolbar > .titlebar-buttonbox-container { - height: var(--uc-menubar-container-height); - } - :root:not([chromehidden~="menubar"], [sizemode="fullscreen"]) #toolbar-menubar:not([autohide="true"]) + #TabsToolbar > .titlebar-buttonbox-container { visibility: collapse !important; } - :root:not([chromehidden~="menubar"]):not([sizemode="fullscreen"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container { @@ -4027,30 +3931,23 @@ See the above repository for updates as well as full license text. */ /*= Tabbar - Move to bottom ==================================================*/ #titlebar { - order: 2; - /* When userChrome.fullscreen.overlap */ + order: 2; /* When userChrome.fullscreen.overlap */ -moz-box-ordinal-group: 2; --tabs-navbar-shadow-size: 0px; } - #tab-notification-deck { - order: 2; - /* When userChrome.fullscreen.overlap */ + order: 2; /* When userChrome.fullscreen.overlap */ -moz-box-ordinal-group: 2; } - #TabsToolbar .titlebar-spacer { display: none; } - #TabsToolbar-customization-target > .toolbarbutton-1:last-child { padding-inline-end: var(--toolbar-start-end-padding, 8px); } - @supports -moz-bool-pref("userChrome.tabbar.on_bottom.above_bookmark") { #PersonalToolbar { - order: 2; - /* When userChrome.fullscreen.overlap */ + order: 2; /* When userChrome.fullscreen.overlap */ -moz-box-ordinal-group: 2; } } @@ -4058,24 +3955,23 @@ @supports -moz-bool-pref("userChrome.tab.connect_to_window") { @supports -moz-bool-pref("userChrome.tab.color_like_toolbar") { #navigator-toolbox { - border-bottom-color: var(--toolbar-bgcolor) !important; - /* Original: 1px solid var(--chrome-content-separator-color); */ + border-bottom-color: var( + --toolbar-bgcolor + ) !important; /* Original: 1px solid var(--chrome-content-separator-color); */ } } } } - /*= Tabbar - Hidden at singgle tab ===========================================*/ + /*= Tabbar - Hidden at single tab ===========================================*/ @supports -moz-bool-pref("userChrome.tabbar.on_bottom.hidden_single_tab") { #tabbrowser-tabs .tabbrowser-tab:only-of-type { display: none !important; } - #tabbrowser-tabs, #tabbrowser-tabs arrowscrollbox { height: auto !important; min-height: auto !important; } - @media screen and (max-width: 1100px) and (prefers-reduced-motion: no-preference) { #tabbrowser-tabs { transition: height 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay); @@ -4086,38 +3982,21 @@ @supports -moz-bool-pref("userChrome.tabbar.on_bottom.menubar_on_top") { /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ - :root { - /* height if native titlebar is enabled, assumes empty menubar */ - --uc-menubar-height: 20px; - --uc-menubar-padding: 1px; - /* FF's menubar padding */ - --uc-menubar-container-height: calc(var(--uc-menubar-height) - (2 * var(--uc-menubar-padding))); - } - - :root[tabsintitlebar] { - /* height when native titlebar is disabled, more roomy so can fit buttons etc. */ - --uc-menubar-height: 30px; - } - /* Menubar on top patch - use with tabs_on_bottom.css */ /* Only really useful if menubar is ALWAYS visible */ :root:not([sizemode="fullscreen"]) { --uc-window-control-width: 0px !important; } - /* Since menubar is statically at top, remove fake drag-space that might be set by window_control_placeholder_support.css */ :root:not([sizemode="fullscreen"]) #nav-bar { border-inline-width: 0; } - #navigator-toolbox { -moz-window-dragging: drag; } - :root[sizemode="fullscreen"] #navigator-toolbox { padding-top: 0px !important; } - #toolbar-menubar { position: fixed; display: flex; @@ -4126,43 +4005,30 @@ width: 100%; overflow: hidden; } - :root[tabsintitlebar] #toolbar-menubar[autohide="true"]:not([inactive="true"]) { - height: var(--uc-menubar-height) !important; - /* calc(var(--tab-min-height) + 2 * var(--tab-block-margin)) */ + height: var(--uc-menubar-height) !important; /* calc(var(--tab-min-height) + 2 * var(--tab-block-margin)) */ } - #toolbar-menubar > .titlebar-buttonbox-container { height: 100%; order: 100; } - #toolbar-menubar > [flex] { flex-grow: 100; } - #toolbar-menubar > spacer[flex] { order: 99; flex-grow: 1; min-width: var(--uc-window-drag-space-post); } - #toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px; } - - #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, - #TabsToolbar > .titlebar-buttonbox-container { - height: var(--uc-menubar-container-height); - } - :root:not([chromehidden~="menubar"], [sizemode="fullscreen"]) #toolbar-menubar:not([autohide="true"]) + #TabsToolbar > .titlebar-buttonbox-container { visibility: collapse !important; } - :root:not([chromehidden~="menubar"]):not([sizemode="fullscreen"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container { @@ -4188,23 +4054,22 @@ --uc-navbar-width: 24em; } } - #nav-bar { --uc-navbar-double-block: calc(2 * var(--uc-navbar-block, 0px)); height: calc(var(--uc-tabbar-height) - var(--uc-navbar-double-block)) !important; margin-top: calc(var(--uc-tabbar-hide-height) + var(--uc-navbar-double-block)) !important; margin-bottom: var(--uc-navbar-block, 0px) !important; - transform: translateY(calc(-1 * var(--uc-navbar-block, 0px))); } - #titlebar { transform: translateY(var(--uc-navbar-block, 0px)); } - #TabsToolbar > .titlebar-buttonbox-container { transform: translateY(calc(-1 * var(--uc-navbar-block, 0px))); } - + #navigator-toolbox { + position: relative; + z-index: 2; + } @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { :root { --uc-navbar-gap: 10px; @@ -4216,28 +4081,22 @@ :root[uidensity="touch"] { --uc-navbar-block: 3px; } - #nav-bar { - --toolbarbutton-inner-padding: 6px; - /* Original: 8px */ + --toolbarbutton-inner-padding: 6px; /* Original: 8px */ border-radius: var(--tab-border-radius, 4px); } - #nav-bar, #nav-bar-customization-target { -moz-box-align: center; } - - #urlbar[breakout] { - top: 0px !important; - /* Original: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2); */ + #urlbar-container { + min-height: calc(var(--urlbar-container-height) - 2px) !important; } } @supports -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { #navigator-toolbox { background-color: var(--toolbar-bgcolor) !important; } - #nav-bar { --lwt-tabs-border-color: transparent; background-color: unset !important; @@ -4245,27 +4104,27 @@ } } #urlbar-container { - min-width: calc(24px + 2 * var(--toolbarbutton-inner-padding)) !important; + min-width: calc( + var(--uc-oneliner-urlbar-base-width, 50px) + 24px + 2 * var(--toolbarbutton-inner-padding) + ) !important; + } + #urlbar[breakout][breakout-extend] { + min-width: calc(310px + 2 * (24px + 2 * var(--toolbarbutton-inner-padding))) !important; } - #PersonalToolbar { position: relative; z-index: -1; } - toolbarspring.chromeclass-toolbar-additional { display: none !important; } - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { #TabsToolbar { margin-inline-start: var(--uc-navbar-margin) !important; } - #nav-bar { margin-inline-end: var(--uc-tabbar-width) !important; } - .titlebar-spacer[type="pre-tabs"] { display: none !important; } @@ -4274,11 +4133,9 @@ #TabsToolbar { margin-inline-end: var(--uc-navbar-margin) !important; } - #nav-bar { margin-inline-start: var(--uc-tabbar-width) !important; } - .titlebar-spacer[type="post-tabs"] { display: none !important; } @@ -4298,23 +4155,22 @@ --uc-navbar-width: 24em; } } - #nav-bar { --uc-navbar-double-block: calc(2 * var(--uc-navbar-block, 0px)); height: calc(var(--uc-tabbar-height) - var(--uc-navbar-double-block)) !important; margin-top: calc(var(--uc-tabbar-hide-height) + var(--uc-navbar-double-block)) !important; margin-bottom: var(--uc-navbar-block, 0px) !important; - transform: translateY(calc(-1 * var(--uc-navbar-block, 0px))); } - #titlebar { transform: translateY(var(--uc-navbar-block, 0px)); } - #TabsToolbar > .titlebar-buttonbox-container { transform: translateY(calc(-1 * var(--uc-navbar-block, 0px))); } - + #navigator-toolbox { + position: relative; + z-index: 2; + } @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { :root { --uc-navbar-gap: 10px; @@ -4326,28 +4182,22 @@ :root[uidensity="touch"] { --uc-navbar-block: 3px; } - #nav-bar { - --toolbarbutton-inner-padding: 6px; - /* Original: 8px */ + --toolbarbutton-inner-padding: 6px; /* Original: 8px */ border-radius: var(--tab-border-radius, 4px); } - #nav-bar, #nav-bar-customization-target { -moz-box-align: center; } - - #urlbar[breakout] { - top: 0px !important; - /* Original: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2); */ + #urlbar-container { + min-height: calc(var(--urlbar-container-height) - 2px) !important; } } @supports -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { #navigator-toolbox { background-color: var(--toolbar-bgcolor) !important; } - #nav-bar { --lwt-tabs-border-color: transparent; background-color: unset !important; @@ -4355,27 +4205,27 @@ } } #urlbar-container { - min-width: calc(24px + 2 * var(--toolbarbutton-inner-padding)) !important; + min-width: calc( + var(--uc-oneliner-urlbar-base-width, 50px) + 24px + 2 * var(--toolbarbutton-inner-padding) + ) !important; + } + #urlbar[breakout][breakout-extend] { + min-width: calc(310px + 2 * (24px + 2 * var(--toolbarbutton-inner-padding))) !important; } - #PersonalToolbar { position: relative; z-index: -1; } - toolbarspring.chromeclass-toolbar-additional { display: none !important; } - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { #TabsToolbar { margin-inline-start: var(--uc-navbar-margin) !important; } - #nav-bar { margin-inline-end: var(--uc-tabbar-width) !important; } - .titlebar-spacer[type="pre-tabs"] { display: none !important; } @@ -4384,11 +4234,9 @@ #TabsToolbar { margin-inline-end: var(--uc-navbar-margin) !important; } - #nav-bar { margin-inline-start: var(--uc-tabbar-width) !important; } - .titlebar-spacer[type="post-tabs"] { display: none !important; } @@ -4402,18 +4250,12 @@ ) or -moz-bool-pref("userChrome.tabbar.as_titlebar") { :root { - --uc-window-control-width: 0px; - /* Same as .titlebar-buttonbox-container - Space reserved for window controls */ - --uc-window-drag-space-pre: 0px; - /* Same as .titlebar-spacer[type="pre-tabs"] - Extra space reserved on both sides of the nav-bar to be able to drag the window */ - --uc-window-drag-space-post: 0px; - /* Same as .titlebar-spacer[type="post-tabs"] */ - --uc-widow-control-space: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post)); + --uc-window-control-width: 0px; /* Same as .titlebar-buttonbox-container - Space reserved for window controls */ + --uc-window-drag-space-pre: 0px; /* Same as .titlebar-spacer[type="pre-tabs"] - Extra space reserved on both sides of the nav-bar to be able to drag the window */ + --uc-window-drag-space-post: 0px; /* Same as .titlebar-spacer[type="post-tabs"] */ + --uc-window-control-space: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post)); } - :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - --uc-window-control-width: 84px; - /* 84px is default value of linux */ --uc-window-drag-space-pre: var(--uc-title-pre-spacer, 40px); --uc-window-drag-space-post: var(--uc-title-post-spacer, 40px); } @@ -4430,15 +4272,174 @@ --uc-window-control-width: 138px; } } - @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + @media (-moz-gtk-csd-available) { :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - --uc-window-control-width: 72px; + /* 84px is default value of linux */ + } + @media (-moz-gtk-csd-minimize-button), (-moz-gtk-csd-maximize-button), (-moz-gtk-csd-close-button) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-control-width: 28px; + } + } + @media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button), + (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-close-button), + (-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-control-width: 56px; + } + } + @media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-control-width: 84px; + } + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + :root[tabsintitlebar] { + --uc-window-control-width: 72px; + } + :root[sizemode="fullscreen"] { + --uc-window-control-space: 0px; } } - :root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) { --uc-window-drag-space-pre: 0px; - /* Remove pre space */ + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-drag-space-pre: 0px; + } + } + @media (-moz-gtk-csd-available) { + @media (-moz-gtk-csd-reversed-placement: 0) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-drag-space-pre: 0px; + } + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-control-space: 0px; + } + } + @media (-moz-gtk-csd-available) { + @media (-moz-gtk-csd-reversed-placement) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-control-space: 0px; + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.as_titlebar") { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) #tabbrowser-tabs { + --uc-window-control-space: 0px; + } + } + } + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + @supports not -moz-bool-pref("userChrome.tabbar.as_titlebar") { + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-control-space: 0px; + } + } + @media (-moz-gtk-csd-available) { + @media (-moz-gtk-csd-reversed-placement: 0) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-control-space: 0px; + } + } + } + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @media screen and (max-width: 1100px) { + @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") or not -moz-bool-pref("userChrome.hidden.tabbar") { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-drag-space-pre: 0px; + --uc-window-control-space: 0px; + } + } + } + @media screen and (min-width: 1100px) { + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-drag-space-pre: 0px; + } + } + @media (-moz-gtk-csd-available) { + @media screen and (min-width: 1100px) and (-moz-gtk-csd-reversed-placement: 0) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-drag-space-pre: 0px; + } + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-control-space: 0px; + } + } + @media (-moz-gtk-csd-available) { + @media screen and (min-width: 1100px) and (-moz-gtk-csd-reversed-placement) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-control-space: 0px; + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.as_titlebar") { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) #tabbrowser-tabs { + --uc-window-control-space: 0px; + } + } + } + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + @supports not -moz-bool-pref("userChrome.tabbar.as_titlebar") { + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-control-space: 0px; + } + } + @media (-moz-gtk-csd-available) { + @media screen and (min-width: 1100px) and (-moz-gtk-csd-reversed-placement: 0) { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + --uc-window-control-space: 0px; + } + } + } + } + } + } + } + } + @supports selector(:has(a)) { + #navigator-toolbox:has(#toolbar-menubar[autohide="false"]) { + --uc-window-drag-space-pre: 0px; + --uc-window-control-space: 0px; + } } } @supports -moz-bool-pref("userChrome.tabbar.on_bottom") or -moz-bool-pref("userChrome.tabbar.one_liner") or -moz-bool-pref( @@ -4449,10 +4450,57 @@ /*= Windows Control - Move to toolbar ========================================*/ /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ + /* Titlebar Button Box */ :root { --uc-titlebar-padding: 0px; } - + #navigator-toolbox { + padding-top: var(--uc-titlebar-padding) !important; + } + @supports -moz-bool-pref("userChrome.tabbar.on_bottom") { + @supports -moz-bool-pref("userChrome.tabbar.on_bottom.menubar_on_top") { + #navigator-toolbox { + padding-top: calc( + max(var(--uc-menubar-height), var(--uc-menubar-height-default)) + var(--uc-titlebar-padding) + ) !important; + } + } + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, + #TabsToolbar > .titlebar-buttonbox-container { + position: fixed; + display: block; + top: 0; + right: 0; + z-index: 1; + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container { + height: var(--uc-titlebar-buttonbox-height, var(--uc-navbar-height, 36px)); + } + @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { + } + .titlebar-buttonbox-container > .titlebar-buttonbox { + height: 100%; + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container > .titlebar-buttonbox { + margin-block: 10px; + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + } + @media (-moz-gtk-csd-available) { + @media (-moz-gtk-csd-reversed-placement) { + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + } + } @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7), (-moz-os-version: windows-win8), @@ -4462,36 +4510,23 @@ :root[sizemode="maximized"][tabsintitlebar] { --uc-titlebar-padding: 8px; } + :root[sizemode="maximized"][tabsintitlebar] #navigator-toolbox-background { + margin-top: calc(-1 * var(--uc-titlebar-padding)); + } + :root[sizemode="normal"][tabsintitlebar] #titlebar, + :root[sizemode="maximized"][tabsintitlebar] #titlebar { + appearance: none !important; + } + .browser-toolbar:not(.titlebar-color) { + background-clip: border-box !important; + } } - #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, - #TabsToolbar > .titlebar-buttonbox-container { - position: fixed; - display: block; - top: var(--uc-titlebar-padding); - right: 0; - height: 40px; - z-index: 1; - } - - /* where window controls are on left */ @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - :root { - --uc-titlebar-padding: 0px !important; - } - - .titlebar-buttonbox-container { - left: 0; - right: unset !important; + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; } } - #navigator-toolbox { - padding-top: calc(var(--uc-menubar-height, 0px) + var(--uc-titlebar-padding)) !important; - } - - :root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container { - height: 32px; - } - @supports not -moz-bool-pref("userChrome.hidden.tabbar") { #toolbar-menubar[inactive] > .titlebar-buttonbox-container { opacity: 0; @@ -4510,7 +4545,6 @@ } } } - @supports -moz-bool-pref("userChrome.hidden.tabbar") { @supports -moz-bool-pref("userChrome.autohide.navbar") { #navigator-toolbox:is(:hover, :focus-within) @@ -4521,41 +4555,17 @@ } } } - @media (prefers-reduced-motion: no-preference) { #toolbar-menubar[inactive] > .titlebar-buttonbox-container { transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay, 600ms), visibility 100ms var(--animation-easing-function) 0.25s !important; } - #navigator-toolbox:is(:hover, :focus-within) #toolbar-menubar[inactive]:not([customizing]) > .titlebar-buttonbox-container { transition-delay: 0s !important; } } - .titlebar-buttonbox-container > .titlebar-buttonbox { - height: 100%; - } - @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - .titlebar-buttonbox-container > .titlebar-buttonbox { - margin-block: 10px; - } - } - - /* At Full Screen */ - :root[sizemode="fullscreen"] #window-controls { - position: fixed; - display: flex; - top: 0; - right: 0; - height: 40px; - } - - :root[uidensity="compact"][sizemode="fullscreen"] #window-controls { - height: 32px; - } - @supports -moz-bool-pref("browser.fullscreen.autohide") { :root[sizemode="fullscreen"] #navigator-toolbox:not(:hover) .titlebar-buttonbox-container { visibility: hidden; @@ -4578,7 +4588,6 @@ > .titlebar-buttonbox-container { display: block !important; } - @supports not -moz-bool-pref("userChrome.hidden.tabbar") { :root:not([chromehidden~="menubar"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container { visibility: hidden; @@ -4592,10 +4601,57 @@ /*= Windows Control - Move to toolbar ========================================*/ /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ + /* Titlebar Button Box */ :root { --uc-titlebar-padding: 0px; } - + #navigator-toolbox { + padding-top: var(--uc-titlebar-padding) !important; + } + @supports -moz-bool-pref("userChrome.tabbar.on_bottom") { + @supports -moz-bool-pref("userChrome.tabbar.on_bottom.menubar_on_top") { + #navigator-toolbox { + padding-top: calc( + max(var(--uc-menubar-height), var(--uc-menubar-height-default)) + var(--uc-titlebar-padding) + ) !important; + } + } + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, + #TabsToolbar > .titlebar-buttonbox-container { + position: fixed; + display: block; + top: 0; + right: 0; + z-index: 1; + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container { + height: var(--uc-titlebar-buttonbox-height, var(--uc-navbar-height, 36px)); + } + @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { + } + .titlebar-buttonbox-container > .titlebar-buttonbox { + height: 100%; + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container > .titlebar-buttonbox { + margin-block: 10px; + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + } + @media (-moz-gtk-csd-available) { + @media (-moz-gtk-csd-reversed-placement) { + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + } + } @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7), (-moz-os-version: windows-win8), @@ -4605,36 +4661,171 @@ :root[sizemode="maximized"][tabsintitlebar] { --uc-titlebar-padding: 8px; } + :root[sizemode="maximized"][tabsintitlebar] #navigator-toolbox-background { + margin-top: calc(-1 * var(--uc-titlebar-padding)); + } + :root[sizemode="normal"][tabsintitlebar] #titlebar, + :root[sizemode="maximized"][tabsintitlebar] #titlebar { + appearance: none !important; + } + .browser-toolbar:not(.titlebar-color) { + background-clip: border-box !important; + } } - #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, - #TabsToolbar > .titlebar-buttonbox-container { - position: fixed; - display: block; - top: var(--uc-titlebar-padding); - right: 0; - height: 40px; - z-index: 1; - } - - /* where window controls are on left */ @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - :root { - --uc-titlebar-padding: 0px !important; - } - - .titlebar-buttonbox-container { - left: 0; - right: unset !important; + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; + } + } + @supports not -moz-bool-pref("userChrome.hidden.tabbar") { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + opacity: 0; + visibility: collapse; + } + } + @supports -moz-bool-pref("userChrome.hidden.tabbar") { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + opacity: 1; + visibility: visible; + } + @supports -moz-bool-pref("userChrome.autohide.navbar") { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + opacity: 0; + visibility: collapse; + } + } + } + @supports -moz-bool-pref("userChrome.hidden.tabbar") { + @supports -moz-bool-pref("userChrome.autohide.navbar") { + #navigator-toolbox:is(:hover, :focus-within) + #toolbar-menubar[inactive]:not([customizing]) + > .titlebar-buttonbox-container { + opacity: 1; + visibility: visible; + } + } + } + @media (prefers-reduced-motion: no-preference) { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay, 600ms), + visibility 100ms var(--animation-easing-function) 0.25s !important; + } + #navigator-toolbox:is(:hover, :focus-within) + #toolbar-menubar[inactive]:not([customizing]) + > .titlebar-buttonbox-container { + transition-delay: 0s !important; + } + } + @supports -moz-bool-pref("browser.fullscreen.autohide") { + :root[sizemode="fullscreen"] #navigator-toolbox:not(:hover) .titlebar-buttonbox-container { + visibility: hidden; + } + } + @supports -moz-bool-pref("userChrome.hidden.tabbar") { + :root[inFullscreen]:not([macOSNativeFullscreen]) #toolbar-menubar { + visibility: visible !important; + min-height: 0 !important; + max-height: 0 !important; + } + :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { + visibility: collapse !important; + } + } + /* At Activated Menubar */ + :root:not([chromehidden~="menubar"], [sizemode="fullscreen"]) + #toolbar-menubar:not([autohide="true"]) + + #TabsToolbar + > .titlebar-buttonbox-container { + display: block !important; + } + @supports not -moz-bool-pref("userChrome.hidden.tabbar") { + :root:not([chromehidden~="menubar"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container { + visibility: hidden; + } + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + /*= Windows Control - Move to toolbar ========================================*/ + /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 + See the above repository for updates as well as full license text. */ + /* Titlebar Button Box */ + :root { + --uc-titlebar-padding: 0px; + } + #navigator-toolbox { + padding-top: var(--uc-titlebar-padding) !important; + } + @supports -moz-bool-pref("userChrome.tabbar.on_bottom") { + @supports -moz-bool-pref("userChrome.tabbar.on_bottom.menubar_on_top") { + #navigator-toolbox { + padding-top: calc( + max(var(--uc-menubar-height), var(--uc-menubar-height-default)) + var(--uc-titlebar-padding) + ) !important; + } + } + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, + #TabsToolbar > .titlebar-buttonbox-container { + position: fixed; + display: block; + top: 0; + right: 0; + z-index: 1; + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container { + height: var(--uc-titlebar-buttonbox-height, var(--uc-navbar-height, 36px)); + } + @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { + } + .titlebar-buttonbox-container > .titlebar-buttonbox { + height: 100%; + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container > .titlebar-buttonbox { + margin-block: 10px; + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + } + @media (-moz-gtk-csd-available) { + @media (-moz-gtk-csd-reversed-placement) { + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + } + } + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + :root[sizemode="maximized"][tabsintitlebar] { + --uc-titlebar-padding: 8px; + } + :root[sizemode="maximized"][tabsintitlebar] #navigator-toolbox-background { + margin-top: calc(-1 * var(--uc-titlebar-padding)); + } + :root[sizemode="normal"][tabsintitlebar] #titlebar, + :root[sizemode="maximized"][tabsintitlebar] #titlebar { + appearance: none !important; + } + .browser-toolbar:not(.titlebar-color) { + background-clip: border-box !important; + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; } } - #navigator-toolbox { - padding-top: calc(var(--uc-menubar-height, 0px) + var(--uc-titlebar-padding)) !important; - } - - :root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container { - height: 32px; - } - @supports not -moz-bool-pref("userChrome.hidden.tabbar") { #toolbar-menubar[inactive] > .titlebar-buttonbox-container { opacity: 0; @@ -4653,7 +4844,6 @@ } } } - @supports -moz-bool-pref("userChrome.hidden.tabbar") { @supports -moz-bool-pref("userChrome.autohide.navbar") { #navigator-toolbox:is(:hover, :focus-within) @@ -4664,41 +4854,17 @@ } } } - @media (prefers-reduced-motion: no-preference) { #toolbar-menubar[inactive] > .titlebar-buttonbox-container { transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay, 600ms), visibility 100ms var(--animation-easing-function) 0.25s !important; } - #navigator-toolbox:is(:hover, :focus-within) #toolbar-menubar[inactive]:not([customizing]) > .titlebar-buttonbox-container { transition-delay: 0s !important; } } - .titlebar-buttonbox-container > .titlebar-buttonbox { - height: 100%; - } - @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - .titlebar-buttonbox-container > .titlebar-buttonbox { - margin-block: 10px; - } - } - - /* At Full Screen */ - :root[sizemode="fullscreen"] #window-controls { - position: fixed; - display: flex; - top: 0; - right: 0; - height: 40px; - } - - :root[uidensity="compact"][sizemode="fullscreen"] #window-controls { - height: 32px; - } - @supports -moz-bool-pref("browser.fullscreen.autohide") { :root[sizemode="fullscreen"] #navigator-toolbox:not(:hover) .titlebar-buttonbox-container { visibility: hidden; @@ -4721,7 +4887,6 @@ > .titlebar-buttonbox-container { display: block !important; } - @supports not -moz-bool-pref("userChrome.hidden.tabbar") { :root:not([chromehidden~="menubar"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container { visibility: hidden; @@ -4735,10 +4900,57 @@ /*= Windows Control - Move to toolbar ========================================*/ /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ + /* Titlebar Button Box */ :root { --uc-titlebar-padding: 0px; } - + #navigator-toolbox { + padding-top: var(--uc-titlebar-padding) !important; + } + @supports -moz-bool-pref("userChrome.tabbar.on_bottom") { + @supports -moz-bool-pref("userChrome.tabbar.on_bottom.menubar_on_top") { + #navigator-toolbox { + padding-top: calc( + max(var(--uc-menubar-height), var(--uc-menubar-height-default)) + var(--uc-titlebar-padding) + ) !important; + } + } + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, + #TabsToolbar > .titlebar-buttonbox-container { + position: fixed; + display: block; + top: 0; + right: 0; + z-index: 1; + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container { + height: var(--uc-titlebar-buttonbox-height, var(--uc-navbar-height, 36px)); + } + @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { + } + .titlebar-buttonbox-container > .titlebar-buttonbox { + height: 100%; + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container > .titlebar-buttonbox { + margin-block: 10px; + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + } + @media (-moz-gtk-csd-available) { + @media screen and (max-width: 1100px) and (-moz-gtk-csd-reversed-placement) { + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + } + } @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7), (-moz-os-version: windows-win8), @@ -4748,36 +4960,23 @@ :root[sizemode="maximized"][tabsintitlebar] { --uc-titlebar-padding: 8px; } + :root[sizemode="maximized"][tabsintitlebar] #navigator-toolbox-background { + margin-top: calc(-1 * var(--uc-titlebar-padding)); + } + :root[sizemode="normal"][tabsintitlebar] #titlebar, + :root[sizemode="maximized"][tabsintitlebar] #titlebar { + appearance: none !important; + } + .browser-toolbar:not(.titlebar-color) { + background-clip: border-box !important; + } } - #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, - #TabsToolbar > .titlebar-buttonbox-container { - position: fixed; - display: block; - top: var(--uc-titlebar-padding); - right: 0; - height: 40px; - z-index: 1; - } - - /* where window controls are on left */ @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - :root { - --uc-titlebar-padding: 0px !important; - } - - .titlebar-buttonbox-container { - left: 0; - right: unset !important; + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; } } - #navigator-toolbox { - padding-top: calc(var(--uc-menubar-height, 0px) + var(--uc-titlebar-padding)) !important; - } - - :root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container { - height: 32px; - } - @supports not -moz-bool-pref("userChrome.hidden.tabbar") { #toolbar-menubar[inactive] > .titlebar-buttonbox-container { opacity: 0; @@ -4796,7 +4995,6 @@ } } } - @supports -moz-bool-pref("userChrome.hidden.tabbar") { @supports -moz-bool-pref("userChrome.autohide.navbar") { #navigator-toolbox:is(:hover, :focus-within) @@ -4807,9 +5005,6 @@ } } } - - /* At Full Screen */ - /* At Activated Menubar */ } @media screen and (max-width: 1100px) and (prefers-reduced-motion: no-preference) { @@ -4817,37 +5012,12 @@ transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay, 600ms), visibility 100ms var(--animation-easing-function) 0.25s !important; } - #navigator-toolbox:is(:hover, :focus-within) #toolbar-menubar[inactive]:not([customizing]) > .titlebar-buttonbox-container { transition-delay: 0s !important; } } - @media screen and (max-width: 1100px) { - .titlebar-buttonbox-container > .titlebar-buttonbox { - height: 100%; - } - @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - .titlebar-buttonbox-container > .titlebar-buttonbox { - margin-block: 10px; - } - } - } - @media screen and (max-width: 1100px) { - :root[sizemode="fullscreen"] #window-controls { - position: fixed; - display: flex; - top: 0; - right: 0; - height: 40px; - } - } - @media screen and (max-width: 1100px) { - :root[uidensity="compact"][sizemode="fullscreen"] #window-controls { - height: 32px; - } - } @media screen and (max-width: 1100px) { @supports -moz-bool-pref("browser.fullscreen.autohide") { :root[sizemode="fullscreen"] #navigator-toolbox:not(:hover) .titlebar-buttonbox-container { @@ -4883,15 +5053,62 @@ } } } - @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - @media screen and (min-width: 1100px) { + @media screen and (min-width: 1100px) { + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { /*= Windows Control - Move to toolbar ========================================*/ /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ + /* Titlebar Button Box */ :root { --uc-titlebar-padding: 0px; } - + #navigator-toolbox { + padding-top: var(--uc-titlebar-padding) !important; + } + @supports -moz-bool-pref("userChrome.tabbar.on_bottom") { + @supports -moz-bool-pref("userChrome.tabbar.on_bottom.menubar_on_top") { + #navigator-toolbox { + padding-top: calc( + max(var(--uc-menubar-height), var(--uc-menubar-height-default)) + var(--uc-titlebar-padding) + ) !important; + } + } + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, + #TabsToolbar > .titlebar-buttonbox-container { + position: fixed; + display: block; + top: 0; + right: 0; + z-index: 1; + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container { + height: var(--uc-titlebar-buttonbox-height, var(--uc-navbar-height, 36px)); + } + @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { + } + .titlebar-buttonbox-container > .titlebar-buttonbox { + height: 100%; + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container > .titlebar-buttonbox { + margin-block: 10px; + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + } + @media (-moz-gtk-csd-available) { + @media screen and (min-width: 1100px) and (-moz-gtk-csd-reversed-placement) { + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + } + } @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7), (-moz-os-version: windows-win8), @@ -4901,36 +5118,23 @@ :root[sizemode="maximized"][tabsintitlebar] { --uc-titlebar-padding: 8px; } + :root[sizemode="maximized"][tabsintitlebar] #navigator-toolbox-background { + margin-top: calc(-1 * var(--uc-titlebar-padding)); + } + :root[sizemode="normal"][tabsintitlebar] #titlebar, + :root[sizemode="maximized"][tabsintitlebar] #titlebar { + appearance: none !important; + } + .browser-toolbar:not(.titlebar-color) { + background-clip: border-box !important; + } } - #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, - #TabsToolbar > .titlebar-buttonbox-container { - position: fixed; - display: block; - top: var(--uc-titlebar-padding); - right: 0; - height: 40px; - z-index: 1; - } - - /* where window controls are on left */ @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - :root { - --uc-titlebar-padding: 0px !important; - } - - .titlebar-buttonbox-container { - left: 0; - right: unset !important; + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; } } - #navigator-toolbox { - padding-top: calc(var(--uc-menubar-height, 0px) + var(--uc-titlebar-padding)) !important; - } - - :root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container { - height: 32px; - } - @supports not -moz-bool-pref("userChrome.hidden.tabbar") { #toolbar-menubar[inactive] > .titlebar-buttonbox-container { opacity: 0; @@ -4949,7 +5153,6 @@ } } } - @supports -moz-bool-pref("userChrome.hidden.tabbar") { @supports -moz-bool-pref("userChrome.autohide.navbar") { #navigator-toolbox:is(:hover, :focus-within) @@ -4960,55 +5163,22 @@ } } } - - /* At Full Screen */ - - /* At Activated Menubar */ - } - @media screen and (min-width: 1100px) and (prefers-reduced-motion: no-preference) { - #toolbar-menubar[inactive] > .titlebar-buttonbox-container { - transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay, 600ms), - visibility 100ms var(--animation-easing-function) 0.25s !important; - } - - #navigator-toolbox:is(:hover, :focus-within) - #toolbar-menubar[inactive]:not([customizing]) - > .titlebar-buttonbox-container { - transition-delay: 0s !important; - } - } - @media screen and (min-width: 1100px) { - .titlebar-buttonbox-container > .titlebar-buttonbox { - height: 100%; - } - @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - .titlebar-buttonbox-container > .titlebar-buttonbox { - margin-block: 10px; + @media screen and (min-width: 1100px) and (prefers-reduced-motion: no-preference) { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay, 600ms), + visibility 100ms var(--animation-easing-function) 0.25s !important; + } + #navigator-toolbox:is(:hover, :focus-within) + #toolbar-menubar[inactive]:not([customizing]) + > .titlebar-buttonbox-container { + transition-delay: 0s !important; } } - } - @media screen and (min-width: 1100px) { - :root[sizemode="fullscreen"] #window-controls { - position: fixed; - display: flex; - top: 0; - right: 0; - height: 40px; - } - } - @media screen and (min-width: 1100px) { - :root[uidensity="compact"][sizemode="fullscreen"] #window-controls { - height: 32px; - } - } - @media screen and (min-width: 1100px) { @supports -moz-bool-pref("browser.fullscreen.autohide") { :root[sizemode="fullscreen"] #navigator-toolbox:not(:hover) .titlebar-buttonbox-container { visibility: hidden; } } - } - @media screen and (min-width: 1100px) { @supports -moz-bool-pref("userChrome.hidden.tabbar") { :root[inFullscreen]:not([macOSNativeFullscreen]) #toolbar-menubar { visibility: visible !important; @@ -5019,16 +5189,161 @@ visibility: collapse !important; } } - } - @media screen and (min-width: 1100px) { + /* At Activated Menubar */ :root:not([chromehidden~="menubar"], [sizemode="fullscreen"]) #toolbar-menubar:not([autohide="true"]) + #TabsToolbar > .titlebar-buttonbox-container { display: block !important; } + @supports not -moz-bool-pref("userChrome.hidden.tabbar") { + :root:not([chromehidden~="menubar"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container { + visibility: hidden; + } + } } - @media screen and (min-width: 1100px) { + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + /*= Windows Control - Move to toolbar ========================================*/ + /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 + See the above repository for updates as well as full license text. */ + /* Titlebar Button Box */ + :root { + --uc-titlebar-padding: 0px; + } + #navigator-toolbox { + padding-top: var(--uc-titlebar-padding) !important; + } + @supports -moz-bool-pref("userChrome.tabbar.on_bottom") { + @supports -moz-bool-pref("userChrome.tabbar.on_bottom.menubar_on_top") { + #navigator-toolbox { + padding-top: calc( + max(var(--uc-menubar-height), var(--uc-menubar-height-default)) + var(--uc-titlebar-padding) + ) !important; + } + } + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, + #TabsToolbar > .titlebar-buttonbox-container { + position: fixed; + display: block; + top: 0; + right: 0; + z-index: 1; + } + #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container { + height: var(--uc-titlebar-buttonbox-height, var(--uc-navbar-height, 36px)); + } + @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { + } + .titlebar-buttonbox-container > .titlebar-buttonbox { + height: 100%; + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container > .titlebar-buttonbox { + margin-block: 10px; + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + } + @media (-moz-gtk-csd-available) { + @media screen and (min-width: 1100px) and (-moz-gtk-csd-reversed-placement) { + .titlebar-buttonbox-container { + left: 0; + right: unset !important; + } + } + } + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + :root[sizemode="maximized"][tabsintitlebar] { + --uc-titlebar-padding: 8px; + } + :root[sizemode="maximized"][tabsintitlebar] #navigator-toolbox-background { + margin-top: calc(-1 * var(--uc-titlebar-padding)); + } + :root[sizemode="normal"][tabsintitlebar] #titlebar, + :root[sizemode="maximized"][tabsintitlebar] #titlebar { + appearance: none !important; + } + .browser-toolbar:not(.titlebar-color) { + background-clip: border-box !important; + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; + } + } + @supports not -moz-bool-pref("userChrome.hidden.tabbar") { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + opacity: 0; + visibility: collapse; + } + } + @supports -moz-bool-pref("userChrome.hidden.tabbar") { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + opacity: 1; + visibility: visible; + } + @supports -moz-bool-pref("userChrome.autohide.navbar") { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + opacity: 0; + visibility: collapse; + } + } + } + @supports -moz-bool-pref("userChrome.hidden.tabbar") { + @supports -moz-bool-pref("userChrome.autohide.navbar") { + #navigator-toolbox:is(:hover, :focus-within) + #toolbar-menubar[inactive]:not([customizing]) + > .titlebar-buttonbox-container { + opacity: 1; + visibility: visible; + } + } + } + @media screen and (min-width: 1100px) and (prefers-reduced-motion: no-preference) { + #toolbar-menubar[inactive] > .titlebar-buttonbox-container { + transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay, 600ms), + visibility 100ms var(--animation-easing-function) 0.25s !important; + } + #navigator-toolbox:is(:hover, :focus-within) + #toolbar-menubar[inactive]:not([customizing]) + > .titlebar-buttonbox-container { + transition-delay: 0s !important; + } + } + @supports -moz-bool-pref("browser.fullscreen.autohide") { + :root[sizemode="fullscreen"] #navigator-toolbox:not(:hover) .titlebar-buttonbox-container { + visibility: hidden; + } + } + @supports -moz-bool-pref("userChrome.hidden.tabbar") { + :root[inFullscreen]:not([macOSNativeFullscreen]) #toolbar-menubar { + visibility: visible !important; + min-height: 0 !important; + max-height: 0 !important; + } + :root[inFullscreen]:not([macOSNativeFullscreen]) #menubar-items { + visibility: collapse !important; + } + } + /* At Activated Menubar */ + :root:not([chromehidden~="menubar"], [sizemode="fullscreen"]) + #toolbar-menubar:not([autohide="true"]) + + #TabsToolbar + > .titlebar-buttonbox-container { + display: block !important; + } @supports not -moz-bool-pref("userChrome.hidden.tabbar") { :root:not([chromehidden~="menubar"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container { visibility: hidden; @@ -5038,186 +5353,319 @@ } } } - /*= Navbar - Padding for window controls =====================================*/ - /* Customized https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/window_control_placeholder_support.css */ - @supports -moz-bool-pref("userChrome.tabbar.one_liner") { - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { - @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - /* Don't need pre spacer */ - --uc-window-drag-space-pre: 0px; - } - @supports -moz-bool-pref("userChrome.tabbar.as_titlebar") { - :root:is([tabsintitlebar], [sizemode="fullscreen"]) #tabbrowser-tabs { - /* Don't need window control */ - --uc-widow-control-space: 0px; - } - } - } - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - @supports not -moz-bool-pref("userChrome.tabbar.as_titlebar") { - :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - /* Don't need window control */ - --uc-widow-control-space: 0px; - } - } - } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { - @media screen and (max-width: 1100px) { - @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") or not -moz-bool-pref("userChrome.hidden.tabbar") { - :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - /* Don't need pre spacer */ - --uc-window-drag-space-pre: 0px; - /* Don't need window control */ - --uc-widow-control-space: 0px; - } - } - } - @media screen and (min-width: 1100px) { - @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - /* Don't need pre spacer */ - --uc-window-drag-space-pre: 0px; - } - @supports -moz-bool-pref("userChrome.tabbar.as_titlebar") { - :root:is([tabsintitlebar], [sizemode="fullscreen"]) #tabbrowser-tabs { - /* Don't need window control */ - --uc-widow-control-space: 0px; - } - } - } - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - @supports not -moz-bool-pref("userChrome.tabbar.as_titlebar") { - :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - /* Don't need window control */ - --uc-widow-control-space: 0px; - } - } - } - } - } - } - #nav-bar { - border-inline-style: solid !important; - border-inline-color: transparent; - } - @supports not -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports not -moz-bool-pref("userChrome.navbar.as_sidebar") { + /*= Navbar - Padding for window controls =====================================*/ + /* Customized https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/window_control_placeholder_support.css */ #nav-bar { - border-inline-start-width: var(--uc-window-drag-space-pre); - border-inline-end-width: var(--uc-widow-control-space); + border-inline-style: solid !important; + border-inline-color: transparent; } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner") { - @supports -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { - #nav-bar { - border-inline-start-width: var(--uc-window-drag-space-pre); - border-inline-end-width: var(--uc-widow-control-space); + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner") { + #nav-bar { + border-inline-start-width: var(--uc-window-drag-space-pre); + border-inline-end-width: var(--uc-window-control-space); + } } - } - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { - @supports -moz-bool-pref("userChrome.tabbar.on_bottom") or -moz-bool-pref("userChrome.hidden.tabbar") { - @media screen and (max-width: 1100px) { + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { #nav-bar { border-inline-start-width: var(--uc-window-drag-space-pre); - border-inline-end-width: var(--uc-widow-control-space); + border-inline-end-width: var(--uc-window-control-space); } } - } - } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner") { - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - #nav-bar { - margin-inline-start: var(--uc-window-drag-space-pre) !important; - } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - #nav-bar { - margin-inline-end: var(--uc-widow-control-space) !important; - } - } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { - @media screen and (min-width: 1100px) { - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - #nav-bar { - margin-inline-start: var(--uc-window-drag-space-pre) !important; - } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - #nav-bar { - margin-inline-end: var(--uc-widow-control-space) !important; + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @supports -moz-bool-pref("userChrome.tabbar.on_bottom") or -moz-bool-pref("userChrome.hidden.tabbar") { + @media screen and (max-width: 1100px) { + #nav-bar { + border-inline-start-width: var(--uc-window-drag-space-pre); + border-inline-end-width: var(--uc-window-control-space); + } } } } } - } - } - - /* Use this pref to check Mac OS where window controls are on left */ - /* This pref defaults to true on Mac and doesn't actually do anything on other platforms. So if your system has window controls on LEFT side you can set the pref to true */ - @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - @supports not -moz-bool-pref("userChrome.tabbar.one_liner") { - :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - border-inline-start-width: var(--uc-widow-control-space); - border-inline-end-width: var(--uc-window-drag-space-pre); - } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner") { - @supports -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { - :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - border-inline-start-width: var(--uc-widow-control-space); - border-inline-end-width: var(--uc-window-drag-space-pre); - } - } - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { - @supports -moz-bool-pref("userChrome.tabbar.on_bottom") or -moz-bool-pref("userChrome.hidden.tabbar") { - @media screen and (max-width: 1100px) { - :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - border-inline-start-width: var(--uc-widow-control-space); - border-inline-end-width: var(--uc-window-drag-space-pre); - } - } - } - } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner") { - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { - @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - margin-inline-start: var(--uc-window-drag-space-pre, 0px) !important; - } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - margin-inline-end: var(--uc-widow-control-space, 0px) !important; - } - } - } - @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { - @media screen and (min-width: 1100px) { + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - margin-inline-start: var(--uc-window-drag-space-pre, 0px) !important; + #nav-bar { + margin-inline-start: var(--uc-window-drag-space-pre) !important; } } @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { - :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { - margin-inline-end: var(--uc-widow-control-space, 0px) !important; + #nav-bar { + margin-inline-end: var(--uc-window-control-space) !important; + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @media screen and (min-width: 1100px) { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-start: var(--uc-window-drag-space-pre) !important; + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-end: var(--uc-window-control-space) !important; + } } } } } } } - - :root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child, - :root[sizemode="fullscreen"] #window-controls { - right: unset; + @media (-moz-gtk-csd-available) { + @media (-moz-gtk-csd-reversed-placement: 0) { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner") { + #nav-bar { + border-inline-start-width: var(--uc-window-drag-space-pre); + border-inline-end-width: var(--uc-window-control-space); + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + #nav-bar { + border-inline-start-width: var(--uc-window-drag-space-pre); + border-inline-end-width: var(--uc-window-control-space); + } + } + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @supports -moz-bool-pref("userChrome.tabbar.on_bottom") or -moz-bool-pref("userChrome.hidden.tabbar") { + @media screen and (-moz-gtk-csd-reversed-placement: 0) and (max-width: 1100px) { + #nav-bar { + border-inline-start-width: var(--uc-window-drag-space-pre); + border-inline-end-width: var(--uc-window-control-space); + } + } + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-start: var(--uc-window-drag-space-pre) !important; + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-end: var(--uc-window-control-space) !important; + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @media screen and (-moz-gtk-csd-reversed-placement: 0) and (min-width: 1100px) { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-start: var(--uc-window-drag-space-pre) !important; + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-end: var(--uc-window-control-space) !important; + } + } + } + } + } + } + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner") { + #nav-bar { + border-inline-start-width: var(--uc-window-control-space); + border-inline-end-width: var(--uc-window-drag-space-pre); + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + #nav-bar { + border-inline-start-width: var(--uc-window-control-space); + border-inline-end-width: var(--uc-window-drag-space-pre); + } + } + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @supports -moz-bool-pref("userChrome.tabbar.on_bottom") or -moz-bool-pref("userChrome.hidden.tabbar") { + @media screen and (max-width: 1100px) { + #nav-bar { + border-inline-start-width: var(--uc-window-control-space); + border-inline-end-width: var(--uc-window-drag-space-pre); + } + } + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-start: var(--uc-window-control-space, 0px) !important; + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @media screen and (min-width: 1100px) { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-start: var(--uc-window-control-space, 0px) !important; + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + } + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #TabsToolbar { + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @media screen and (min-width: 1100px) { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #TabsToolbar { + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + #TabsToolbar { + margin-inline-start: var(--uc-window-control-width, 0px) !important; + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @media screen and (min-width: 1100px) { + #TabsToolbar { + margin-inline-start: var(--uc-window-control-width, 0px) !important; + } + } + } + } + } + } + @media (-moz-gtk-csd-available) { + @media (-moz-gtk-csd-reversed-placement) { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner") { + #nav-bar { + border-inline-start-width: var(--uc-window-control-space); + border-inline-end-width: var(--uc-window-drag-space-pre); + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + #nav-bar { + border-inline-start-width: var(--uc-window-control-space); + border-inline-end-width: var(--uc-window-drag-space-pre); + } + } + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @supports -moz-bool-pref("userChrome.tabbar.on_bottom") or -moz-bool-pref("userChrome.hidden.tabbar") { + @media screen and (-moz-gtk-csd-reversed-placement) and (max-width: 1100px) { + #nav-bar { + border-inline-start-width: var(--uc-window-control-space); + border-inline-end-width: var(--uc-window-drag-space-pre); + } + } + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-start: var(--uc-window-control-space, 0px) !important; + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @media screen and (-moz-gtk-csd-reversed-placement) and (min-width: 1100px) { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-start: var(--uc-window-control-space, 0px) !important; + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #nav-bar { + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + } + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.combine_navbar") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #TabsToolbar { + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @media screen and (-moz-gtk-csd-reversed-placement) and (min-width: 1100px) { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + #TabsToolbar { + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + } + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { + @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + #TabsToolbar { + margin-inline-start: var(--uc-window-control-width, 0px) !important; + } + } + @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { + @media screen and (-moz-gtk-csd-reversed-placement) and (min-width: 1100px) { + #TabsToolbar { + margin-inline-start: var(--uc-window-control-width, 0px) !important; + } + } + } + } + } + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + :root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child, + :root[sizemode="fullscreen"] #window-controls { + right: unset; + } } } } @@ -5235,11 +5683,10 @@ #tabs-newtab-button { display: none !important; } - .tabbrowser-tab[selected="true"] { -moz-window-dragging: drag; --tab-max-width: 100vw; - min-width: calc(var(--uc-tabbar-width, 100vw) - var(--uc-widow-control-space)) !important; + min-width: calc(var(--uc-tabbar-width, 100vw) - var(--uc-window-control-space)) !important; max-width: var(--tab-max-width) !important; margin-inline-start: calc(var(--tab-shadow-max-size) * -1) !important; } @@ -5250,23 +5697,18 @@ .tabbrowser-tab[selected="true"] .tab-label-container { margin-inline: 0 !important; } - .tab-content { margin-inline: auto; width: 100%; } - /* Pinned */ #tabbrowser-tabs[positionpinnedtabs] > #tabbrowser-arrowscrollbox > .tabbrowser-tab[pinned][selected="true"] { position: relative !important; } - #tabbrowser-tabs { --tab-overflow-pinned-tabs-width: 0 !important; - padding-inline: 0 !important; - /* Original: var(--tab-overflow-pinned-tabs-width) 0; */ + padding-inline: 0 !important; /* Original: var(--tab-overflow-pinned-tabs-width) 0; */ } - .tab-throbber[pinned], .tab-icon-pending[pinned], .tab-icon-image[pinned], @@ -5274,17 +5716,14 @@ .tab-icon-overlay[pinned] { margin-inline-end: 5.5px; } - .tab-label-container[pinned] { width: unset !important; } - /* Padding */ @supports not -moz-bool-pref("userChrome.centered.tab") { #tabbrowser-arrowscrollbox { margin-inline: 2px !important; } - :root[sizemode="normal"] #tabbrowser-arrowscrollbox { margin-inline: 6px !important; } @@ -5294,7 +5733,6 @@ #tabbrowser-arrowscrollbox { margin-inline: 2px !important; } - :root[sizemode="normal"] #tabbrowser-arrowscrollbox { margin-inline: 6px !important; } @@ -5309,33 +5747,150 @@ } } } -/** Tab UI ****************************************************************/ +/*= Tab Bar - Multi Row ======================================================*/ +@supports -moz-bool-pref("userChrome.tabbar.multi_row") { + /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/multi-row_tabs.css made available under Mozilla Public License v. 2.0 + See the above repository for updates as well as full license text. */ + :root { + --uc-multirow-tabbar-rows: 3; + --uc-multirow-tab-dynamic-width: 1; /* Change to 0 for fixed-width tabs using the above width. */ + } + #tabbrowser-tabs { + min-height: unset !important; + padding-inline-start: 0px !important; + } + @-moz-document url(chrome://browser/content/browser.xhtml) + { + #scrollbutton-up ~ spacer, + #scrollbutton-up, + #scrollbutton-down { + display: var(--scrollbutton-display-model, initial); + } + scrollbox[part][orient="horizontal"] { + display: flex; + flex-wrap: wrap; + overflow-y: auto; + max-height: calc((var(--tab-min-height) + 2 * var(--tab-block-margin, 0px)) * var(--uc-multirow-tabbar-rows)); + scroll-snap-type: y mandatory; + } + } + .scrollbox-clip[orient="horizontal"], + #tabbrowser-arrowscrollbox { + overflow: -moz-hidden-unscrollable; + display: block; + --scrollbutton-display-model: none; + } + .tabbrowser-tab { + scroll-snap-align: start; + } + #tabbrowser-tabs .tabbrowser-tab[pinned] { + position: static !important; + margin-inline-start: 0px !important; + } + .tabbrowser-tab[fadein]:not([pinned]) { + flex-grow: var(--uc-multirow-tab-dynamic-width); + } + .tabbrowser-tab > stack { + width: 100%; + height: 100%; + } + /* remove bottom margin so it doesn't throw off row height computation */ + #tabs-newtab-button { + margin-bottom: 0 !important; + } + #tabbrowser-tabs[hasadjacentnewtabbutton][overflow="true"] + > #tabbrowser-arrowscrollbox + > #tabbrowser-arrowscrollbox-periphery + > #tabs-newtab-button { + display: -moz-box !important; + } + #alltabs-button, + :root:not([customizing]) #TabsToolbar #new-tab-button, + #tabbrowser-arrowscrollbox > spacer, + .tabbrowser-tab::after { + display: none !important; + } +} +/*= Tab Bar - Scollmode disabled =============================================*/ +@supports -moz-bool-pref("userChrome.tabbar.unscroll") { + /* Disable scrollbox */ + spacer[part="overflow-start-indicator"] + .scrollbox-clip > scrollbox { + overflow: -moz-hidden-unscrollable !important; + } + #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([pinned]):not([visuallyselected]) { + /* Set minimum width below which tabs will not shrink */ + --tab-min-width: 16px; + container-type: inline-size; + container-name: backgroundTab; + } + @container backgroundTab (max-width: 46px) { + #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([pinned]):not([visuallyselected]) .tab-content { + --inline-tab-padding: 0px; + justify-self: center; + } + #tabbrowser-tabs[closebuttons="activetab"] + .tabbrowser-tab:not([pinned]):not([visuallyselected]) + .tab-icon-stack + > * { + margin-inline-end: 0 !important; + } + #tabbrowser-tabs[closebuttons="activetab"] + .tabbrowser-tab:not([pinned]):not([visuallyselected]) + .tab-label-container, + #tabbrowser-tabs[closebuttons="activetab"] + .tabbrowser-tab:not([pinned]):not([visuallyselected]):hover + .tab-close-button { + visibility: collapse !important; + } + } + #tabbrowser-tabs[closebuttons="activetab"][hasadjacentnewtabbutton="true"] #tabbrowser-arrowscrollbox-periphery { + position: absolute !important; + right: 0; + top: 50%; + transform: translateY(-50%); + } + #tabbrowser-tabs[closebuttons="activetab"][hasadjacentnewtabbutton="true"] + #tabbrowser-arrowscrollbox-periphery + > #tabs-newtab-button { + z-index: 2 !important; + } + #tabbrowser-tabs[closebuttons="activetab"][hasadjacentnewtabbutton="true"] #tabbrowser-arrowscrollbox { + padding-inline-end: calc( + 16px + (var(--toolbarbutton-inner-padding) + var(--toolbarbutton-outer-padding)) * 2 + ) !important; + } +} +/*= Tab Bar - Fill width tab =================================================*/ +@supports -moz-bool-pref("userChrome.tabbar.fill_width") { + /* Why 100vw? Tab closing requires width animation to end and "none" can't be animated */ + .tabbrowser-tab[fadein]:not([style^="max-width"]) { + --tab-max-width: 100vw; + max-width: var(--tab-max-width) !important; + } +} +/** Tab UI ********************************************************************/ /*= Tab - Connect to window ==============================================*/ @supports -moz-bool-pref("userChrome.tab.connect_to_window") { .tab-background { border-radius: var(--tab-border-radius) var(--tab-border-radius) 0px 0px !important; margin-bottom: 0px !important; } - .tab-content { margin-top: var(--tab-block-margin); } - .tab-stack { margin-top: 0px !important; margin-bottom: 0px !important; } - /* Remove line at Toolbar's top */ #tabbrowser-tabs { z-index: 1 !important; } - - #TabsToolbar { - overflow: hidden; - /* Prevent toolbar area over */ + @supports not -moz-bool-pref("userChrome.tabbar.multi_row") { + #TabsToolbar:not([multibar]) { + overflow: clip; /* Prevent toolbar area over */ + } } - /* Pinned Tab - tabbrowser-arrowscrollbox overflowing */ #tabbrowser-tabs[positionpinnedtabs] > #tabbrowser-arrowscrollbox > .tabbrowser-tab[pinned] { z-index: 0 !important; @@ -5346,12 +5901,9 @@ @supports -moz-bool-pref("userChrome.tab.color_like_toolbar") { :root:not(:-moz-lwtheme) { /* Fix for windows's system default theme. Using --toolbar-bgcolor, --toolbar-bgimage fallback */ - --tab-selected-bgcolor: unset !important; - /* Original: rgb(255,255,255); */ - --tab-selected-bgimage: unset !important; - /* Above FF v101 */ + --tab-selected-bgcolor: unset !important; /* Original: rgb(255,255,255); */ + --tab-selected-bgimage: unset !important; /* Above FF v101 */ } - #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab @@ -5365,26 +5917,35 @@ } /*= Multi Selected Color - More Contrast =====================================*/ @supports -moz-bool-pref("userChrome.tab.multi_selected") { + #TabsToolbar { + --uc-multiselected-tab-bgcolor: color-mix(in srgb, currentColor 28%, var(--toolbar-bgcolor, transparent)); + } + #TabsToolbar[brighttext] { + --uc-multiselected-tab-bgcolor: color-mix(in srgb, currentColor 16%, var(--toolbar-bgcolor, transparent)); + } #tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab > .tab-stack - > .tab-background[multiselected]:not([selected]):-moz-lwtheme { - background-image: linear-gradient(var(--toolbar-bgcolor, transparent), var(--toolbar-bgcolor, transparent)), - linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none) !important; + > .tab-background[multiselected]:not([selected]) { + /* Original: + background-attachment: scroll, scroll, fixed; + background-color: transparent; + background-image: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), + linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), + var(--lwt-header-image, none); + background-position: 0 0, 0 0, right top; + background-repeat: repeat-x, repeat-x, no-repeat; + background-size: auto 100%, auto 100%, auto auto; + */ + background-attachment: scroll, fixed !important; + background-color: transparent !important; + background-image: linear-gradient(var(--uc-multiselected-tab-bgcolor), var(--uc-multiselected-tab-bgcolor)), + var(--lwt-header-image, none) !important; + background-position: 0 0, right top !important; + background-repeat: repeat-x, no-repeat !important; + background-size: auto 100%, auto auto !important; } - - .tab-background[multiselected="true"]:not([selected="true"]) > .tab-loading-burst:not([bursting]) { - background: color-mix(in srgb, currentColor 65%, transparent); - opacity: 0.3; - } - - #TabsToolbar[brighttext] - .tab-background[multiselected="true"]:not([selected="true"]) - > .tab-loading-burst:not([bursting]) { - opacity: 0.15; - } - @supports -moz-bool-pref("userChrome.tab.connect_to_window") { .tab-background[multiselected="true"] { outline: none !important; @@ -5396,7 +5957,6 @@ outline: 1px solid color-mix(in srgb, var(--focus-outline-color, currentColor) 40%, transparent); outline-offset: -1px; } - .tab-background[multiselected="true"][selected="true"] { outline-width: 2px; outline-offset: -2px; @@ -5405,42 +5965,68 @@ } /*= Selected Tab - Box Shadow ================================================*/ @supports -moz-bool-pref("userChrome.tab.box_shadow") { - #TabsToolbar[brighttext] + #TabsToolbar { + --uc-tab-background-shadow-soft: 0 0 1px; + --uc-tab-background-shadow-hard: 0 0 0 1px; + --uc-tab-shadow-color: var( + --tab-line-color, + var(--lwt-tab-line-color, var(--tabs-border-color, rgba(128, 128, 142, 0.9))) + ); + --uc-tab-shadow-color-bundle: var(--tab-line-color, var(--lwt-tab-line-color, rgba(128, 128, 142, 0.9))); + --uc-tab-basic-shadow: 0 0 4px rgba(0, 0, 0, 0.4); + --uc-tab-additional-shadow: 0 0 4px rgba(128, 128, 142, 0.5); + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner") { + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.wave") or -moz-bool-pref( + "userChrome.tab.bottom_rounded_corner.australis" + ) or -moz-bool-pref("userChrome.tab.bottom_rounded_corner.chrome_legacy") or -moz-bool-pref( + "userChrome.tab.bottom_rounded_corner.chrome" + ) or -moz-bool-pref("userChrome.tab.bottom_rounded_corner.edge") { + #TabsToolbar { + --uc-tab-background-shadow-hard: 0 -1px 0; + --uc-tab-basic-shadow: 0 -1px 0px rgba(0, 0, 0, 0.4); + --uc-tab-additional-shadow: 0 0 0 transparent; + } + } + } + #tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { + box-shadow: var(--uc-tab-basic-shadow) !important; + } + :root:is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) + #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) - .tabbrowser-tab[visuallyselected="true"]:not(:focus) - > .tab-stack - > .tab-background:-moz-lwtheme { - /* Origina: 0 0 1px var(--tab-line-color, rgba(128,128,142,0.9)) + .tabbrowser-tab { + /* Original: 0 0 1px var(--tab-line-color, rgba(128,128,142,0.9)) Bright: 0 0 1px var(--tab-line-color, rgba(128,128,142,0.9)), 0 0 4px rgba(128,128,142,0.5) */ - box-shadow: 0 0 1px var(--toolbar-color) !important; + /* Consider 0 0 4px rgba(128,128,142,0.9) -> 0 0 4px rgba(0,0,0,.4) new default */ } - - #TabsToolbar[brighttext] + :root:is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) + #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) - .tabbrowser-tab[multiselected]:not([visuallyselected]) + .tabbrowser-tab:is([selected], [multiselected]) > .tab-stack > .tab-background:-moz-lwtheme { - box-shadow: 0 0 1px color-mix(in srgb, var(--toolbar-color) 80%, transparent) !important; + box-shadow: var(--uc-tab-background-shadow-soft) var(--uc-tab-shadow-color) !important; } - - /* Consider 0 0 4px rgba(128,128,142,0.9) -> 0 0 4px rgba(0,0,0,.4) new default */ - #TabsToolbar:not([brighttext]) + :root:is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) + #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) - .tabbrowser-tab:is([visuallyselected="true"], [multiselected]) + .tabbrowser-tab[visuallyselected="true"]:not(:focus), + :root:is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) + #TabsToolbar[brighttext] + #tabbrowser-tabs:not([noshadowfortests]) + .tabbrowser-tab[multiselected]:not([visuallyselected]) { + --uc-tab-shadow-color: var(--toolbar-color); + } + :root:is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"]) + #TabsToolbar:not([brighttext]) + #tabbrowser-tabs:not([noshadowfortests]) + .tabbrowser-tab:is([visuallyselected], [multiselected]) > .tab-stack > .tab-background { - box-shadow: 0 0 1px var(--tab-line-color, var(--lwt-tab-line-color, rgba(128, 128, 142, 0.9))), - 0 0 4px rgba(128, 128, 142, 0.5) !important; + --uc-tab-shadow-color: var(--uc-tab-shadow-color-bundle); + box-shadow: var(--uc-tab-background-shadow-soft) var(--uc-tab-shadow-color), var(--uc-tab-additional-shadow) !important; } - - #TabsToolbar[brighttext] - #tabbrowser-tabs:not([noshadowfortests]) - .tabbrowser-tab:is([visuallyselected="true"], [multiselected]) - > .tab-stack - > .tab-background:-moz-lwtheme { - box-shadow: 0 0 1px var(--tab-line-color, var(--lwt-tab-line-color, rgba(128, 128, 142, 0.9))) !important; - } - /* For themes outside of Light and Dark (which are curated by Mozilla), show a thicker border around the tab to help themes that are dependent on tab_line to show the selected tab. */ :root:not([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"]) @@ -5449,147 +6035,418 @@ .tabbrowser-tab:is([visuallyselected="true"], [multiselected]) > .tab-stack > .tab-background:-moz-lwtheme { - box-shadow: 0 0 0 1px - var(--tab-line-color, var(--lwt-tab-line-color, var(--tabs-border-color, rgba(128, 128, 142, 0.9)))), - 0 0 4px rgba(128, 128, 142, 0.5) !important; + box-shadow: var(--uc-tab-background-shadow-hard) var(--uc-tab-shadow-color), var(--uc-tab-additional-shadow) !important; } - :root:not([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected="true"], [multiselected]) > .tab-stack > .tab-background:-moz-lwtheme { - box-shadow: 0 0 0 1px - var(--tab-line-color, var(--lwt-tab-line-color, var(--tabs-border-color, rgba(128, 128, 142, 0.9)))) !important; + box-shadow: var(--uc-tab-background-shadow-hard) var(--uc-tab-shadow-color) !important; } } /*= Selected Tab - Bottom Rounded Corner =====================================*/ @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner") { - #tabbrowser-tabs { - --tab-corner-rounding: 3px; - /* 10px looks about like chromium - 17px looks close to Australis tabs */ - --tab-corner-padding: 0px; - --tab-corner-position: calc(var(--tab-corner-padding) - var(--tab-corner-rounding)); - } + @supports not -moz-bool-pref("userChrome.tab.bottom_rounded_corner.wave") { + @supports not -moz-bool-pref("userChrome.tab.bottom_rounded_corner.australis") { + @supports not -moz-bool-pref("userChrome.tab.bottom_rounded_corner.chrome") { + @supports not -moz-bool-pref("userChrome.tab.bottom_rounded_corner.chrome_legacy") { + @supports not -moz-bool-pref("userChrome.tab.bottom_rounded_corner.edge") { + #TabsToolbar { + --uc-tab-corner-rounding: 3px; /* 10px looks about like chromium - 17px looks close to Australis tabs */ + --uc-tab-corner-padding: 0px; + --uc-tab-corner-position: calc(var(--uc-tab-corner-padding) - var(--uc-tab-corner-rounding)); + --uc-tab-corner-left-side-svg: url("../icons/tab-bottom-corner-left.svg"); + --uc-tab-corner-right-side-svg: url("../icons/tab-bottom-corner-right.svg"); + } + :root:not([customizing="true"]) .tabbrowser-tab .tab-background::before, + :root:not([customizing="true"]) .tabbrowser-tab .tab-background::after { + /* Box */ + display: block; + position: absolute; + z-index: 1; + bottom: 0; + /* Shape */ + width: var(--uc-tab-corner-rounding); + height: 100%; + /* Color */ + fill: transparent; + stroke: transparent; + -moz-context-properties: fill, stroke; + /* Image */ + background-size: var(--uc-tab-corner-rounding); + background-repeat: no-repeat; + background-position-y: bottom; + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.all") { + :root:not([customizing="true"]) .tabbrowser-tab .tab-background::before, + :root:not([customizing="true"]) .tabbrowser-tab .tab-background::after { + content: ""; + } + } + @supports not -moz-bool-pref("userChrome.tab.color_like_toolbar") { + :root:not([customizing="true"]) .tabbrowser-tab .tab-background::before, + :root:not([customizing="true"]) .tabbrowser-tab .tab-background::after { + /* Based on tab background + background-image: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none); - :root:not([customizing="true"]) tab[visuallyselected] > stack::before, - :root:not([customizing="true"]) tab[visuallyselected] > stack::after { - content: "" !important; - /* Box */ - display: block !important; - position: absolute !important; - z-index: 1 !important; - /* Shape */ - width: var(--tab-corner-rounding) !important; - height: 100% !important; - /* Color */ - fill: var(--toolbar-bgcolor) !important; - stroke: var(--tab-line-color, var(--tabs-border-color, rgba(128, 128, 142, 0.9))) !important; - -moz-context-properties: fill, stroke !important; - /* Image */ - background-size: var(--tab-corner-rounding); - background-repeat: no-repeat; - background-position-y: bottom; + defaults + background-color: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); + background-image: var(--tab-selected-bgimage, var(--toolbar-bgimage)); + */ + fill: var( + --lwt-selected-tab-background-color, + var(--tab-selected-bgcolor, var(--toolbar-bgcolor)) + ) !important; + } + } + :root:not([customizing="true"]) .tabbrowser-tab .tab-background::before { + left: var(--uc-tab-corner-position); + background-image: var(--uc-tab-corner-left-side-svg); + } + :root:not([customizing="true"]) .tabbrowser-tab .tab-background::after { + right: var(--uc-tab-corner-position); + background-image: var(--uc-tab-corner-right-side-svg); + } + :root:not([customizing="true"]) .tabbrowser-tab[visuallyselected] .tab-background::before, + :root:not([customizing="true"]) .tabbrowser-tab[visuallyselected] .tab-background::after { + fill: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); + stroke: var(--tab-line-color, var(--tabs-border-color, rgba(128, 128, 142, 0.9))); + } + @supports not -moz-bool-pref("userChrome.tab.bottom_rounded_corner.all") { + :root:not([customizing="true"]) .tabbrowser-tab[visuallyselected] .tab-background::before, + :root:not([customizing="true"]) .tabbrowser-tab[visuallyselected] .tab-background::after { + content: ""; + } + } + :root:not([customizing="true"]) .tabbrowser-tab[multiselected] .tab-background::before, + :root:not([customizing="true"]) .tabbrowser-tab[multiselected] .tab-background::after { + fill: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); + } + :root:not([customizing="true"]) + .tabbrowser-tab:hover:not([visuallyselected], [multiselected]) + .tab-background::before, + :root:not([customizing="true"]) + .tabbrowser-tab:hover:not([visuallyselected], [multiselected]) + .tab-background::after { + fill: color-mix(in srgb, currentColor 11%, transparent); + } + @supports -moz-bool-pref("userChrome.tab.multi_selected") { + :root:not([customizing="true"]) + .tabbrowser-tab[multiselected]:not([visuallyselected]) + .tab-background::before, + :root:not([customizing="true"]) + .tabbrowser-tab[multiselected]:not([visuallyselected]) + .tab-background::after { + fill: color-mix(in srgb, currentColor 65%, transparent); + opacity: 0.3; + } + } + :root:not([customizing="true"])::is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) + #TabsToolbar[brighttext] + #tabbrowser-tabs:not([noshadowfortests]) + .tabbrowser-tab[visuallyselected] + .tab-background:-moz-lwtheme::before, + :root:not([customizing="true"])::is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) + #TabsToolbar[brighttext] + #tabbrowser-tabs:not([noshadowfortests]) + .tabbrowser-tab[visuallyselected] + .tab-background:-moz-lwtheme::after { + /* As Selected Tab - Box Shadow */ + stroke: var(--toolbar-color); + } + @media (-moz-gtk-csd-available) { + :root:not([customizing="true"]) { + /* Fill color for GTK */ + } + :root:not([customizing="true"]):not([lwtheme="true"]) + .tabbrowser-tab:is([visuallyselected], [multiselected]) + .tab-background::before, + :root:not([customizing="true"]):not([lwtheme="true"]) + .tabbrowser-tab:is([visuallyselected], [multiselected]) + .tab-background::after { + /* As GTK Toolbar's background-color + background-image + * --toolbar-non-lwt-bgcolor: -moz-dialog; + * --toolbar-non-lwt-bgimage: linear-gradient(rgba(255,255,255,.15), rgba(255,255,255,.15)); + */ + fill: color-mix(in srgb, rgb(255, 255, 255) 15%, -moz-dialog); + stroke: transparent; + opacity: 1; + } + :root:not([customizing="true"]):not([lwtheme="true"]) + #TabsToolbar[brighttext] + .tabbrowser-tab[visuallyselected] + .tab-background::before, + :root:not([customizing="true"]):not([lwtheme="true"]) + #TabsToolbar[brighttext] + .tabbrowser-tab[visuallyselected] + .tab-background::after { + stroke: transparent; + } + } + } + } + } + } } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.wave") or -moz-bool-pref( + "userChrome.tab.bottom_rounded_corner.australis" + ) or -moz-bool-pref("userChrome.tab.bottom_rounded_corner.chrome_legacy") or -moz-bool-pref( + "userChrome.tab.bottom_rounded_corner.chrome" + ) or -moz-bool-pref("userChrome.tab.bottom_rounded_corner.edge") { + #TabsToolbar { + --uc-tab-corner-height: calc(var(--tab-min-height) + 1px); + --uc-tab-corner-size: var(--uc-tab-corner-height); + --uc-tab-corner-half-size: calc(var(--uc-tab-corner-size) / 2); + --uc-tab-corner-half-size-reverse: calc(var(--uc-tab-corner-half-size) * -1); + --uc-tab-corner-bgimage: none; + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.wave") { + #TabsToolbar { + --uc-tab-corner-left-side-svg: url("../icons/tab-bottom-corner-left-wave.svg"); + --uc-tab-corner-left-side-clipPath: url("../icons/tab-bottom-corner-left-wave.svg#svgClipPath"); + --uc-tab-corner-right-side-svg: url("../icons/tab-bottom-corner-right-wave.svg"); + --uc-tab-corner-right-side-clipPath: url("../icons/tab-bottom-corner-right-wave.svg#svgClipPath"); + --uc-tab-corner-left-side-svg-clipped: url("../icons/tab-bottom-corner-left-wave-clipped.svg"); + --uc-tab-corner-right-side-svg-clipped: url("../icons/tab-bottom-corner-right-wave-clipped.svg"); + } + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.australis") { + #TabsToolbar { + --uc-tab-corner-left-side-svg: url("../icons/tab-bottom-corner-left-australis.svg"); + --uc-tab-corner-left-side-clipPath: url("../icons/tab-bottom-corner-left-australis.svg#svgClipPath"); + --uc-tab-corner-right-side-svg: url("../icons/tab-bottom-corner-right-australis.svg"); + --uc-tab-corner-right-side-clipPath: url("../icons/tab-bottom-corner-right-australis.svg#svgClipPath"); + --uc-tab-corner-left-side-svg-clipped: url("../icons/tab-bottom-corner-left-australis-clipped.svg"); + --uc-tab-corner-right-side-svg-clipped: url("../icons/tab-bottom-corner-right-australis-cilpped.svg"); + } + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.chrome") { + #TabsToolbar { + --uc-tab-corner-left-side-svg: url("../icons/tab-bottom-corner-left-chrome.svg"); + --uc-tab-corner-left-side-clipPath: url("../icons/tab-bottom-corner-left-chrome.svg#svgClipPath"); + --uc-tab-corner-right-side-svg: url("../icons/tab-bottom-corner-right-chrome.svg"); + --uc-tab-corner-right-side-clipPath: url("../icons/tab-bottom-corner-right-chrome.svg#svgClipPath"); + --uc-tab-corner-left-side-svg-clipped: url("../icons/tab-bottom-corner-left-chrome-clipped.svg"); + --uc-tab-corner-right-side-svg-clipped: url("../icons/tab-bottom-corner-right-chrome-clipped.svg"); + --uc-tab-corner-size: 16px; + } + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.chrome_legacy") { + #TabsToolbar { + --uc-tab-corner-left-side-svg: url("../icons/tab-bottom-corner-left-chromeLegacy.svg"); + --uc-tab-corner-left-side-clipPath: url("../icons/tab-bottom-corner-left-chromeLegacy.svg#svgClipPath"); + --uc-tab-corner-right-side-svg: url("../icons/tab-bottom-corner-right-chromeLegacy.svg"); + --uc-tab-corner-right-side-clipPath: url("../icons/tab-bottom-corner-right-chromeLegacy.svg#svgClipPath"); + --uc-tab-corner-left-side-svg-clipped: url("../icons/tab-bottom-corner-left-chromeLegacy-clipped.svg"); + --uc-tab-corner-right-side-svg-clipped: url("../icons/tab-bottom-corner-right-chromeLegacy-clipped.svg"); + } + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.edge") { + #TabsToolbar { + --uc-tab-corner-left-side-svg: url("../icons/tab-bottom-corner-left-edge.svg"); + --uc-tab-corner-left-side-clipPath: url("../icons/tab-bottom-corner-left-edge.svg#svgClipPath"); + --uc-tab-corner-right-side-svg: url("../icons/tab-bottom-corner-right-edge.svg"); + --uc-tab-corner-right-side-clipPath: url("../icons/tab-bottom-corner-right-edge.svg#svgClipPath"); + --uc-tab-corner-left-side-svg-clipped: url("../icons/tab-bottom-corner-left-edge-clipped.svg"); + --uc-tab-corner-right-side-svg-clipped: url("../icons/tab-bottom-corner-right-edge-clipped.svg"); + --uc-tab-corner-size: 14px; + } + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.all") { + .tabbrowser-tab { + padding-inline: 0 !important; + overflow-clip-margin: var(--uc-tab-corner-half-size) !important; + } + .tabbrowser-tab .tab-background { + --tab-border-radius: 0px; + margin-inline: var(--uc-tab-corner-half-size) !important; + position: relative; + } + } + @supports not -moz-bool-pref("userChrome.tab.bottom_rounded_corner.all") { + .tabbrowser-tab[visuallyselected] { + padding-inline: 0 !important; + overflow-clip-margin: var(--uc-tab-corner-half-size) !important; + } + .tabbrowser-tab[visuallyselected] .tab-background { + --tab-border-radius: 0px; + margin-inline: var(--uc-tab-corner-half-size) !important; + position: relative; + } + .tabbrowser-tab[visuallyselected] .tab-background::before, + .tabbrowser-tab[visuallyselected] .tab-background::after { + content: ""; + } + } + .tabbrowser-tab .tab-background::before, + .tabbrowser-tab .tab-background::after { + /* Box */ + display: block; + position: absolute; + z-index: -1; + bottom: 0; + /* Shape */ + width: var(--uc-tab-corner-size); + height: var(--uc-tab-corner-height); + /* Color */ + fill: transparent; + stroke: transparent; + -moz-context-properties: fill, stroke, stroke-opacity; + /* Image */ + background-size: cover, auto auto; + background-repeat: no-repeat, no-repeat; + background-position: bottom, right top; + background-attachment: scroll, fixed; + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.all") { + .tabbrowser-tab .tab-background::before, + .tabbrowser-tab .tab-background::after { + content: ""; + } + } + @supports not -moz-bool-pref("userChrome.tab.color_like_toolbar") { + .tabbrowser-tab .tab-background::before, + .tabbrowser-tab .tab-background::after { + /* Based on tab background + background-image: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none); - :root:not([customizing="true"]):is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) - #TabsToolbar[brighttext] - #tabbrowser-tabs:not([noshadowfortests]) - tab[visuallyselected] - > stack:-moz-lwtheme::before, - :root:not([customizing="true"]):is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) - #TabsToolbar[brighttext] - #tabbrowser-tabs:not([noshadowfortests]) - tab[visuallyselected] - > stack:-moz-lwtheme::after { - /* As Selected Tab - Box Shadow */ - stroke: var(--toolbar-color) !important; - } - - tab[visuallyselected] > stack::before { - left: var(--tab-corner-position) !important; - background-image: url("../icons/tab-bottom-corner-left.svg"); - } - - tab[visuallyselected] > stack::after { - left: auto; - right: var(--tab-corner-position); - background-image: url("../icons/tab-bottom-corner-right.svg"); - } - - @media (-moz-gtk-csd-available) { - /* Fill color for GTK */ - :root:not([customizing="true"]):not([lwtheme="true"]) tab[visuallyselected] > stack::before, - :root:not([customizing="true"]):not([lwtheme="true"]) tab[visuallyselected] > stack::after { - /* As GTK Toolbar's background-color + backround-image + defaults + background-color: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); + background-image: var(--tab-selected-bgimage, var(--toolbar-bgimage)); + */ + fill: var(--lwt-selected-tab-background-color, var(--tab-selected-bgcolor, var(--toolbar-bgcolor))) !important; + } + } + .tabbrowser-tab .tab-background::before { + right: 100%; + background-image: var(--uc-tab-corner-left-side-svg), var(--uc-tab-corner-bgimage); + clip-path: var(--uc-tab-corner-left-side-clipPath); + } + .tabbrowser-tab .tab-background::after { + left: 100%; + background-image: var(--uc-tab-corner-right-side-svg), var(--uc-tab-corner-bgimage); + clip-path: var(--uc-tab-corner-right-side-clipPath); + } + .tabbrowser-tab[beforeselected-visible] .tab-background::after { + --uc-tab-corner-right-side-svg: var(--uc-tab-corner-right-side-svg-clipped); + } + .tabbrowser-tab[visuallyselected] + .tabbrowser-tab .tab-background::before { + --uc-tab-corner-left-side-svg: var(--uc-tab-corner-left-side-svg-clipped); + } + .tabbrowser-tab:is([visuallyselected], [multiselected]) .tab-background { + --uc-tab-corner-bgimage: var(--lwt-header-image, none); + } + .tabbrowser-tab:is([visuallyselected], [multiselected]) .tab-background::before, + .tabbrowser-tab:is([visuallyselected], [multiselected]) .tab-background::after { + fill: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); + } + @supports -moz-bool-pref("userChrome.tab.box_shadow") { + .tabbrowser-tab:is([visuallyselected], [multiselected]) .tab-background::before, + .tabbrowser-tab:is([visuallyselected], [multiselected]) .tab-background::after { + stroke: var(--uc-tab-shadow-color); + } + } + .tabbrowser-tab:hover:not([visuallyselected], [multiselected]) .tab-background::before, + .tabbrowser-tab:hover:not([visuallyselected], [multiselected]) .tab-background::after { + fill: color-mix(in srgb, currentColor 11%, transparent); + } + @supports -moz-bool-pref("userChrome.tab.multi_selected") { + .tabbrowser-tab[multiselected]:not([visuallyselected]) .tab-background::before, + .tabbrowser-tab[multiselected]:not([visuallyselected]) .tab-background::after { + fill: var(--uc-multiselected-tab-bgcolor); + } + } + #tabbrowser-tabs[movingtab] .tabbrowser-tab:is([visuallyselected], [multiselected]) .tab-background:-moz-lwtheme { + --uc-tab-corner-bgimage: none; + } + @supports -moz-bool-pref("userChrome.tab.box_shadow") { + :root:is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) + #TabsToolbar[brighttext] + #tabbrowser-tabs:not([noshadowfortests]) + .tabbrowser-tab:is([visuallyselected], [multiselected]) + .tab-background::before, + :root:is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) + #TabsToolbar[brighttext] + #tabbrowser-tabs:not([noshadowfortests]) + .tabbrowser-tab:is([visuallyselected], [multiselected]) + .tab-background::after { + stroke-opacity: 0.3; + } + } + @media (-moz-gtk-csd-available) { + :root { + /* Fill color for GTK */ + } + @supports -moz-bool-pref("userChrome.tab.box_shadow") { + :root:not([lwtheme="true"]) .tabbrowser-tab { + --uc-tab-shadow-color: rgba(0, 0, 0, 0.4); + } + } + :root:not([lwtheme="true"]) .tabbrowser-tab[visuallyselected] .tab-background { + background-clip: content-box; + } + :root:not([lwtheme="true"]) .tabbrowser-tab[visuallyselected] .tab-background::before, + :root:not([lwtheme="true"]) .tabbrowser-tab[visuallyselected] .tab-background::after { + /* As GTK Toolbar's background-color + background-image * --toolbar-non-lwt-bgcolor: -moz-dialog; * --toolbar-non-lwt-bgimage: linear-gradient(rgba(255,255,255,.15), rgba(255,255,255,.15)); */ - fill: color-mix(in srgb, white 15%, -moz-dialog) !important; - stroke: transparent !important; + --uc-tab-corner-bgimage: linear-gradient(var(--toolbar-non-lwt-bgcolor), var(--toolbar-non-lwt-bgcolor)); + fill: rgba(255, 255, 255, 0.075); + } + @supports not -moz-bool-pref("userChrome.tab.color_like_toolbar") { + :root:not([lwtheme="true"]) .tabbrowser-tab[visuallyselected] .tab-background::before, + :root:not([lwtheme="true"]) .tabbrowser-tab[visuallyselected] .tab-background::after { + fill: rgba(255, 255, 255, 0.15); + } + } } - - :root:not([customizing="true"]):not([lwtheme="true"]) - #TabsToolbar[brighttext] - tab[visuallyselected] - > stack::before, - :root:not([customizing="true"]):not([lwtheme="true"]) - #TabsToolbar[brighttext] - tab[visuallyselected] - > stack::after { - stroke: transparent !important; + #tabbrowser-tabs[positionpinnedtabs], + #tabbrowser-tabs:not([overflow]) .tabbrowser-tab[first-visible-tab], + #tabbrowser-tabs[overflow] .tabbrowser-tab[first-visible-unpinned-tab] { + margin-left: var(--uc-tab-corner-half-size) !important; } - } - @supports not -moz-bool-pref("userChrome.tab.color_like_toolbar") { - :root:not([customizing="true"]) tab[visuallyselected] > stack::before, - :root:not([customizing="true"]) tab[visuallyselected] > stack::after { - /* Based on tab background - background-image: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none); - - defaults - background-color: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); - background-image: var(--tab-selected-bgimage, var(--toolbar-bgimage)); - */ - fill: var(--lwt-selected-tab-background-color, var(--tab-selected-bgcolor, var(--toolbar-bgcolor))) !important; + .tabbrowser-tab[last-visible-tab] { + margin-right: vart(--uc-tab-corner-half-size) !important; } } } /*= Selected Tab - Photon like contextline ===================================*/ -@supports -moz-bool-pref("userChrome.tab.photon_like_contextline") { +@supports -moz-bool-pref("userChrome.tab.photon_like_contextline") or -moz-bool-pref("userChrome.tab.static_separator") or -moz-bool-pref( + "userChrome.tab.bar_separator" + ) { :root[lwtheme-mozlightdark] #tabbrowser-tabs, :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] { --tab-line-color: rgb(10, 132, 255) !important; } - @media (-moz-gtk-csd-available) { :root:not(:-moz-lwtheme) #tabbrowser-tabs { - --tab-line-color: Highlight !important; - /* -moz-accent-color */ + --tab-line-color: Highlight !important; /* -moz-accent-color */ } } +} +@supports -moz-bool-pref("userChrome.tab.photon_like_contextline") { .tab-context-line { display: -moz-inline-box !important; height: 2px !important; border-radius: var(--tab-border-radius, 4px) var(--tab-border-radius, 4px) 0 0 !important; } - .tabbrowser-tab:is([selected], [multiselected]) .tab-context-line { /* Photon like color Default: var(--tab-line-color, rgb(10, 132, 255)) Automatic: color-mix(in srgb, var(--button-primary-bgcolor) 80%, transparent) FF v96+ replace by var(--lwt-tab-line-color) */ - background-color: var(--tab-line-color, var(--lwt-tab-line-color, #0a84ff)) !important; + background-color: var(--tab-line-color, var(--lwt-tab-line-color, rgb(10, 132, 255))) !important; } - .tabbrowser-tab:hover:not([selected="true"], [multiselected]) > .tab-stack > .tab-background > .tab-context-line { background-color: rgba(0, 0, 0, 0.2) !important; opacity: 1 !important; transform: none !important; } - #TabsToolbar[brighttext] .tabbrowser-tab:hover:not([selected="true"], [multiselected]) > .tab-stack @@ -5597,28 +6454,23 @@ > .tab-context-line { background-color: rgba(255, 255, 255, 0.2) !important; } - - /* Prevent identitiy color flashing */ + /* Prevent identity color flashing */ .tabbrowser-tab[usercontextid] .tab-context-line { --identity-icon-color: none; } - :root:not([customizing="true"]) #TabsToolbar[brighttext] tab[visuallyselected] > stack::before, :root:not([customizing="true"]) #TabsToolbar[brighttext] tab[visuallyselected] > stack::after { /* As Selected Tab - Box Shadow */ stroke: var(--toolbar-color) !important; } - /* Animation */ .tabbrowser-tab:not([selected="true"], [multiselected]) .tab-context-line { opacity: 0 !important; transform: scaleX(0) !important; } - @media (prefers-reduced-motion: no-preference) { .tabbrowser-tab:not([selected="true"], [multiselected]) .tab-context-line { - transition: transform 250ms var(--animation-easing-function), opacity 250ms var(--animation-easing-function) !important; - /* --animation-easing-function: cubic-bezier(.07, .95, 0, 1); */ + transition: transform 250ms var(--animation-easing-function), opacity 250ms var(--animation-easing-function) !important; /* --animation-easing-function: cubic-bezier(.07, .95, 0, 1); */ } } /* Remove side's background color border */ @@ -5628,19 +6480,15 @@ > .tab-stack > .tab-background:-moz-lwtheme { --tabs-border-color: rgba(0, 0, 0, 0.3) !important; - box-shadow: 0 0 1px var(--tabs-border-color) !important; - /* Original: 0 0 1px var(--tab-line-color, rgba(128,128,142,0.9)) */ + box-shadow: 0 0 1px var(--tabs-border-color) !important; /* Original: 0 0 1px var(--tab-line-color, rgba(128,128,142,0.9)) */ } - #TabsToolbar:not([brighttext]) #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected="true"], [multiselected]) > .tab-stack > .tab-background { - box-shadow: 0 0 1px var(--tabs-border-color), 0 0 4px rgba(128, 128, 142, 0.5) !important; - /* Original: 0 0 1px var(--tab-line-color, rgba(128,128,142,0.9)), 0 0 4px rgba(128,128,142,0.5) */ + box-shadow: 0 0 1px var(--tabs-border-color), 0 0 4px rgba(128, 128, 142, 0.5) !important; /* Original: 0 0 1px var(--tab-line-color, rgba(128,128,142,0.9)), 0 0 4px rgba(128,128,142,0.5) */ } - /* Container Tab */ .tabbrowser-tab[usercontextid] > .tab-stack > .tab-background > .tab-context-line { margin: unset !important; @@ -5648,13 +6496,23 @@ } /*= Unselected Tab - Divide line =============================================*/ /*= Unselected Tab - Dynamic Separator =======================================*/ -@supports -moz-bool-pref("userChrome.tab.dynamic_separtor") { +@supports -moz-bool-pref("userChrome.tab.dynamic_separator") { + #tabbrowser-arrowscrollbox { + --start-tab-separator-position-x: -1.5px; + --end-tab-separator-position-x: 1.5px; + --tab-separator-position-x: -2.5px; + --tab-separator-position-y: calc(-50% + 1px); + } + #tabbrowser-arrowscrollbox:-moz-locale-dir(rtl) { + --start-tab-separator-position-x: 1.5px; + --end-tab-separator-position-x: -1.5px; + --tab-separator-position-x: 2.5px; + } + #tabbrowser-arrowscrollbox-periphery { + position: relative; + } @supports -moz-bool-pref("userChrome.tab.newtab_button_like_tab") { - #tabbrowser-arrowscrollbox { - position: absolute; - } - - .tab-background::before, + .tab-stack::before, #tabs-newtab-button::before { /* Box Model */ content: ""; @@ -5669,20 +6527,20 @@ opacity: 0; background-color: var(--toolbarseparator-color); /* More position */ - transform: translateX(-2.5px) translateY(calc(-50% + 1px)); + transform: translateX(var(--tab-separator-position-x)) translateY(var(--tab-separator-position-y)); } @supports -moz-bool-pref("userChrome.compatibility.dynamic_separator") { - .tab-background::before, + .tab-stack::before, #tabs-newtab-button::before { background-color: var(--tabs-border-color); } } } @supports not -moz-bool-pref("userChrome.tab.newtab_button_like_tab") { - .tab-background::before, + .tab-stack::before, #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab:not([visuallyselected], [multiselected], :hover)[last-visible-tab] - .tab-background::after { + .tab-stack::after { /* Box Model */ content: ""; display: block; @@ -5697,40 +6555,37 @@ background-color: var(--toolbarseparator-color); } @supports -moz-bool-pref("userChrome.compatibility.dynamic_separator") { - .tab-background::before, + .tab-stack::before, #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab:not([visuallyselected], [multiselected], :hover)[last-visible-tab] - .tab-background::after { + .tab-stack::after { background-color: var(--tabs-border-color); } } - - .tab-background::before { - transform: translateX(-2.5px) translateY(calc(-50% + 1px)) !important; + .tab-stack::before { + transform: translateX(var(--tab-separator-position-x)) translateY(var(--tab-separator-position-y)) !important; } - - .tabbrowser-tab[last-visible-tab] .tab-background::after { + .tabbrowser-tab[last-visible-tab] .tab-stack::after { right: 0; - transform: translateX(1.5px) translateY(calc(-50% + 1px)) !important; + transform: translateX(var(--end-tab-separator-position-x)) translateY(var(--tab-separator-position-y)) !important; } } - .tabbrowser-tab:not([visuallyselected], [multiselected], :hover, :first-child) .tab-background::before { + .tabbrowser-tab:not([visuallyselected], [multiselected], :hover, :first-child) .tab-stack::before { opacity: var(--tab-separator-opacity); } - @supports -moz-bool-pref("userChrome.tabbar.one_liner") { @supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") { @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { - .tabbrowser-tab:not([visuallyselected], [multiselected], :hover):first-child .tab-background::before { + .tabbrowser-tab:not([visuallyselected], [multiselected], :hover):first-child .tab-stack::before { opacity: var(--tab-separator-opacity); - transform: translateX(-1.5px) translateY(calc(-50% + 1px)); + transform: translateX(var(--start-tab-separator-position-x)) translateY(var(--tab-separator-position-y)); } } @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { @media screen and (min-width: 1100px) { - .tabbrowser-tab:not([visuallyselected], [multiselected], :hover):first-child .tab-background::before { + .tabbrowser-tab:not([visuallyselected], [multiselected], :hover):first-child .tab-stack::before { opacity: var(--tab-separator-opacity); - transform: translateX(-1.5px) translateY(calc(-50% + 1px)); + transform: translateX(var(--start-tab-separator-position-x)) translateY(var(--tab-separator-position-y)); } } } @@ -5742,32 +6597,31 @@ } } @supports not -moz-bool-pref("userChrome.tab.newtab_button_like_tab") { - #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab[first-visible-unpinned-tab] .tab-background::before, + #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab[first-visible-unpinned-tab] .tab-stack::before, #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab:not([visuallyselected], [multiselected], :hover)[last-visible-tab] - .tab-background::after { + .tab-stack::after { opacity: var(--tab-separator-opacity); } } #navigator-toolbox:not([movingtab]) .tabbrowser-tab[first-visible-unpinned-tab]:is([visuallyselected], [multiselected], :hover) - .tab-background::before, + .tab-stack::before, #navigator-toolbox:not([movingtab]) #tabbrowser-arrowscrollbox[overflowing] tab.tabbrowser-tab[first-visible-unpinned-tab] - .tab-background::before { + .tab-stack::before { opacity: 0 !important; } - @supports -moz-bool-pref("userChrome.tab.newtab_button_like_tab") { #navigator-toolbox:not([movingtab]) .tabbrowser-tab:is([visuallyselected], [multiselected], :hover) + .tabbrowser-tab - .tab-background::before, + .tab-stack::before, #navigator-toolbox:not([movingtab]) .tabbrowser-tab:is([visuallyselected], [multiselected], :hover) ~ .tabbrowser-tab[afterhovered] - .tab-background::before, + .tab-stack::before, #navigator-toolbox:not([movingtab]) .tabbrowser-tab[last-visible-tab]:is([visuallyselected], [multiselected], :hover) ~ #tabs-newtab-button::before, @@ -5781,29 +6635,31 @@ @supports not -moz-bool-pref("userChrome.tab.newtab_button_like_tab") { .tabbrowser-tab:is([visuallyselected], [multiselected], :hover) + .tabbrowser-tab:not([visuallyselected]) - .tab-background::before { + .tab-stack::before { opacity: 0 !important; } + :root:not([uidensity="compact"]) #tabs-newtab-button > .toolbarbutton-icon { + margin-left: 2px; + } + :root[uidensity="compact"] #tabs-newtab-button > .toolbarbutton-icon { + margin-left: 1px; + } } /* Animate */ @media (prefers-reduced-motion: no-preference) { - .tab-background::before { - transition: opacity 0.2s var(--animation-easing-function); - /* cubic-bezier(.07, .95, 0, 1) */ + .tab-stack::before { + transition: opacity 0.2s var(--animation-easing-function); /* cubic-bezier(.07, .95, 0, 1) */ } - @supports -moz-bool-pref("userChrome.tab.newtab_button_like_tab") { #tabs-newtab-button::before { - transition: opacity 0.2s var(--animation-easing-function); - /* cubic-bezier(.07, .95, 0, 1) */ + transition: opacity 0.2s var(--animation-easing-function); /* cubic-bezier(.07, .95, 0, 1) */ } } @supports not -moz-bool-pref("userChrome.tab.newtab_button_like_tab") { #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab:not([visuallyselected], [multiselected], :hover)[last-visible-tab] - .tab-background::after { - transition: opacity 0.2s var(--animation-easing-function); - /* cubic-bezier(.07, .95, 0, 1) */ + .tab-stack::after { + transition: opacity 0.2s var(--animation-easing-function); /* cubic-bezier(.07, .95, 0, 1) */ } } } @@ -5814,13 +6670,12 @@ } /*= Unselected Tab - Static Separator ========================================*/ @supports -moz-bool-pref("userChrome.tab.static_separator") { - .tabbrowser-tab[first-visible-tab="true"] .tab-background::before, - .tab-background::after { + .tabbrowser-tab[first-visible-tab="true"] .tab-stack::before, + .tab-stack::after { content: ""; } - - .tab-background::before, - .tab-background::after { + .tab-stack::before, + .tab-stack::after { /* Box Model */ display: block; position: absolute; @@ -5834,128 +6689,272 @@ opacity: 0.3; border-right: 1px solid var(--lwt-background-tab-separator-color, currentColor) !important; } - - .tab-background::after { + .tab-stack::after { right: 0; } - @supports -moz-bool-pref("userChrome.tab.static_separator.selected_accent") { - .tabbrowser-tab[visuallyselected] .tab-background::before, - .tabbrowser-tab[visuallyselected] .tab-background::after, - .tabbrowser-tab[beforeselected-visible] .tab-background::after { + .tabbrowser-tab[visuallyselected] .tab-stack::before, + .tabbrowser-tab[visuallyselected] .tab-stack::after, + .tabbrowser-tab[beforeselected-visible] .tab-stack::after { --lwt-background-tab-separator-color: var(--tab-line-color, var(--lwt-tab-line-color, rgb(10, 132, 255))); opacity: 1; } } @supports not -moz-bool-pref("userChrome.tab.static_separator.selected_accent") { - .tabbrowser-tab[visuallyselected] .tab-background::before, - .tabbrowser-tab[visuallyselected] .tab-background::after, - .tabbrowser-tab[beforeselected-visible] .tab-background::after { + .tabbrowser-tab[visuallyselected] .tab-stack::before, + .tabbrowser-tab[visuallyselected] .tab-stack::after, + .tabbrowser-tab[beforeselected-visible] .tab-stack::after { opacity: 0; } } - /* Animate */ @media (prefers-reduced-motion: no-preference) { - .tab-background::before, - .tab-background::after { - transition: opacity 0.2s var(--animation-easing-function); - /* cubic-bezier(.07, .95, 0, 1) */ + .tab-stack::before, + .tab-stack::after { + transition: opacity 0.2s var(--animation-easing-function); /* cubic-bezier(.07, .95, 0, 1) */ + } + } +} +/*= Unselected Tab - Bar Separator ===========================================*/ +@supports -moz-bool-pref("userChrome.tab.bar_separator") { + .tab-stack::before { + /* Box Model */ + content: ""; + display: block; + position: absolute; + /* Position */ + top: 50%; + left: 0%; + transform: translateX(calc((var(--inline-tab-padding) - 5px) / 2)) translateY(calc(-50% + var(--tab-block-margin))); + z-index: 1; + /* Bar shape */ + width: 3px; + height: 20px; + /* Bar Color */ + background-color: var( + --uc-bar-separator-color, + var(--tab-line-color, var(--lwt-tab-line-color, rgb(10, 132, 255))) + ); + } + @media (prefers-reduced-motion: no-preference) { + .tab-stack::before { + transition-property: opacity, background-color; + transition-duration: 0.2s; + transition-timing-function: var(--animation-easing-function); /* cubic-bezier(.07, .95, 0, 1) */ + } + } + :root[sessionrestored] .tabbrowser-tab[busy] .tab-stack::before { + --uc-bar-separator-color: currentColor; + opacity: 0.7; + } + :root[sessionrestored] .tabbrowser-tab[busy][progress] .tab-stack::before { + --uc-bar-separator-color: var(--tab-loading-fill); + opacity: 1; + } + :root[sessionrestored] + #TabsToolbar[brighttext] + .tabbrowser-tab[busy][progress]:not([selected="true"]) + .tab-stack::before { + --uc-bar-separator-color: var(--lwt-tab-loading-fill-inactive, #84c1ff); + } + @supports -moz-bool-pref("userChrome.tab.unloaded") { + :root[sessionrestored] .tabbrowser-tab[pending] .tab-stack::before { + opacity: 0.7; } } } /*= New tab button ============================================================*/ /*= New tab button - Looks like tab ==========================================*/ @supports -moz-bool-pref("userChrome.tab.newtab_button_like_tab") { - #tabs-newtab-button { - /* Original: - margin: 0 0 var(--tabs-navbar-shadow-size) !important - => Can't ovrride style. Therefore, we should approach it by bypass. - */ - --tabs-navbar-shadow-size: -1px; - /* Original: 1px */ - --tabs-navbar-original-shadow-size: 1px; - --tab-corner-rounding: 4px; - /* Hardcorded */ - /* Size */ - -moz-box-align: stretch !important; - padding-top: var(--tab-block-margin) !important; - /* Corner Rounding Image */ - --newtab-position: calc((var(--tab-corner-rounding) / 2) * -1); - background-image: url("../icons/tab-bottom-corner-left.svg"), url("../icons/tab-bottom-corner-right.svg"); - background-repeat: no-repeat; - background-position: left var(--newtab-position) bottom var(--tabs-navbar-original-shadow-size), - right var(--newtab-position) bottom var(--tabs-navbar-original-shadow-size); - background-size: var(--tab-corner-rounding); - /* Corner Rounding Color */ - fill: transparent !important; - -moz-context-properties: fill !important; + @supports -moz-bool-pref("userChrome.tab.connect_to_window") { + #tabs-newtab-button { + /* Size */ + -moz-box-align: stretch !important; + padding-top: var(--tab-block-margin) !important; + } + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner") { + #tabs-newtab-button { + /* Original: + margin: 0 0 var(--tabs-navbar-shadow-size) !important + => Can't override style. Therefore, we should approach it by bypass. + */ + --tabs-navbar-shadow-size: -1px; /* Original: 1px */ + --uc-tabs-navbar-shadow-size: 0.5px; + --uc-tab-corner-rounding: 4px; /* Hardcoded */ + --uc-newtab-bgcolor: transparent; + /* Corner Rounding Image */ + --uc-newtab-position: calc((var(--uc-tab-corner-rounding) / 2) * -1); + background-image: var(--uc-tab-corner-left-side-svg), var(--uc-tab-corner-right-side-svg); + background-repeat: no-repeat; + background-position: left var(--uc-newtab-position) bottom var(--uc-tabs-navbar-shadow-size), + right var(--uc-newtab-position) bottom var(--uc-tabs-navbar-shadow-size); + background-size: var(--uc-tab-corner-rounding); + /* Corner Rounding Color */ + fill: var(--uc-newtab-bgcolor) !important; + -moz-context-properties: fill !important; + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.wave") or -moz-bool-pref( + "userChrome.tab.bottom_rounded_corner.australis" + ) or -moz-bool-pref("userChrome.tab.bottom_rounded_corner.chrome_legacy") or -moz-bool-pref( + "userChrome.tab.bottom_rounded_corner.chrome" + ) or -moz-bool-pref("userChrome.tab.bottom_rounded_corner.edge") { + #tabs-newtab-button { + --uc-newtab-position: 0px; + --uc-newtab-non-corner-bgwidth: 0px; + --uc-tab-corner-half-height: calc(var(--uc-tab-corner-height) / 2); + --uc-tab-corner-half-height-reverse: calc(var(--uc-tab-corner-half-height) * -1); + transform: translateX(var(--uc-tab-corner-half-height-reverse)); + padding-inline: var(--uc-tab-corner-half-height) !important; + overflow-clip-margin: var(--uc-tab-corner-half-height) !important; + background-image: var(--uc-tab-corner-left-side-svg), + linear-gradient(to left, var(--uc-newtab-bgcolor), var(--uc-newtab-bgcolor)), + var(--uc-tab-corner-right-side-svg); + background-position: left var(--uc-newtab-position) bottom var(--uc-tabs-navbar-shadow-size), + center bottom var(--uc-tabs-navbar-shadow-size), + right var(--uc-newtab-position) bottom var(--uc-tabs-navbar-shadow-size); + background-size: var(--uc-tab-corner-height) var(--uc-tab-corner-height), + var(--uc-newtab-non-corner-bgwidth) var(--uc-tab-corner-height), + var(--uc-tab-corner-height) var(--uc-tab-corner-height); + background-origin: padding-box; + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.chrome") or -moz-bool-pref("userChrome.tab.bottom_rounded_corner.edge") { + #tabs-newtab-button { + --uc-newtab-non-corner-bgwidth: calc(2 * var(--toolbarbutton-inner-padding)); + } + } + } } - /* Corner Rounding Color */ #tabs-newtab-button:hover { - fill: var(--toolbarbutton-hover-background) !important; + --uc-newtab-bgcolor: var(--toolbarbutton-hover-background); } - #tabs-newtab-button:hover:active { - fill: var(--toolbarbutton-active-background) !important; + --uc-newtab-bgcolor: var(--toolbarbutton-active-background); } - @media (-moz-windows-accent-color-in-titlebar) { :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #tabs-newtab-button:hover, :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) #tabs-newtab-button:hover { - fill: color-mix(in srgb, AccentColorText 10%, transparent) !important; - /* Hardcorded for compatibility */ + fill: color-mix(in srgb, AccentColorText 10%, transparent) !important; /* Hardcoded for compatibility */ } - :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #tabs-newtab-button:hover:active, :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) #tabs-newtab-button:hover:active { - fill: color-mix(in srgb, AccentColorText 15%, transparent) !important; - /* Hardcorded for compatibility */ + fill: color-mix(in srgb, AccentColorText 15%, transparent) !important; /* Hardcoded for compatibility */ + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner") { + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.wave") or -moz-bool-pref( + "userChrome.tab.bottom_rounded_corner.australis" + ) or -moz-bool-pref("userChrome.tab.bottom_rounded_corner.chrome_legacy") or -moz-bool-pref( + "userChrome.tab.bottom_rounded_corner.chrome" + ) or -moz-bool-pref("userChrome.tab.bottom_rounded_corner.edge") { + :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #tabs-newtab-button:hover, + :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) #tabs-newtab-button:hover { + background-image: var(--uc-tab-corner-left-side-svg), + linear-gradient( + to left, + color-mix(in srgb, AccentColorText 10%, transparent), + color-mix(in srgb, AccentColorText 10%, transparent) + ), + var(--uc-tab-corner-right-side-svg); + } + :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #tabs-newtab-button:hover:active, + :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) + #tabs-newtab-button:hover:active { + background-image: var(--uc-tab-corner-left-side-svg), + linear-gradient( + to left, + color-mix(in srgb, AccentColorText 15%, transparent), + color-mix(in srgb, AccentColorText 15%, transparent) + ), + var(--uc-tab-corner-right-side-svg); + } + } } - @supports -moz-bool-pref("userChrome.compatibility.accent_color") { :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #tabs-newtab-button:hover, :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) #tabs-newtab-button:hover { - fill: color-mix(in srgb, -moz-accent-color-foreground 10%, transparent) !important; - /* Hardcorded for compatibility */ + fill: color-mix( + in srgb, + -moz-accent-color-foreground 10%, + transparent + ) !important; /* Hardcoded for compatibility */ } - :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #tabs-newtab-button:hover:active, :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) #tabs-newtab-button:hover:active { - fill: color-mix(in srgb, -moz-accent-color-foreground 15%, transparent) !important; - /* Hardcorded for compatibility */ + fill: color-mix( + in srgb, + -moz-accent-color-foreground 15%, + transparent + ) !important; /* Hardcoded for compatibility */ + } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner") { + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.wave") or -moz-bool-pref( + "userChrome.tab.bottom_rounded_corner.australis" + ) or -moz-bool-pref("userChrome.tab.bottom_rounded_corner.chrome_legacy") or -moz-bool-pref( + "userChrome.tab.bottom_rounded_corner.chrome" + ) or -moz-bool-pref("userChrome.tab.bottom_rounded_corner.edge") { + :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #tabs-newtab-button:hover, + :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) #tabs-newtab-button:hover { + background-image: var(--uc-tab-corner-left-side-svg), + linear-gradient( + to left, + color-mix(in srgb, -moz-accent-color-foreground 10%, transparent), + color-mix(in srgb, -moz-accent-color-foreground 10%, transparent) + ), + var(--uc-tab-corner-right-side-svg); + } + :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #tabs-newtab-button:hover:active, + :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) + #tabs-newtab-button:hover:active { + background-image: var(--uc-tab-corner-left-side-svg), + linear-gradient( + to left, + color-mix(in srgb, -moz-accent-color-foreground 15%, transparent), + color-mix(in srgb, -moz-accent-color-foreground 15%, transparent) + ), + var(--uc-tab-corner-right-side-svg); + } + } } } } /* '+'Icon */ #tabs-newtab-button .toolbarbutton-icon { - border-radius: var(--tab-border-radius) var(--tab-border-radius) 0 0 !important; - /* Original: var(--tab-border-radius) */ + border-radius: var(--tab-border-radius) var(--tab-border-radius) 0 0 !important; /* Original: var(--tab-border-radius) */ padding: calc(var(--toolbarbutton-inner-padding) - var(--tab-block-margin) / 4) var(--toolbarbutton-inner-padding) - calc(var(--toolbarbutton-inner-padding) + var(--tab-block-margin) / 4 + var(--tabs-navbar-original-shadow-size)) !important; + calc(var(--toolbarbutton-inner-padding) + var(--tab-block-margin) / 4 + var(--uc-tabs-navbar-shadow-size)) !important; -moz-context-properties: fill, fill-opacity; fill: var(--toolbarbutton-icon-fill); fill-opacity: var(--toolbarbutton-icon-fill-opacity); } + @supports -moz-bool-pref("userChrome.tab.bottom_rounded_corner.wave") or -moz-bool-pref( + "userChrome.tab.bottom_rounded_corner.australis" + ) or -moz-bool-pref("userChrome.tab.bottom_rounded_corner.chrome_legacy") or -moz-bool-pref( + "userChrome.tab.bottom_rounded_corner.chrome" + ) or -moz-bool-pref("userChrome.tab.bottom_rounded_corner.edge") { + #tabs-newtab-button .toolbarbutton-icon { + --tab-border-radius: 0px; + width: unset !important; + padding-inline: 0px !important; + margin-inline: calc(var(--uc-tab-corner-half-height) - 7.75px) !important; + background-color: transparent !important; + } + } } /*= New tab button - Smaller button ==========================================*/ @supports -moz-bool-pref("userChrome.tab.newtab_button_smaller") { #tabs-newtab-button > .toolbarbutton-icon { + --tab-border-radius: var(--toolbarbutton-border-radius); margin-left: 1px; - /* Origianl: calc((var(--tab-min-height) - 16px) / 2) = 10px */ + /* Original: calc((var(--tab-min-height) - 16px) / 2) = 10px */ --toolbarbutton-inner-padding: 6px; } - :root[uidensity="compact"] #tabs-newtab-button > .toolbarbutton-icon { - --toolbarbutton-inner-padding: 4px; - /* Photon: 6px */ + --toolbarbutton-inner-padding: 4px; /* Photon: 6px */ } - :root[uidensity="touch"] #tabs-newtab-button > .toolbarbutton-icon { - --toolbarbutton-inner-padding: 9px; - /* Photon: 9px */ + --toolbarbutton-inner-padding: 9px; /* Photon: 9px */ } } /*= New tab button - Proton like button ======================================*/ @@ -5963,18 +6962,10 @@ :root:not([uidensity="touch"]) #tabs-newtab-button > .toolbarbutton-icon { --toolbarbutton-inner-padding: calc((var(--tab-min-height) - 16px) / 2 - 1px); } - - :root:not([uidensity="compact"]) #tabs-newtab-button > .toolbarbutton-icon { - margin-left: 2px; - } - - :root[uidensity="compact"] #tabs-newtab-button > .toolbarbutton-icon { - margin-left: 1px; - } } /*= Unloaded Tab - Contents Opacity ===========================================*/ @supports -moz-bool-pref("userChrome.tab.unloaded") { - #tabbrowser-tabs .tabbrowser-tab[pending] .tab-content { + .tabbrowser-tab[pending] .tab-content { opacity: 0.7; } } @@ -5982,30 +6973,21 @@ /** Clipped tabs - Letters cleary *********************************************/ @supports -moz-bool-pref("userChrome.tab.letters_cleary") { #tabbrowser-tabs[closebuttons="activetab"] { - --inline-tab-padding: 7px !important; - /* Original: 8px */ + --inline-tab-padding: 7px !important; /* Original: 8px */ } - #tabbrowser-tabs[overflow="true"] { - --inline-tab-padding: 6px !important; - /* Original: 8px */ + --inline-tab-padding: 6px !important; /* Original: 8px */ } - .tab-content[pinned] { - --inline-tab-padding: 10px; - /* Prevent overflow pinned tab's divide line not aligned */ + --inline-tab-padding: 10px; /* Prevent overflow pinned tab's divide line not aligned */ padding-inline: var(--inline-tab-padding) !important; } - :root[uidensity="compact"] .tab-content[pinned] { --inline-tab-padding: 8px; } - .tabbrowser-tab .tab-label-container { - --tab-label-mask-size: 1.8em; - /* Original: 2em */ + --tab-label-mask-size: 1.8em; /* Original: 2em */ } - #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab .tab-label-container { --tab-label-mask-size: 30%; } @@ -6014,14 +6996,12 @@ .tab-label-container { --tab-label-mask-size: 25%; } - .tabbrowser-tab[visuallyselected="true"]:not([labelendaligned]):hover .tab-label-container, #tabbrowser-tabs:not([closebuttons="activetab"]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab:not([visuallyselected="true"], [labelendaligned]):hover .tab-label-container { - --tab-label-mask-size: 0.9em; - /* Original: 1em */ + --tab-label-mask-size: 0.9em; /* Original: 1em */ } } /** Clipped tabs - Show close button at hover *********************************/ @@ -6034,91 +7014,75 @@ > .tab-close-button:not([selected="true"]) { display: -moz-inline-box !important; } - #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([visuallyselected]) .tab-close-button { visibility: collapse !important; opacity: 0; } - #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:hover .tab-close-button { visibility: visible !important; opacity: 1; } - + @supports -moz-bool-pref("userChrome.tab.close_button_at_hover.with_selected") { + #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([pinned]):not(:hover) .tab-close-button { + visibility: collapse !important; + opacity: 0; + } + } @supports -moz-bool-pref("userChrome.tab.close_button_at_hover.always") { .tabbrowser-tab:not([visuallyselected]) .tab-close-button { visibility: collapse !important; opacity: 0; } - .tabbrowser-tab:hover .tab-close-button { visibility: visible !important; opacity: 1; } + @supports -moz-bool-pref("userChrome.tab.close_button_at_hover.with_selected") { + .tabbrowser-tab:not([pinned]):not(:hover) .tab-close-button { + visibility: collapse !important; + opacity: 0; + } + } } /* Animate */ @media (prefers-reduced-motion: no-preference) { /* Fade out */ - #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([visuallyselected]) .tab-close-button { + .tabbrowser-tab .tab-close-button { transition: opacity 0.1s var(--animation-easing-function) !important; } - /* Fade in */ - #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:hover .tab-close-button { + .tabbrowser-tab:hover .tab-close-button { transition: opacity 0.25s var(--animation-easing-function) !important; } - - @supports -moz-bool-pref("userChrome.tab.close_button_at_hover.always") { - /* Fade out */ - .tabbrowser-tab:not([visuallyselected]) .tab-close-button { - transition: opacity 0.1s var(--animation-easing-function) !important; - } - - /* Fade in */ - .tabbrowser-tab:hover .tab-close-button { - transition: opacity 0.25s var(--animation-easing-function) !important; - } - } } /* Closed Button's icon thicker */ .tabbrowser-tab .tab-content > .close-icon { list-style-image: url("../icons/dismiss-filled.svg") !important; } - /* Closed Button's icon larger */ .tab-close-button { - padding: 6px !important; - /* Original: 7px */ + padding: 6px !important; /* Original: 7px */ } - .tabbrowser-tab:not(:hover, [pinned]) > .tab-stack > .tab-content > .tab-close-button { - padding-inline-start: 1px !important; - /* Original: 0px */ - width: 19px !important; - /* Original: 17px */ + padding-inline-start: 1px !important; /* Original: 0px */ + width: 19px !important; /* Original: 17px */ } - /* Closed Button's padding reduce */ #tabbrowser-tabs[closebuttons="activetab"] .tab-content > .tab-close-button { - margin-inline-end: calc(var(--inline-tab-padding) / -2 + 2px) !important; - /* Original: calc(var(--inline-tab-padding) / -2)*/ - padding: 4px !important; - /* Original: 7px */ - width: 20px !important; - /* Original: 24px */ - height: 20px !important; - /* Original: 24px */ + margin-inline-end: calc( + var(--inline-tab-padding) / -2 + 2px + ) !important; /* Original: calc(var(--inline-tab-padding) / -2)*/ + padding: 4px !important; /* Original: 7px */ + width: 20px !important; /* Original: 24px */ + height: 20px !important; /* Original: 24px */ } - #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not(:hover) > .tab-stack > .tab-content > .tab-close-button { - padding-inline-start: 3px !important; - /* Original: 0px */ - width: 19px !important; - /* Redefine from 19px !important, Original: 17px = (width - padding) */ + padding-inline-start: 3px !important; /* Original: 0px */ + width: 19px !important; /* Redefine from 19px !important, Original: 17px = (width - padding) */ } } /** Clipped tabs - Show close button at pinned tab ****************************/ @@ -6129,12 +7093,10 @@ --uc-close-button-padding: 6px; --uc-close-button-margin: calc((var(--uc-close-button-size) - 16px) / -2); } - #tabbrowser-tabs[closebuttons="activetab"] { --uc-close-button-size: 20px; --uc-close-button-padding: 4px; } - .tabbrowser-tab[pinned][visuallyselected]:not([style*="transform: translateX"]):hover:not([busy]) .tab-close-button { display: -moz-box !important; @@ -6191,7 +7153,6 @@ display: none !important; } } - #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab[pinned]:not([style*="transform: translateX"]):hover:not([busy]) .tab-close-button { @@ -6226,22 +7187,26 @@ .tab-icon-image:not([pinned]) { opacity: 1 !important; } - /* Makes the speaker icon to always appear if the tab is playing (not only on hover) */ + .tabbrowser-tab { + --uc-sound-tab-icon-position-x: -0.5px; + } + .tabbrowser-tab:-moz-locale-dir(rtl) { + --uc-sound-tab-icon-position-x: 0.5px; + } .tab-icon-overlay:not([crashed]), .tab-icon-overlay[pinned][crashed][selected] { /* Position */ top: 0 !important; inset-inline-end: -9px !important; z-index: 1 !important; - transform: translateX(-0.5px) translateY(-6px); + transform: translateX(var(--uc-sound-tab-icon-position-x)) translateY(-6px); /* Shape */ padding: 1.5px !important; border-radius: 10px !important; width: 17px !important; height: 17px !important; } - .tab-icon-overlay:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) { /* Color */ color: currentColor !important; @@ -6250,18 +7215,44 @@ fill-opacity: 0.8 !important; opacity: 1 !important; } - /* Label */ @supports not -moz-bool-pref("userChrome.hidden.tab_icon") { - .tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) .tab-label { - transform: translateX(4px); + .tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) + .tab-label-container[labeldirection="ltr"], + .tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) + .tab-label-container:not([labeldirection]):-moz-locale-dir(ltr) { + --uc-sound-tab-label-position-x: 4px; + } + .tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) + .tab-label-container[labeldirection="rtl"], + .tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) + .tab-label-container:not([labeldirection]):-moz-locale-dir(rtl) { + --uc-sound-tab-label-position-x: -4px; + } + .tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) + .tab-label-container + > * { + transform: translateX(var(--uc-sound-tab-label-position-x)); } } @supports -moz-bool-pref("userChrome.hidden.tab_icon") { @supports not -moz-bool-pref("userChrome.hidden.tab_icon.always") { .tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) - .tab-label { - transform: translateX(4px); + .tab-label-container[labeldirection="ltr"], + .tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) + .tab-label-container:not([labeldirection]):-moz-locale-dir(ltr) { + --uc-sound-tab-label-position-x: 4px; + } + .tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) + .tab-label-container[labeldirection="rtl"], + .tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) + .tab-label-container:not([labeldirection]):-moz-locale-dir(rtl) { + --uc-sound-tab-label-position-x: -4px; + } + .tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) + .tab-label-container + > * { + transform: translateX(var(--uc-sound-tab-label-position-x)); } } } @@ -6271,44 +7262,53 @@ .tab-icon-overlay[pinned][crashed][selected] { transition: 0.1s var(--animation-easing-function); } - - .tab-label-container > .tab-label { + .tab-label-container > * { transition: transform 0.25s var(--animation-easing-function); } } /* None exist favicon - Size bigger */ @supports not -moz-bool-pref("userChrome.tab.always_show_tab_icon") { + .tabbrowser-tab .tab-label-container[labeldirection="ltr"], + .tabbrowser-tab .tab-label-container:not([labeldirection]):-moz-locale-dir(ltr) { + --uc-sound-tab-no-icon-position-x: -0.5px; + --uc-sound-tab-no-icon-label-position-x: 3px; + } + .tabbrowser-tab .tab-label-container[labeldirection="rtl"], + .tabbrowser-tab .tab-label-container:not([labeldirection]):-moz-locale-dir(rtl) { + --uc-sound-tab-no-icon-position-x: 0.5px; + --uc-sound-tab-no-icon-label-position-x: -3px; + } @supports not -moz-bool-pref("userChrome.hidden.tab_icon") { .tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing], [crashed]) { - transform: translateX(-0.5px) translateY(-1px); + transform: translateX(var(--uc-sound-tab-no-icon-position-x)) translateY(-1px); inset-inline-end: 0 !important; margin-inline-end: 0 !important; padding: 0 !important; } .tabbrowser-tab:not([image]):is([soundplaying], [muted], [activemedia-blocked]) .tab-icon-image:not([pinned]) { - opacity: 0 !important; - /* Favicon hidden */ + opacity: 0 !important; /* Favicon hidden */ } .tabbrowser-tab:not([image]):not([image]):not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) - .tab-label { - transform: translateX(3px); + .tab-label-container + > * { + transform: translateX(var(--uc-sound-tab-no-icon-label-position-x)); } } @supports -moz-bool-pref("userChrome.hidden.tab_icon") { @supports not -moz-bool-pref("userChrome.hidden.tab_icon.always") { .tabbrowser-tab .tab-icon-overlay:not([pinned], [sharing], [crashed]) { - transform: translateX(-0.5px) translateY(-1px); + transform: translateX(var(--uc-sound-tab-no-icon-position-x)) translateY(-1px); inset-inline-end: 0 !important; margin-inline-end: 0 !important; padding: 0 !important; } .tabbrowser-tab:is([soundplaying], [muted], [activemedia-blocked]) .tab-icon-image:not([pinned]) { - opacity: 0 !important; - /* Favicon hidden */ + opacity: 0 !important; /* Favicon hidden */ } .tabbrowser-tab:not([image]):not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) - .tab-label { - transform: translateX(3px); + .tab-label-container + > * { + transform: translateX(var(--uc-sound-tab-no-icon-label-position-x)); } } } @@ -6318,18 +7318,15 @@ .tab-icon-pending[busy] { opacity: 1 !important; } - /* Busy - Overlay Position */ .tabbrowser-tab:not([pinned])[busy] .tab-icon-overlay:is([soundplaying], [muted], [activemedia-blocked]) { - transform: translateX(-0.5px) translateY(-6px); + transform: translateX(var(--uc-sound-tab-icon-position-x)) translateY(-6px); } - .tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing], [crashed])[busy] { inset-inline-end: -9px !important; margin-inline-end: 9.5px !important; padding: 1.5px !important; } - /* Hover */ .tab-icon-overlay:not([crashed])[soundplaying]:hover, .tab-icon-overlay:not([crashed])[muted]:hover, @@ -6339,13 +7336,11 @@ background-color: var(--lwt-tab-text, var(--toolbar-color)) !important; fill-opacity: 0.95 !important; } - #TabsToolbar[brighttext] .tab-icon-overlay:not([crashed])[soundplaying]:hover, #TabsToolbar[brighttext] .tab-icon-overlay:not([crashed])[muted]:hover, #TabsToolbar[brighttext] .tab-icon-overlay:not([crashed])[activemedia-blocked]:hover { color: var(--toolbar-bgcolor, black) !important; } - .tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing], [crashed]):hover { padding: 0 !important; } @@ -6358,7 +7353,6 @@ .tab-content::after { content: ""; } - .tabbrowser-tab[pictureinpicture]:not([pinned]) .tab-content::after { /* Shape */ display: -moz-inline-box !important; @@ -6373,20 +7367,16 @@ /* Icon */ background-image: url("chrome://global/skin/media/picture-in-picture-open.svg"); } - .tabbrowser-tab[pictureinpicture]:not([pinned])[selected] .tab-content::after { opacity: 0.95; } - /* Close Button's position */ .tabbrowser-tab[pictureinpicture]:not([pinned]) .tab-close-button { -moz-box-ordinal-group: 2 !important; } - #tabbrowser-tabs:not([closebuttons="activetab"]) .tabbrowser-tab[pictureinpicture]:not([pinned]) .tab-close-button { margin-left: 7px !important; } - #tabbrowser-tabs:not([closebuttons="activetab"]) .tabbrowser-tab[pictureinpicture]:not([pinned]):hover .tab-close-button { @@ -6401,52 +7391,53 @@ display: none; } } - .tabbrowser-tab { - --container-position-y: 11px; + #tabbrowser-tabs { + --uc-container-position-x: 9px; + --uc-container-position-y-default: 11.5px; + --uc-container-position-y: calc(50% + var(--uc-container-position-y-default)); + --uc-titlechanged-container-position-x: 32%, 50%, 70%; } - - :root[uidensity="compact"] .tabbrowser-tab { - --container-position-y: 10px; + #tabbrowser-tabs:-moz-locale-dir(rtl) { + --uc-container-position-x: -9px; } - - :root[uidensity="touch"] .tabbrowser-tab { - --container-position-y: 12px; + :root[uidensity="compact"] #tabbrowser-tabs { + --uc-container-position-y-default: 10.5px; + --uc-titlechanged-container-position-x: 30%, 50%, 70%; + } + :root[uidensity="touch"] #tabbrowser-tabs { + --uc-container-position-y-default: 12.5px; } - .tab-content:not([titlechanged])::before { /* Box Model */ content: ""; display: block; - position: absolute !important; - transform: translate(9px, var(--container-position-y)) !important; + position: absolute; + top: 50%; + transform: translate(var(--uc-container-position-x), var(--uc-container-position-y)); /* Shape */ border-bottom: 2px solid var(--identity-icon-color); width: 25%; opacity: 0.75; } - .tabbrowser-tab[visuallyselected]:not([pinned]) .tab-content::before { width: calc(100% - 30px); opacity: 1; } - #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab[visuallyselected]:not([pinned]) .tab-content::before { width: calc(100% - 33px); } - /* Animate */ @media (prefers-reduced-motion: no-preference) { .tab-content:not([titlechanged])::before { - transition: 0.15s var(--animation-easing-function) !important; + transition: 0.15s var(--animation-easing-function); transition-property: width, opacity; } } /* Pinned Tab */ .tabbrowser-tab[pinned] .tab-content::before { - transform: translateY(var(--container-position-y)) !important; + transform: translateY(var(--uc-container-position-y)); width: 16px; } - @supports -moz-bool-pref("userChrome.tab.close_button_at_pinned") { .tabbrowser-tab[pinned][visuallyselected]:not([busy]):hover .tab-content::before { opacity: 0; @@ -6463,27 +7454,13 @@ transparent 2px ); background-image: var(--dotted-identity-image), var(--dotted-identity-image), var(--dotted-identity-image) !important; - background-position-x: 32%, 50%, 70% !important; + background-position-x: var(--uc-titlechanged-container-position-x) !important; } - - :root[uidensity="compact"] - .tabbrowser-tab:is([image], [pinned])[usercontextid] - > .tab-stack - > .tab-content[attention]:not([selected="true"]), - :root[uidensity="compact"] - .tabbrowser-tab[usercontextid] - > .tab-stack - > .tab-content[pinned][titlechanged]:not([selected="true"]) { - /* Original: radial-gradient(circle, var(--attention-icon-color), var(--attention-icon-color) 2px, transparent 2px); */ - background-position-x: 30%, 50%, 70% !important; - } - .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]), .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */ - background-position-y: top calc(0.5px + 50% + var(--container-position-y)) !important; + background-position-y: top var(--uc-container-position-y) !important; } - /* Pinned Tab - Titlechanged & soundplaying */ .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack @@ -6491,9 +7468,8 @@ .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { - background-position-x: calc(32% - 1px), calc(50% - 1px), calc(70% - 1px) !important; + --uc-titlechanged-container-position-x: calc(32% - 1px), calc(50% - 1px), calc(70% - 1px); } - :root[uidensity="compact"] .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack @@ -6502,7 +7478,7 @@ .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { - background-position-x: calc(30% - 1px), calc(50% - 1px), calc(70% - 1px) !important; + --uc-titlechanged-container-position-x: calc(30% - 1px), calc(50% - 1px), calc(70% - 1px); } } } @@ -6512,8 +7488,350 @@ display: none !important; } } +/** Nav Bar UI ****************************************************************/ +/*= Nav Bar - Navbar comabine with sidebar===================================*/ +@supports -moz-bool-pref("userChrome.navbar.as_sidebar") { + :root { + --uc-navbar-margin-block: var(--toolbarbutton-inner-padding); + --uc-urlbar-margin-top: calc(var(--uc-navbar-height) + var(--uc-navbar-margin-block)); + --uc-urlbar-container-height: 36px; + --uc-navbar-sideblock-height: calc(var(--uc-urlbar-margin-top) + var(--uc-urlbar-container-height)); + } + #nav-bar, + #sidebar-box, + #sidebar-header, + #sidebar { + min-width: var(--uc-sidebar-activate-width) !important; + max-width: var(--uc-sidebar-activate-width) !important; + } + #nav-bar, + #wrapper-urlbar-container, + #urlbar-container { + position: absolute !important; + } + #nav-bar-customization-target { + -moz-box-pack: justify; + } + #nav-bar { + z-index: 1; + margin-top: calc( + var(--uc-tabbar-height) + var(--uc-bm-height) + var(--uc-menubar-height) + var(--uc-navbar-margin-block) + ); + overflow-y: visible !important; + background: none !important; + box-shadow: none !important; + -moz-window-dragging: drag; + } + @supports selector(:has(a)) { + :root:has(#sidebar-box[hidden="true"]) #nav-bar { + margin-inline-start: var(--uc-sidebar-activate-width-reverse) !important; + opacity: 0; + visibility: hidden; + } + :root:has(#sidebar-box[positionend="true"]) #nav-bar { + right: 0; + } + } + @media (prefers-reduced-motion: no-preference) { + @supports -moz-bool-pref("userChrome.decoration.animate") { + @supports not -moz-bool-pref("userChrome.decoration.disable_sidebar_animate") { + #nav-bar { + transition: margin-inline-start 0.25s var(--animation-easing-function), opacity 0.25s ease-in-out, + visibility 0s linear, + margin-top var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay), + var(--ext-theme-background-transition) !important; + will-change: margin-inline-start, opacity, visibility, margin-top; + } + :root:has(#sidebar-box[hidden="true"]) #nav-bar, + #navigator-toolbox:is(:hover, :focus-within) #nav-bar { + transition-delay: 0s, 0s, 0.25s, 0s, 0s !important; + } + } + @supports -moz-bool-pref("userChrome.decoration.disable_sidebar_animate") { + #nav-bar { + transition: margin-top var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay), + var(--ext-theme-background-transition) !important; + will-change: margin-top; + } + #navigator-toolbox:is(:hover, :focus-within) #nav-bar { + transition-delay: 0s !important; + } + } + } + } + #urlbar-container { + top: var(--uc-urlbar-margin-top); + min-width: calc(var(--uc-sidebar-activate-width) - 2 * var(--toolbarbutton-inner-padding)) !important; + margin-inline: auto !important; /* Original: var(--urlbar-margin-inline) */ + left: 50%; + transform: translateX(-50%); + } + #customizableui-special-spring1, + #customizableui-special-spring2, + #wrapper-customizableui-special-spring1, + #wrapper-customizableui-special-spring2 { + display: none !important; + } + #sidebar-header { + margin-top: var(--uc-navbar-sideblock-height) !important; + -moz-window-dragging: drag; + } + :root[customizing="true"] #wrapper-urlbar-container { + left: 50%; + } + :root[customizing="true"] #browser[collapsed="true"] { + visibility: visible !important; + } + :root[customizing="true"] #browser[collapsed="true"] #appcontent { + visibility: collapse; + } + :root[customizing="true"] #browser[collapsed="true"] #sidebar-box { + position: absolute; + height: 100%; + } + :root[customizing="true"] #browser[collapsed="true"] #sidebar-box[positionend="true"] { + right: 0; + } + :root[customizing="true"] #customization-container { + --uc-customization-conatiner-margin: var(--uc-navbar-height-default); + width: calc(100% - var(--uc-sidebar-activate-width)); + height: calc(100% - var(--uc-customization-conatiner-margin)); + } + @supports -moz-bool-pref("userChrome.hidden.tabbar") { + :root[customizing="true"] #customization-container { + --uc-customization-conatiner-margin: calc(var(--uc-navbar-height-default) - var(--uc-tabbar-height-default)); + } + } + :root[customizing="true"]:has(#sidebar-box:not([positionend="true"])) #customization-container { + margin-inline-start: var(--uc-sidebar-activate-width); + } + :root[customizing="true"]:has(#sidebar-box[positionend="true"]) #customization-container { + margin-inline-end: var(--uc-sidebar-activate-width); + } + :root[customizing="true"] #customization-palette-container, + :root[customizing="true"] #customization-panel-container { + flex-shrink: 0.5 !important; + } +} +/** Bookark Bar UI ************************************************************/ +@supports -moz-bool-pref("userChrome.bookmarkbar.multi_row") { + #PersonalToolbar { + --uc-multirow-bookmark-rows: 3; + --uc-multirow-bookmark-row-margin: 2px; + max-height: none !important; + } + #PlacesToolbar > hbox { + display: block; + width: 100vw; + } + #PlacesToolbarItems { + display: flex; + flex-wrap: wrap; + overflow-y: auto; + scroll-snap-type: y mandatory; + max-height: calc( + var(--uc-multirow-bookmark-rows) * + ( + var(--uc-bm-height, calc(20px + 2 * var(--bookmark-block-padding, 4px))) + 2 * + var(--uc-multirow-bookmark-row-margin) + ) + ) !important; + } + #PlacesChevron { + display: none; + } + #PlacesToolbarItems > .bookmark-item { + scroll-snap-align: start; + margin-block: var(--uc-multirow-bookmark-row-margin) !important; + } +} /** Url View UI ***************************************************************/ -/*= Url View - Move icon to left =============================================*/ +/*= Url Bar - Icon box as Separator ==========================================*/ +@supports -moz-bool-pref("userChrome.urlbar.iconbox_with_separator") { + #identity-box { + /* separator */ + position: relative; + } + #identity-box[pageproxystate="valid"].notSecureText > .identity-box-button:not(:hover, [open]), + #identity-box[pageproxystate="valid"].chromeUI > .identity-box-button:not(:hover, [open]), + #identity-box[pageproxystate="valid"].extensionPage > .identity-box-button:not(:hover, [open]) { + /* remove background from urlbar box */ + background-color: transparent !important; + } + #identity-box[pageproxystate="valid"].notSecureText > .identity-box-button:not(:hover, [open])::after, + #identity-box[pageproxystate="valid"].chromeUI > .identity-box-button:not(:hover, [open])::after, + #identity-box[pageproxystate="valid"].extensionPage > .identity-box-button:not(:hover, [open])::after { + opacity: 0.375; + } + #identity-box[pageproxystate="valid"].notSecureText > .identity-box-button::after, + #identity-box[pageproxystate="valid"].chromeUI > .identity-box-button::after, + #identity-box[pageproxystate="valid"].extensionPage > .identity-box-button::after { + /* Box Model */ + content: ""; + position: absolute; + display: block; + /* Position */ + right: 0; + top: 50%; + transform: translateY(-50%); + /* Bar shape */ + width: 1px; + height: 1em; + /* Bar Color */ + opacity: 0; + background-color: currentColor; + } + #identity-box[pageproxystate="valid"] #identity-icon-label { + /* increase space between icon and text - as identity box padding */ + padding-inline-start: 8px !important; + } + @media (prefers-reduced-motion: no-preference) { + .identity-box-button::after { + transition: opacity 0.2s var(--animation-easing-function); + } + } +} +/*= Url View - Share Layout ==================================================*/ +@supports -moz-bool-pref("userChrome.urlView.as_commandbar") or -moz-bool-pref("userChrome.urlView.full_width_padding") { + .urlbarView { + --uc-urlView-padding: calc(5px + var(--urlbar-container-padding)); + margin-inline: 0 !important; /* Original: calc(5px + var(--urlbar-container-padding)) */ + } +} +/*= Url View - Looks like Launcher ===========================================*/ +@supports -moz-bool-pref("userChrome.urlView.as_commandbar") { + /* Init & Base Layout */ + .urlbarView { + --urlbarView-favicon-width: 32px; /* Original: 16px */ + --uc-urlView-typeIcon-size: 18px; + --uc-urlView-icon-size-differ: 14px; + --uc-searchBar-icon-size: 20px; + --uc-searchBar-button-size: 32px; + --uc-urlView-row-padding: 8px; + --uc-urlView-row-bottom: 2px; + --uc-urlView-margin: calc(var(--uc-sidebar-activate-width, 18rem) + var(--toolbarbutton-inner-padding)); + position: fixed !important; + left: 50vw; + transform: translateX(-50%); + top: 12vh !important; + width: calc(100vw - (var(--uc-urlView-margin) + var(--toolbarbutton-inner-padding))) !important; + /* paddding as margin */ + /* background */ + background-color: var(--toolbar-field-focus-background-color) !important; + background-clip: border-box; + border: 1px solid var(--arrowpanel-border-color) !important; + border-radius: var(--toolbarbutton-border-radius) !important; + box-shadow: 0 2px 14px rgba(0, 0, 0, 0.13); + } + @supports not -moz-bool-pref("userChrome.urlView.full_width_padding") { + .urlbarView { + padding-inline: var(--uc-urlView-padding) !important; + } + } + .urlbarView-body-inner { + border-top: none !important; + } + /* Big icons */ + :root[uidensity="compact"] .urlbarView { + --urlbarView-favicon-width: 24px; /* Original: 16px */ + --uc-urlView-typeIcon-size: 16px; + --uc-urlView-icon-size-differ: 8px; + --uc-searchBar-icon-size: 18px; + --uc-searchBar-button-size: 30px; + } + :root[uidensity="touch"] .urlbarView { + --uc-urlView-row-padding: 17px; + --uc-urlView-row-bottom: 11px; + } + .urlbarView-row:not([type="tip"], [type="dynamic"]) { + position: relative; + min-height: calc(var(--urlbarView-favicon-width) + var(--uc-urlView-row-padding)) !important; + } + .urlbarView-row:not([type="tip"], [type="dynamic"]) .urlbarView-row-inner { + height: var(--urlbarView-favicon-width) !important; + } + .urlbarView-row:not([type="tip"], [type="dynamic"]) .urlbarView-favicon { + position: absolute; + top: 50%; + transform: translateY(-50%); + } + .urlbarView-row:not([type="tip"], [type="dynamic"]) .urlbarView-title { + padding-inline-start: calc( + var(--urlbarView-item-inline-padding) + var(--identity-box-margin-inline) + var(--urlbarView-favicon-width) + ) !important; + } + .urlbarView-row:not([type="tip"], [type="dynamic"]) .urlbarView-type-icon { + width: var(--uc-urlView-typeIcon-size) !important; + height: var(--uc-urlView-typeIcon-size) !important; + margin-inline-start: calc( + var(--uc-urlView-icon-size-differ) + var(--urlbarView-item-inline-padding) + ) !important; /* Original: 8px */ + bottom: var(--uc-urlView-row-bottom); + } + .urlbarView-row[dynamicType="quickactions"] .urlbarView-favicon-img { + width: var(--urlbarView-favicon-width) !important; /* Original: 16px */ + height: var(--urlbarView-favicon-width) !important; /* Original: 16px */ + } + .urlbarView-row[dynamicType="quickactions"] .urlbarView-label { + font-size: 0.95em !important; /* Original: 11px */ + } + :root[uidensity="touch"] .urlbarView-row { + padding-block: 6px !important; + } + :root[uidensity="touch"] .urlbarView-row-inner { + padding-block: 11px !important; + } + #urlbar .searchbar-engine-one-off-item { + min-width: var(--uc-searchBar-button-size) !important; /* Original: 28px */ + height: var(--uc-searchBar-button-size) !important; + } + #urlbar .searchbar-engine-one-off-item > .button-box > .button-icon { + width: var(--uc-searchBar-icon-size) !important; /* Original: 16px */ + height: var(--uc-searchBar-icon-size) !important; + } +} +/*= Url View - Full Width Pddding ============================================*/ +@supports -moz-bool-pref("userChrome.urlView.full_width_padding") { + .urlbarView { + --uc-urlView-padding-double: calc(var(--uc-urlView-padding) * 2); + --uc-urlView-full-width-padding: var(--uc-urlView-padding-double); + } + @supports not -moz-bool-pref("userChrome.urlView.as_commandbar") { + .urlbarView { + --uc-urlView-full-width-padding: var(--uc-urlView-padding); + width: 100% !important; + } + } + #urlbar[open] > .urlbarView > .urlbarView-body-outer > .urlbarView-body-inner { + border-color: transparent !important; + } + #urlbar[open] > .urlbarView > .urlbarView-body-outer > .urlbarView-body-inner::before { + content: ""; + position: absolute; + border-top: 1px solid var(--autocomplete-popup-separator-color); + transform: translate(-50%, -1px); + left: 50%; + } + #urlbar[open] > .urlbarView > .urlbarView-body-outer > .urlbarView-body-inner::before, + .urlbarView .search-one-offs { + width: calc(100% + 2px - var(--uc-urlView-padding-double)) !important; + } + .urlbarView .search-one-offs { + margin-inline: var(--uc-urlView-full-width-padding) !important; + } + .urlbarView-row-inner { + padding-inline: calc(var(--uc-urlView-full-width-padding) + var(--urlbarView-item-inline-padding)) !important; + } +} +/*= Url View - Always show page actions ======================================*/ +@supports -moz-bool-pref("userChrome.urlbar.always_show_page_actions") { + #urlbar:not([breakout-extend="true"]) #pageActionButton { + display: block !important; + visibility: visible !important; + } +} /*= Url View - Move icon to left =============================================*/ @supports -moz-bool-pref("userChrome.urlView.move_icon_to_left") { .urlbarView-type-icon { min-width: 16px !important; @@ -6521,7 +7839,6 @@ margin-block: 0 !important; margin-inline-start: 0 !important; } - .urlbarView-favicon { margin-inline-start: 20px !important; } @@ -6532,18 +7849,17 @@ display: block !important; } } -/*= Url View - Always show page actions ======================================*/ -@supports -moz-bool-pref("userChrome.urlView.always_show_page_actions") { - #urlbar:not([breakout-extend="true"]) #pageActionButton { - display: block !important; - visibility: visible !important; +/*= Url View - Item Focus Border =============================================*/ +@supports -moz-bool-pref("userChrome.urlView.focus_item_border") { + .urlbarView-row:not([type="tip"], [type="dynamic"])[selected] > .urlbarView-row-inner, + .urlbarView-row-inner[selected] { + box-shadow: 3px 0 var(--toolbar-field-focus-border-color) inset !important; } } /** Panel UI ******************************************************************/ @supports -moz-bool-pref("userChrome.panel.remove_strip") { #appMenu-fxa-separator { - --panel-separator-zap-gradient: none; - /* Original: linear-gradient(90deg, #9059FF 0%, #FF4AA2 52.08%, #FFBD4F 100%) */ + --panel-separator-zap-gradient: none; /* Original: linear-gradient(90deg, #9059FF 0%, #FF4AA2 52.08%, #FFBD4F 100%) */ } } @supports -moz-bool-pref("userChrome.panel.full_width_separator") { @@ -6571,20 +7887,30 @@ } } /** Sidebar UI ****************************************************************/ -@supports -moz-bool-pref("userChrome.sidebar.overlap") or -moz-bool-pref("userChrome.autohide.sidebar") { - #sidebar-box { +@supports -moz-bool-pref("userChrome.sidebar.overlap") or -moz-bool-pref("userChrome.autohide.sidebar") or -moz-bool-pref( + "userChrome.navbar.as_sidebar" + ) { + :root { /* Original min-width: 14em; width: 18em; max-width: 36em; */ --uc-sidebar-width: 40px; - --uc-sidebar-activate-width: 18em; + --uc-sidebar-activate-width: 18rem; --uc-sidebar-activate-width-reverse: calc(-1 * var(--uc-sidebar-activate-width)); --uc-sidebar-fullscreen-width: 4px; + --uc-autohide-sidebar-speed: 750ms; + --uc-autohide-fullscreen-sidebar-speed: 1s; + --uc-autohide-sidebar-delay: 600ms; /* Wait 0.6s before hiding sidebar */ + } + #sidebar-splitter { + display: none !important; + } +} +@supports -moz-bool-pref("userChrome.sidebar.overlap") or -moz-bool-pref("userChrome.autohide.sidebar") { + #sidebar-box { --uc-sidebar-shadow-color: #28282f; - --uc-autohide-sidebar-delay: 600ms; - /* Wait 0.6s before hiding sidebar */ z-index: 1 !important; position: relative !important; box-shadow: 1px 0px 15px -10px var(--uc-sidebar-shadow-color); @@ -6592,39 +7918,39 @@ #sidebar-box[positionend="true"] { box-shadow: -1px 0px 15px -10px var(--uc-sidebar-shadow-color); } - #sidebar { display: block; } - - #sidebar-splitter { - display: none !important; - } } @supports -moz-bool-pref("userChrome.sidebar.overlap") { #sidebar-box[positionend="true"] { direction: rtl; } - - #sidebar-header { + #sidebar-header, + #sidebar { background-color: var(--sidebar-background-color) !important; color: var(--sidebar-text-color) !important; overflow: hidden; } - + #sidebar-header { + font-size: unset !important; + } + #sidebar-header > #sidebar-switcher-target { + font-size: 1.333em; + } @supports not -moz-bool-pref("userChrome.autohide.sidebar") { #sidebar-box, + #sidebar-header, #sidebar { min-width: var(--uc-sidebar-activate-width) !important; max-width: var(--uc-sidebar-activate-width) !important; } - #sidebar-box { margin-inline-start: var(--uc-sidebar-activate-width-reverse) !important; will-change: padding-inline; } #sidebar-box:not([hidden="true"]) { - padding-inline-start: var(--uc-sidebar-activate-width); + padding-inline-start: var(--uc-sidebar-activate-width) !important; } @media (prefers-reduced-motion: no-preference) { #sidebar-box { @@ -6634,23 +7960,565 @@ } } } +/** Combined UI ***************************************************************/ +/*= Combined - At URL bar ====================================================*/ +@supports -moz-bool-pref("userChrome.combined.nav_button") or -moz-bool-pref( + "userChrome.combined.nav_button.home_button" + ) or -moz-bool-pref("userChrome.combined.urlbar.nav_button") or -moz-bool-pref( + "userChrome.combined.urlbar.home_button" + ) or -moz-bool-pref("userChrome.combined.urlbar.reload_button") { + #nav-bar { + --uc-combined-circlebutton-background: hsla(0, 100%, 100%, 0.5); + --uc-combined-circlebutton-hover-background: var(--uc-combined-circlebutton-background); + --uc-combined-circlebutton-active-background: var(--toolbarbutton-active-background); + --uc-combined-circlebutton-border-color: hsla(240, 5%, 5%, 0.3); + --uc-toolbarbutton-boundary: calc(var(--toolbarbutton-outer-padding) + var(--toolbarbutton-inner-padding)); + --uc-toolbarbutton-padding: calc(2 * var(--uc-toolbarbutton-boundary)); + --uc-toolbarbutton-size: calc(12px + var(--uc-toolbarbutton-padding)); + --uc-toolbarbutton-halfsize: calc(6px + var(--uc-toolbarbutton-boundary)); + --uc-urlbar-icon-size: calc(16px + 2 * var(--urlbar-icon-padding)); + } + #nav-bar[brighttext] { + --uc-combined-circlebutton-background: var(--toolbarbutton-hover-background); + --uc-combined-circlebutton-hover-background: var(--toolbarbutton-active-background); + --uc-combined-circlebutton-active-background: color-mix(in srgb, currentColor 20%, transparent); + } + #nav-bar-customization-target > * { + -moz-box-ordinal-group: 1; + } + #nav-bar-customization-target > #urlbar-container { + -moz-box-ordinal-group: 5; + } + #nav-bar-customization-target > #urlbar-container ~ * { + -moz-box-ordinal-group: 7; + } +} +@supports -moz-bool-pref("userChrome.combined.urlbar.nav_button") or -moz-bool-pref("userChrome.combined.urlbar.home_button") { + #nav-bar-customization-target > #urlbar-container { + /* var(--urlbar-margin-inline) */ + margin-inline-start: calc(-1 * var(--uc-urlbar-combined-margin, 0px)) !important; + } + #nav-bar-customization-target > #urlbar-container > #urlbar:not([breakout][breakout-extend]) { + padding-left: var(--uc-urlbar-combined-margin, 0px); + } + @supports -moz-bool-pref("userChrome.combined.urlbar.nav_button") { + #nav-bar-customization-target > #urlbar-container { + --uc-urlbar-combined-margin: var(--uc-toolbarbutton-size); + } + } + @supports not -moz-bool-pref("userChrome.combined.urlbar.nav_button") { + #nav-bar-customization-target > #urlbar-container { + --uc-urlbar-combined-margin: var(--uc-toolbarbutton-halfsize); + } + @supports -moz-bool-pref("userChrome.combined.nav_button") { + @supports -moz-bool-pref("userChrome.combined.nav_button.home_button") { + @supports -moz-bool-pref("userChrome.combined.urlbar.home_button") { + #nav-bar-customization-target > #urlbar-container { + --uc-urlbar-combined-margin: var(--uc-toolbarbutton-size); + } + } + } + } + } + @supports -moz-bool-pref("userChrome.combined.urlbar.nav_button") { + @supports -moz-bool-pref("userChrome.autohide.forward_button") { + #nav-bar-customization-target + > #forward-button[disabled="true"] + ~ #urlbar-container + > #urlbar:not([breakout][breakout-extend]) { + padding-left: calc(var(--uc-urlbar-combined-margin, 0px) - var(--urlbar-icon-padding)); + } + } + @media (prefers-reduced-motion: no-preference) { + #nav-bar-customization-target > #forward-button[disabled="true"] ~ #urlbar-container > #urlbar { + transition-property: margin-left, padding-left; + transition-duration: 0.5s; + transition-timing-function: var(--animation-easing-function); + } + } + } +} +@supports -moz-bool-pref("userChrome.combined.nav_button") or -moz-bool-pref("userChrome.combined.urlbar.nav_button") { + #nav-bar-customization-target > #forward-button { + --uc-forward-button-margin: calc(-1 * var(--uc-toolbarbutton-boundary) + 1px); + z-index: 2; + position: relative; + } + #nav-bar-customization-target > #forward-button > .toolbarbutton-icon { + padding-inline-end: var(--urlbar-icon-padding) !important; /* Original: var(--toolbarbutton-inner-padding) */ + padding-block: var(--urlbar-icon-padding) !important; + height: var(--uc-urlbar-icon-size) !important; + } + @supports -moz-bool-pref("userChrome.combined.urlbar.nav_button") { + #nav-bar-customization-target > #forward-button { + padding-inline-end: 0px !important; /* Original: var(--toolbarbutton-outer-padding) */ + } + } + @supports not -moz-bool-pref("userChrome.combined.urlbar.nav_button") { + @supports not -moz-bool-pref("userChrome.combined.nav_button.none_forward_background") { + @supports -moz-bool-pref("userChrome.combined.urlbar.home_button") { + @supports not -moz-bool-pref("userChrome.combined.nav_button.home_button") { + #nav-bar-customization-target > #forward-button > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-background); + } + #nav-bar-customization-target > #forward-button:not([disabled], [open]):hover > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-hover-background) !important; + box-shadow: 0 1px 6px hsla(0deg, 0%, 0%, 0.1); + border-color: hsla(240deg, 5%, 5%, 0.35); + } + #nav-bar-customization-target > #forward-button[open] > .toolbarbutton-icon, + #nav-bar-customization-target > #forward-button:not([disabled]):hover:active > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-active-background) !important; + border-color: hsla(240deg, 5%, 5%, 0.4); + } + #nav-bar-customization-target > #forward-button[disabled="true"] > .toolbarbutton-icon { + background-color: color-mix( + in srgb, + var(--toolbarbutton-hover-background), + var(--toolbar-field-background-color) 40% + ) !important; + fill: color-mix(in srgb, var(--toolbarbutton-icon-fill), transparent 60%); + } + @supports not -moz-bool-pref("userChrome.autohide.forward_button") { + #nav-bar-customization-target > #forward-button[disabled="true"] { + opacity: 1 !important; /* Original: 0.4 */ + } + } + } + } + @supports not -moz-bool-pref("userChrome.combined.urlbar.home_button") { + #nav-bar-customization-target > #forward-button > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-background); + } + #nav-bar-customization-target > #forward-button:not([disabled], [open]):hover > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-hover-background) !important; + box-shadow: 0 1px 6px hsla(0deg, 0%, 0%, 0.1); + border-color: hsla(240deg, 5%, 5%, 0.35); + } + #nav-bar-customization-target > #forward-button[open] > .toolbarbutton-icon, + #nav-bar-customization-target > #forward-button:not([disabled]):hover:active > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-active-background) !important; + border-color: hsla(240deg, 5%, 5%, 0.4); + } + #nav-bar-customization-target > #forward-button[disabled="true"] > .toolbarbutton-icon { + background-color: color-mix( + in srgb, + var(--toolbarbutton-hover-background), + var(--toolbar-field-background-color) 40% + ) !important; + fill: color-mix(in srgb, var(--toolbarbutton-icon-fill), transparent 60%); + } + @supports not -moz-bool-pref("userChrome.autohide.forward_button") { + #nav-bar-customization-target > #forward-button[disabled="true"] { + opacity: 1 !important; /* Original: 0.4 */ + } + } + } + } + } + @supports not -moz-bool-pref("userChrome.autohide.forward_button") { + #nav-bar-customization-target > #forward-button { + margin-inline-start: var(--uc-forward-button-margin) !important; + } + } + @supports -moz-bool-pref("userChrome.autohide.forward_button") { + #nav-bar-customization-target > #forward-button:not([disabled="true"]) { + margin-inline-start: var(--uc-forward-button-margin) !important; + } + } + #nav-bar-customization-target > #back-button { + position: relative; + } + #nav-bar-customization-target > #back-button > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-background); + } + #nav-bar-customization-target > #back-button:not([disabled], [open]):hover > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-hover-background) !important; + box-shadow: 0 1px 6px hsla(0deg, 0%, 0%, 0.1); + border-color: hsla(240deg, 5%, 5%, 0.35); + } + #nav-bar-customization-target > #back-button[open] > .toolbarbutton-icon, + #nav-bar-customization-target > #back-button:not([disabled]):hover:active > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-active-background) !important; + border-color: hsla(240deg, 5%, 5%, 0.4); + } + #nav-bar-customization-target > #back-button[disabled="true"] > .toolbarbutton-icon { + background-color: color-mix( + in srgb, + var(--toolbarbutton-hover-background), + var(--toolbar-field-background-color) 40% + ) !important; + fill: color-mix(in srgb, var(--toolbarbutton-icon-fill), transparent 60%); + } + @supports not -moz-bool-pref("userChrome.autohide.back_button") { + #nav-bar-customization-target > #back-button[disabled="true"] { + opacity: 1 !important; /* Original: 0.4 */ + } + } + @supports -moz-bool-pref("userChrome.combined.nav_button.home_button") or -moz-bool-pref("userChrome.combined.urlbar.home_button") { + #nav-bar-customization-target > #back-button { + z-index: 2; + margin-inline-end: calc(-1 * var(--uc-toolbarbutton-boundary) - 1px) !important; + padding-inline-start: 0px !important; /* Original: var(--toolbarbutton-outer-padding) */ + } + #nav-bar-customization-target > #back-button > .toolbarbutton-icon { + padding-inline-start: var(--urlbar-icon-padding) !important; /* Original: var(--toolbarbutton-inner-padding) */ + padding-block: var(--urlbar-icon-padding) !important; + height: var(--uc-urlbar-icon-size) !important; + } + } + @supports not -moz-bool-pref("userChrome.combined.nav_button.home_button") { + @supports -moz-bool-pref("userChrome.combined.urlbar.nav_button") { + @supports not -moz-bool-pref("userChrome.combined.urlbar.home_button") { + #nav-bar-customization-target > #back-button { + z-index: 3 !important; + background-color: var(--toolbar-bgcolor) !important; + background-clip: content-box !important; + border-radius: 100%; + padding-block: 0 !important; + } + @supports not -moz-bool-pref("userChrome.autohide.back_button") { + #nav-bar-customization-target > #back-button { + padding-inline-end: 0 !important; + } + } + @supports -moz-bool-pref("userChrome.autohide.back_button") { + #nav-bar-customization-target > #back-button:not([disabled="true"]) { + padding-inline-end: 0 !important; + } + #nav-bar-customization-target > #back-button[disabled="true"] { + padding-inline-end: calc(var(--toolbarbutton-outer-padding) + 1px) !important; + } + } + #nav-bar-customization-target > #back-button > menupopup { + margin-top: -1px !important; + } + #nav-bar-customization-target > #back-button > .toolbarbutton-icon { + background-origin: padding-box; + background-clip: padding-box; + border: 1px solid var(--uc-combined-circlebutton-border-color); + border-radius: 10000px !important; + padding-inline-end: var(--urlbar-icon-padding) !important; + height: auto !important; + } + } + } + @supports not -moz-bool-pref("userChrome.combined.urlbar.nav_button") { + #nav-bar-customization-target > #back-button { + z-index: 3 !important; + background-color: var(--toolbar-bgcolor) !important; + background-clip: content-box !important; + border-radius: 100%; + padding-block: 0 !important; + } + @supports not -moz-bool-pref("userChrome.autohide.back_button") { + #nav-bar-customization-target > #back-button { + padding-inline-end: 0 !important; + } + } + @supports -moz-bool-pref("userChrome.autohide.back_button") { + #nav-bar-customization-target > #back-button:not([disabled="true"]) { + padding-inline-end: 0 !important; + } + #nav-bar-customization-target > #back-button[disabled="true"] { + padding-inline-end: calc(var(--toolbarbutton-outer-padding) + 1px) !important; + } + } + #nav-bar-customization-target > #back-button > menupopup { + margin-top: -1px !important; + } + #nav-bar-customization-target > #back-button > .toolbarbutton-icon { + background-origin: padding-box; + background-clip: padding-box; + border: 1px solid var(--uc-combined-circlebutton-border-color); + border-radius: 10000px !important; + padding-inline-end: var(--urlbar-icon-padding) !important; + height: auto !important; + } + } + } +} +@supports -moz-bool-pref("userChrome.combined.nav_button") { + @supports -moz-bool-pref("userChrome.combined.nav_button.home_button") { + #nav-bar-customization-target > #home-button { + z-index: 3; + position: relative; + background-color: var(--toolbar-bgcolor) !important; + background-clip: content-box !important; + border-radius: 100%; + padding-block: 0 !important; + padding-inline-end: 0 !important; + } + #nav-bar-customization-target > #home-button > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-background); + background-origin: padding-box; + background-clip: padding-box; + border: 1px solid var(--uc-combined-circlebutton-border-color); + border-radius: 10000px !important; + padding-inline-end: var(--urlbar-icon-padding) !important; + height: auto !important; + } + #nav-bar-customization-target > #home-button:hover > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-hover-background) !important; + box-shadow: 0 1px 6px hsla(0deg, 0%, 0%, 0.1); + border-color: hsla(240deg, 5%, 5%, 0.35); + } + #nav-bar-customization-target > #home-button:hover:active > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-active-background) !important; + border-color: hsla(240deg, 5%, 5%, 0.4); + } + } +} +@supports -moz-bool-pref("userChrome.combined.urlbar.nav_button") { + #nav-bar-customization-target > #back-button { + -moz-box-ordinal-group: 2; + } + #nav-bar-customization-target > #forward-button { + -moz-box-ordinal-group: 4; + } +} +@supports -moz-bool-pref("userChrome.combined.urlbar.home_button") { + #nav-bar-customization-target > #home-button { + -moz-box-ordinal-group: 3; + } + #nav-bar-customization-target > #home-button { + z-index: 3; + position: relative; + background-color: var(--toolbar-bgcolor) !important; + background-clip: content-box !important; + border-radius: 100%; + padding-block: 0 !important; + padding-inline-end: 0 !important; + } + #nav-bar-customization-target > #home-button > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-background); + background-origin: padding-box; + background-clip: padding-box; + border: 1px solid var(--uc-combined-circlebutton-border-color); + border-radius: 10000px !important; + padding-inline-end: var(--urlbar-icon-padding) !important; + height: auto !important; + } + #nav-bar-customization-target > #home-button:hover > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-hover-background) !important; + box-shadow: 0 1px 6px hsla(0deg, 0%, 0%, 0.1); + border-color: hsla(240deg, 5%, 5%, 0.35); + } + #nav-bar-customization-target > #home-button:hover:active > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-active-background) !important; + border-color: hsla(240deg, 5%, 5%, 0.4); + } +} +@supports -moz-bool-pref("userChrome.combined.urlbar.reload_button") { + #nav-bar-customization-target > #stop-reload-button { + -moz-box-ordinal-group: 6; + } + #urlbar { + padding-right: calc(var(--uc-toolbarbutton-size) - var(--urlbar-margin-inline) / 2); + } + #nav-bar-customization-target > #stop-reload-button { + z-index: 3; + position: relative; + --toolbarbutton-hover-background: var(--urlbar-box-hover-bgcolor); + color: var(--urlbar-box-hover-text-color) !important; + margin-left: calc(-1 * (var(--uc-toolbarbutton-size) + var(--urlbar-margin-inline))); + } + #nav-bar-customization-target > #stop-reload-button > .toolbarbutton-1 > .toolbarbutton-icon { + width: var(--uc-urlbar-icon-size) !important; + height: var(--uc-urlbar-icon-size) !important; + padding: var(--urlbar-icon-padding) !important; + } +} +/** Others UI *****************************************************************/ +/*= Counter for Tab ==========================================================*/ +@supports -moz-bool-pref("userChrome.counter.tab") { + #tabbrowser-tabs { + counter-reset: tab-counts; + } + .tabbrowser-tab:not([hidden="true"]) { + counter-increment: tab-counts; + } + .tabbrowser-tab:not([hidden="true"])[pinned="true"] .tab-label-container::before { + content: " " counter(tab-counts); + } + .tabbrowser-tab:not([hidden="true"]):not([pinned="true"]) .tab-label-container::before { + content: counter(tab-counts) ": "; + } + .tabbrowser-tab:not([hidden="true"]) .tab-label-container { + display: grid; + align-content: safe center; + align-items: safe center; + } + @supports -moz-bool-pref("userChrome.centered.tab") { + @supports not -moz-bool-pref("userChrome.centered.tab.label") { + .tabbrowser-tab:not([hidden="true"]) .tab-label-container { + justify-content: start; + justify-items: start; + } + } + } + @supports not -moz-bool-pref("userChrome.centered.tab") { + .tabbrowser-tab:not([hidden="true"]) .tab-label-container { + justify-content: start; + justify-items: start; + } + } + .tabbrowser-tab:not([hidden="true"]) .tab-label-container::before { + display: inline-block; + grid-row: 1; + } + .tabbrowser-tab:not([hidden="true"]) .tab-label-container > .tab-text { + grid-row: 1; + } + .tabbrowser-tab:not([hidden="true"]) .tab-label-container[pinned] { + width: unset !important; /* Original: 0 */ + } + .tabbrowser-tab:not([hidden="true"]) .tab-label-container[pinned] > .tab-text, + .tabbrowser-tab:not([hidden="true"]) .tab-label-container[pinned] > .tab-secondary-label { + width: 0; + } + .tab-label, + .tab-secondary-label { + overflow: hidden; + } + @supports -moz-bool-pref("userChrome.tab.sound_with_favicons") { + @supports not -moz-bool-pref("userChrome.hidden.tab_icon") { + .tabbrowser-tab:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])[pinned] + .tab-label-container[labeldirection="ltr"], + .tabbrowser-tab:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])[pinned] + .tab-label-container:not([labeldirection]):-moz-locale-dir(ltr) { + --uc-sound-tab-label-position-x: 2px; + } + .tabbrowser-tab:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])[pinned] + .tab-label-container[labeldirection="rtl"], + .tabbrowser-tab:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])[pinned] + .tab-label-container:not([labeldirection]):-moz-locale-dir(rtl) { + --uc-sound-tab-label-position-x: -2px; + } + .tabbrowser-tab:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) + .tab-label-container::before { + transform: translateX(var(--uc-sound-tab-label-position-x, 0px)); + } + } + @supports -moz-bool-pref("userChrome.hidden.tab_icon") { + @supports not -moz-bool-pref("userChrome.hidden.tab_icon.always") { + .tabbrowser-tab:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])[pinned] + .tab-label-container[labeldirection="ltr"], + .tabbrowser-tab:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])[pinned] + .tab-label-container:not([labeldirection]):-moz-locale-dir(ltr) { + --uc-sound-tab-label-position-x: 2px; + } + .tabbrowser-tab:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])[pinned] + .tab-label-container[labeldirection="rtl"], + .tabbrowser-tab:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked])[pinned] + .tab-label-container:not([labeldirection]):-moz-locale-dir(rtl) { + --uc-sound-tab-label-position-x: -2px; + } + .tabbrowser-tab:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) + .tab-label-container::before { + transform: translateX(var(--uc-sound-tab-label-position-x, 0px)); + } + } + } + .tab-label-container::beforee { + transition: transform 0.25s var(--animation-easing-function); + } + } +} +/*= Counter for Bookmark menu ================================================*/ +@supports -moz-bool-pref("userChrome.counter.bookmark_menu") { + menupopup[placespopup="true"] > menu.bookmark-item > .menu-right { + counter-reset: bookmark-counts 0; + } + menupopup[placespopup="true"] > menu.bookmark-item::after { + display: -moz-inline-box; + content: "(" counter(bookmark-counts) ")"; + } + menupopup[placespopup="true"] > menu.bookmark-item > .menu-iconic-highlightable-text, + menupopup[placespopup="true"] > menu.bookmark-item > .menu-accel-container, + menupopup[placespopup="true"] > menu.bookmark-item > .menu-right { + -moz-box-ordinal-group: 2; + } + menu.bookmark-item > menupopup[placespopup="true"] > .bookmark-item { + counter-increment: bookmark-counts; + } +} +@supports -moz-bool-pref("userChrome.findbar.floating_on_top") { + /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/floating_findbar_on_top.css made available under Mozilla Public License v. 2.0 + See the above repository for updates as well as full license text. */ + /* Note that privacy.resistFingerprinting.letterboxing prevents this from working properly */ + findbar { + -moz-box-ordinal-group: 0; + position: relative; + height: 0 !important; + overflow: visible; + border-top: none !important; + padding: 0 !important; + background: none !important; + pointer-events: none; + z-index: 1; + margin-right: 16px; + border-right: 1px solid var(--chrome-content-separator-color); + } + findbar::before { + content: ""; + display: -moz-box; + -moz-box-flex: 200; + } + .findbar-container, + .findbar-closebutton { + border: 1px solid var(--chrome-content-separator-color); + border-width: 0 0 1px 0px; + background: var(--uc-light-bkgnd-color, var(--toolbar-bgcolor)) !important; + pointer-events: auto; + height: 33px !important; + } + .findbar-container { + -moz-box-direction: reverse; + border-left-width: 1px; + border-bottom-left-radius: 4px; + } + .findbar-container > .findbar-find-fast { + padding: var(--toolbarbutton-inner-padding) 1px; + margin: 0 !important; + } + .findbar-container > .findbar-find-status { + display: -moz-box; + overflow: hidden; + text-overflow: ellipsis; + -moz-box-flex: 1; + } + .findbar-container > hbox { + margin-inline: 5px; + } + .findbar-closebutton { + box-sizing: padding-box; + width: 30px !important; /* Original: 24px */ + margin: 0 !important; + border-radius: 0 4px 4px 0 !important; + padding: 2px 5px 2px 3px !important; + overflow: clip; + } + .findbar-closebutton image { + padding: 4px; + border-radius: var(--toolbarbutton-border-radius); + } + .findbar-closebutton:hover > image { + background: var(--toolbarbutton-hover-background) !important; + } +} /** Fullscreen - Overlap toolbar **********************************************/ @supports -moz-bool-pref("userChrome.fullscreen.overlap") { @supports -moz-bool-pref("browser.fullscreen.autohide") { :root[sizemode="fullscreen"] #navigator-toolbox { - position: fixed !important; - /* Needed for content to take up entire height */ - z-index: 1000 !important; - /* Puts the UI above the content */ + position: fixed !important; /* Needed for content to take up entire height */ + z-index: 1000 !important; /* Puts the UI above the content */ } - :root[sizemode="fullscreen"] :-moz-any(#navigator-toolbox, #titlebar, #nav-bar, #PersonalToolbar) { - width: 100%; - /* Makes the UI take up the entire width */ + width: 100%; /* Makes the UI take up the entire width */ } - @media (-moz-gtk-csd-available) { - /* Fix transparent backgorund */ + /* Fix transparent background */ :root[tabsintitlebar][sizemode="fullscreen"] #TabsToolbar:not(:-moz-lwtheme) { appearance: auto !important; } @@ -6660,8 +8528,7 @@ @supports -moz-bool-pref("userChrome.fullscreen.show_bookmarkbar") { :root:not([sizemode="fullscreen"]) #PersonalToolbar[initialized="true"]:not([collapsed="true"]), :root[sizemode="fullscreen"] #PersonalToolbar[initialized="true"] { - visibility: unset !important; - /* Makes the bookmarks toolbar visible if enabled */ + visibility: unset !important; /* Makes the bookmarks toolbar visible if enabled */ } } /** Centered ******************************************************************/ @@ -6671,14 +8538,12 @@ .tabbrowser-tab:not(:hover, [pinned]) .tab-label-container:not([textoverflow]) { margin-inline-end: 5px; } - @supports -moz-bool-pref("userChrome.tab.close_button_at_hover") { #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not(:hover, [pinned]) .tab-label-container:not([textoverflow]) { margin-inline-end: 1px; } - #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected]):not(:hover, [pinned]) .tab-label-container @@ -6699,12 +8564,10 @@ justify-content: safe center; align-items: safe center; } - .tab-label, .tab-secondary-label { overflow: hidden; } - .tabbrowser-tab[selected]:not(:hover) .tab-label-container:not([textoverflow]), .tabbrowser-tab:not(:hover, [pinned]) .tab-label-container:not([textoverflow]) { margin-inline-end: 5px; @@ -6726,18 +8589,23 @@ } } /** Auto Hide *****************************************************************/ +@supports -moz-bool-pref("userChrome.autohide.back_button") or -moz-bool-pref("userChrome.autohide.forward_button") { + :root { + --uc-toolbarbutton-hide-size: calc( + -1 * (16px + (2 * var(--toolbarbutton-outer-padding) + var(--toolbarbutton-inner-padding))) + ); + } +} @supports -moz-bool-pref("userChrome.autohide.back_button") { #back-button[disabled="true"] { - margin-left: -36px !important; + margin-left: var(--uc-toolbarbutton-hide-size) !important; opacity: 0 !important; pointer-events: none; } - @media (prefers-reduced-motion: no-preference) { #back-button { transition-property: background-color, opacity, margin-left !important; } - #back-button[disabled="true"] { transition: background-color 1s var(--animation-easing-function), opacity 1s var(--animation-easing-function), margin-left 0.5s ease !important; @@ -6746,16 +8614,14 @@ } @supports -moz-bool-pref("userChrome.autohide.forward_button") { #forward-button[disabled="true"] { - margin-left: -36px !important; + margin-left: var(--uc-toolbarbutton-hide-size) !important; opacity: 0 !important; pointer-events: none; } - @media (prefers-reduced-motion: no-preference) { #forward-button { transition-property: background-color, opacity, margin-left !important; } - #forward-button[disabled="true"] { transition: background-color 1s var(--animation-easing-function), opacity 1s var(--animation-easing-function), margin-left 0.5s ease !important; @@ -6767,14 +8633,12 @@ margin-inline-end: calc(-16px - 2 * var(--urlbar-icon-padding)); opacity: 0; } - #urlbar-container:is(:hover, :focus-within) #page-action-buttons > .urlbar-page-action, .urlbar-page-action[open], .urlbar-page-action[open] ~ .urlbar-page-action { margin-inline-end: 0px !important; opacity: 1; } - @media (prefers-reduced-motion: no-preference) { #page-action-buttons > .urlbar-page-action { transition: margin-inline-end 50ms var(--animation-easing-function) 900ms, @@ -6786,7 +8650,6 @@ opacity 1.5s var(--animation-easing-function) 600ms, background-color 2.5s var(--animation-easing-function) !important; } } - #urlbar-container:is(:hover, :focus-within) #page-action-buttons > .urlbar-page-action, .urlbar-page-action[open], .urlbar-page-action[open] ~ .urlbar-page-action { @@ -6840,18 +8703,35 @@ } } } +:root { + --uc-autohide-toolbar-speed: 0.25s; + --uc-autohide-toolbar-delay: 600ms; +} + @supports -moz-bool-pref("userChrome.autohide.tabbar") or -moz-bool-pref("userChrome.autohide.navbar") or -moz-bool-pref( "userChrome.autohide.bookmarkbar" ) - or -moz-bool-pref("userChrome.tabbar.one_liner") { + or -moz-bool-pref("userChrome.tabbar.one_liner") or -moz-bool-pref("userChrome.tabbar.on_bottom.menubar_on_top") or -moz-bool-pref( + "userChrome.hidden.tabbar" + ) or -moz-bool-pref("userChrome.navbar.as_sidebar") { :root { - --uc-tabbar-height: var(--tab-min-height); + --uc-tabbar-height: var(--uc-tabbar-height-default); + --uc-tabbar-height-default: var(--tab-min-height); --uc-tabbar-hide-height: calc(-1 * var(--uc-tabbar-height)); - --uc-navbar-height: calc(16px + 2 * (var(--toolbarbutton-inner-padding) + var(--toolbarbutton-outer-padding))); + --uc-navbar-height: var(--uc-navbar-height-default); + --uc-navbar-height-default: calc( + 16px + 2 * (var(--toolbarbutton-inner-padding) + var(--toolbarbutton-outer-padding)) + ); --uc-navbar-hide-height: calc(-1 * var(--uc-navbar-height)); - --uc-bm-height: calc(20px + (2 * var(--bookmark-block-padding, 4px))); - /* 20px = 16px + (2px * 2) [margin block] */ + --uc-bm-height: var(--uc-bm-height-default); + --uc-bm-height-default: calc( + 20px + (2 * var(--bookmark-block-padding, 4px)) + ); /* 20px = 16px + (2px * 2) [margin block] */ --uc-bm-hide-height: calc(-1 * var(--uc-bm-height)); + --uc-titlebar-buttonbox-height: 34px; + --uc-menubar-height: 0px; + --uc-menubar-height-default: calc(1.6rem + 2px); + --uc-menubar-inner-height: calc(1.6rem - 2px); } @supports -moz-bool-pref("userChrome.hidden.tabbar") { @supports not -moz-bool-pref("userChrome.tabbar.one_liner") { @@ -6874,24 +8754,66 @@ --uc-navbar-height: 0px; } } + @supports selector(:has(a)) { + :root:not([tabsintitlebar]):has(#toolbar-menubar) { + --uc-menubar-height: var(--uc-menubar-height-default); + } + @media (-moz-gtk-csd-available) { + :root[tabsintitlebar]:has(#toolbar-menubar[autohide="true"]) { + --uc-menubar-height: calc(var(--tab-min-height) + 2 * var(--tab-block-margin)); + } + } + @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { + :root[tabsintitlebar]:has(#toolbar-menubar[autohide="true"]) { + --uc-menubar-height: calc(var(--tab-min-height) - var(--tabs-navbar-shadow-size)); + } + } + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8) { + :root[tabsintitlebar]:has(#toolbar-menubar[autohide="true"]) { + --uc-menubar-height: calc(var(--tab-min-height) + var(--tab-block-margin)); + } + } + :root[tabsintitlebar]:has(#toolbar-menubar[autohide="false"]) { + --uc-menubar-height: var(--uc-titlebar-buttonbox-height); + } + :root:not([tabsintitlebar]):has(#toolbar-menubar[autohide="true"][inactive="true"]), + :root[tabsintitlebar]:has(#toolbar-menubar[autohide="true"][inactive="true"]) { + --uc-menubar-height: 0px; + } + #navigator-toolbox:has(#PersonalToolbar[collapsed="true"]) { + --uc-bm-height: 0px; + } + @supports -moz-bool-pref("userChrome.navbar.as_sidebar") { + #navigator-toolbox:has(#PersonalToolbar[collapsed="false"]) #nav-bar { + --uc-bm-height: var(--uc-bm-height-default); + } + @supports -moz-bool-pref("userChrome.autohide.bookmarkbar") { + #navigator-toolbox:has(#PersonalToolbar[collapsed="false"]):not(:hover) #nav-bar { + --uc-bm-height: 0px; + } + } + } + } } @supports -moz-bool-pref("userChrome.autohide.tabbar") or -moz-bool-pref("userChrome.autohide.navbar") or -moz-bool-pref( "userChrome.autohide.bookmarkbar" ) or -moz-bool-pref("userChrome.autohide.infobar") { - :root { - --uc-autohide-toolbar-delay: 600ms; - } - #navigator-toolbox { position: relative; + } + #navigator-toolbox:is(:hover, :focus-within) { z-index: 2; } - - #navigator-toolbox:not(:hover) { + #navigator-toolbox:is(:hover, :focus-within) #PersonalToolbar { + z-index: -1; + } + #navigator-toolbox:not(:hover):not(:focus-within) { animation: 1s keepfront; } - @keyframes keepfront { from { z-index: 3; @@ -6904,7 +8826,6 @@ position: relative; z-index: 2 !important; } - @supports -moz-bool-pref("userChrome.autohide.toolbar_overlap") { #navigator-toolbox { --uc-toolbar-hide-height: calc(-1 * var(--uc-toolbar-height, 0)); @@ -6914,19 +8835,22 @@ @supports -moz-bool-pref("userChrome.decoration.animate") { #navigator-toolbox { transition: margin-top 1s ease, - margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay); + margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay); } #navigator-toolbox:is(:hover, :focus-within) { transition-delay: 0s !important; } #navigator-toolbox[inFullscreen="true"] { transition: margin-top 1.3s var(--animation-easing-function) 50ms, - margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay); + margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay); } } @supports not -moz-bool-pref("userChrome.decoration.animate") { #navigator-toolbox { - transition: margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay); + transition: margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay); } #navigator-toolbox:is(:hover, :focus-within) { transition-delay: 0s !important; @@ -7027,25 +8951,26 @@ margin-bottom: var(--uc-tabbar-hide-height); will-change: margin-bottom; } - + #TabsToolbar:not([customizing]) { + will-change: opacity; + } @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { - #TabsToolbar:not([customizing]) { + #TabsToolbar:not([customizing]), + #TabsToolbar:not([customizing]) .titlebar-buttonbox-container { opacity: 0; - will-change: opacity; } } @supports -moz-bool-pref("userChrome.tabbar.on_bottom") { #TabsToolbar:not([customizing]) > *:not(.titlebar-buttonbox-container) { opacity: 0; - will-change: opacity; } } - #navigator-toolbox:is(:hover, :focus-within) > #titlebar { margin-bottom: 0px; } @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { - #navigator-toolbox:is(:hover, :focus-within) #TabsToolbar { + #navigator-toolbox:is(:hover, :focus-within) #TabsToolbar, + #navigator-toolbox:is(:hover, :focus-within) #TabsToolbar .titlebar-buttonbox-container { opacity: 1; } } @@ -7061,25 +8986,26 @@ margin-bottom: var(--uc-tabbar-hide-height); will-change: margin-bottom; } - + #TabsToolbar:not([customizing]) { + will-change: opacity; + } @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { - #TabsToolbar:not([customizing]) { + #TabsToolbar:not([customizing]), + #TabsToolbar:not([customizing]) .titlebar-buttonbox-container { opacity: 0; - will-change: opacity; } } @supports -moz-bool-pref("userChrome.tabbar.on_bottom") { #TabsToolbar:not([customizing]) > *:not(.titlebar-buttonbox-container) { opacity: 0; - will-change: opacity; } } - #navigator-toolbox:is(:hover, :focus-within) > #titlebar { margin-bottom: 0px; } @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { - #navigator-toolbox:is(:hover, :focus-within) #TabsToolbar { + #navigator-toolbox:is(:hover, :focus-within) #TabsToolbar, + #navigator-toolbox:is(:hover, :focus-within) #TabsToolbar .titlebar-buttonbox-container { opacity: 1; } } @@ -7094,25 +9020,26 @@ margin-bottom: var(--uc-tabbar-hide-height); will-change: margin-bottom; } - + #TabsToolbar:not([customizing]) { + will-change: opacity; + } @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { - #TabsToolbar:not([customizing]) { + #TabsToolbar:not([customizing]), + #TabsToolbar:not([customizing]) .titlebar-buttonbox-container { opacity: 0; - will-change: opacity; } } @supports -moz-bool-pref("userChrome.tabbar.on_bottom") { #TabsToolbar:not([customizing]) > *:not(.titlebar-buttonbox-container) { opacity: 0; - will-change: opacity; } } - #navigator-toolbox:is(:hover, :focus-within) > #titlebar { margin-bottom: 0px; } @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { - #navigator-toolbox:is(:hover, :focus-within) #TabsToolbar { + #navigator-toolbox:is(:hover, :focus-within) #TabsToolbar, + #navigator-toolbox:is(:hover, :focus-within) #TabsToolbar .titlebar-buttonbox-container { opacity: 1; } } @@ -7125,21 +9052,23 @@ } @media (prefers-reduced-motion: no-preference) { #titlebar:not([customizing]) { - transition: margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + transition: margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay), background-color 1s var(--animation-easing-function) !important; } - @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { - #TabsToolbar:not([customizing]) { - transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay) !important; + #TabsToolbar:not([customizing]), + #TabsToolbar:not([customizing]) .titlebar-buttonbox-container { + transition: opacity var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay) !important; } } @supports -moz-bool-pref("userChrome.tabbar.on_bottom") { #TabsToolbar:not([customizing]) > *:not(.titlebar-buttonbox-container) { - transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay) !important; + transition: opacity var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay) !important; } } - #navigator-toolbox:is(:hover, :focus-within) { transition-delay: 0s !important; } @@ -7147,7 +9076,8 @@ transition-delay: 0s !important; } @supports not -moz-bool-pref("userChrome.tabbar.on_bottom") { - #navigator-toolbox:is(:hover, :focus-within) #TabsToolbar:not([customizing]) { + #navigator-toolbox:is(:hover, :focus-within) #TabsToolbar:not([customizing]), + #navigator-toolbox:is(:hover, :focus-within) #TabsToolbar:not([customizing]) .titlebar-buttonbox-container { transition-delay: 0s !important; } } @@ -7168,7 +9098,6 @@ opacity: 0; will-change: margin-bottom, opacity; } - #navigator-toolbox:is(:hover, :focus-within) #nav-bar:not([customizing]) { margin-bottom: 0; opacity: 1; @@ -7182,7 +9111,6 @@ opacity: 0; will-change: margin-bottom, opacity; } - #navigator-toolbox:is(:hover, :focus-within) #nav-bar:not([customizing]) { margin-bottom: 0; opacity: 1; @@ -7193,19 +9121,21 @@ } @media (prefers-reduced-motion: no-preference) { #nav-bar:not([customizing]) { - transition: margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), - opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + transition: margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay), + opacity var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), var(--ext-theme-background-transition) !important; } @supports -moz-bool-pref("userChrome.autohide.fill_urlbar") { #nav-bar:not([customizing]) { - transition: margin-inline 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), - margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), - opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + transition: margin-inline var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay), + margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay), + opacity var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), var(--ext-theme-background-transition) !important; } } - #navigator-toolbox:is(:hover, :focus-within) #nav-bar:not([customizing]) { transition-delay: 0s !important; } @@ -7219,24 +9149,26 @@ will-change: margin-bottom, opacity; } @supports -moz-bool-pref("userChrome.autohide.toolbar_overlap") { - #PersonalToolbar:not([customizing])[collapsed="true"] { - visibility: visible !important; - max-height: unset !important; + @supports not -moz-bool-pref("userChrome.autohide.toolbar_overlap.allow_layout_shift") { + @supports not selector(:has(a)) { + #PersonalToolbar:not([customizing])[collapsed="true"] { + visibility: visible !important; + max-height: unset !important; + } + } } } - #navigator-toolbox:is(:hover, :focus-within) #PersonalToolbar:not([customizing]) { margin-bottom: 0; opacity: 1; } - @media (prefers-reduced-motion: no-preference) { #PersonalToolbar:not([customizing]) { - transition: margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), - opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), min-height 170ms ease-out, - max-height 170ms ease-out, var(--ext-theme-background-transition) !important; + transition: margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay), + opacity var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + min-height 170ms ease-out, max-height 170ms ease-out, var(--ext-theme-background-transition) !important; } - #navigator-toolbox:is(:hover, :focus-within) #PersonalToolbar:not([customizing]) { transition-delay: 0s !important; } @@ -7248,13 +9180,11 @@ 25px + (var(--infobar-button-vertical-margin, 4px) * 2) + var(--infobar-message-vertical-margin, 8px) ); } - #tab-notification-deck:not([customizing]) > .notificationbox-stack[slot="selected"] > notification-message { --infobar-message-margin: 0 4px calc(-1 * var(--infobar-height)); opacity: 0; will-change: margin-bottom, opacity; } - #navigator-toolbox:is(:hover, :focus-within) #tab-notification-deck:not([customizing]) > .notificationbox-stack[slot="selected"] @@ -7262,7 +9192,6 @@ --infobar-message-margin: 0 4px var(--infobar-message-vertical-margin, 8px); opacity: 1; } - @supports -moz-bool-pref("userChrome.autohide.toolbar_overlap") { #tab-notification-deck:not([customizing]) { height: 0; @@ -7270,11 +9199,11 @@ } @media (prefers-reduced-motion: no-preference) { #tab-notification-deck:not([customizing]) > .notificationbox-stack[slot="selected"] > notification-message { - transition: margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), - opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + transition: margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay), + opacity var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), var(--ext-theme-background-transition) !important; } - #navigator-toolbox:is(:hover, :focus-within) #tab-notification-deck:not([customizing]) > .notificationbox-stack[slot="selected"] @@ -7288,24 +9217,22 @@ min-width: var(--uc-sidebar-width) !important; max-width: var(--uc-sidebar-width) !important; } - :root[inFullscreen="true"] #sidebar-box { min-width: var(--uc-sidebar-activate-width) !important; max-width: var(--uc-sidebar-activate-width) !important; } - @supports -moz-bool-pref("userChrome.sidebar.overlap") { + #sidebar-header, #sidebar { min-width: var(--uc-sidebar-width) !important; max-width: var(--uc-sidebar-width) !important; will-change: min-width, max-width; } - + #sidebar-box:is(:hover, :focus-within) > #sidebar-header, #sidebar-box:is(:hover, :focus-within) > #sidebar { min-width: var(--uc-sidebar-activate-width) !important; max-width: var(--uc-sidebar-activate-width) !important; } - :root[inFullscreen="true"] #sidebar-box { margin-inline-start: var(--uc-sidebar-activate-width-reverse) !important; padding-inline-start: var(--uc-sidebar-fullscreen-width); @@ -7320,18 +9247,19 @@ max-width: calc(var(--uc-sidebar-activate-width)) !important; will-change: unset; } - @media (prefers-reduced-motion: no-preference) { + #sidebar-header, #sidebar { - transition: min-width 750ms var(--animation-easing-function) var(--uc-autohide-sidebar-delay) !important; + transition: min-width var(--uc-autohide-sidebar-speed) var(--animation-easing-function) + var(--uc-autohide-sidebar-delay) !important; } - + #sidebar-box:is(:hover, :focus-within) > #sidebar-header, #sidebar-box:is(:hover, :focus-within) > #sidebar { transition-delay: 0ms !important; } - :root[inFullscreen="true"] #sidebar-box { - transition: padding-inline-start 1s var(--animation-easing-function) var(--uc-autohide-sidebar-delay) !important; + transition: padding-inline-start var(--uc-autohide-fullscreen-sidebar-speed) var(--animation-easing-function) + var(--uc-autohide-sidebar-delay) !important; } :root[inFullscreen="true"] #sidebar-box:is(:hover, :focus-within) { transition-delay: 0ms !important; @@ -7350,7 +9278,6 @@ min-width: var(--uc-sidebar-activate-width) !important; max-width: var(--uc-sidebar-activate-width) !important; } - :root[inFullscreen="true"] #sidebar-box:not([positionend="true"]) { margin-inline-start: var(--uc-sidebar-fullscreen-margin) !important; will-change: margin-inline-start; @@ -7365,17 +9292,17 @@ :root[inFullscreen="true"] #sidebar-box[positionend="true"]:is(:hover, :focus-within) { margin-inline-end: 0 !important; } - @media (prefers-reduced-motion: no-preference) { #sidebar-box { - transition: min-width 750ms var(--animation-easing-function) var(--uc-autohide-sidebar-delay) !important; + transition: min-width var(--uc-autohide-sidebar-speed) var(--animation-easing-function) + var(--uc-autohide-sidebar-delay) !important; } #sidebar-box:is(:hover, :focus-within) { transition-delay: 0ms !important; } - :root[inFullscreen="true"] #sidebar-box { - transition: margin-inline-start 1s var(--animation-easing-function) var(--uc-autohide-sidebar-delay) !important; + transition: margin-inline-start var(--uc-autohide-fullscreen-sidebar-speed) var(--animation-easing-function) + var(--uc-autohide-sidebar-delay) !important; } :root[inFullscreen="true"] #sidebar-box[positionend="true"] { transition-property: margin-inline-end !important; @@ -7394,7 +9321,6 @@ (2 * var(--urlbar-margin-inline) + var(--uc-window-drag-space-pre, 0px) + var(--uc-navbar-gap, 0px)) ) !important; } - @supports -moz-bool-pref("userChrome.tabbar.one_liner") { #nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) { --uc-tabbar-width: calc(100vw - var(--uc-navbar-width-origin)); @@ -7404,10 +9330,10 @@ @supports -moz-bool-pref("userChrome.tabbar.one_liner") { @supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { #nav-bar { - transition: margin-inline 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + transition: margin-inline var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay), var(--ext-theme-background-transition) !important; } - #nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) { transition-delay: 0s !important; } @@ -7415,10 +9341,10 @@ @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { @media screen and (prefers-reduced-motion: no-preference) and (min-width: 1100px) { #nav-bar { - transition: margin-inline 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + transition: margin-inline var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay), var(--ext-theme-background-transition) !important; } - #nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) { transition-delay: 0s !important; } @@ -7427,9 +9353,9 @@ } @supports not -moz-bool-pref("userChrome.tabbar.one_liner") { #urlbar-container { - transition: min-width 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay); + transition: min-width var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay); } - #nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) #urlbar-container { transition-delay: 0s !important; } @@ -7438,9 +9364,9 @@ @supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") { @media screen and (prefers-reduced-motion: no-preference) and (max-width: 1100px) { #urlbar-container { - transition: min-width 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay); + transition: min-width var(--uc-autohide-toolbar-speed) var(--animation-easing-function) + var(--uc-autohide-toolbar-delay); } - #nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) #urlbar-container { transition-delay: 0s !important; } @@ -7458,8 +9384,7 @@ } @supports -moz-bool-pref("userChrome.hidden.navbar") { #nav-bar { - visibility: collapse; - /* display: none is not work */ + visibility: collapse; /* display: none is not work */ } } } @@ -7473,8 +9398,7 @@ } @supports -moz-bool-pref("userChrome.hidden.navbar") { #nav-bar { - visibility: collapse; - /* display: none is not work */ + visibility: collapse; /* display: none is not work */ } } } @@ -7506,14 +9430,30 @@ } } @supports -moz-bool-pref("userChrome.hidden.urlbar_iconbox") { - #identity-box[pageproxystate="valid"].notSecureText #identity-icon-label, - #identity-box[pageproxystate="valid"].chromeUI #identity-icon-box, - #identity-box[pageproxystate="valid"].extensionPage #identity-icon-box { - display: none; + @supports not -moz-bool-pref("userChrome.hidden.urlbar_iconbox.label_only") { + #identity-box[pageproxystate="valid"].notSecureText #identity-icon-label, + #identity-box[pageproxystate="valid"].chromeUI #identity-icon-box, + #identity-box[pageproxystate="valid"].extensionPage #identity-icon-box { + display: none; + } + #identity-box[pageproxystate="valid"].notSecureText #identity-icon-box { + padding-inline-end: 5px; /* Original: 8px */ + } } - #identity-box[pageproxystate="valid"].notSecureText #identity-icon-box { - padding-inline-end: 5px; - /* Original: 8px */ + @supports -moz-bool-pref("userChrome.hidden.urlbar_iconbox.label_only") { + #identity-box[pageproxystate="valid"].chromeUI #identity-icon-box:not(:hover), + #identity-box[pageproxystate="valid"].extensionPage #identity-icon-box:not(:hover) { + background-color: transparent !important; + } + @supports not -moz-bool-pref("userChrome.urlbar.iconbox_with_separator") { + #identity-box[pageproxystate="valid"].chromeUI #identity-icon-box, + #identity-box[pageproxystate="valid"].extensionPage #identity-icon-box { + padding-inline: var(--urlbar-icon-padding) !important; + } + } + #identity-box[pageproxystate="valid"] #identity-icon-label { + display: none !important; + } } } @supports -moz-bool-pref("userChrome.hidden.bookmarkbar_icon") { @@ -7523,970 +9463,733 @@ } @supports -moz-bool-pref("userChrome.hidden.bookmarkbar_label") { #PlacesToolbarItems .bookmark-item > .toolbarbutton-text { - visibility: collapse; - /* display: none is not work */ + visibility: collapse; /* display: none is not work */ } } @supports -moz-bool-pref("userChrome.hidden.disabled_menu") { menu[disabled="true"], menuitem:not(#context-back, #context-forward)[disabled="true"] { - display: none !important; + visibility: collapse !important; } - @supports -moz-bool-pref("widget.macos.native-context-menus") or -moz-bool-pref("widget.gtk.native-context-menus") { #context-back[disabled="true"], #context-forward[disabled="true"] { - display: none !important; + visibility: collapse !important; } } } /** Icons *********************************************************************/ -/** Library - Icons Replace ***************************************************/ -@supports -moz-bool-pref("userChrome.icon.library") { - /*= Standard Folder - More Visible ===========================================*/ - /* on Toolbar and Menus */ - :-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) - .bookmark-item[container="true"]:not([query="true"], [tagContainer], [dayContainer]), - :-moz-any(#bookmarks-view, #historyTree, #editBMPanel_folderTree, #placesList, #placeContent) - treechildren::-moz-tree-image(title, container), - #editBMPanel_folderMenuList:not([selectedGuid="toolbar_____"], [selectedGuid="menu________"]), - #editBMPanel_folderMenuList .folder-icon:not([id]), - .downloadIconShow > .button-box > .button-icon { - list-style-image: url("../icons/folder.svg") !important; - } - - /* Standard Folder - Open */ - :-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) - .bookmark-item[container="true"]:not([query="true"], [tagContainer], [dayContainer])[open="true"], - :-moz-any(#bookmarks-view, #historyTree, #editBMPanel_folderTree, #placesList, #placeContent) - treechildren::-moz-tree-image(title, container, open) { - list-style-image: url("../icons/folder-open.svg") !important; - } - - /*= Other Folder - Inbox Icon ================================================*/ - /* on Menus */ - #PlacesToolbar #OtherBookmarks, - #BMB_bookmarksPopup #BMB_unsortedBookmarks, - #bookmarksMenuPopup #menu_unsortedBookmarks, - :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) - treechildren::-moz-tree-image(container, OrganizerQuery_UnfiledBookmarks), - :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) - treechildren::-moz-tree-image(container, queryFolder_unfiled_____), - #editBMPanel_unfiledRootItem, - #editBMPanel_folderMenuList[selectedGuid="unfiled_____"] { - list-style-image: url("../icons/mail-inbox-all.svg") !important; - } - - /* Other Folder - Open */ - #PlacesToolbar #OtherBookmarks[open="true"], - #BMB_bookmarksPopup #BMB_unsortedBookmarks[open="true"], - #bookmarksMenuPopup #menu_unsortedBookmarks[open="true"], - :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) - treechildren::-moz-tree-image(container, open, OrganizerQuery_UnfiledBookmarks), - :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) - treechildren::-moz-tree-image(container, open, queryFolder_unfiled_____) { - list-style-image: url("../icons/mail-inbox.svg") !important; - } - - /*= Default Icon - Override ===================================================*/ - /* https://github.com/mozilla/gecko-dev/blob/master/browser/themes/shared/places/tree-icons.css */ - /* Query */ - :-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, query) { - list-style-image: url("chrome://browser/skin/places/folder-smart.svg") !important; - } - - /* History */ - :-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, query, dayContainer), - :-moz-any(#historyTree, #placesList, #placeContent) - treechildren::-moz-tree-image(query, OrganizerQuery_history____v) { - list-style-image: url("chrome://browser/skin/history.svg") !important; - } - - /* Downloads */ - :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_downloads__v) { - list-style-image: url("chrome://browser/skin/downloads/downloads.svg") !important; - } - - /* Tag */ - :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(title, query, tagContainer), - :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_tags_______v) { - list-style-image: url("chrome://browser/skin/places/tag.svg") !important; - } - - /* Boomark */ - :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_allbms_____v) { - list-style-image: url("chrome://browser/skin/bookmark.svg") !important; - } - - /* Bookmark Toolbar */ - #BMB_bookmarksPopup #BMB_bookmarksToolbar, - #bookmarksMenuPopup #bookmarksToolbarFolderMenu, - :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) - treechildren::-moz-tree-image(container, queryFolder_toolbar_____) { - list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.svg") !important; - } - - /* Bookmark Menu */ - :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) - treechildren::-moz-tree-image(container, queryFolder_menu________) { - list-style-image: url("chrome://browser/skin/places/bookmarksMenu.svg") !important; - } - - /*= Default Icon - Open ======================================================*/ - /* Query */ - :-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) - .bookmark-item[container="true"][query="true"]:not([tagContainer])[open="true"] - > .menu-iconic-left - > .menu-iconic-icon { - transform: rotate(15deg) !important; - } - - /* History */ - :-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, query, open, dayContainer), - :-moz-any(#historyTree, #placesList, #placeContent) - treechildren::-moz-tree-image(query, open, OrganizerQuery_history____v) { - list-style-image: url("../icons/history-reverse.svg") !important; - } - - /* Tag */ - :-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) - .bookmark-item[container="true"][tagContainer="true"][open="true"], - :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(title, query, open, tagContainer), - :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, open, OrganizerQuery_tags_______v) { - list-style-image: url("../icons/tag-open.svg") !important; - } - - /* Boomark */ - :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, open, OrganizerQuery_allbms_____v) { - list-style-image: url("chrome://browser/skin/bookmark-hollow.svg") !important; - } - - /* Bookmark Toolbar */ - #BMB_bookmarksPopup #BMB_bookmarksToolbar[open="true"], - #bookmarksMenuPopup #bookmarksToolbarFolderMenu[open="true"], - :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) - treechildren::-moz-tree-image(container, open, queryFolder_toolbar_____) { - list-style-image: url("../icons/bookmarksToolbar-open.svg") !important; - } - - /* Bookmark Menu */ - :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) - treechildren::-moz-tree-image(container, open, queryFolder_menu________) { - list-style-image: url("../icons/bookmarksMenu-open.svg") !important; - /* or bookmarksMenu-open2.svg" */ - } - - @-moz-document url("chrome://browser/content/places/places.xhtml") - { - @media (-moz-gtk-csd-available) { - /*= Menubar - Icons ==========================================================*/ - #organizeButton, - #viewMenu, - #maintenanceButton, - #back-button, - #forward-button, - #clearDownloadsButton { - fill: currentColor !important; - -moz-context-properties: fill !important; - } - - /* Add */ - #organizeButton { - list-style-image: url("chrome://global/skin/icons/settings.svg") !important; - } - - #viewMenu { - list-style-image: url("../icons/sort.svg") !important; - } - - #maintenanceButton { - list-style-image: url("../icons/import-export.svg") !important; - } - - #clearDownloadsButton { - list-style-image: url("chrome://global/skin/icons/delete.svg") !important; - } - - #clearDownloadsButton > .toolbarbutton-icon { - display: -moz-inline-box !important; - margin-top: 0; - margin-bottom: 0; - margin-inline-start: 0; - margin-inline-end: 2px; - } - - /* Replace */ - #back-button { - list-style-image: url("chrome://browser/skin/back.svg") !important; - } - - #forward-button { - list-style-image: url("chrome://browser/skin/forward.svg") !important; - } - - #back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon, - #forward-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { - transform: scaleX(-1) !important; +@supports not -moz-bool-pref("userChrome.icon.disabled") { + /** Library - Icons Replace ***************************************************/ + @supports -moz-bool-pref("userChrome.icon.library") { + /*= Standard Folder - More Visible ===========================================*/ + /* on Toolbar and Menus */ + :-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) + .bookmark-item[container="true"]:not([query="true"], [tagContainer], [dayContainer]), + :-moz-any(#bookmarks-view, #historyTree, #editBMPanel_folderTree, #placesList, #placeContent) + treechildren::-moz-tree-image(title, container), + #editBMPanel_folderMenuList:not([selectedGuid="toolbar_____"], [selectedGuid="menu________"]), + #editBMPanel_folderMenuList .folder-icon:not([id]), + .downloadIconShow > .button-box > .button-icon { + list-style-image: url("../icons/folder.svg") !important; + } + /* Standard Folder - Open */ + :-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) + .bookmark-item[container="true"]:not([query="true"], [tagContainer], [dayContainer])[open="true"], + :-moz-any(#bookmarks-view, #historyTree, #editBMPanel_folderTree, #placesList, #placeContent) + treechildren::-moz-tree-image(title, container, open) { + list-style-image: url("../icons/folder-open.svg") !important; + } + /*= Other Folder - Inbox Icon ================================================*/ + /* on Menus */ + #PlacesToolbar #OtherBookmarks, + #BMB_bookmarksPopup #BMB_unsortedBookmarks, + #bookmarksMenuPopup #menu_unsortedBookmarks, + :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) + treechildren::-moz-tree-image(container, OrganizerQuery_UnfiledBookmarks), + :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) + treechildren::-moz-tree-image(container, queryFolder_unfiled_____), + #editBMPanel_unfiledRootItem, + #editBMPanel_folderMenuList[selectedGuid="unfiled_____"] { + list-style-image: url("../icons/mail-inbox-all.svg") !important; + } + /* Other Folder - Open */ + #PlacesToolbar #OtherBookmarks[open="true"], + #BMB_bookmarksPopup #BMB_unsortedBookmarks[open="true"], + #bookmarksMenuPopup #menu_unsortedBookmarks[open="true"], + :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) + treechildren::-moz-tree-image(container, open, OrganizerQuery_UnfiledBookmarks), + :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) + treechildren::-moz-tree-image(container, open, queryFolder_unfiled_____) { + list-style-image: url("../icons/mail-inbox.svg") !important; + } + /*= Default Icon - Override ===================================================*/ + /* https://github.com/mozilla/gecko-dev/blob/master/browser/themes/shared/places/tree-icons.css */ + /* Query */ + :-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, query) { + list-style-image: url("chrome://browser/skin/places/folder-smart.svg") !important; + } + /* History */ + :-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, query, dayContainer), + :-moz-any(#historyTree, #placesList, #placeContent) + treechildren::-moz-tree-image(query, OrganizerQuery_history____v) { + list-style-image: url("chrome://browser/skin/history.svg") !important; + } + /* Downloads */ + :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_downloads__v) { + list-style-image: url("chrome://browser/skin/downloads/downloads.svg") !important; + } + /* Tag */ + :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(title, query, tagContainer), + :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_tags_______v) { + list-style-image: url("chrome://browser/skin/places/tag.svg") !important; + } + /* Bookmark */ + :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_allbms_____v) { + list-style-image: url("chrome://browser/skin/bookmark.svg") !important; + } + /* Bookmark Toolbar */ + #BMB_bookmarksPopup #BMB_bookmarksToolbar, + #bookmarksMenuPopup #bookmarksToolbarFolderMenu, + :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) + treechildren::-moz-tree-image(container, queryFolder_toolbar_____) { + list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.svg") !important; + } + /* Bookmark Menu */ + :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) + treechildren::-moz-tree-image(container, queryFolder_menu________) { + list-style-image: url("chrome://browser/skin/places/bookmarksMenu.svg") !important; + } + /*= Default Icon - Open ======================================================*/ + /* Query */ + :-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) + .bookmark-item[container="true"][query="true"]:not([tagContainer])[open="true"] + > .menu-iconic-left + > .menu-iconic-icon { + transform: rotate(15deg) !important; + } + /* History */ + :-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, query, open, dayContainer), + :-moz-any(#historyTree, #placesList, #placeContent) + treechildren::-moz-tree-image(query, open, OrganizerQuery_history____v) { + list-style-image: url("../icons/history-reverse.svg") !important; + } + /* Tag */ + :-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) + .bookmark-item[container="true"][tagContainer="true"][open="true"], + :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(title, query, open, tagContainer), + :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, open, OrganizerQuery_tags_______v) { + list-style-image: url("../icons/tag-open.svg") !important; + } + /* Bookmark */ + :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, open, OrganizerQuery_allbms_____v) { + list-style-image: url("chrome://browser/skin/bookmark-hollow.svg") !important; + } + /* Bookmark Toolbar */ + #BMB_bookmarksPopup #BMB_bookmarksToolbar[open="true"], + #bookmarksMenuPopup #bookmarksToolbarFolderMenu[open="true"], + :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) + treechildren::-moz-tree-image(container, open, queryFolder_toolbar_____) { + list-style-image: url("../icons/bookmarksToolbar-open.svg") !important; + } + /* Bookmark Menu */ + :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) + treechildren::-moz-tree-image(container, open, queryFolder_menu________) { + list-style-image: url("../icons/bookmarksMenu-open.svg") !important; /* or bookmarksMenu-open2.svg" */ + } + @-moz-document url("chrome://browser/content/places/places.xhtml") + { + @media (-moz-gtk-csd-available) { + /*= Menubar - Icons ==========================================================*/ + #organizeButton, + #viewMenu, + #maintenanceButton, + #back-button, + #forward-button, + #clearDownloadsButton { + fill: currentColor !important; + -moz-context-properties: fill, fill-opacity, stroke !important; + } + /* Add */ + #organizeButton { + list-style-image: url("chrome://global/skin/icons/settings.svg") !important; + } + #viewMenu { + list-style-image: url("../icons/sort.svg") !important; + } + #maintenanceButton { + list-style-image: url("../icons/import-export.svg") !important; + } + #clearDownloadsButton { + list-style-image: url("chrome://global/skin/icons/delete.svg") !important; + } + #clearDownloadsButton > .toolbarbutton-icon { + display: -moz-inline-box !important; + margin-top: 0; + margin-bottom: 0; + margin-inline-start: 0; + margin-inline-end: 2px; + } + /* Replace */ + #back-button { + list-style-image: url("chrome://browser/skin/back.svg") !important; + } + #forward-button { + list-style-image: url("chrome://browser/skin/forward.svg") !important; + } + #back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon, + #forward-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { + transform: scaleX(-1) !important; + } } } } -} -/** Panel - Icons *************************************************************/ -@supports -moz-bool-pref("userChrome.icon.panel") { - /*= Padding ==================================================================*/ - :root { - --arrowpanel-menuicon-padding: 8px; - --arrowpanel-menublank-padding: calc( - var(--arrowpanel-menuicon-padding) * 2 + var(var(--arrowpanel-menuitem-padding-inline)) - ) !important; - --arrowpanel-menuimageblank-padding: calc(var(--arrowpanel-menuitem-padding-inline) - 2px) !important; - --arrowpanel-menuimageblank-padding-block: calc(var(--arrowpanel-menuitem-padding-block) - 2px) !important; - } - - .subviewbutton > .toolbarbutton-icon { - width: 16px; - } - - @supports -moz-bool-pref("userChrome.icon.panel_photon") or -moz-bool-pref("userChrome.icon.panel_sparse") { + /** Panel - Icons *************************************************************/ + @supports -moz-bool-pref("userChrome.icon.panel") { + /*= Padding ==================================================================*/ :root { - /* Global */ - --arrowpanel-menuicon-paddingx2: calc(var(--arrowpanel-menuicon-padding) * 2); - /* General Panel */ - --arrowpanel-menublank-padding: calc(var(--arrowpanel-menuicon-paddingx2) + 8px) !important; + --arrowpanel-menuicon-padding: 8px; + --arrowpanel-menublank-padding: calc( + var(--arrowpanel-menuicon-padding) * 2 + var(var(--arrowpanel-menuitem-padding-inline)) + ) !important; --arrowpanel-menuimageblank-padding: calc(var(--arrowpanel-menuitem-padding-inline) - 2px) !important; - /* Blank Menu Left Padding */ - --arrowpanel-menuimageblank-padding-horizontal: calc( - var(--arrowpanel-menuicon-paddingx2) + var(--arrowpanel-menuitem-padding-inline) - ); - --arrowpanel-menuitemblank-padding: calc(var(--arrowpanel-menuitem-padding-block) + 1px); + --arrowpanel-menuimageblank-padding-block: calc(var(--arrowpanel-menuitem-padding-block) - 2px) !important; } - } - #downloadsHistory .button-text, - .subviewbutton > .toolbarbutton-text { - padding-inline-start: var(--arrowpanel-menuicon-padding) !important; - } - - .toolbaritem-combined-buttons > .subviewbutton:not(.subviewbutton-iconic) > .toolbarbutton-text { - padding-inline-start: 0 !important; - } - - #panelMenu_bookmarksMenu .subviewbutton[disabled="true"] .toolbarbutton-text, - #appMenu_historyMenu .subviewbutton[disabled="true"] .toolbarbutton-text { - padding-inline-start: var(--arrowpanel-menublank-padding) !important; - } - - #appMenu-proton-update-banner .toolbarbutton-text { - margin-inline-start: 0 !important; - } - - #appMenu-multiView .subviewbutton::before, - #appMenu-proton-update-banner::before { - display: -moz-inline-box; - margin-inline-end: var(--arrowpanel-menuicon-padding); - width: 16px; - height: 16px; - } - - #appMenu-proton-update-banner { - margin-bottom: 2px !important; - } - - #appMenu-proton-update-banner::before { - margin-inline-start: var(--arrowpanel-menuitem-padding-inline) !important; - } - - #appMenu-fxa-status2, - #appMenu-zoom-controls2, - #appMenu-zoom-controls { - align-items: center; - padding-top: var(--arrowpanel-menuimageblank-padding-block) !important; - padding-bottom: var(--arrowpanel-menuimageblank-padding-block) !important; - } - - #appMenu-zoom-controls2::before, - #appMenu-zoom-controls::before { - margin-inline-end: 0 !important; - } - - #appMenu-zoomReduce-button2, - #appMenu-zoomReset-button2, - #appMenu-zoomEnlarge-button2, - #appMenu-fullscreen-button2 { - --arrowpanel-menuitem-padding-block: 0px; - } - - .subviewbutton[type="checkbox"]:not([checked="true"]) > .toolbarbutton-text { - margin-left: 16px !important; - } - - /* Icons Color */ - #appMenu-multiView .subviewbutton::before, - #appMenu-proton-update-banner::before, - #downloadsHistory .button-icon, - .subviewbutton > image { - fill: currentColor !important; - fill-opacity: var(--toolbarbutton-icon-fill-opacity) !important; - -moz-context-properties: fill !important; - } - - #appMenu-zoomReduce-button2 > .toolbarbutton-icon, - #appMenu-zoomEnlarge-button2 > .toolbarbutton-icon { - stroke: var(--zoom-controls-bgcolor, var(--button-bgcolor, ButtonFace)) !important; - -moz-context-properties: fill, stroke !important; - } - - #appMenu-zoomReduce-button2:not([disabled], [open], :active):is(:hover) > .toolbarbutton-icon, - #appMenu-zoomEnlarge-button2:not([disabled], [open], :active):is(:hover) > .toolbarbutton-icon { - stroke: var(--button-hover-bgcolor) !important; - } - - .subviewbutton[disabled="true"] > image { - /* Ghost icons when disabled */ - opacity: 0.4; - } - - /*= Panel - Main =============================================================*/ - #appMenu-proton-addon-banners > .addon-banner-item > .toolbarbutton-icon { - display: -moz-inline-box !important; - margin-inline-start: var(--arrowpanel-menuicon-padding); - -moz-box-ordinal-group: 0 !important; - } - - #appMenu-proton-update-banner::before { - content: url("../icons/whatsnew.svg"); - } - - #appMenu-fxa-status2::before { - /* Don't exist img tag */ - content: url("chrome://browser/skin/fxa/avatar-empty.svg"); - } - - #appMenu-fxa-status2:is([fxastatus="signedin"], [fxastatus="unverified"], [fxastatus="login-failed"])::before { - display: none; - } - - #appMenu-fxa-status2:is([fxastatus="signedin"], [fxastatus="unverified"], [fxastatus="login-failed"]) - #appMenu-fxa-label2::before { - /* url("https://profile.accounts.firefox.com/v1/avatar/a") */ - content: ""; - border-radius: 50% !important; - background-size: 16px !important; - background-image: var(--avatar-image-url) !important; - } - - @supports -moz-bool-pref("userChrome.icon.panel_full") or -moz-bool-pref("userChrome.icon.panel_photon") { - #appMenu-new-tab-button2 { - list-style-image: url("chrome://browser/skin/new-tab.svg"); + .subviewbutton > .toolbarbutton-icon { + width: 16px; } - } - @supports -moz-bool-pref("userChrome.icon.panel_photon") { - #appMenu-save-file-button2, - #appMenu-find-button2, - #appMenu-more-button2 { - padding-top: var(--arrowpanel-menuitemblank-padding) !important; - padding-bottom: var(--arrowpanel-menuitemblank-padding) !important; + @supports not -moz-bool-pref("userChrome.icon.panel_full") { + :root { + /* Global */ + --arrowpanel-menuicon-paddingx2: calc(var(--arrowpanel-menuicon-padding) * 2); + /* General Panel */ + --arrowpanel-menublank-padding: calc(var(--arrowpanel-menuicon-paddingx2) + 8px) !important; + --arrowpanel-menuimageblank-padding: calc(var(--arrowpanel-menuitem-padding-inline) - 2px) !important; + /* Blank Menu Left Padding */ + --arrowpanel-menuimageblank-padding-horizontal: calc( + var(--arrowpanel-menuicon-paddingx2) + var(--arrowpanel-menuitem-padding-inline) + ); + --arrowpanel-menuitemblank-padding: calc(var(--arrowpanel-menuitem-padding-block) + 1px); + } } - + #downloadsHistory .button-text, + .subviewbutton > .toolbarbutton-text { + padding-inline-start: var(--arrowpanel-menuicon-padding) !important; + } + .toolbaritem-combined-buttons > .subviewbutton:not(.subviewbutton-iconic) > .toolbarbutton-text { + padding-inline-start: 0 !important; + } + #panelMenu_bookmarksMenu .subviewbutton[disabled="true"] .toolbarbutton-text, + #appMenu_historyMenu .subviewbutton[disabled="true"] .toolbarbutton-text { + padding-inline-start: var(--arrowpanel-menublank-padding) !important; + } + #appMenu-proton-update-banner .toolbarbutton-text { + margin-inline-start: 0 !important; + padding-inline-start: 0 !important; /* FF v107 */ + } + #appMenu-multiView .subviewbutton::before, + #appMenu-proton-update-banner::before { + display: -moz-inline-box; + margin-inline-end: var(--arrowpanel-menuicon-padding); + width: 16px; + height: 16px; + } + #appMenu-proton-update-banner { + margin-bottom: 2px !important; + padding-inline-start: var(--arrowpanel-menuitem-padding-inline) !important; + } + #appMenu-fxa-status2, #appMenu-zoom-controls2, #appMenu-zoom-controls { - padding-inline-start: var(--arrowpanel-menuimageblank-padding-horizontal) !important; + align-items: center; + padding-top: var(--arrowpanel-menuimageblank-padding-block) !important; + padding-bottom: var(--arrowpanel-menuimageblank-padding-block) !important; } - } - @supports -moz-bool-pref("userChrome.icon.panel_sparse") { - #appMenu-new-tab-button2, - #appMenu-passwords-button, - #appMenu-extensions-themes-button, - #appMenu-save-file-button2, - #appMenu-find-button2, - #appMenu-more-button2, - #appMenu-help-button2, - #appMenu-quit-button2 { - padding-top: var(--arrowpanel-menuitemblank-padding-block) !important; - padding-bottom: var(--arrowpanel-menuitemblank-padding-block) !important; + #appMenu-zoom-controls2::before, + #appMenu-zoom-controls::before { + margin-inline-end: 0 !important; } - - #appMenu-zoom-controls2, - #appMenu-zoom-controls { - padding-inline-start: var(--arrowpanel-menuimageblank-padding-horizontal) !important; + #appMenu-zoomReduce-button2, + #appMenu-zoomReset-button2, + #appMenu-zoomEnlarge-button2, + #appMenu-fullscreen-button2 { + --arrowpanel-menuitem-padding-block: 0px; } - } - #appMenu-new-window-button2 { - list-style-image: url("chrome://browser/skin/window.svg"); - } - - #appMenu-new-private-window-button2 { - list-style-image: url("chrome://browser/skin/privateBrowsing.svg"); - } - - #appMenu-bookmarks-button { - list-style-image: url("chrome://browser/skin/bookmark.svg"); - } - - #appMenu-history-button { - list-style-image: url("chrome://browser/skin/history.svg"); - } - - #appMenu-downloads-button { - list-style-image: url("chrome://browser/skin/downloads/downloads.svg"); - } - - @supports -moz-bool-pref("userChrome.icon.panel_full") or -moz-bool-pref("userChrome.icon.panel_photon") { - #appMenu-passwords-button { - list-style-image: url("chrome://browser/skin/login.svg"); + .subviewbutton[type="checkbox"]:not([checked="true"]) > .toolbarbutton-text { + margin-left: 16px !important; } - - #appMenu-extensions-themes-button { + /* Icons Color */ + #appMenu-multiView .subviewbutton::before, + #appMenu-proton-update-banner::before, + #downloadsHistory .button-icon, + .subviewbutton:not(#appMenu-proton-update-banner) > image { + fill: currentColor !important; + fill-opacity: var(--toolbarbutton-icon-fill-opacity) !important; + -moz-context-properties: fill, fill-opacity, stroke !important; + } + #appMenu-zoomReduce-button2 > .toolbarbutton-icon, + #appMenu-zoomEnlarge-button2 > .toolbarbutton-icon { + stroke: var(--zoom-controls-bgcolor, var(--button-bgcolor, ButtonFace)) !important; + } + #appMenu-zoomReduce-button2:not([disabled], [open], :active):is(:hover) > .toolbarbutton-icon, + #appMenu-zoomEnlarge-button2:not([disabled], [open], :active):is(:hover) > .toolbarbutton-icon { + stroke: var(--button-hover-bgcolor) !important; + } + .subviewbutton[disabled="true"] > image { + /* Ghost icons when disabled */ + opacity: 0.4; + } + /*= Panel - Main =============================================================*/ + #appMenu-proton-addon-banners > .addon-banner-item > .toolbarbutton-icon { + display: -moz-inline-box !important; + margin-inline-start: var(--arrowpanel-menuicon-padding); + -moz-box-ordinal-group: 0 !important; + } + #appMenu-proton-update-banner::before { + content: url("../icons/whatsnew.svg"); + } + #appMenu-fxa-status2::before { + /* Don't exist img tag */ + content: url("chrome://browser/skin/fxa/avatar-empty.svg"); + } + #appMenu-fxa-status2:is([fxastatus="signedin"], [fxastatus="unverified"], [fxastatus="login-failed"])::before { + display: none; + } + #appMenu-fxa-status2:is([fxastatus="signedin"], [fxastatus="unverified"], [fxastatus="login-failed"]) + #appMenu-fxa-label2::before { + /* url("https://profile.accounts.firefox.com/v1/avatar/a") */ + content: ""; + border-radius: 50% !important; + background-size: 16px !important; + background-image: var(--avatar-image-url) !important; + } + @supports -moz-bool-pref("userChrome.icon.panel_full") or -moz-bool-pref("userChrome.icon.panel_photon") { + #appMenu-new-tab-button2 { + list-style-image: url("chrome://browser/skin/new-tab.svg"); + } + } + @supports -moz-bool-pref("userChrome.icon.panel_photon") { + #appMenu-save-file-button2, + #appMenu-find-button2, + #appMenu-more-button2 { + padding-top: var(--arrowpanel-menuitemblank-padding) !important; + padding-bottom: var(--arrowpanel-menuitemblank-padding) !important; + } + #appMenu-zoom-controls2, + #appMenu-zoom-controls { + padding-inline-start: var(--arrowpanel-menuimageblank-padding-horizontal) !important; + } + } + @supports not -moz-bool-pref("userChrome.icon.panel_photon") { + @supports not -moz-bool-pref("userChrome.icon.panel_full") { + #appMenu-new-tab-button2, + #appMenu-passwords-button, + #appMenu-extensions-themes-button, + #appMenu-save-file-button2, + #appMenu-find-button2, + #appMenu-more-button2, + #appMenu-help-button2, + #appMenu-quit-button2 { + padding-top: var(--arrowpanel-menuitemblank-padding-block) !important; + padding-bottom: var(--arrowpanel-menuitemblank-padding-block) !important; + } + #appMenu-zoom-controls2, + #appMenu-zoom-controls { + padding-inline-start: var(--arrowpanel-menuimageblank-padding-horizontal) !important; + } + } + } + #appMenu-new-window-button2 { + list-style-image: url("chrome://browser/skin/window.svg"); + } + #appMenu-new-private-window-button2 { + list-style-image: url("chrome://browser/skin/privateBrowsing.svg"); + } + #appMenu-bookmarks-button { + list-style-image: url("chrome://browser/skin/bookmark.svg"); + } + #appMenu-history-button { + list-style-image: url("chrome://browser/skin/history.svg"); + } + #appMenu-downloads-button { + list-style-image: url("chrome://browser/skin/downloads/downloads.svg"); + } + @supports -moz-bool-pref("userChrome.icon.panel_full") or -moz-bool-pref("userChrome.icon.panel_photon") { + #appMenu-passwords-button { + list-style-image: url("chrome://browser/skin/login.svg"); + } + #appMenu-extensions-themes-button { + list-style-image: url("chrome://mozapps/skin/extensions/extension.svg"); + } + } + #appMenu-print-button2 { + list-style-image: url("chrome://global/skin/icons/print.svg"); + } + @supports -moz-bool-pref("userChrome.icon.panel_full") { + #appMenu-save-file-button2 { + list-style-image: url("../icons/toolbarButton-download.svg"); + } + #appMenu-find-button2 { + list-style-image: url("chrome://global/skin/icons/search-glass.svg"); + } + #appMenu-zoom-controls2::before, + #appMenu-zoom-controls::before { + content: url("../icons/screenshot.svg"); + } + } + #appMenu-settings-button { + list-style-image: url("chrome://global/skin/icons/settings.svg"); + } + @supports -moz-bool-pref("userChrome.icon.panel_full") { + #appMenu-more-button2 { + list-style-image: url("chrome://browser/skin/ion.svg"); + } + } + @supports -moz-bool-pref("userChrome.icon.panel_full") or -moz-bool-pref("userChrome.icon.panel_photon") { + #appMenu-help-button2 { + list-style-image: url("chrome://global/skin/icons/help.svg"); + } + #appMenu-quit-button2 { + list-style-image: url("../icons/quit.svg"); + } + } + /*= Panel - Account ==========================================================*/ + #PanelUI-fxa-menu-connect-device-button .toolbarbutton-icon, + #PanelUI-fxa-menu-account-signout-button .toolbarbutton-icon { + width: 16px !important; + height: 16px !important; + } + /* Default */ + #fxa-manage-account-button::before { + content: ""; + display: -moz-inline-box; + width: 32px !important; + height: 32px !important; + border-radius: 50%; + background-size: 32px; + background-image: var(--avatar-image-url); + margin-inline-end: var(--arrowpanel-menuicon-padding); + } + @supports -moz-bool-pref("userChrome.icon.account_image_to_right") { + #fxa-manage-account-button::before { + -moz-box-ordinal-group: 2 !important; + } + } + @supports -moz-bool-pref("userChrome.icon.account_label_to_right") { + #fxa-menu-header-title, + #fxa-menu-header-description { + text-align: right; + } + } + .syncNowBtn { + visibility: visible !important; + -moz-box-ordinal-group: 1 !important; + margin-inline-end: var(--arrowpanel-menuicon-padding); + } + #PanelUI-fxa-menu-setup-sync-button { + list-style-image: url("chrome://browser/skin/sync.svg"); + } + #PanelUI-fxa-menu-connect-device-button { + list-style-image: url("chrome://browser/skin/fxa/add-device.svg"); + } + #PanelUI-fxa-menu-sendtab-button { + list-style-image: url("../icons/send-to-device.svg"); + } + #PanelUI-fxa-menu-sync-prefs-button { + list-style-image: url("chrome://global/skin/icons/settings.svg"); + } + #PanelUI-fxa-menu-account-signout-button { + list-style-image: url("../icons/sign-out.svg"); + } + #PanelUI-remotetabs-view-managedevices::before { + /* Box */ + content: ""; + padding-inline-end: 16px; + padding-block: 1px; + margin-inline-end: var(--arrowpanel-menuicon-padding); + /* Color */ + fill: currentColor; + fill-opacity: var(--toolbarbutton-icon-fill-opacity); + -moz-context-properties: fill, fill-opacity, stroke; + background-size: 16px; + background-repeat: no-repeat; + background-position: left center; + background-image: url("chrome://global/skin/icons/settings.svg"); + } + .PanelUI-remotetabs-notabsforclient-label { + margin-inline-start: calc( + var(--arrowpanel-menuicon-padding) + var(--arrowpanel-menuitem-padding-inline) + ) !important; + padding-inline-start: var(--arrowpanel-menublank-padding) !important; + } + /* Change Separator */ + #PanelUI-fxa-menu::before { + content: ""; + display: -moz-box; + border-bottom: 1px solid var(--panel-separator-color); + margin: var(--panel-separator-margin); + padding: 0; + } + #PanelUI-fxa-menu > :first-child { + -moz-box-ordinal-group: 0; + } + #PanelUI-sign-out-separator { + display: none; + } + .pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target[clientType=""], + .sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target[clientType=""] { + list-style-image: url("../icons/send-to-device.svg"); + } + .pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target:not([clientType]), + .sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target:not([clientType]) { + list-style-image: url("chrome://global/skin/icons/settings.svg"); + } + /*= Panel - Bookmark =========================================================*/ + #panelMenuBookmarkThisPage { + list-style-image: url("chrome://browser/skin/bookmark-hollow.svg"); + } + panelMenuBookmarkThisPage[starred] { + list-style-image: url("chrome://browser/skin/bookmark.svg"); + } + #panelMenu_searchBookmarks { + list-style-image: url("chrome://global/skin/icons/search-glass.svg"); + } + #panelMenu_viewBookmarksToolbar { + list-style-image: url("chrome://browser/skin/bookmarks-toolbar.svg"); + } + #panelMenu_showAllBookmarks { + list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg"); + } + /*= Panel - History ==========================================================*/ + #appMenuRecentlyClosedTabs { + list-style-image: url("chrome://browser/skin/tab.svg"); + } + #appMenuRecentlyClosedWindows { + list-style-image: url("chrome://browser/skin/window.svg"); + } + #appMenuRestoreSession, + #appMenu-restoreSession { + list-style-image: url("../icons/restore-session.svg"); + } + #appMenuClearRecentHistory { + list-style-image: url("chrome://browser/skin/forget.svg"); + } + #PanelUI-historyMore { + list-style-image: url("chrome://browser/skin/history.svg"); + } + #appMenu-library-recentlyClosedTabs { + list-style-image: url("../icons/movetowindow-16.svg"); + } + #appMenu-library-recentlyClosedWindows { + list-style-image: url("../icons/restore-session.svg"); + } + /*= Panel - More tools =======================================================*/ + #appmenu-moreTools-button { + list-style-image: url("chrome://browser/skin/customize.svg"); + } + /* Web Developer Tools */ + #appmenu-developer-tools-view .subviewbutton:nth-child(1), + #PanelUI-developer-tools-view .subviewbutton:nth-child(1) { + list-style-image: url("../icons/developer.svg"); + } + /* Task Manager */ + #appmenu-developer-tools-view .subviewbutton:nth-child(2), + #PanelUI-developer-tools-view .subviewbutton:nth-child(2) { + list-style-image: url("../icons/performance.svg"); + } + /* Remote Debugging - Edge bug.svg */ + #appmenu-developer-tools-view .subviewbutton:nth-child(3), + #PanelUI-developer-tools-view .subviewbutton:nth-child(3) { + list-style-image: url("../icons/bug.svg"); + } + /* Browser Toolbox - Edge webdeveloper.svg */ + #appmenu-developer-tools-view .subviewbutton:nth-child(4), + #PanelUI-developer-tools-view .subviewbutton:nth-child(4) { + list-style-image: url("../icons/window-dev-tools.svg"); + } + /* Browser Content Toolbox */ + #appmenu-developer-tools-view .subviewbutton:nth-child(5), + #PanelUI-developer-tools-view .subviewbutton:nth-child(5) { + list-style-image: url("../icons/command-frames.svg"); + } + /* Browser Console */ + #appmenu-developer-tools-view .subviewbutton:nth-last-child(5), + #PanelUI-developer-tools-view .subviewbutton:nth-last-child(5) { + list-style-image: url("chrome://devtools/skin/images/command-console.svg"); + } + /* Responsive Design Mode */ + #appmenu-developer-tools-view .subviewbutton:nth-last-child(4), + #PanelUI-developer-tools-view .subviewbutton:nth-last-child(4) { + list-style-image: url("../icons/command-responsivemode.svg"); + } + /* Eyedropper */ + #appmenu-developer-tools-view .subviewbutton:nth-last-child(3), + #PanelUI-developer-tools-view .subviewbutton:nth-last-child(3) { + list-style-image: url("chrome://devtools/skin/images/command-eyedropper.svg"); + } + /* Page Source - Edge file-search.svg */ + #appmenu-developer-tools-view .subviewbutton:nth-last-child(2), + #PanelUI-developer-tools-view .subviewbutton:nth-last-child(2) { + list-style-image: url("../icons/document-search.svg"); + } + /* Extensions for Devel */ + #appmenu-developer-tools-view .subviewbutton:nth-last-child(1), + #PanelUI-developer-tools-view .subviewbutton:nth-last-child(1) { + list-style-image: url("chrome://devtools/skin/images/debugging-addons.svg"); + } + #appmenu-developer-tools-view .subviewbutton:last-child { + margin-bottom: 6px !important; + } + /*= Panel - Help =============================================================*/ + #appMenu_menu_openHelp { + list-style-image: url("chrome://global/skin/icons/help.svg"); + } + #appMenu_feedbackPage { + list-style-image: url("../icons/send.svg"); + } + #appMenu_helpSafeMode { + list-style-image: url("chrome://devtools/skin/images/debugging-workers.svg"); + } + #appMenu_troubleShooting { + list-style-image: url("chrome://global/skin/icons/more.svg"); + } + #appMenu_help_reportSiteIssue { + list-style-image: url("chrome://global/skin/icons/lightbulb.svg"); + } + #appMenu_menu_HelpPopup_reportPhishingtoolmenu { + list-style-image: url("chrome://global/skin/icons/warning.svg"); + } + #appMenu_aboutName { + list-style-image: url("chrome://global/skin/icons/info.svg"); + } + /*= Panel - Library ==========================================================*/ + #appMenu-library-bookmarks-button { + list-style-image: url("chrome://browser/skin/bookmark.svg"); + } + #appMenu-library-history-button { + list-style-image: url("chrome://browser/skin/history.svg"); + } + #appMenu-library-downloads-button { + list-style-image: url("chrome://browser/skin/downloads/downloads.svg"); + } + /*= Panel - Downloads ========================================================*/ + #downloadsHistory { + list-style-image: url("chrome://browser/skin/downloads/downloads.svg"); + } + #downloadsHistory .box-inherit.button-box { + display: -moz-inline-box !important; + } + /*= Toolbar - Overflow Menu ==================================================*/ + #overflowMenu-customize-button { + list-style-image: url("chrome://browser/skin/customize.svg"); + } + /*= Tabbar - All Tab Menu ====================================================*/ + #allTabsMenu-undoCloseTab { + list-style-image: url("../icons/undo.svg"); + } + #allTabsMenu-searchTabs { + list-style-image: url("chrome://global/skin/icons/search-glass.svg"); + } + #allTabsMenu-containerTabsButton { + list-style-image: url("../icons/container-openin-16.svg"); + } + #allTabsMenu-hiddenTabsButton { + list-style-image: url("../icons/eye-hide.svg"); + } + #allTabsMenu-containerTabsView .subviewbutton:last-child { + list-style-image: url("chrome://global/skin/icons/settings.svg"); + } + /*= BMB_bookmarksPopup =======================================================*/ + #BMB_bookmarksShowAllTop, + #BMB_bookmarksShowAll { + --menuitem-image: url("chrome://browser/skin/bookmark-star-on-tray.svg"); + } + #BMB_bookmarksToolbar { + --menuitem-image: url("chrome://browser/skin/bookmarks-toolbar.svg"); + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + #BMB_bookmarksShowAllTop { + list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg") !important; + } + #BMB_bookmarksShowAllTop > .menu-iconic-left { + display: -moz-box !important; + } + } + /* BMB_bookmarksToolbarPopup */ + #BMB_viewBookmarksToolbar[data-l10n-args='{"isVisible":true}'] { + --menuitem-image: url("../icons/eye-hide.svg"); + } + #BMB_viewBookmarksToolbar[data-l10n-args='{"isVisible":false}'] { + --menuitem-image: url("../icons/eye-show.svg"); + } + /*= protections-popup ========================================================*/ + #protections-popup-settings-button > .protections-popup-settings-icon, + #protections-popup-show-report-button > .protections-popup-show-report-icon { + -moz-context-properties: fill, fill-opacity, stroke; + fill: currentColor; + margin-inline-end: 1em; + } + #protections-popup-settings-button > .protections-popup-settings-icon, + #protections-popup-multiView .panel-subview-footer-button { + list-style-image: url("chrome://global/skin/icons/settings.svg"); + } + #protections-popup-show-report-button > .protections-popup-show-report-icon { + /* chrome://browser/skin/controlcenter/dashboard.svg */ + list-style-image: url("../icons/dashboard.svg"); + } + /*= identity-popup ===========================================================*/ + #identity-popup-clear-sitedata-button, + #identity-popup-more-info { + padding-inline: 5px !important; + } + #identity-popup-securityView-body { + margin-inline-start: 32px !important; /* Original: 10px */ + } + #identity-popup-clear-sitedata-button { + list-style-image: url("../icons/broom.svg"); + } + /*= sidebarMenu-popup ========================================================*/ + #identity-popup-more-info { + list-style-image: url("chrome://global/skin/icons/info.svg"); + } + #sidebar-switcher-bookmarks { + list-style-image: url("chrome://browser/skin/bookmark.svg"); + } + #sidebar-switcher-history { + list-style-image: url("chrome://browser/skin/history.svg"); + } + #sidebar-switcher-tabs { + list-style-image: url("chrome://browser/skin/tab.svg"); + } + #sidebar-reverse-position { + list-style-image: url("chrome://browser/skin/sidebars-right.svg"); + } + #sidebar-box[positionend="true"] #sidebar-reverse-position { + /* Can't apply this. shadow dom */ + list-style-image: url("chrome://browser/skin/sidebars.svg"); + } + #sidebarMenu-popup > .subviewbutton[data-l10n-id="sidebar-menu-close"] { + list-style-image: url("chrome://global/skin/icons/close.svg"); + } + /*= unified-extensions-view ===================================================*/ + #unified-extensions-manage-extensions { list-style-image: url("chrome://mozapps/skin/extensions/extension.svg"); } } - #appMenu-print-button2 { - list-style-image: url("chrome://global/skin/icons/print.svg"); - } - - @supports -moz-bool-pref("userChrome.icon.panel_full") { - #appMenu-save-file-button2 { - list-style-image: url("chrome://browser/skin/save.svg"); + /** Menu - Icons Layout *******************************************************/ + @supports -moz-bool-pref("userChrome.icon.menu") { + menupopup menuitem:not([type="checkbox"][checked="true"], [type="radio"]), + menupopup menu:not([type="checkbox"][checked="true"], [type="radio"]), + #main-menubar > menu { + -moz-appearance: none !important; /* Linux: menulist */ } - - #appMenu-find-button2 { - list-style-image: url("chrome://global/skin/icons/search-glass.svg"); - } - - #appMenu-zoom-controls2::before, - #appMenu-zoom-controls::before { - content: url("../icons/screenshot.svg"); - } - } - #appMenu-settings-button { - list-style-image: url("chrome://global/skin/icons/settings.svg"); - } - - @supports -moz-bool-pref("userChrome.icon.panel_full") { - #appMenu-more-button2 { - list-style-image: url("chrome://browser/skin/ion.svg"); - } - } - @supports -moz-bool-pref("userChrome.icon.panel_full") or -moz-bool-pref("userChrome.icon.panel_photon") { - #appMenu-help-button2 { - list-style-image: url("chrome://global/skin/icons/help.svg"); - } - - #appMenu-quit-button2 { - list-style-image: url("../icons/quit.svg"); - } - } - /*= Panel - Account ==========================================================*/ - #PanelUI-fxa-menu-connect-device-button .toolbarbutton-icon, - #PanelUI-fxa-menu-account-signout-button .toolbarbutton-icon { - width: 16px !important; - height: 16px !important; - } - - /* Default */ - #fxa-manage-account-button::before { - content: ""; - display: -moz-inline-box; - width: 32px !important; - height: 32px !important; - border-radius: 50%; - background-size: 32px; - background-image: var(--avatar-image-url); - margin-inline-end: var(--arrowpanel-menuicon-padding); - } - @supports -moz-bool-pref("userChrome.icon.account_image_to_right") { - #fxa-manage-account-button::before { - -moz-box-ordinal-group: 2 !important; - } - } - - @supports -moz-bool-pref("userChrome.icon.account_label_to_right") { - #fxa-menu-header-title, - #fxa-menu-header-description { - text-align: right; - } - } - .syncNowBtn { - visibility: visible !important; - -moz-box-ordinal-group: 1 !important; - margin-inline-end: var(--arrowpanel-menuicon-padding); - } - - #PanelUI-fxa-menu-setup-sync-button { - list-style-image: url("chrome://browser/skin/sync.svg"); - } - - #PanelUI-fxa-menu-connect-device-button { - list-style-image: url("chrome://browser/skin/fxa/add-device.svg"); - } - - #PanelUI-fxa-menu-sendtab-button { - list-style-image: url("../icons/send-to-device.svg"); - } - - #PanelUI-fxa-menu-sync-prefs-button { - list-style-image: url("chrome://global/skin/icons/settings.svg"); - } - - #PanelUI-fxa-menu-account-signout-button { - list-style-image: url("../icons/sign-out.svg"); - } - - #PanelUI-remotetabs-view-managedevices::before { - /* Box */ - content: ""; - padding-inline-end: 16px; - padding-block: 1px; - margin-inline-end: var(--arrowpanel-menuicon-padding); - /* Color */ - fill: currentColor; - fill-opacity: var(--toolbarbutton-icon-fill-opacity); - -moz-context-properties: fill; - background-size: 16px; - background-repeat: no-repeat; - background-position: left center; - background-image: url("chrome://global/skin/icons/settings.svg"); - } - - .PanelUI-remotetabs-notabsforclient-label { - margin-inline-start: calc( - var(--arrowpanel-menuicon-padding) + var(--arrowpanel-menuitem-padding-inline) - ) !important; - padding-inline-start: var(--arrowpanel-menublank-padding) !important; - } - - /* Change Separator */ - #PanelUI-fxa-menu::before { - content: ""; - display: -moz-box; - border-bottom: 1px solid var(--panel-separator-color); - margin: var(--panel-separator-margin); - padding: 0; - } - - #PanelUI-fxa-menu > :first-child { - -moz-box-ordinal-group: 0; - } - - #PanelUI-sign-out-separator { - display: none; - } - - .pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target[clientType=""], - .sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target[clientType=""] { - list-style-image: url("../icons/send-to-device.svg"); - } - - .pageAction-sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target:not([clientType]), - .sendToDevice-device.subviewbutton.sync-menuitem.sendtab-target:not([clientType]) { - list-style-image: url("chrome://global/skin/icons/settings.svg"); - } - - /*= Panel - Bookmark =========================================================*/ - #panelMenuBookmarkThisPage { - list-style-image: url("chrome://browser/skin/bookmark-hollow.svg"); - } - - panelMenuBookmarkThisPage[starred] { - list-style-image: url("chrome://browser/skin/bookmark.svg"); - } - - #panelMenu_searchBookmarks { - list-style-image: url("chrome://global/skin/icons/search-glass.svg"); - } - - #panelMenu_viewBookmarksToolbar { - list-style-image: url("chrome://browser/skin/bookmarks-toolbar.svg"); - } - - #panelMenu_showAllBookmarks { - list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg"); - } - - /*= Panel - History ==========================================================*/ - #appMenuRecentlyClosedTabs { - list-style-image: url("chrome://browser/skin/tab.svg"); - } - - #appMenuRecentlyClosedWindows { - list-style-image: url("chrome://browser/skin/window.svg"); - } - - #appMenuRestoreSession, - #appMenu-restoreSession { - list-style-image: url("../icons/restore-session.svg"); - } - - #appMenuClearRecentHistory { - list-style-image: url("chrome://browser/skin/forget.svg"); - } - - #PanelUI-historyMore { - list-style-image: url("chrome://browser/skin/history.svg"); - } - - #appMenu-library-recentlyClosedTabs { - list-style-image: url("../icons/movetowindow-16.svg"); - } - - #appMenu-library-recentlyClosedWindows { - list-style-image: url("../icons/restore-session.svg"); - } - - /*= Panel - More tools =======================================================*/ - #appmenu-moreTools-button { - list-style-image: url("chrome://browser/skin/customize.svg"); - } - - /* Web Developer Tools */ - #appmenu-developer-tools-view .subviewbutton:nth-child(1), - #PanelUI-developer-tools-view .subviewbutton:nth-child(1) { - list-style-image: url("../icons/developer.svg"); - } - - /* Task Manager */ - #appmenu-developer-tools-view .subviewbutton:nth-child(2), - #PanelUI-developer-tools-view .subviewbutton:nth-child(2) { - list-style-image: url("../icons/performance.svg"); - } - - /* Remote Debugging - Edge bug.svg */ - #appmenu-developer-tools-view .subviewbutton:nth-child(3), - #PanelUI-developer-tools-view .subviewbutton:nth-child(3) { - list-style-image: url("../icons/bug.svg"); - } - - /* Browser Toolbox - Edge webdeveloper.svg */ - #appmenu-developer-tools-view .subviewbutton:nth-child(4), - #PanelUI-developer-tools-view .subviewbutton:nth-child(4) { - list-style-image: url("../icons/window-dev-tools.svg"); - } - - /* Browser Content Toolbox */ - #appmenu-developer-tools-view .subviewbutton:nth-child(5), - #PanelUI-developer-tools-view .subviewbutton:nth-child(5) { - list-style-image: url("../icons/command-frames.svg"); - } - - /* Browser Console */ - #appmenu-developer-tools-view .subviewbutton:nth-last-child(5), - #PanelUI-developer-tools-view .subviewbutton:nth-last-child(5) { - list-style-image: url("chrome://devtools/skin/images/command-console.svg"); - } - - /* Responsive Design Mode */ - #appmenu-developer-tools-view .subviewbutton:nth-last-child(4), - #PanelUI-developer-tools-view .subviewbutton:nth-last-child(4) { - list-style-image: url("../icons/command-responsivemode.svg"); - } - - /* Eyedropper */ - #appmenu-developer-tools-view .subviewbutton:nth-last-child(3), - #PanelUI-developer-tools-view .subviewbutton:nth-last-child(3) { - list-style-image: url("chrome://devtools/skin/images/command-eyedropper.svg"); - } - - /* Page Source - Edge file-search.svg */ - #appmenu-developer-tools-view .subviewbutton:nth-last-child(2), - #PanelUI-developer-tools-view .subviewbutton:nth-last-child(2) { - list-style-image: url("../icons/document-search.svg"); - } - - /* Extensions for Devel */ - #appmenu-developer-tools-view .subviewbutton:nth-last-child(1), - #PanelUI-developer-tools-view .subviewbutton:nth-last-child(1) { - list-style-image: url("chrome://devtools/skin/images/debugging-addons.svg"); - } - - #appmenu-developer-tools-view .subviewbutton:last-child { - margin-bottom: 6px !important; - } - - /*= Panel - Help =============================================================*/ - #appMenu_menu_openHelp { - list-style-image: url("chrome://global/skin/icons/help.svg"); - } - - #appMenu_feedbackPage { - list-style-image: url("../icons/send.svg"); - } - - #appMenu_helpSafeMode { - list-style-image: url("chrome://devtools/skin/images/debugging-workers.svg"); - } - - #appMenu_troubleShooting { - list-style-image: url("chrome://global/skin/icons/more.svg"); - } - - #appMenu_help_reportSiteIssue { - list-style-image: url("chrome://global/skin/icons/lightbulb.svg"); - } - - #appMenu_menu_HelpPopup_reportPhishingtoolmenu { - list-style-image: url("chrome://global/skin/icons/warning.svg"); - } - - #appMenu_aboutName { - list-style-image: url("chrome://global/skin/icons/info.svg"); - } - - /*= Panel - Library ==========================================================*/ - #appMenu-library-bookmarks-button { - list-style-image: url("chrome://browser/skin/bookmark.svg"); - } - - #appMenu-library-history-button { - list-style-image: url("chrome://browser/skin/history.svg"); - } - - #appMenu-library-downloads-button { - list-style-image: url("chrome://browser/skin/downloads/downloads.svg"); - } - - /*= Panel - Downloads ========================================================*/ - #downloadsHistory { - list-style-image: url("chrome://browser/skin/downloads/downloads.svg"); - } - - #downloadsHistory .box-inherit.button-box { - display: -moz-inline-box !important; - } - - /*= Toolbar - Overflow Menu ==================================================*/ - #overflowMenu-customize-button { - list-style-image: url("chrome://browser/skin/customize.svg"); - } - - /*= Tabbar - All Tab Menu ====================================================*/ - #allTabsMenu-undoCloseTab { - list-style-image: url("../icons/undo.svg"); - } - - #allTabsMenu-searchTabs { - list-style-image: url("chrome://global/skin/icons/search-glass.svg"); - } - - #allTabsMenu-containerTabsButton { - list-style-image: url("../icons/container-openin-16.svg"); - } - - #allTabsMenu-hiddenTabsButton { - list-style-image: url("../icons/eye-hide.svg"); - } - - #allTabsMenu-containerTabsView .subviewbutton:last-child { - list-style-image: url("chrome://global/skin/icons/settings.svg"); - } - - /*= BMB_bookmarksPopup =======================================================*/ - #BMB_bookmarksShowAllTop, - #BMB_bookmarksShowAll { - --menuitem-image: url("chrome://browser/skin/bookmark-star-on-tray.svg"); - } - - #BMB_bookmarksToolbar { - --menuitem-image: url("chrome://browser/skin/bookmarks-toolbar.svg"); - } - - @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - #BMB_bookmarksShowAllTop { - list-style-image: url("chrome://browser/skin/bookmark-star-on-tray.svg") !important; - } - - #BMB_bookmarksShowAllTop > .menu-iconic-left { - display: -moz-box !important; - } - } - /* BMB_bookmarksToolbarPopup */ - #BMB_viewBookmarksToolbar[data-l10n-args='{"isVisible":true}'] { - --menuitem-image: url("../icons/eye-hide.svg"); - } - #BMB_viewBookmarksToolbar[data-l10n-args='{"isVisible":false}'] { - --menuitem-image: url("../icons/eye-show.svg"); - } - - /*= protections-popup ========================================================*/ - #protections-popup-settings-button > .protections-popup-settings-icon, - #protections-popup-show-report-button > .protections-popup-show-report-icon { - -moz-context-properties: fill; - fill: currentColor; - margin-inline-end: 1em; - } - - #protections-popup-settings-button > .protections-popup-settings-icon, - #protections-popup-multiView .panel-subview-footer-button { - list-style-image: url("chrome://global/skin/icons/settings.svg"); - } - - #protections-popup-show-report-button > .protections-popup-show-report-icon { - /* chrome://browser/skin/controlcenter/dashboard.svg */ - list-style-image: url("../icons/dashboard.svg"); - } - - /*= identity-popup ===========================================================*/ - #identity-popup-clear-sitedata-button, - #identity-popup-more-info { - padding-inline: 5px !important; - } - - #identity-popup-securityView-body { - margin-inline-start: 32px !important; - /* Original: 10px */ - } - - #identity-popup-clear-sitedata-button { - list-style-image: url("../icons/broom.svg"); - } - - /*= sidebarMenu-popup ========================================================*/ - #identity-popup-more-info { - list-style-image: url("chrome://global/skin/icons/info.svg"); - } - - #sidebar-switcher-bookmarks { - list-style-image: url("chrome://browser/skin/bookmark.svg"); - } - - #sidebar-switcher-history { - list-style-image: url("chrome://browser/skin/history.svg"); - } - - #sidebar-switcher-tabs { - list-style-image: url("chrome://browser/skin/tab.svg"); - } - - #sidebar-reverse-position { - list-style-image: url("chrome://browser/skin/sidebars-right.svg"); - } - - #sidebar-box[positionend="true"] #sidebar-reverse-position { - /* Can't apply this. shadow dom */ - list-style-image: url("chrome://browser/skin/sidebars.svg"); - } - - #sidebarMenu-popup > .subviewbutton[data-l10n-id="sidebar-menu-close"] { - list-style-image: url("chrome://global/skin/icons/close.svg"); - } -} -/** Menu - Icons Layout *******************************************************/ -@supports -moz-bool-pref("userChrome.icon.menu") { - menupopup menuitem:not([type="checkbox"][checked="true"], [type="radio"]), - menupopup menu:not([type="checkbox"][checked="true"], [type="radio"]), - #main-menubar > menu { - -moz-appearance: none !important; - /* Linux: menulist */ - } - - /* Icon */ - #main-menubar > menu, - :not(menu, #ContentSelectDropdown) - > menupopup - > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - :not(menu, #ContentSelectDropdown) > menupopup > menu:not(.menu-iconic, .in-menulist, [checked="true"]), - menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) - menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) - menu:not(.menu-iconic, .in-menulist, [checked="true"]), - menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) - > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]), - menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup, #context-sendlinktodevice-popup) - > menuitem, - .openintabs-menuitem, - #blockedPopupDontShowMessage, - #BMB_viewBookmarksToolbar { - /* Color */ - -moz-context-properties: fill, fill-opacity !important; - fill: currentColor !important; - /* Layout */ - background-size: 16px !important; - background-repeat: no-repeat !important; - background-image: var(--menuitem-image); - } - - /* For native context menus */ - @supports -moz-bool-pref("widget.macos.native-context-menus") or -moz-bool-pref("widget.gtk.native-context-menus") { + /* Icon */ + #main-menubar > menu, :not(menu, #ContentSelectDropdown) > menupopup > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - :not(menu, #ContentSelectDropdown) > menupopup > menu:not(.menu-iconic, .in-menulist, [checked="true"]) { - list-style-image: var(--menuitem-image, url("../icons/blank.svg")) !important; - } - } - - /* Padding */ - :root { - --context-menu-background-padding-default: 5px; - --context-menu-background-padding: var(--context-menu-background-padding-default); - } - - :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem:not(.menuitem-iconic), - :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menu:not(.menu-iconic), - :not(menu, #ContentSelectDropdown, #context-navigation) - > menupopup - > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - :not(menu, #ContentSelectDropdown, #context-navigation) - > menupopup - > menu:not(.menu-iconic, .in-menulist, [checked="true"]), - menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) - menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) - menu:not(.menu-iconic, .in-menulist, [checked="true"]), - menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) - > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]), - menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup, #context-sendlinktodevice-popup) - > menuitem, - .openintabs-menuitem, - #blockedPopupDontShowMessage, - #BMB_viewBookmarksToolbar { - background-position: left var(--context-menu-background-padding) center !important; - padding-inline-start: var(--context-menu-background-padding) !important; - } - - /* Menubar */ - @supports -moz-bool-pref("userChrome.icon.global_menubar") { - #main-menubar > menu { - background-position: left var(--context-menu-background-padding-default) center !important; - padding-inline-start: calc(16px + var(--context-menu-background-padding-default)) !important; - padding-inline-end: 3px; - } - #main-menubar > menu:first-child { - background-position: left calc(3px + var(--context-menu-background-padding-default)) center !important; - padding-inline-start: calc(19px + var(--context-menu-background-padding-default)) !important; - } - #main-menubar > menu > menupopup { - --menuitem-image: none; - /* Prevent Image Inheritance */ - } - @supports not -moz-bool-pref("userChrome.padding.global_menubar") { - #main-menubar > menu { - padding-block: 2px !important; - } - } - } - /* Padding - Windows */ - @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7) { - :root { - --context-menu-background-padding-default: 2px; - } - } - @media (-moz-os-version: windows-win8), (-moz-platform: windows-win8) { - :root { - --context-menu-background-padding-default: 3px; - } - } - @media (-moz-os-version: windows-win7), - (-moz-platform: windows-win7), - (-moz-os-version: windows-win8), - (-moz-platform: windows-win8) { - :not(menu, #ContentSelectDropdown, #context-navigation) - > menupopup - > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - :not(menu, #ContentSelectDropdown, #context-navigation) - > menupopup - > menu:not(.menu-iconic, .in-menulist, [checked="true"]), + :not(menu, #ContentSelectDropdown) > menupopup > menu:not(.menu-iconic, .in-menulist, [checked="true"]), menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) @@ -8498,1610 +10201,1550 @@ > menuitem, .openintabs-menuitem, #blockedPopupDontShowMessage, - #BMB_viewBookmarksToolbar { - background-position: left var(--context-menu-background-padding) center !important; - padding-inline-start: 0 !important; + #BMB_viewBookmarksToolbar, + #context_openANewTab.tabmix-newtab-menu-icon { + /* Color */ + -moz-context-properties: fill, fill-opacity, stroke !important; + fill: currentColor !important; + /* Layout */ + background-size: 16px !important; + background-repeat: no-repeat !important; + background-image: var(--menuitem-image); } - } - @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { - :root { - --context-menu-background-padding: 1em; - --context-menu-text-padding: 24px; - /* 16px + 8px */ - --menu-background-padding-default: calc( - var(--context-menu-background-padding) + var(--context-menu-text-padding) - ); + #tabContextMenu > .tabmix-newtab-menu-icon { + -moz-context-properties: fill, fill-opacity, stroke !important; + fill: currentColor !important; } - - :not(menu, #ContentSelectDropdown, #context-navigation) - > menupopup - > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - :not(menu, #ContentSelectDropdown, #context-navigation) - > menupopup - > menu:not(.menu-iconic, .in-menulist, [checked="true"]), - menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) - menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) - menu:not(.menu-iconic, .in-menulist, [checked="true"]), - menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) - > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]), - menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup, #context-sendlinktodevice-popup) - > menuitem, - .openintabs-menuitem, - #blockedPopupDontShowMessage, - #BMB_viewBookmarksToolbar { - padding-inline-start: var(--menu-background-padding-default) !important; - margin-left: 0 !important; - } - } - /* Padding - Linux */ - @media (-moz-gtk-csd-available) { - :root { - --context-menu-background-padding-default: 6px; - } - - #main-menubar > menu > .menubar-text { - padding-inline-start: 3px; - } - } - /* Padding - Mac */ - @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - :root { - --context-menu-background-padding-default: 10px; - --context-menu-mac-padding: 21px; - } - - /* context menu width */ - :not(menu, #ContentSelectDropdown, #context-navigation) - > menupopup - > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - :not(menu, #ContentSelectDropdown, #context-navigation) - > menupopup - > menu:not(.menu-iconic, .in-menulist, [checked="true"]), - #blockedPopupDontShowMessage { - padding-inline-end: var(--context-menu-background-padding) !important; - } - - /* text position */ - :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem > .menu-text, - :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menu > .menu-text { - padding-inline-start: var(--context-menu-mac-padding) !important; - } - - /* Checkbox menuitem, None iconic menu */ - :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem[checked="true"], - :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menu:not(.menu-iconic) { - padding-inline-start: calc(var(--context-menu-background-padding) + var(--context-menu-mac-padding)) !important; - } - - /* Global Menu */ - @supports -moz-bool-pref("userChrome.icon.global_menu.mac") { - menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) - menuitem:not(.menuitem-iconic, .bookmark-item), - menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) - menu:not(.menu-iconic) { + /* For native context menus */ + @supports -moz-bool-pref("widget.macos.native-context-menus") or -moz-bool-pref("widget.gtk.native-context-menus") { + :not(menu, #ContentSelectDropdown) + > menupopup + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + :not(menu, #ContentSelectDropdown) > menupopup > menu:not(.menu-iconic, .in-menulist, [checked="true"]) { list-style-image: var(--menuitem-image, url("../icons/blank.svg")) !important; } } - } - /*= Bookmark Menu - Layout ===================================================*/ - /* #goPopup(Legacy of historyMenuPoup), #historyMenuPopup, #bookmarksMenuPopup: looks like global menu - * #BMB_bookmarksPopup: looks like arrow panel - */ - /* Empty Menu */ - menupopup menupopup[emptyplacesresult] .menu-text, - #PersonalToolbar menupopup[emptyplacesresult] .menu-text { - margin-inline-start: 0 !important; - } - - /* Bookmark Popup - As Arrow Panel */ - #BMB_bookmarksPopup, - #PersonalToolbar { - --context-menu-background-padding: var(--arrowpanel-menuitem-padding-inline); - } - - /* Windows 7, 8 */ - @media (-moz-os-version: windows-win7), - (-moz-platform: windows-win7), - (-moz-os-version: windows-win8), - (-moz-platform: windows-win8) { - /* Global Menu */ - menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) .bookmark-item { - padding-inline-start: 0 !important; + /* Padding */ + :root { + --uc-menu-background-position: left; + --context-menu-background-padding-default: 5px; + --context-menu-background-padding: var(--context-menu-background-padding-default); } - - /* Bookmark Popup - None icon menu */ - #BMB_bookmarksPopup, - #PersonalToolbar { - --arrowpanel-menuicon-padding: 9px; + :root:-moz-locale-dir(rtl) { + --uc-menu-background-position: right; } - - menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]), - menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic), - #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]), - #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) { - margin-inline: var(--arrowpanel-menuitem-padding-inline) !important; - background-position: left calc(var(--arrowpanel-menuicon-padding)) center !important; - } - - menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]), - menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic) { - padding-inline-start: calc( - var(--arrowpanel-menuicon-padding) + var(--context-menu-text-padding) + 2px - ) !important; - } - - #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]), - #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) { - padding-inline-start: var(--arrowpanel-menuicon-padding) !important; - } - } - /* Windows */ - @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { - /* Bookmark Popup - None icon menu */ - menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]), - menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic), - #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]), - #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) { - margin-inline: var(--arrowpanel-menuitem-padding-inline) !important; - padding-inline-start: calc(var(--arrowpanel-menuicon-padding) + var(--context-menu-text-padding)) !important; - background-position: left calc(var(--arrowpanel-menuicon-padding)) center !important; - } - } - /* Linux */ - @media (-moz-gtk-csd-available) { - /* Global Menu */ - menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) .bookmark-item { + :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem:not(.menuitem-iconic), + :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menu:not(.menu-iconic), + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup + > menu:not(.menu-iconic, .in-menulist, [checked="true"]), + menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) + menu:not(.menu-iconic, .in-menulist, [checked="true"]), + menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]), + menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup, #context-sendlinktodevice-popup) + > menuitem, + .openintabs-menuitem, + #blockedPopupDontShowMessage, + #BMB_viewBookmarksToolbar, + #context_openANewTab.tabmix-newtab-menu-icon { + background-position: var(--uc-menu-background-position) var(--context-menu-background-padding) center !important; padding-inline-start: var(--context-menu-background-padding) !important; } - - /* Bookmark Popup - Iconic menu */ - #BMB_bookmarksPopup .menu-iconic-text, - #PersonalToolbar menupopup[placespopup="true"] .bookmark-item .menu-iconic-text { - padding-inline-start: 1px !important; + /* Menubar */ + @supports -moz-bool-pref("userChrome.icon.global_menubar") { + #main-menubar > menu { + background-position: var(--uc-menu-background-position) var(--context-menu-background-padding-default) center !important; + padding-inline-start: calc(16px + var(--context-menu-background-padding-default)) !important; + padding-inline-end: 3px; + } + #main-menubar > menu:first-child { + background-position: var(--uc-menu-background-position) + calc(3px + var(--context-menu-background-padding-default)) center !important; + padding-inline-start: calc(19px + var(--context-menu-background-padding-default)) !important; + } + #main-menubar > menu > menupopup { + --menuitem-image: none; /* Prevent Image Inheritance */ + } + @supports not -moz-bool-pref("userChrome.padding.global_menubar") { + #main-menubar > menu { + padding-block: 2px !important; + } + } } - - /* Bookmark Popup - None icon menu */ - menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]), - menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic), - #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]), - #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) { - padding-inline-start: calc(var(--arrowpanel-menuitem-padding-inline) + 1px) !important; + /* Padding - Windows */ + @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7) { + :root { + --context-menu-background-padding-default: 2px; + } + } + @media (-moz-os-version: windows-win8), (-moz-platform: windows-win8) { + :root { + --context-menu-background-padding-default: 3px; + } + } + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8) { + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup + > menu:not(.menu-iconic, .in-menulist, [checked="true"]), + menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) + menu:not(.menu-iconic, .in-menulist, [checked="true"]), + menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]), + menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup, #context-sendlinktodevice-popup) + > menuitem, + .openintabs-menuitem, + #blockedPopupDontShowMessage, + #BMB_viewBookmarksToolbar, + #context_openANewTab.tabmix-newtab-menu-icon { + background-position: left var(--context-menu-background-padding) center !important; + padding-inline-start: 0 !important; + } + } + @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { + :root { + --context-menu-background-padding: 1em; + --context-menu-text-padding: 24px; /* 16px + 8px */ + --menu-background-padding-default: calc( + var(--context-menu-background-padding) + var(--context-menu-text-padding) + ); + } + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup + > menu:not(.menu-iconic, .in-menulist, [checked="true"]), + menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) + menu:not(.menu-iconic, .in-menulist, [checked="true"]), + menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]), + menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup, #context-sendlinktodevice-popup) + > menuitem, + .openintabs-menuitem, + #blockedPopupDontShowMessage, + #BMB_viewBookmarksToolbar, + #context_openANewTab.tabmix-newtab-menu-icon { + padding-inline-start: var(--menu-background-padding-default) !important; + margin-left: 0 !important; + } + } + /* Padding - Linux */ + @media (-moz-gtk-csd-available) { + :root { + --context-menu-background-padding-default: 6px; + } + #main-menubar > menu > .menubar-text { + padding-inline-start: 3px; + } + } + /* Padding - Mac */ + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + :root { + --context-menu-background-padding-default: 10px; + --context-menu-mac-padding: 21px; + } + /* context menu width */ + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + :not(menu, #ContentSelectDropdown, #context-navigation) + > menupopup + > menu:not(.menu-iconic, .in-menulist, [checked="true"]), + #blockedPopupDontShowMessage { + padding-inline-end: var(--context-menu-background-padding) !important; + } + /* text position */ + :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem > .menu-text, + :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menu > .menu-text { + padding-inline-start: var(--context-menu-mac-padding) !important; + } + /* Checkbox menuitem, None iconic menu */ + :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem[type="checkbox"] { + padding-inline-start: calc(var(--context-menu-background-padding) + var(--context-menu-mac-padding)) !important; + } + /* Global Menu */ + @supports -moz-bool-pref("userChrome.icon.global_menu.mac") { + menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) + menuitem:not(.menuitem-iconic, .bookmark-item), + menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup) + menu:not(.menu-iconic) { + list-style-image: var(--menuitem-image, url("../icons/blank.svg")) !important; + } + } + } + /*= Bookmark Menu - Layout ===================================================*/ + /* #goPopup(Legacy of historyMenuPopup), #historyMenuPopup, #bookmarksMenuPopup: looks like global menu + * #BMB_bookmarksPopup: looks like arrow panel + */ + /* Empty Menu */ + menupopup menupopup[emptyplacesresult] .menu-text, + #PersonalToolbar menupopup[emptyplacesresult] .menu-text { + margin-inline-start: 0 !important; } - } - @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { /* Bookmark Popup - As Arrow Panel */ - #PersonalToolbar menupopup menuitem, - #PersonalToolbar menupopup menu { - padding-inline: calc(var(--arrowpanel-menuicon-padding) + var(--arrowpanel-menuitem-padding-inline)) !important; + #BMB_bookmarksPopup, + #PersonalToolbar { + --context-menu-background-padding: var(--arrowpanel-menuitem-padding-inline); } - - /* Bookmark Popup - None icon menu */ - menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]), - menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic) { - padding-inline-start: calc(var(--arrowpanel-menuitem-padding-inline) + 3px) !important; - } - } - @supports -moz-bool-pref("userChrome.icon.context_menu") { - /** Context Menu - Icons ******************************************************/ - /*= tabContextMenu ===========================================================*/ - #context_openANewTab, - #treestyletab_piro_sakura_ne_jp-menuitem-_context_newTab, - #tabcenter-reborn_ariasuni-menuitem-_newTabContextMenuOpenAlternatePosition, - #sidebartabs_asamuzak_jp-menuitem-_newTab { - --menuitem-image: url("chrome://browser/skin/new-tab.svg"); - } - - #tabcenter-reborn_ariasuni-menuitem-_newTabContextMenuOpenInWindow { - --menuitem-image: url("chrome://browser/skin/window.svg"); - } - - #tabcenter-reborn_ariasuni-menuitem-_newTabContextMenuOpenInPrivateWindow { - --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg"); - } - - #context_reloadTab, - #context_reloadSelectedTabs, - #treestyletab_piro_sakura_ne_jp-menuitem-_context_reloadTab, - #treestyletab_piro_sakura_ne_jp-menuitem-_noContextTab\:context_reloadTab, - #treestyletab_piro_sakura_ne_jp-menuitem-_grouped\:reloadTree, - #tabcenter-reborn_ariasuni-menuitem-_contextMenuReloadTab, - #sidebartabs_asamuzak_jp-menuitem-_reloadTab, - #sidebartabs_asamuzak_jp-menuitem-_reloadAllTabs { - --menuitem-image: url("../icons/reload.svg"); - } - - #context_toggleMuteTab, - #context_toggleMuteSelectedTabs, - #treestyletab_piro_sakura_ne_jp-menuitem-_context_toggleMuteTab-mute, - #tabcenter-reborn_ariasuni-menuitem-_contextMenuMuteTab, - #sidebartabs_asamuzak_jp-menuitem-_muteTab { - --menuitem-image: url("chrome://browser/skin/tabbrowser/tab-audio-muted-small.svg"); - } - - #context_toggleMuteTab[muted], - #context_toggleMuteSelectedTabs[muted], - #treestyletab_piro_sakura_ne_jp-menuitem-_context_toggleMuteTab-unmute, - #tabcenter-reborn_ariasuni-menuitem-_contextMenuMuteTab[label="Unmute Tab"], - #sidebartabs_asamuzak_jp-menuitem-_muteTab[label="Unmute Tab"] { - --menuitem-image: url("chrome://browser/skin/tabbrowser/tab-audio-playing-small.svg"); - } - - #context_pinTab, - #context_pinSelectedTabs, - #treestyletab_piro_sakura_ne_jp-menuitem-_context_pinTab, - #tabcenter-reborn_ariasuni-menuitem-_contextMenuPinTab, - #sidebartabs_asamuzak_jp-menuitem-_pinTab { - --menuitem-image: url("../icons/pin-tab.svg"); - } - - #context_unpinTab, - #context_unpinSelectedTabs, - #treestyletab_piro_sakura_ne_jp-menuitem-_context_unpinTab, - #tabcenter-reborn_ariasuni-menuitem-_contextMenuPinTab[label="Unpin Tab"], - #sidebartabs_asamuzak_jp-menuitem-_pinTab[label="Unpin Tab"] { - --menuitem-image: url("../icons/unpin-tab.svg"); - } - - #context_duplicateTab, - #context_duplicateTabs, - #treestyletab_piro_sakura_ne_jp-menuitem-_context_duplicateTab, - #tabcenter-reborn_ariasuni-menuitem-_contextMenuDuplicateTab, - #sidebartabs_asamuzak_jp-menuitem-_dupeTab { - --menuitem-image: url("../icons/notebook-subsection.svg"); - } - - #context_bookmarkTab, - #context_bookmarkSelectedTabs, - #treestyletab_piro_sakura_ne_jp-menuitem-_context_bookmarkTab, - #treestyletab_piro_sakura_ne_jp-menuitem-_noContextTab\:context_bookmarkSelected, - #treestyletab_piro_sakura_ne_jp-menuitem-_grouped\:bookmarkTree, - #sidebartabs_asamuzak_jp-menuitem-_bookmarkTab, - #sidebartabs_asamuzak_jp-menuitem-_bookmarkAllTabs { - --menuitem-image: url("chrome://browser/skin/bookmark.svg"); - } - - #context_moveTabOptions, - #treestyletab_piro_sakura_ne_jp-menuitem-_context_moveTab, - #tabcenter-reborn_ariasuni-menuitem-_contextMenuMoveTab, - #sidebartabs_asamuzak_jp-menuitem-_moveTab { - --menuitem-image: url("../icons/arrow-swap.svg"); - } - - #context_sendTabToDevice, - #treestyletab_piro_sakura_ne_jp-menuitem-_context_sendTabsToDevice { - --menuitem-image: url("../icons/send-to-device.svg"); - } - - #context_sendTabToDevice:is([disabled="true"]) + #context_shareTabURL, - #context_sendTabToDevice:is([disabled="true"]) + menuitem.share-tab-url-item { - /* At windows */ - --menuitem-image: url("../icons/share.svg"); - } - - @supports -moz-bool-pref("userChrome.icon.menu.full") { - #context_shareTabURL, - menuitem.share-tab-url-item { - --menuitem-image: url("../icons/share.svg"); + /* Windows 7, 8 */ + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8) { + /* Global Menu */ + menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) .bookmark-item { + padding-inline-start: 0 !important; + } + /* Bookmark Popup - None icon menu */ + #BMB_bookmarksPopup, + #PersonalToolbar { + --arrowpanel-menuicon-padding: 9px; + } + menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]), + menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic), + #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]), + #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) { + margin-inline: var(--arrowpanel-menuitem-padding-inline) !important; + background-position: var(--uc-menu-background-position) calc(var(--arrowpanel-menuicon-padding)) center !important; + } + menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]), + menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic) { + padding-inline-start: calc( + var(--arrowpanel-menuicon-padding) + var(--context-menu-text-padding) + 2px + ) !important; + } + #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]), + #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) { + padding-inline-start: var(--arrowpanel-menuicon-padding) !important; } } - #context_reopenInContainer, - #treestyletab_piro_sakura_ne_jp-menuitem-_context_reopenInContainer, - #tabcenter-reborn_ariasuni-menuitem-_contextMenuOpenInContextualTab, - #sidebartabs_asamuzak_jp-menuitem-_openNewTabInContainer, - #sidebartabs_asamuzak_jp-menuitem-_reopenTabInContainer { - --menuitem-image: url("../icons/container-openin-16.svg"); - } - - #context_selectAllTabs, - #treestyletab_piro_sakura_ne_jp-menuitem-_context_selectAllTabs, - #treestyletab_piro_sakura_ne_jp-menuitem-_noContextTab\:context_selectAllTabs, - #sidebartabs_asamuzak_jp-menuitem-_selectAllTabs { - --menuitem-image: url("../icons/tab-multiple.svg"); - } - - #context_closeTab, - #treestyletab_piro_sakura_ne_jp-menuitem-_context_closeTab, - #treestyletab_piro_sakura_ne_jp-menuitem-_grouped\:closeTree, - #tabcenter-reborn_ariasuni-menuitem-_contextMenuCloseTab, - #sidebartabs_asamuzak_jp-menuitem-_closeTab { - --menuitem-image: url("chrome://global/skin/icons/close.svg"); - } - - #context_undoCloseTab, - #treestyletab_piro_sakura_ne_jp-menuitem-_context_undoCloseTab, - #treestyletab_piro_sakura_ne_jp-menuitem-_noContextTab\:context_undoCloseTab, - #tabcenter-reborn_ariasuni-menuitem-_contextMenuUndoCloseTab, - #sidebartabs_asamuzak_jp-menuitem-_undoCloseTab { - --menuitem-image: url("../icons/undo.svg"); - } - - /*= new-tab-button-popup =====================================================*/ - #new-tab-button-popup > menuitem[command="Browser:NewUserContextTab"], - .new-tab-popup > menuitem[command="Browser:NewUserContextTab"] { - --menuitem-image: url("../icons/container-openin-16.svg"); - } - - #new-tab-button-popup > menuitem[command="Browser:OpenAboutContainers"], - .new-tab-popup > menuitem[command="Browser:OpenAboutContainers"] { - --menuitem-image: url("chrome://global/skin/icons/settings.svg"); - } - - /*= toolbar-context-menu =====================================================*/ - .customize-context-manageExtension { - --menuitem-image: url("chrome://global/skin/icons/settings.svg"); - } - - .customize-context-removeExtension { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); - } - - .customize-context-reportExtension { - --menuitem-image: url("../icons/send.svg"); - } - - .customize-context-moveToPanel { - --menuitem-image: url("chrome://browser/skin/pin-12.svg"); - } - - #toolbar-context-autohide-downloads-button { - /* checkbox */ - --menuitem-image: url("../icons/eye-tracking-off.svg"); - } - - .customize-context-removeFromToolbar { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); - } - - #toolbar-context-always-open-downloads-panel { - /* checkbox */ - --menuitem-image: url("../icons/drawer-arrow-download.svg"); - } - - #toolbar-context-openANewTab { - --menuitem-image: url("chrome://browser/skin/new-tab.svg"); - } - - #toolbar-context-reloadSelectedTab, - #toolbar-context-reloadSelectedTabs { - --menuitem-image: url("../icons/reload.svg"); - } - - #toolbar-context-bookmarkSelectedTab, - #toolbar-context-bookmarkSelectedTabs { - --menuitem-image: url("chrome://browser/skin/bookmark.svg"); - } - - #toolbar-context-selectAllTabs { - --menuitem-image: url("../icons/tab-multiple.svg"); - } - - #toolbar-context-undoCloseTab { - --menuitem-image: url("../icons/undo.svg"); - } - - #toggle_toolbar-menubar { - /* checkbox */ - --menuitem-image: url("../icons/calendar-agenda.svg"); - } - - #toggle_PersonalToolbar { - /* Also placeContext */ - --menuitem-image: url("chrome://browser/skin/bookmarks-toolbar.svg"); - } - - menuitem.viewCustomizeToolbar { - --menuitem-image: url("chrome://browser/skin/customize.svg"); - } - - .fullscreen-context-autohide { - /* checkbox */ - --menuitem-image: url("../icons/eye-tracking-off.svg"); - } - - #toolbar-context-menu > menuitem[data-l10n-id="full-screen-exit"] { - --menuitem-image: url("chrome://browser/skin/fullscreen-exit.svg"); - } - - /*= contentAreaContextMenu ===================================================*/ - #context-viewsource-goToLine { - --menuitem-image: url("../icons/text-number-format.svg"); - } - - #context-viewsource-wrapLongLines { - /* checkbox */ - --menuitem-image: url("../icons/arrow-sort-down-lines.svg"); - } - - #context-viewsource-highlightSyntax { - /* checkbox */ - --menuitem-image: url("../icons/code.svg"); - } - - #spell-no-suggestions { - --menuitem-image: url("../icons/text-proofing-tools.svg"); - } - - #spell-add-to-dictionary { - --menuitem-image: url("../icons/book-add.svg"); - } - - #spell-undo-add-to-dictionary { - --menuitem-image: url("../icons/undo.svg"); - } - - #context-openlinkincurrent { - --menuitem-image: url("../icons/link-square.svg"); - } - - #context-openlinkincontainertab { - --menuitem-image: url("chrome://browser/skin/new-tab.svg"); - } - - #context-openlinkintab { - --menuitem-image: url("chrome://browser/skin/new-tab.svg"); - } - - #context-openlinkinusercontext-menu { - --menuitem-image: url("../icons/container-openin-16.svg"); - } - - #context-openlink { - --menuitem-image: url("chrome://browser/skin/window.svg"); - } - - #context-openlinkprivate { - --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg"); - } - - #context-bookmarklink { - --menuitem-image: url("chrome://browser/skin/bookmark.svg"); - } - - #context-savelink { - --menuitem-image: url("chrome://browser/skin/save.svg"); - } - - #context-savelinktopocket { - --menuitem-image: url("../icons/pocket-outline.svg"); - } - - #context-copyemail { - --menuitem-image: url("chrome://browser/skin/mail.svg"); - } - - #context-copylink { - --menuitem-image: url("../icons/link.svg"); - } - - #context-sendlinktodevice { - --menuitem-image: url("../icons/send-to-device.svg"); - } - - #context-media-play { - --menuitem-image: url("chrome://global/skin/media/play-fill.svg"); - } - - #context-media-pause { - --menuitem-image: url("chrome://global/skin/media/pause-fill.svg"); - } - - #context-media-mute { - --menuitem-image: url("chrome://global/skin/media/audio-muted.svg"); - } - - #context-media-unmute { - --menuitem-image: url("chrome://global/skin/media/audio.svg"); - } - - #context-media-playbackrate { - --menuitem-image: url("../icons/time-picker.svg"); - } - - #context-media-loop { - /* checkbox */ - --menuitem-image: url("../icons/arrow-repeat-all.svg"); - } - - #context-leave-dom-fullscreen { - --menuitem-image: url("chrome://global/skin/media/fullscreenExitButton.svg"); - } - - #context-video-fullscreen { - --menuitem-image: url("chrome://global/skin/media/fullscreenEnterButton.svg"); - } - - #context-media-hidecontrols { - --menuitem-image: url("../icons/eye-hide.svg"); - } - - #context-media-showcontrols { - --menuitem-image: url("../icons/eye-show.svg"); - } - - #context-viewvideo { - --menuitem-image: url("../icons/video.svg"); - } - - #context-video-pictureinpicture { - /* checkbox */ - --menuitem-image: url("chrome://global/skin/media/picture-in-picture-open.svg"); - } - - #context-reloadimage { - --menuitem-image: url("../icons/image-arrow-counterclockwise.svg"); - } - - #context-viewimage { - --menuitem-image: url("../icons/image-add.svg"); - } - - #context-saveimage { - --menuitem-image: url("../icons/image.svg"); - } - - #context-video-saveimage { - --menuitem-image: url("../icons/video-snapshot.svg"); - } - - #context-savevideo { - --menuitem-image: url("../icons/video.svg"); - } - - #context-saveaudio { - --menuitem-image: url("chrome://global/skin/media/audio.svg"); - } - - #context-copyimage-contents { - --menuitem-image: url("../icons/image-copy.svg"); - } - - #context-copyimage, - #context-copyvideourl, - #context-copyaudiourl { - --menuitem-image: url("../icons/link.svg"); - } - - #context-sendimage, - #context-sendvideo, - #context-sendaudio { - --menuitem-image: url("chrome://browser/skin/mail.svg"); - } - - #context-viewimageinfo { - --menuitem-image: url("chrome://global/skin/icons/info.svg"); - } - - #context-viewimagedesc { - --menuitem-image: url("../icons/image-alt-text.svg"); - } - - #context-setDesktopBackground { - --menuitem-image: url("../icons/resize-image.svg"); - } - - #context-ctp-play { - --menuitem-image: url("chrome://global/skin/icons/plugin.svg"); - } - - #context-ctp-hide { - --menuitem-image: url("chrome://global/skin/icons/plugin-blocked.svg"); - } - - #context-savepage { - --menuitem-image: url("chrome://browser/skin/save.svg"); - } - - #context-pocket { - --menuitem-image: url("../icons/pocket-outline.svg"); - } - - #context-sendpagetodevice { - --menuitem-image: url("../icons/send-to-device.svg"); - } - - #fill-login { - --menuitem-image: url("../icons/password.svg"); - } - - #fill-login-generated-password { - --menuitem-image: url("chrome://browser/skin/login.svg"); - } - - #manage-saved-logins { - --menuitem-image: url("../icons/key-multiple.svg"); - } - - #context-undo { - --menuitem-image: url("../icons/undo.svg"); - } - - @supports -moz-bool-pref("userChrome.icon.menu.full") { - #context-redo { - --menuitem-image: url("../icons/redo.svg"); + /* Windows */ + @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { + /* Bookmark Popup - None icon menu */ + menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]), + menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic), + #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]), + #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) { + margin-inline: var(--arrowpanel-menuitem-padding-inline) !important; + padding-inline-start: calc(var(--arrowpanel-menuicon-padding) + var(--context-menu-text-padding)) !important; + background-position: var(--uc-menu-background-position) calc(var(--arrowpanel-menuicon-padding)) center !important; } } - - #context-cut { - --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); - } - - #context-copy { - --menuitem-image: url("../icons/edit-copy.svg"); - } - - #context-paste { - --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); - } - - #context-delete { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); - } - - #context-selectall { - --menuitem-image: url("../icons/select-all-on.svg"); - } - - #context-print-selection { - --menuitem-image: url("chrome://global/skin/icons/print.svg"); - } - - #context-take-screenshot { - --menuitem-image: url("chrome://browser/skin/screenshot.svg"); - } - - #context-keywordfield { - --menuitem-image: url("chrome://browser/skin/bookmark.svg"); - } - - #context-searchselect, - #context-searchselect-private { - --menuitem-image: url("chrome://global/skin/icons/search-glass.svg"); - } - - #frame { - --menuitem-image: url("../icons/command-frames.svg"); - } - - #spell-check-enabled { - /* checkbox */ - --menuitem-image: url("../icons/text-proofing-tools.svg"); - } - - #spell-add-dictionaries-main { - --menuitem-image: url("../icons/book-add.svg"); - } - - #spell-dictionaries { - --menuitem-image: url("../icons/book.svg"); - } - - #context-bidi-text-direction-toggle { - --menuitem-image: url("../icons/text-direction-horizontal-ltr.svg"); - } - - #context-bidi-page-direction-toggle { - --menuitem-image: url("../icons/document-landscape-split-hint.svg"); - } - - #context-viewpartialsource-selection, - #context-viewsource { - --menuitem-image: url("../icons/document-search.svg"); - } - - #context-inspect-a11y { - --menuitem-image: url("chrome://devtools/skin/images/tool-accessibility.svg"); - } - - #context-inspect { - --menuitem-image: url("../icons/command-pick.svg"); - } - - #context-media-eme-learnmore { - /* iconic */ - } - - @supports -moz-bool-pref("widget.macos.native-context-menus") or -moz-bool-pref("widget.gtk.native-context-menus") { - #context-back { - --menuitem-image: url("chrome://browser/skin/back.svg"); + /* Linux */ + @media (-moz-gtk-csd-available) { + /* Global Menu */ + menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) .bookmark-item { + padding-inline-start: var(--context-menu-background-padding) !important; } - - #context-forward { - --menuitem-image: url("chrome://browser/skin/forward.svg"); + /* Bookmark Popup - Iconic menu */ + #BMB_bookmarksPopup .menu-iconic-text, + #PersonalToolbar menupopup[placespopup="true"] .bookmark-item .menu-iconic-text { + padding-inline-start: 1px !important; } - - #context-reload { + /* Bookmark Popup - None icon menu */ + menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]), + menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic), + #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]), + #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) { + padding-inline-start: calc(var(--arrowpanel-menuitem-padding-inline) + 1px) !important; + } + menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]) .menu-text, + menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic) .menu-text, + #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]) .menu-text, + #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) .menu-text { + margin-inline-start: 21px !important; + } + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + /* Bookmark Popup - As Arrow Panel */ + #PersonalToolbar menupopup menuitem, + #PersonalToolbar menupopup menu { + padding-inline: var(--arrowpanel-menuitem-padding-inline) !important; + } + /* Bookmark Popup - None icon menu */ + menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]), + menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic) { + padding-inline-start: calc(var(--arrowpanel-menuitem-padding-inline) + 3px) !important; + } + #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]), + #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) { + padding-inline-start: calc(var(--arrowpanel-menuitem-padding-inline) + 1px) !important; + } + menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]) > .menu-text, + menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic) > .menu-text, + #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]) > .menu-text, + #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) > .menu-text { + padding-inline-start: var(--context-menu-mac-padding) !important; + } + } + @supports -moz-bool-pref("userChrome.icon.context_menu") { + /** Context Menu - Icons ******************************************************/ /*= tabContextMenu ===========================================================*/ + #context_openANewTab, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_newTab, + #tabcenter-reborn_ariasuni-menuitem-_newTabContextMenuOpenAlternatePosition, + #sidebartabs_asamuzak_jp-menuitem-_newTab { + --menuitem-image: url("chrome://browser/skin/new-tab.svg"); + } + #tabcenter-reborn_ariasuni-menuitem-_newTabContextMenuOpenInWindow { + --menuitem-image: url("chrome://browser/skin/window.svg"); + } + #tabcenter-reborn_ariasuni-menuitem-_newTabContextMenuOpenInPrivateWindow { + --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg"); + } + #context_reloadTab, + #context_reloadSelectedTabs, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_reloadTab, + #treestyletab_piro_sakura_ne_jp-menuitem-_noContextTab\:context_reloadTab, + #treestyletab_piro_sakura_ne_jp-menuitem-_grouped\:reloadTree, + #tabcenter-reborn_ariasuni-menuitem-_contextMenuReloadTab, + #sidebartabs_asamuzak_jp-menuitem-_reloadTab, + #sidebartabs_asamuzak_jp-menuitem-_reloadAllTabs { --menuitem-image: url("../icons/reload.svg"); } - - #context-stop { - --menuitem-image: url("chrome://global/skin/icons/close.svg"); + #context_toggleMuteTab, + #context_toggleMuteSelectedTabs, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_toggleMuteTab-mute, + #tabcenter-reborn_ariasuni-menuitem-_contextMenuMuteTab, + #sidebartabs_asamuzak_jp-menuitem-_muteTab { + --menuitem-image: url("chrome://browser/skin/tabbrowser/tab-audio-muted-small.svg"); } - - #context-bookmarkpage { + #context_toggleMuteTab[muted], + #context_toggleMuteSelectedTabs[muted], + #treestyletab_piro_sakura_ne_jp-menuitem-_context_toggleMuteTab-unmute, + #tabcenter-reborn_ariasuni-menuitem-_contextMenuMuteTab[label="Unmute Tab"], + #sidebartabs_asamuzak_jp-menuitem-_muteTab[label="Unmute Tab"] { + --menuitem-image: url("chrome://browser/skin/tabbrowser/tab-audio-playing-small.svg"); + } + #context_pinTab, + #context_pinSelectedTabs, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_pinTab, + #tabcenter-reborn_ariasuni-menuitem-_contextMenuPinTab, + #sidebartabs_asamuzak_jp-menuitem-_pinTab { + --menuitem-image: url("../icons/pin-tab.svg"); + } + #context_unpinTab, + #context_unpinSelectedTabs, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_unpinTab, + #tabcenter-reborn_ariasuni-menuitem-_contextMenuPinTab[label="Unpin Tab"], + #sidebartabs_asamuzak_jp-menuitem-_pinTab[label="Unpin Tab"] { + --menuitem-image: url("../icons/unpin-tab.svg"); + } + #context_duplicateTab, + #context_duplicateTabs, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_duplicateTab, + #tabcenter-reborn_ariasuni-menuitem-_contextMenuDuplicateTab, + #sidebartabs_asamuzak_jp-menuitem-_dupeTab { + --menuitem-image: url("../icons/tab-copy.svg"); + } + #tabcenter-reborn_ariasuni-menuitem-_contextMenuUnloadTab { + --menuitem-image: url("../icons/tab-unload.svg"); + } + #context_bookmarkTab, + #context_bookmarkSelectedTabs, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_bookmarkTab, + #treestyletab_piro_sakura_ne_jp-menuitem-_noContextTab\:context_bookmarkSelected, + #treestyletab_piro_sakura_ne_jp-menuitem-_grouped\:bookmarkTree, + #sidebartabs_asamuzak_jp-menuitem-_bookmarkTab, + #sidebartabs_asamuzak_jp-menuitem-_bookmarkAllTabs { --menuitem-image: url("chrome://browser/skin/bookmark.svg"); } - } - /*= downloadsContextMenu =====================================================*/ - .downloadPauseMenuItem { - --menuitem-image: url("chrome://global/skin/media/pause-fill.svg"); - } - - .downloadResumeMenuItem { - --menuitem-image: url("chrome://global/skin/media/play-fill.svg"); - } - - .downloadUnblockMenuItem { - --menuitem-image: url("../icons/checkmark-circle.svg"); - } - - .downloadUseSystemDefaultMenuItem { - --menuitem-image: url("chrome://browser/skin/open.svg"); - } - - .downloadAlwaysUseSystemDefaultMenuItem { - /* checkbox */ - --menuitem-image: url("../icons/folder-globe.svg"); - } - - .downloadAlwaysOpenSimilarFilesMenuItem { - /* checkbox */ - --menuitem-image: url("../icons/fluid.svg"); - } - - .downloadShowMenuItem { - --menuitem-image: url("chrome://global/skin/icons/folder.svg"); - } - @supports -moz-bool-pref("userChrome.icon.library") { - .downloadShowMenuItem { - --menuitem-image: url("../icons/folder.svg"); + #context_moveTabOptions, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_moveTab, + #tabcenter-reborn_ariasuni-menuitem-_contextMenuMoveTab, + #sidebartabs_asamuzak_jp-menuitem-_moveTab { + --menuitem-image: url("../icons/arrow-swap.svg"); + } + #context_sendTabToDevice, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_sendTabsToDevice { + --menuitem-image: url("../icons/send-to-device.svg"); + } + #context_sendTabToDevice:is([disabled="true"]) + #context_shareTabURL, + #context_sendTabToDevice:is([disabled="true"]) + menuitem.share-tab-url-item { + /* At windows */ + --menuitem-image: url("../icons/share.svg"); + } + @supports -moz-bool-pref("userChrome.icon.menu.full") { + #context_shareTabURL, + menuitem.share-tab-url-item { + --menuitem-image: url("../icons/share.svg"); + } + } + #context_reopenInContainer, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_reopenInContainer, + #tabcenter-reborn_ariasuni-menuitem-_contextMenuOpenInContextualTab, + #sidebartabs_asamuzak_jp-menuitem-_openNewTabInContainer, + #sidebartabs_asamuzak_jp-menuitem-_reopenTabInContainer { + --menuitem-image: url("../icons/container-openin-16.svg"); + } + #context_selectAllTabs, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_selectAllTabs, + #treestyletab_piro_sakura_ne_jp-menuitem-_noContextTab\:context_selectAllTabs, + #sidebartabs_asamuzak_jp-menuitem-_selectAllTabs { + --menuitem-image: url("../icons/tab-multiple.svg"); + } + #context_closeTab, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_closeTab, + #treestyletab_piro_sakura_ne_jp-menuitem-_grouped\:closeTree, + #tabcenter-reborn_ariasuni-menuitem-_contextMenuCloseTab, + #sidebartabs_asamuzak_jp-menuitem-_closeTab { + --menuitem-image: url("chrome://global/skin/icons/close.svg"); + } + @supports -moz-bool-pref("userChrome.icon.menu.full") { + #context_closeTabOptions, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_closeMultipleTabs, + #tabcenter-reborn_ariasuni-menuitem-_contextMenuCloseTabs, + #sidebartabs_asamuzak_jp-menuitem-_closeMultipleTabs { + --menuitem-image: url("../icons/filter-dismiss.svg"); + } + } + #context_undoCloseTab, + #treestyletab_piro_sakura_ne_jp-menuitem-_context_undoCloseTab, + #treestyletab_piro_sakura_ne_jp-menuitem-_noContextTab\:context_undoCloseTab, + #tabcenter-reborn_ariasuni-menuitem-_contextMenuUndoCloseTab, + #sidebartabs_asamuzak_jp-menuitem-_undoCloseTab { + --menuitem-image: url("../icons/undo.svg"); + } + /*= new-tab-button-popup =====================================================*/ + #new-tab-button-popup > menuitem[command="Browser:NewUserContextTab"], + .new-tab-popup > menuitem[command="Browser:NewUserContextTab"] { + --menuitem-image: url("../icons/container-openin-16.svg"); + } + #new-tab-button-popup > menuitem[command="Browser:OpenAboutContainers"], + .new-tab-popup > menuitem[command="Browser:OpenAboutContainers"] { + --menuitem-image: url("chrome://global/skin/icons/settings.svg"); + } + /*= toolbar-context-menu =====================================================*/ + .customize-context-manageExtension { + --menuitem-image: url("chrome://global/skin/icons/settings.svg"); + } + .customize-context-removeExtension { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + .customize-context-reportExtension { + --menuitem-image: url("../icons/send.svg"); + } + .customize-context-moveToPanel { + --menuitem-image: url("chrome://browser/skin/pin-12.svg"); + } + #toolbar-context-autohide-downloads-button { + /* checkbox */ + --menuitem-image: url("../icons/eye-tracking-off.svg"); + } + .customize-context-removeFromToolbar { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + #toolbar-context-always-open-downloads-panel { + /* checkbox */ + --menuitem-image: url("../icons/drawer-arrow-download.svg"); + } + #toolbar-context-openANewTab { + --menuitem-image: url("chrome://browser/skin/new-tab.svg"); + } + #toolbar-context-reloadSelectedTab, + #toolbar-context-reloadSelectedTabs { + --menuitem-image: url("../icons/reload.svg"); + } + #toolbar-context-bookmarkSelectedTab, + #toolbar-context-bookmarkSelectedTabs { + --menuitem-image: url("chrome://browser/skin/bookmark.svg"); + } + #toolbar-context-selectAllTabs { + --menuitem-image: url("../icons/tab-multiple.svg"); + } + #toolbar-context-undoCloseTab { + --menuitem-image: url("../icons/undo.svg"); + } + #toggle_toolbar-menubar { + /* checkbox */ + --menuitem-image: url("../icons/calendar-agenda.svg"); + } + #toggle_PersonalToolbar { + /* Also placeContext */ + --menuitem-image: url("chrome://browser/skin/bookmarks-toolbar.svg"); + } + menuitem.viewCustomizeToolbar { + --menuitem-image: url("chrome://browser/skin/customize.svg"); + } + .fullscreen-context-autohide { + /* checkbox */ + --menuitem-image: url("../icons/eye-tracking-off.svg"); + } + #toolbar-context-menu > menuitem[data-l10n-id="full-screen-exit"] { + --menuitem-image: url("chrome://browser/skin/fullscreen-exit.svg"); + } + /*= Tab Mix Plus =============================================================*/ + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { + #context_openANewTab.tabmix-newtab-menu-icon .menu-iconic-left { + display: none; + } + } + @supports -moz-bool-pref("userChrome.icon.menu.full") { + #tm-duplicateinWin { + --menuitem-image: url("../icons/tab-desktop-multiple-bottom.svg"); + } + #tm-mergeWindowsTab { + --menuitem-image: url("../icons/merge.svg"); + } + } + #tm-renameTab { + --menuitem-image: url("chrome://global/skin/icons/edit.svg"); + } + #tm-copyTabUrl { + --menuitem-image: url("../icons/link.svg"); + } + #tm-autoreloadTab_menu { + --menuitem-image: url("../icons/timer10.svg"); + } + #context_reloadTabOptions { + --menuitem-image: url("../icons/reload.svg"); + } + @supports -moz-bool-pref("userChrome.icon.menu.full") { + #context_reloadTabOptions { + --menuitem-image: url("../icons/filter-reload.svg"); + } + } + @supports not -moz-bool-pref("userChrome.icon.menu.full") { + #context_reloadTabOptions + #context_reloadTab { + --menuitem-image: url("../icons/blank.svg"); + } + } + #tm-docShell { + --menuitem-image: url("chrome://browser/skin/permissions.svg"); + } + #tm-freezeTab { + --menuitem-image: url("../icons/weather-snowflake.svg"); + } + #tm-protectTab { + --menuitem-image: url("../icons/shield-task.svg"); + } + @supports -moz-bool-pref("userChrome.icon.menu.full") { + #tm-lockTab { + --menuitem-image: url("../icons/lock-closed.svg"); + } + } + @supports -moz-bool-pref("userChrome.icon.menu.full") { + #context_bookmarkAllTabs { + --menuitem-image: url("../icons/bookmark-multiple.svg"); + } + } + /*= contentAreaContextMenu ===================================================*/ + #context-viewsource-goToLine { + --menuitem-image: url("../icons/text-number-format.svg"); + } + #context-viewsource-wrapLongLines { + /* checkbox */ + --menuitem-image: url("../icons/arrow-sort-down-lines.svg"); + } + #context-viewsource-highlightSyntax { + /* checkbox */ + --menuitem-image: url("../icons/code.svg"); + } + #spell-no-suggestions { + --menuitem-image: url("../icons/text-proofing-tools.svg"); + } + #spell-add-to-dictionary { + --menuitem-image: url("../icons/book-add.svg"); + } + #spell-undo-add-to-dictionary { + --menuitem-image: url("../icons/undo.svg"); + } + #context-openlinkincurrent { + --menuitem-image: url("../icons/link-square.svg"); + } + #context-openlinkincontainertab { + --menuitem-image: url("chrome://browser/skin/new-tab.svg"); + } + #context-openlinkintab { + --menuitem-image: url("chrome://browser/skin/new-tab.svg"); + } + #context-openlinkinusercontext-menu { + --menuitem-image: url("../icons/container-openin-16.svg"); + } + #context-openlink { + --menuitem-image: url("chrome://browser/skin/window.svg"); + } + #context-openlinkprivate { + --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg"); + } + #context-bookmarklink { + --menuitem-image: url("chrome://browser/skin/bookmark.svg"); + } + #context-savelink { + --menuitem-image: url("../icons/toolbarButton-download.svg"); + } + #context-savelinktopocket { + --menuitem-image: url("../icons/pocket-outline.svg"); + } + #context-copyemail { + --menuitem-image: url("chrome://browser/skin/mail.svg"); + } + #context-copylink { + --menuitem-image: url("../icons/link.svg"); + } + #context-sendlinktodevice { + --menuitem-image: url("../icons/send-to-device.svg"); + } + #context-media-play { + --menuitem-image: url("chrome://global/skin/media/play-fill.svg"); + } + #context-media-pause { + --menuitem-image: url("chrome://global/skin/media/pause-fill.svg"); + } + #context-media-mute { + --menuitem-image: url("chrome://global/skin/media/audio-muted.svg"); + } + #context-media-unmute { + --menuitem-image: url("chrome://global/skin/media/audio.svg"); + } + #context-media-playbackrate { + --menuitem-image: url("../icons/time-picker.svg"); + } + #context-media-loop { + /* checkbox */ + --menuitem-image: url("../icons/arrow-repeat-all.svg"); + } + #context-leave-dom-fullscreen { + --menuitem-image: url("chrome://global/skin/media/fullscreenExitButton.svg"); + } + #context-video-fullscreen { + --menuitem-image: url("chrome://global/skin/media/fullscreenEnterButton.svg"); + } + #context-media-hidecontrols { + --menuitem-image: url("../icons/eye-hide.svg"); + } + #context-media-showcontrols { + --menuitem-image: url("../icons/eye-show.svg"); + } + #context-viewvideo { + --menuitem-image: url("../icons/video.svg"); + } + #context-video-pictureinpicture { + /* checkbox */ + --menuitem-image: url("chrome://global/skin/media/picture-in-picture-open.svg"); + } + #context-reloadimage { + --menuitem-image: url("../icons/image-arrow-counterclockwise.svg"); + } + #context-viewimage { + --menuitem-image: url("../icons/image-add.svg"); + } + #context-saveimage { + --menuitem-image: url("../icons/image.svg"); + } + #context-video-saveimage { + --menuitem-image: url("../icons/video-snapshot.svg"); + } + #context-savevideo { + --menuitem-image: url("../icons/video.svg"); + } + #context-saveaudio { + --menuitem-image: url("chrome://global/skin/media/audio.svg"); + } + #context-copyimage-contents { + --menuitem-image: url("../icons/image-copy.svg"); + } + #context-copyimage, + #context-copyvideourl, + #context-copyaudiourl { + --menuitem-image: url("../icons/link.svg"); + } + #context-sendimage, + #context-sendvideo, + #context-sendaudio { + --menuitem-image: url("chrome://browser/skin/mail.svg"); + } + #context-viewimageinfo { + --menuitem-image: url("chrome://global/skin/icons/info.svg"); + } + #context-viewimagedesc { + --menuitem-image: url("../icons/image-alt-text.svg"); + } + #context-setDesktopBackground { + --menuitem-image: url("../icons/resize-image.svg"); + } + #context-ctp-play { + --menuitem-image: url("chrome://global/skin/icons/plugin.svg"); + } + #context-ctp-hide { + --menuitem-image: url("chrome://global/skin/icons/plugin-blocked.svg"); + } + #context-savepage { + --menuitem-image: url("../icons/toolbarButton-download.svg"); + } + #context-pocket { + --menuitem-image: url("../icons/pocket-outline.svg"); + } + #context-sendpagetodevice { + --menuitem-image: url("../icons/send-to-device.svg"); + } + #fill-login { + --menuitem-image: url("../icons/password.svg"); + } + #fill-login-generated-password { + --menuitem-image: url("chrome://browser/skin/login.svg"); + } + #manage-saved-logins { + --menuitem-image: url("../icons/key-multiple.svg"); + } + #context-undo { + --menuitem-image: url("../icons/undo.svg"); + } + @supports -moz-bool-pref("userChrome.icon.menu.full") { + #context-redo { + --menuitem-image: url("../icons/redo.svg"); + } + } + #context-cut { + --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); + } + #context-copy { + --menuitem-image: url("../icons/edit-copy.svg"); + } + #context-paste { + --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); + } + #context-delete { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + #context-selectall { + --menuitem-image: url("../icons/select-all-on.svg"); + } + #context-print-selection { + --menuitem-image: url("chrome://global/skin/icons/print.svg"); + } + #context-take-screenshot { + --menuitem-image: url("chrome://browser/skin/screenshot.svg"); + } + #context-keywordfield { + --menuitem-image: url("chrome://browser/skin/bookmark.svg"); + } + #context-searchselect, + #context-searchselect-private { + --menuitem-image: url("chrome://global/skin/icons/search-glass.svg"); + } + #frame { + --menuitem-image: url("../icons/command-frames.svg"); + } + #spell-check-enabled { + /* checkbox */ + --menuitem-image: url("../icons/text-proofing-tools.svg"); + } + #spell-add-dictionaries-main { + --menuitem-image: url("../icons/book-add.svg"); + } + #spell-dictionaries { + --menuitem-image: url("../icons/book.svg"); + } + #context-bidi-text-direction-toggle { + --menuitem-image: url("../icons/text-direction-horizontal-ltr.svg"); + } + #context-bidi-page-direction-toggle { + --menuitem-image: url("../icons/document-landscape-split-hint.svg"); + } + #context-viewpartialsource-selection, + #context-viewsource { + --menuitem-image: url("../icons/document-search.svg"); + } + #context-inspect-a11y { + --menuitem-image: url("chrome://devtools/skin/images/tool-accessibility.svg"); + } + #context-inspect { + --menuitem-image: url("../icons/command-pick.svg"); + } + #context-media-eme-learnmore { + /* iconic */ + } + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + #context-back { + --menuitem-image: url("chrome://browser/skin/back.svg"); + } + #context-forward { + --menuitem-image: url("chrome://browser/skin/forward.svg"); + } + #context-reload { + --menuitem-image: url("../icons/reload.svg"); + } + #context-stop { + --menuitem-image: url("chrome://global/skin/icons/close.svg"); + } + #context-bookmarkpage { + --menuitem-image: url("chrome://browser/skin/bookmark.svg"); + } + } + /*= Tab Mix Plus =============================================================*/ + #tm-autoreload_menu { + --menuitem-image: url("../icons/timer10.svg"); + } + #tm-linkWithhistory { + --menuitem-image: url("../icons/new-tab-skip-forward.svg"); + } + #tm-openAllLinks { + --menuitem-image: url("../icons/new-tab-multiple.svg"); + } + #tm-openinverselink { + --menuitem-image: url("../icons/new-tab-forward.svg"); + } + #tm-content-closetab { + --menuitem-image: url("../icons/dismiss-filled.svg"); + } + #tm-duplicateTabContext { + --menuitem-image: url("../icons/tab-copy.svg"); + } + #tm-duplicateinWinContext { + --menuitem-image: url("../icons/tab-desktop-multiple-bottom.svg"); + } + #tm-detachTabContext { + --menuitem-image: url("../icons/convert-range.svg"); + } + #tm-mergeWindows { + --menuitem-image: url("../icons/merge.svg"); + } + #tm-content-freezeTab { + --menuitem-image: url("../icons/weather-snowflake.svg"); + } + #tm-content-protectTab { + --menuitem-image: url("../icons/shield-task.svg"); + } + #tm-content-lockTab { + --menuitem-image: url("../icons/lock-closed.svg"); + } + #tm-content-undoCloseTab { + --menuitem-image: url("../icons/undo.svg"); + } + /*= downloadsContextMenu =====================================================*/ + .downloadPauseMenuItem { + --menuitem-image: url("chrome://global/skin/media/pause-fill.svg"); + } + .downloadResumeMenuItem { + --menuitem-image: url("chrome://global/skin/media/play-fill.svg"); + } + .downloadUnblockMenuItem { + --menuitem-image: url("../icons/checkmark-circle.svg"); + } + .downloadUseSystemDefaultMenuItem { + --menuitem-image: url("chrome://browser/skin/open.svg"); + } + .downloadAlwaysUseSystemDefaultMenuItem { + /* checkbox */ + --menuitem-image: url("../icons/folder-globe.svg"); + } + .downloadAlwaysOpenSimilarFilesMenuItem { + /* checkbox */ + --menuitem-image: url("../icons/fluid.svg"); + } + .downloadShowMenuItem { + --menuitem-image: url("chrome://global/skin/icons/folder.svg"); + } + @supports -moz-bool-pref("userChrome.icon.library") { + .downloadShowMenuItem { + --menuitem-image: url("../icons/folder.svg"); + } + } + #downloadsContextMenu > menuitem.downloadOpenReferrerMenuItem, + #downloadsContextMenu > menuitem[command="downloadsCmd_openReferrer"] { + --menuitem-image: url("../icons/link-square.svg"); + } + #downloadsContextMenu > menuitem.downloadCopyLocationMenuItem, + #downloadsContextMenu > menuitem[command="downloadsCmd_copyLocation"] { + --menuitem-image: url("../icons/link.svg"); + } + .downloadDeleteFileMenuItem { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + .downloadRemoveFromHistoryMenuItem { + --menuitem-image: url("../icons/eraser.svg"); + } + #downloadsContextMenu > menuitem[command="downloadsCmd_clearList"], + #downloadsContextMenu > menuitem[command="downloadsCmd_clearDownloads"] { + --menuitem-image: url("../icons/broom.svg"); + } + /*= placeContext =============================================================*/ + #placesContext_open { + --menuitem-image: url("../icons/link-square.svg"); + } + #placesContext_openBookmarkContainer\:tabs, + #placesContext_openBookmarkLinks\:tabs { + --menuitem-image: url("../icons/movetowindow-16.svg"); + } + #placesContext_open\:newtab, + #placesContext_openContainer\:tabs, + #placesContext_openLinks\:tabs { + --menuitem-image: url("chrome://browser/skin/new-tab.svg"); + } + #placesContext_open\:newcontainertab { + --menuitem-image: url("../icons/container-openin-16.svg"); + } + #placesContext_open\:newwindow { + --menuitem-image: url("chrome://browser/skin/window.svg"); + } + #placesContext_open\:newprivatewindow { + --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg"); + } + #placesContext_show_bookmark\:info, + #placesContext_show\:info, + #placesContext_show_folder\:info { + --menuitem-image: url("chrome://global/skin/icons/edit.svg"); + } + #placesContext_deleteBookmark, + #placesContext_deleteFolder, + #placesContext_delete, + #placesContext_delete_history { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + #placesContext_deleteHost { + --menuitem-image: url("../icons/eye-hide.svg"); + } + #placesContext_sortBy\:name { + --menuitem-image: url("../icons/text-sort-ascending.svg"); + } + #placesContext_cut { + --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); + } + #placesContext_copy { + --menuitem-image: url("../icons/edit-copy.svg"); + } + #placesContext_paste_group { + --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); + } + #placesContext_new\:bookmark { + --menuitem-image: url("chrome://browser/skin/bookmark.svg"); } - } - - #downloadsContextMenu > menuitem.downloadOpenReferrerMenuItem, - #downloadsContextMenu > menuitem[command="downloadsCmd_openReferrer"] { - --menuitem-image: url("../icons/link-square.svg"); - } - #downloadsContextMenu > menuitem.downloadCopyLocationMenuItem, - #downloadsContextMenu > menuitem[command="downloadsCmd_copyLocation"] { - --menuitem-image: url("../icons/link.svg"); - } - - .downloadDeleteFileMenuItem { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); - } - - .downloadRemoveFromHistoryMenuItem { - --menuitem-image: url("../icons/eraser.svg"); - } - - #downloadsContextMenu > menuitem[command="downloadsCmd_clearList"], - #downloadsContextMenu > menuitem[command="downloadsCmd_clearDownloads"] { - --menuitem-image: url("../icons/broom.svg"); - } - - /*= placeContext =============================================================*/ - #placesContext_open { - --menuitem-image: url("../icons/link-square.svg"); - } - - #placesContext_openBookmarkContainer\:tabs, - #placesContext_openBookmarkLinks\:tabs { - --menuitem-image: url("../icons/movetowindow-16.svg"); - } - - #placesContext_open\:newtab, - #placesContext_openContainer\:tabs, - #placesContext_openLinks\:tabs { - --menuitem-image: url("chrome://browser/skin/new-tab.svg"); - } - - #placesContext_open\:newcontainertab { - --menuitem-image: url("../icons/container-openin-16.svg"); - } - - #placesContext_open\:newwindow { - --menuitem-image: url("chrome://browser/skin/window.svg"); - } - - #placesContext_open\:newprivatewindow { - --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg"); - } - - #placesContext_show_bookmark\:info, - #placesContext_show\:info, - #placesContext_show_folder\:info { - --menuitem-image: url("chrome://global/skin/icons/edit.svg"); - } - - #placesContext_deleteBookmark, - #placesContext_deleteFolder, - #placesContext_delete, - #placesContext_delete_history { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); - } - - #placesContext_deleteHost { - --menuitem-image: url("../icons/eye-hide.svg"); - } - - #placesContext_sortBy\:name { - --menuitem-image: url("../icons/text-sort-ascending.svg"); - } - - #placesContext_cut { - --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); - } - - #placesContext_copy { - --menuitem-image: url("../icons/edit-copy.svg"); - } - - #placesContext_paste_group { - --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); - } - - #placesContext_new\:bookmark { - --menuitem-image: url("chrome://browser/skin/bookmark.svg"); - } - - #placesContext_showInFolder, - #placesContext_new\:folder { - --menuitem-image: url("chrome://global/skin/icons/folder.svg"); - } - @supports -moz-bool-pref("userChrome.icon.library") { #placesContext_showInFolder, #placesContext_new\:folder { - --menuitem-image: url("../icons/folder.svg"); + --menuitem-image: url("chrome://global/skin/icons/folder.svg"); + } + @supports -moz-bool-pref("userChrome.icon.library") { + #placesContext_showInFolder, + #placesContext_new\:folder { + --menuitem-image: url("../icons/folder.svg"); + } + } + #placesContext_new\:separator { + --menuitem-image: url("../icons/vertical-line.svg"); + } + #placesContext_paste { + --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); + } + #placesContext_createBookmark { + --menuitem-image: url("chrome://browser/skin/bookmark.svg"); + } + #show-other-bookmarks_PersonalToolbar { + /* checkbox */ + --menuitem-image: url("../icons/star-line-horizontal.svg"); + } + #placesContext_showAllBookmarks { + --menuitem-image: url("chrome://browser/skin/bookmark-star-on-tray.svg"); + } + .openintabs-menuitem { + --menuitem-image: url("../icons/movetowindow-16.svg"); + } + /*= Notification =============================================================*/ + #doNotDisturbMenuItem { + --menuitem-image: url(chrome://global/skin/media/pause-fill.svg); + } + #disableForOriginMenuItem { + --menuitem-image: url("chrome://global/skin/icons/blocked.svg"); + } + #openSettingsMenuItem { + --menuitem-image: url("chrome://global/skin/icons/settings.svg"); + } + /*= blockedPopupOptions ======================================================*/ + #blockedPopupAllowSite { + --menuitem-image: url("chrome://global/skin/icons/check.svg"); + } + #blockedPopupOptions > menuitem[oncommand="gPopupBlockerObserver.editPopupSettings();"] { + --menuitem-image: url("chrome://global/skin/icons/edit.svg"); + } + #blockedPopupDontShowMessage { + /* checkbox */ + --menuitem-image: url("chrome://global/skin/icons/blocked.svg"); + } + /*= autohide-context =========================================================*/ + #autohide-context > menuitem[data-l10n-id="full-screen-autohide"] { + /* checkbox */ + --menuitem-image: url("../icons/eye-tracking-off.svg"); + } + #autohide-context > menuitem[data-l10n-id="full-screen-exit"] { + --menuitem-image: url("chrome://browser/skin/fullscreen-exit.svg"); + } + /*= pictureInPictureToggleContextMenu ========================================*/ + #pictureInPictureToggleContextMenu > menuitem[oncommand="PictureInPicture.hideToggle();"] { + --menuitem-image: url("../icons/eye-hide.svg"); + } + /*= pageActionContextMenu ====================================================*/ + .pageActionContextMenuItem.extensionPinned.extensionUnpinned.manageExtensionItem { + --menuitem-image: url("chrome://global/skin/icons/settings.svg"); + } + .pageActionContextMenuItem.extensionPinned.extensionUnpinned .removeExtensionItem { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + /*= customizationPanelItemContextMenu ========================================*/ + #customizationPanelItemContextMenuUnpin { + --menuitem-image: url("../icons/unpin-tab.svg"); + } + .customize-context-removeFromPanel { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + /*= customizationPaletteItemContextMenu ======================================*/ + .customize-context-addToToolbar { + --menuitem-image: url("chrome://devtools/skin/images/dock-bottom.svg"); + } + .customize-context-addToPanel { + --menuitem-image: url("chrome://browser/skin/menu.svg"); + } + /*= customizationPanelContextMenu ============================================*/ + #customizationPanelContextMenu > menuitem[command="cmd_CustomizeToolbars"] { + --menuitem-image: url("chrome://browser/skin/customize.svg"); + } + /*= downloads-button-autohide-panel ==========================================*/ + #downloads-button-autohide-checkbox { + /* checkbox */ + --menuitem-image: url("../icons/eye-tracking-off.svg"); + } + /*= SyncedTabsSidebarContext =================================================*/ + #syncedTabsOpenSelected { + --menuitem-image: url("../icons/link-square.svg"); + } + #syncedTabsOpenSelectedInTab { + --menuitem-image: url("chrome://browser/skin/new-tab.svg"); + } + #syncedTabsOpenSelectedInWindow { + --menuitem-image: url("chrome://browser/skin/window.svg"); + } + #syncedTabsOpenSelectedInPrivateWindow { + --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg"); + } + #syncedTabsBookmarkSelected { + --menuitem-image: url("chrome://browser/skin/bookmark.svg"); + } + #syncedTabsCopySelected { + --menuitem-image: url("../icons/link.svg"); + } + #syncedTabsOpenAllInTabs { + --menuitem-image: url("../icons/movetowindow-16.svg"); + } + #syncedTabsManageDevices { + --menuitem-image: url("chrome://global/skin/icons/settings.svg"); + } + #syncedTabsRefresh { + --menuitem-image: url("chrome://browser/skin/sync.svg"); + } + /*= SyncedTabsSidebarTabsFilterContext =======================================*/ + #SyncedTabsSidebarTabsFilterContext > menuitem[cmd="cmd_undo"] { + --menuitem-image: url("../icons/undo.svg"); + } + #SyncedTabsSidebarTabsFilterContext > menuitem[cmd="cmd_cut"] { + --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); + } + #SyncedTabsSidebarTabsFilterContext > menuitem[cmd="cmd_copy"] { + --menuitem-image: url("../icons/edit-copy.svg"); + } + #SyncedTabsSidebarTabsFilterContext > menuitem[cmd="cmd_paste"] { + --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); + } + #SyncedTabsSidebarTabsFilterContext > menuitem[cmd="cmd_delete"] { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + #SyncedTabsSidebarTabsFilterContext > menuitem[cmd="cmd_selectAll"] { + --menuitem-image: url("../icons/select-all-on.svg"); + } + #syncedTabsRefreshFilter { + --menuitem-image: url("chrome://browser/skin/sync.svg"); + } + /*= urlbar-input-container ===================================================*/ + #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_undo"] { + --menuitem-image: url("../icons/undo.svg"); + } + @supports -moz-bool-pref("userChrome.icon.menu.full") { + #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_redo"] { + --menuitem-image: url("../icons/redo.svg"); + } + } + #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_cut"] { + --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); + } + #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_copy"] { + --menuitem-image: url("../icons/edit-copy.svg"); + } + #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_paste"] { + --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); + } + @supports -moz-bool-pref("userChrome.icon.menu.full") { + #paste-and-go { + --menuitem-image: url("../icons/edit-paste-go.svg"); + } + } + #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_delete"] { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_selectAll"] { + --menuitem-image: url("../icons/select-all-on.svg"); + } + /*= textbox-contextmenu ======================================================*/ + /* Browser's Searchbar, Library's Searchbar, Page Info */ + .textbox-contextmenu > menuitem[data-l10n-id="text-action-undo"] { + --menuitem-image: url("../icons/undo.svg"); + } + @supports -moz-bool-pref("userChrome.icon.menu.full") { + .textbox-contextmenu > menuitem[data-l10n-id="text-action-redo"] { + --menuitem-image: url("../icons/redo.svg"); + } + } + .textbox-contextmenu > menuitem[data-l10n-id="text-action-cut"] { + --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); + } + .textbox-contextmenu > menuitem[data-l10n-id="text-action-copy"] { + --menuitem-image: url("../icons/edit-copy.svg"); + } + .textbox-contextmenu > menuitem[data-l10n-id="text-action-paste"] { + --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); + } + .textbox-contextmenu > menuitem[data-l10n-id="text-action-delete"] { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + .textbox-contextmenu > menuitem[data-l10n-id="text-action-select-all"] { + --menuitem-image: url("../icons/select-all-on.svg"); + } + /* Only searchbar */ + @supports -moz-bool-pref("userChrome.icon.menu.full") { + menuitem.searchbar-paste-and-search { + --menuitem-image: url("../icons/edit-paste-search.svg"); + } + } + menuitem.searchbar-clear-history { + --menuitem-image: url("chrome://browser/skin/forget.svg"); + } + /*= context_sendTabToDevicePopupMenu =========================================*/ + .sync-menuitem.sendtab-target[clientType="phone"] { + --menuitem-image: url("chrome://browser/skin/device-phone.svg"); + } + .sync-menuitem.sendtab-target[clientType="tablet"] { + --menuitem-image: url("chrome://browser/skin/device-tablet.svg"); + } + .sync-menuitem.sendtab-target[clientType="desktop"] { + --menuitem-image: url("chrome://browser/skin/device-desktop.svg"); + } + .sync-menuitem.sendtab-target[clientType="tv"] { + --menuitem-image: url("chrome://browser/skin/device-tv.svg"); + } + .sync-menuitem.sendtab-target[clientType="vr"] { + --menuitem-image: url("chrome://browser/skin/device-vr.svg"); + } + .sync-menuitem.sendtab-target[clientType=""] { + --menuitem-image: url("../icons/send-to-device.svg"); + } + .sync-menuitem.sendtab-target:not([clientType]) { + --menuitem-image: url("chrome://global/skin/icons/settings.svg"); + } + #treestyletab_piro_sakura_ne_jp-menuitem-_context_sendTabsToDevice\:manage { + --menuitem-image: url("chrome://global/skin/icons/settings.svg"); + } + /*= unified-extensions-context-menu ==========================================*/ + .unified-extensions-context-menu-manage-extension { + --menuitem-image: url("chrome://global/skin/icons/settings.svg"); + } + .unified-extensions-context-menu-remove-extension { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + .unified-extensions-context-menu-report-extension { + --menuitem-image: url("../icons/send.svg"); } } - - #placesContext_new\:separator { - --menuitem-image: url("../icons/vertical-line.svg"); - } - - #placesContext_paste { - --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); - } - - #placesContext_createBookmark { - --menuitem-image: url("chrome://browser/skin/bookmark.svg"); - } - - #show-other-bookmarks_PersonalToolbar { - /* checkbox */ - --menuitem-image: url("../icons/star-line-horizontal.svg"); - } - - #placesContext_showAllBookmarks { - --menuitem-image: url("chrome://browser/skin/bookmark-star-on-tray.svg"); - } - - .openintabs-menuitem { - --menuitem-image: url("../icons/movetowindow-16.svg"); - } - - /*= blockedPopupOptions ======================================================*/ - #blockedPopupAllowSite { - --menuitem-image: url("chrome://global/skin/icons/check.svg"); - } - - #blockedPopupOptions > menuitem[oncommand="gPopupBlockerObserver.editPopupSettings();"] { - --menuitem-image: url("chrome://global/skin/icons/edit.svg"); - } - - #blockedPopupDontShowMessage { - /* checkbox */ - --menuitem-image: url("chrome://global/skin/icons/blocked.svg"); - } - - /*= autohide-context =========================================================*/ - #autohide-context > menuitem[data-l10n-id="full-screen-autohide"] { - /* checkbox */ - --menuitem-image: url("../icons/eye-tracking-off.svg"); - } - - #autohide-context > menuitem[data-l10n-id="full-screen-exit"] { - --menuitem-image: url("chrome://browser/skin/fullscreen-exit.svg"); - } - - /*= pictureInPictureToggleContextMenu ========================================*/ - #pictureInPictureToggleContextMenu > menuitem[oncommand="PictureInPicture.hideToggle();"] { - --menuitem-image: url("../icons/eye-hide.svg"); - } - - /*= pageActionContextMenu ====================================================*/ - .pageActionContextMenuItem.extensionPinned.extensionUnpinned.manageExtensionItem { - --menuitem-image: url("chrome://global/skin/icons/settings.svg"); - } - .pageActionContextMenuItem.extensionPinned.extensionUnpinned .removeExtensionItem { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); - } - - /*= customizationPanelItemContextMenu ========================================*/ - #customizationPanelItemContextMenuUnpin { - --menuitem-image: url("../icons/unpin-tab.svg"); - } - - .customize-context-removeFromPanel { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); - } - - /*= customizationPaletteItemContextMenu ======================================*/ - .customize-context-addToToolbar { - --menuitem-image: url("chrome://devtools/skin/images/dock-bottom.svg"); - } - - .customize-context-addToPanel { - --menuitem-image: url("chrome://browser/skin/menu.svg"); - } - - /*= customizationPanelContextMenu ============================================*/ - #customizationPanelContextMenu > menuitem[command="cmd_CustomizeToolbars"] { - --menuitem-image: url("chrome://browser/skin/customize.svg"); - } - - /*= downloads-button-autohide-panel ==========================================*/ - #downloads-button-autohide-checkbox { - /* checkbox */ - --menuitem-image: url("../icons/eye-tracking-off.svg"); - } - - /*= SyncedTabsSidebarContext =================================================*/ - #syncedTabsOpenSelected { - --menuitem-image: url("../icons/link-square.svg"); - } - - #syncedTabsOpenSelectedInTab { - --menuitem-image: url("chrome://browser/skin/new-tab.svg"); - } - - #syncedTabsOpenSelectedInWindow { - --menuitem-image: url("chrome://browser/skin/window.svg"); - } - - #syncedTabsOpenSelectedInPrivateWindow { - --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg"); - } - - #syncedTabsBookmarkSelected { - --menuitem-image: url("chrome://browser/skin/bookmark.svg"); - } - - #syncedTabsCopySelected { - --menuitem-image: url("../icons/link.svg"); - } - - #syncedTabsOpenAllInTabs { - --menuitem-image: url("../icons/movetowindow-16.svg"); - } - - #syncedTabsManageDevices { - --menuitem-image: url("chrome://global/skin/icons/settings.svg"); - } - - #syncedTabsRefresh { - --menuitem-image: url("chrome://browser/skin/sync.svg"); - } - - /*= SyncedTabsSidebarTabsFilterContext =======================================*/ - #SyncedTabsSidebarTabsFilterContext > menuitem[cmd="cmd_undo"] { - --menuitem-image: url("../icons/undo.svg"); - } - - #SyncedTabsSidebarTabsFilterContext > menuitem[cmd="cmd_cut"] { - --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); - } - - #SyncedTabsSidebarTabsFilterContext > menuitem[cmd="cmd_copy"] { - --menuitem-image: url("../icons/edit-copy.svg"); - } - - #SyncedTabsSidebarTabsFilterContext > menuitem[cmd="cmd_paste"] { - --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); - } - - #SyncedTabsSidebarTabsFilterContext > menuitem[cmd="cmd_delete"] { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); - } - - #SyncedTabsSidebarTabsFilterContext > menuitem[cmd="cmd_selectAll"] { - --menuitem-image: url("../icons/select-all-on.svg"); - } - - #syncedTabsRefreshFilter { - --menuitem-image: url("chrome://browser/skin/sync.svg"); - } - - /*= urlbar-input-container ===================================================*/ - #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_undo"] { - --menuitem-image: url("../icons/undo.svg"); - } - - @supports -moz-bool-pref("userChrome.icon.menu.full") { - #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_redo"] { - --menuitem-image: url("../icons/redo.svg"); + @supports -moz-bool-pref("userChrome.icon.global_menubar") { + /*= main-menubar =============================================================*/ + #file-menu { + --menuitem-image: url("../icons/mail-inbox-all.svg"); + } + #edit-menu { + --menuitem-image: url("chrome://global/skin/icons/edit.svg"); + } + #view-menu { + --menuitem-image: url("../icons/content-view.svg"); + } + #history-menu { + --menuitem-image: url("chrome://browser/skin/history.svg"); + } + #bookmarksMenu { + --menuitem-image: url("chrome://browser/skin/bookmark.svg"); + } + #tools-menu { + --menuitem-image: url("../icons/toolbox.svg"); + } + #helpMenu { + --menuitem-image: url("chrome://global/skin/icons/help.svg"); } } - - #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_cut"] { - --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); - } - - #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_copy"] { - --menuitem-image: url("../icons/edit-copy.svg"); - } - - #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_paste"] { - --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); - } - - #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_delete"] { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); - } - - #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_selectAll"] { - --menuitem-image: url("../icons/select-all-on.svg"); - } - - /*= textbox-contextmenu ======================================================*/ - /* Browser's Searchbar, Libray's Searchbar, Page Info */ - .textbox-contextmenu > menuitem[data-l10n-id="text-action-undo"] { - --menuitem-image: url("../icons/undo.svg"); - } - - @supports -moz-bool-pref("userChrome.icon.menu.full") { - .textbox-contextmenu > menuitem[data-l10n-id="text-action-redo"] { - --menuitem-image: url("../icons/redo.svg"); + @supports -moz-bool-pref("userChrome.icon.global_menu") { + /** Global Menu ***************************************************************/ + /*= menu_FilePopup ===========================================================*/ + #menu_newNavigatorTab { + --menuitem-image: url("chrome://browser/skin/new-tab.svg"); } - } - - .textbox-contextmenu > menuitem[data-l10n-id="text-action-cut"] { - --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); - } - - .textbox-contextmenu > menuitem[data-l10n-id="text-action-copy"] { - --menuitem-image: url("../icons/edit-copy.svg"); - } - - .textbox-contextmenu > menuitem[data-l10n-id="text-action-paste"] { - --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); - } - - .textbox-contextmenu > menuitem[data-l10n-id="text-action-delete"] { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); - } - - .textbox-contextmenu > menuitem[data-l10n-id="text-action-select-all"] { - --menuitem-image: url("../icons/select-all-on.svg"); - } - - /* Only searchbar */ - menuitem.searchbar-clear-history { - --menuitem-image: url("chrome://browser/skin/forget.svg"); - } - - /*= context_sendTabToDevicePopupMenu =========================================*/ - .sync-menuitem.sendtab-target[clientType="phone"] { - --menuitem-image: url("chrome://browser/skin/device-phone.svg"); - } - .sync-menuitem.sendtab-target[clientType="tablet"] { - --menuitem-image: url("chrome://browser/skin/device-tablet.svg"); - } - .sync-menuitem.sendtab-target[clientType="desktop"] { - --menuitem-image: url("chrome://browser/skin/device-desktop.svg"); - } - .sync-menuitem.sendtab-target[clientType="tv"] { - --menuitem-image: url("chrome://browser/skin/device-tv.svg"); - } - .sync-menuitem.sendtab-target[clientType="vr"] { - --menuitem-image: url("chrome://browser/skin/device-vr.svg"); - } - .sync-menuitem.sendtab-target[clientType=""] { - --menuitem-image: url("../icons/send-to-device.svg"); - } - .sync-menuitem.sendtab-target:not([clientType]) { - --menuitem-image: url("chrome://global/skin/icons/settings.svg"); - } - - #treestyletab_piro_sakura_ne_jp-menuitem-_context_sendTabsToDevice\:manage { - --menuitem-image: url("chrome://global/skin/icons/settings.svg"); - } - } - @supports -moz-bool-pref("userChrome.icon.global_menubar") { - /*= main-menubar =============================================================*/ - #file-menu { - --menuitem-image: url("../icons/mail-inbox-all.svg"); - } - - #edit-menu { - --menuitem-image: url("chrome://global/skin/icons/edit.svg"); - } - - #view-menu { - --menuitem-image: url("../icons/content-view.svg"); - } - - #history-menu { - --menuitem-image: url("chrome://browser/skin/history.svg"); - } - - #bookmarksMenu { - --menuitem-image: url("chrome://browser/skin/bookmark.svg"); - } - - #tools-menu { - --menuitem-image: url("../icons/toolbox.svg"); - } - - #helpMenu { - --menuitem-image: url("chrome://global/skin/icons/help.svg"); - } - } - @supports -moz-bool-pref("userChrome.icon.global_menu") { - /** Global Menu ***************************************************************/ - /*= menu_FilePopup ===========================================================*/ - #menu_newNavigatorTab { - --menuitem-image: url("chrome://browser/skin/new-tab.svg"); - } - - #menu_newUserContext { - --menuitem-image: url("../icons/container-openin-16.svg"); - } - - #menu_newNavigator { - --menuitem-image: url("chrome://browser/skin/window.svg"); - } - - #menu_newPrivateWindow { - --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg"); - } - - #menu_openFile { - --menuitem-image: url("chrome://browser/skin/open.svg"); - } - - #menu_savePage { - --menuitem-image: url("chrome://browser/skin/save.svg"); - } - - #menu_sendLink { - --menuitem-image: url("chrome://browser/skin/mail.svg"); - } - - menu.share-tab-url-item { - --menuitem-image: url("chrome://browser/skin/share.svg"); - } - - #menu_print { - --menuitem-image: url("chrome://global/skin/icons/print.svg"); - } - - #menu_importFromAnotherBrowser { - --menuitem-image: url("chrome://browser/skin/import.svg"); - } - - #goOfflineMenuitem { - /* checkbox */ - --menuitem-image: url("../icons/plug-disconnected.svg"); - } - - #menu_FileQuitItem { - --menuitem-image: url("../icons/quit.svg"); - } - - /* Mange Containers */ - #menu_newUserContext menupopup menuitem:last-child { - --menuitem-image: url("chrome://global/skin/icons/settings.svg"); - } - - /*= menu_EditPopup ===========================================================*/ - #menu_undo { - --menuitem-image: url("../icons/undo.svg"); - } - - @supports -moz-bool-pref("userChrome.icon.menu.full") { - #menu_redo { - --menuitem-image: url("../icons/redo.svg"); + #menu_newUserContext { + --menuitem-image: url("../icons/container-openin-16.svg"); + } + #menu_newNavigator { + --menuitem-image: url("chrome://browser/skin/window.svg"); + } + #menu_newPrivateWindow { + --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg"); + } + #menu_openFile { + --menuitem-image: url("chrome://browser/skin/open.svg"); + } + #menu_savePage { + --menuitem-image: url("../icons/toolbarButton-download.svg"); + } + #menu_sendLink { + --menuitem-image: url("chrome://browser/skin/mail.svg"); + } + menu.share-tab-url-item { + --menuitem-image: url("chrome://browser/skin/share.svg"); + } + #menu_print { + --menuitem-image: url("chrome://global/skin/icons/print.svg"); + } + #menu_importFromAnotherBrowser { + --menuitem-image: url("chrome://browser/skin/import.svg"); + } + #goOfflineMenuitem { + /* checkbox */ + --menuitem-image: url("../icons/plug-disconnected.svg"); + } + #menu_FileQuitItem { + --menuitem-image: url("../icons/quit.svg"); + } + /* Mange Containers */ + #menu_newUserContext menupopup menuitem:last-child { + --menuitem-image: url("chrome://global/skin/icons/settings.svg"); + } + /*= menu_EditPopup ===========================================================*/ + #menu_undo { + --menuitem-image: url("../icons/undo.svg"); + } + @supports -moz-bool-pref("userChrome.icon.menu.full") { + #menu_redo { + --menuitem-image: url("../icons/redo.svg"); + } + } + #menu_cut { + --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); + } + #menu_copy { + --menuitem-image: url("../icons/edit-copy.svg"); + } + #menu_paste { + --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); + } + #menu_delete { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + #menu_selectAll { + --menuitem-image: url("../icons/select-all-on.svg"); + } + #menu_find { + --menuitem-image: url("chrome://global/skin/icons/search-glass.svg"); + } + #menu_preferences { + --menuitem-image: url("chrome://global/skin/icons/settings.svg"); + } + /*= menu_viewPopup ===========================================================*/ + #viewToolbarsMenu { + --menuitem-image: url("../icons/toolbar.svg"); + } + #viewSidebarMenuMenu { + --menuitem-image: url("chrome://browser/skin/sidebars.svg"); + } + #viewFullZoomMenu { + --menuitem-image: url("../icons/screenshot.svg"); + } + #pageStyleMenu { + --menuitem-image: url("../icons/document-css.svg"); + } + #repair-text-encoding { + --menuitem-image: url("chrome://browser/skin/characterEncoding.svg"); + } + #enterFullScreenItem { + --menuitem-image: url("chrome://browser/skin/fullscreen.svg"); + } + #exitFullScreenItem { + --menuitem-image: url("chrome://browser/skin/fullscreen-exit.svg"); + } + #fullScreenItem { + /* checkbox */ + --menuitem-image: url("chrome://browser/skin/fullscreen.svg"); + } + #menu_readerModeItem { + --menuitem-image: url("chrome://browser/skin/reader-mode.svg"); + } + #menu_showAllTabs { + --menuitem-image: url("../icons/tab.svg"); + } + #documentDirection-swap { + --menuitem-image: url("../icons/text-direction-horizontal-ltr.svg"); + } + /* view-menu-popup sub menu */ + #menu_customizeToolbars { + --menuitem-image: url("chrome://browser/skin/customize.svg"); + } + /* viewFullZoomMenu sub menu */ + #menu_zoomEnlarge { + --menuitem-image: url("chrome://browser/skin/add-circle-fill.svg"); + } + #menu_zoomReduce { + --menuitem-image: url("chrome://browser/skin/subtract-circle-fill.svg"); + } + #menu_zoomReset { + --menuitem-image: url("../icons/resize.svg"); + } + #toggle_zoom { + --menuitem-image: url("../icons/screenshot.svg"); + } + /*= goPopup ==================================================================*/ + #menu_showAllHistory { + --menuitem-image: url("chrome://browser/skin/history.svg"); + } + #sanitizeItem { + --menuitem-image: url("chrome://browser/skin/forget.svg"); + } + #sync-tabs-menuitem { + --menuitem-image: url("chrome://browser/skin/sync.svg"); + } + #historyRestoreLastSession { + --menuitem-image: url("../icons/restore-session.svg"); + } + #hiddenTabsMenu { + --menuitem-image: url("../icons/eye-hide.svg"); + } + #historyUndoMenu { + --menuitem-image: url("chrome://browser/skin/tab.svg"); + } + #historyUndoWindowMenu { + --menuitem-image: url("chrome://browser/skin/window.svg"); + } + /* sub menu */ + #historyUndoPopup .restoreallitem { + --menuitem-image: url("../icons/movetowindow-16.svg"); + } + #historyUndoWindowPopup .restoreallitem { + --menuitem-image: url("../icons/restore-session.svg"); + } + /*= bookmarksMenuPopup =======================================================*/ + #bookmarksShowAll { + --menuitem-image: url("chrome://browser/skin/bookmark-star-on-tray.svg"); + } + #menu_bookmarkThisPage, + #menu_bookmarkAllTabs { + --menuitem-image: url("chrome://browser/skin/bookmark-hollow.svg"); + } + #menu_bookmarkThisPage[data-l10n-id="menu-bookmark-edit"] { + --menuitem-image: url("chrome://browser/skin/bookmark.svg"); + } + /*= menu_ToolsPopup ==========================================================*/ + #menu_openDownloads { + --menuitem-image: url("chrome://browser/skin/downloads/downloads.svg"); + } + #menu_openAddons { + --menuitem-image: url("chrome://mozapps/skin/extensions/extension.svg"); + } + #sync-setup { + --menuitem-image: url("chrome://browser/skin/fxa/avatar-empty.svg"); + } + #sync-syncnowitem { + --menuitem-image: url("chrome://browser/skin/sync.svg"); + } + #menu_openFirefoxView { + --menuitem-image: url("chrome://branding/content/icon32.png"); + } + #webDeveloperMenu, + #browserToolsMenu { + --menuitem-image: url("../icons/developer.svg"); + } + #menu_pageInfo { + --menuitem-image: url("../icons/document-endnote.svg"); + } + /* menuWebDeveloperPopup sub menu */ + #menu_devToolbox { + /* checkbox */ + --menuitem-image: url("../icons/developer.svg"); + } + #menu_taskManager { + --menuitem-image: url("../icons/performance.svg"); + } + #menu_devtools_remotedebugging { + --menuitem-image: url("../icons/bug.svg"); + } + #menu_browserToolbox { + --menuitem-image: url("../icons/window-dev-tools.svg"); + } + #menu_browserContentToolbox { + --menuitem-image: url("../icons/command-frames.svg"); + } + #menu_browserConsole { + --menuitem-image: url("chrome://devtools/skin/images/command-console.svg"); + } + #menu_responsiveUI { + /* checkbox */ + --menuitem-image: url("../icons/command-responsivemode.svg"); + } + #menu_eyedropper { + /* checkbox */ + --menuitem-image: url("chrome://devtools/skin/images/command-eyedropper.svg"); + } + #menu_pageSource { + --menuitem-image: url("../icons/document-search.svg"); + } + #extensionsForDevelopers { + --menuitem-image: url("chrome://devtools/skin/images/debugging-addons.svg"); + } + /*= windowPopup ==============================================================*/ + #windowPopup > menuitem[command="minimizeWindow"] { + --menuitem-image: url("../icons/arrow-between-down.svg"); + } + #windowPopup > menuitem[command="zoomWindow"] { + --menuitem-image: url("../icons/auto-fit-width.svg"); + } + /*= menu_HelpPopup ===========================================================*/ + #menu_openHelp { + --menuitem-image: url("chrome://global/skin/icons/help.svg"); + } + #feedbackPage { + --menuitem-image: url("../icons/send.svg"); + } + #helpSafeMode { + --menuitem-image: url("chrome://devtools/skin/images/debugging-workers.svg"); + } + #troubleShooting { + --menuitem-image: url("chrome://global/skin/icons/more.svg"); + } + #help_reportSiteIssue { + --menuitem-image: url("chrome://global/skin/icons/lightbulb.svg"); + } + #menu_HelpPopup_reportPhishingtoolmenu { + --menuitem-image: url("chrome://global/skin/icons/warning.svg"); + } + #aboutName { + --menuitem-image: url("chrome://global/skin/icons/info.svg"); } - } - - #menu_cut { - --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); - } - - #menu_copy { - --menuitem-image: url("../icons/edit-copy.svg"); - } - - #menu_paste { - --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); - } - - #menu_delete { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); - } - - #menu_selectAll { - --menuitem-image: url("../icons/select-all-on.svg"); - } - - #menu_find { - --menuitem-image: url("chrome://global/skin/icons/search-glass.svg"); - } - - #menu_preferences { - --menuitem-image: url("chrome://global/skin/icons/settings.svg"); - } - - /*= menu_viewPopup ===========================================================*/ - #viewToolbarsMenu { - --menuitem-image: url("../icons/toolbar.svg"); - } - - #viewSidebarMenuMenu { - --menuitem-image: url("chrome://browser/skin/sidebars.svg"); - } - - #viewFullZoomMenu { - --menuitem-image: url("../icons/screenshot.svg"); - } - - #pageStyleMenu { - --menuitem-image: url("../icons/document-css.svg"); - } - - #repair-text-encoding { - --menuitem-image: url("chrome://browser/skin/characterEncoding.svg"); - } - - #enterFullScreenItem { - --menuitem-image: url("chrome://browser/skin/fullscreen.svg"); - } - - #exitFullScreenItem { - --menuitem-image: url("chrome://browser/skin/fullscreen-exit.svg"); - } - - #fullScreenItem { - /* checkbox */ - --menuitem-image: url("chrome://browser/skin/fullscreen.svg"); - } - - #menu_readerModeItem { - --menuitem-image: url("chrome://browser/skin/reader-mode.svg"); - } - - #menu_showAllTabs { - --menuitem-image: url("../icons/tab.svg"); - } - - #documentDirection-swap { - --menuitem-image: url("../icons/text-direction-horizontal-ltr.svg"); - } - - /* view-menu-popup sub menu */ - #menu_customizeToolbars { - --menuitem-image: url("chrome://browser/skin/customize.svg"); - } - - /* viewFullZoomMenu sub menu */ - #menu_zoomEnlarge { - --menuitem-image: url("chrome://browser/skin/add-circle-fill.svg"); - } - - #menu_zoomReduce { - --menuitem-image: url("chrome://browser/skin/subtract-circle-fill.svg"); - } - - #menu_zoomReset { - --menuitem-image: url("../icons/resize.svg"); - } - - #toggle_zoom { - --menuitem-image: url("../icons/screenshot.svg"); - } - - /*= goPopup ==================================================================*/ - #menu_showAllHistory { - --menuitem-image: url("chrome://browser/skin/history.svg"); - } - - #sanitizeItem { - --menuitem-image: url("chrome://browser/skin/forget.svg"); - } - - #sync-tabs-menuitem { - --menuitem-image: url("chrome://browser/skin/sync.svg"); - } - - #historyRestoreLastSession { - --menuitem-image: url("../icons/restore-session.svg"); - } - - #hiddenTabsMenu { - --menuitem-image: url("../icons/eye-hide.svg"); - } - - #historyUndoMenu { - --menuitem-image: url("chrome://browser/skin/tab.svg"); - } - - #historyUndoWindowMenu { - --menuitem-image: url("chrome://browser/skin/window.svg"); - } - - /* sub menu */ - #historyUndoPopup .restoreallitem { - --menuitem-image: url("../icons/movetowindow-16.svg"); - } - - #historyUndoWindowPopup .restoreallitem { - --menuitem-image: url("../icons/restore-session.svg"); - } - - /*= bookmarksMenuPopup =======================================================*/ - #bookmarksShowAll { - --menuitem-image: url("chrome://browser/skin/bookmark-star-on-tray.svg"); - } - - #menu_bookmarkThisPage, - #menu_bookmarkAllTabs { - --menuitem-image: url("chrome://browser/skin/bookmark-hollow.svg"); - } - - #menu_bookmarkThisPage[data-l10n-id="menu-bookmark-edit"] { - --menuitem-image: url("chrome://browser/skin/bookmark.svg"); - } - - /*= menu_ToolsPopup ==========================================================*/ - #menu_openDownloads { - --menuitem-image: url("chrome://browser/skin/downloads/downloads.svg"); - } - - #menu_openAddons { - --menuitem-image: url("chrome://mozapps/skin/extensions/extension.svg"); - } - - #sync-setup { - --menuitem-image: url("chrome://browser/skin/fxa/avatar-empty.svg"); - } - - #sync-syncnowitem { - --menuitem-image: url("chrome://browser/skin/sync.svg"); - } - - #webDeveloperMenu, - #browserToolsMenu { - --menuitem-image: url("../icons/developer.svg"); - } - - #menu_pageInfo { - --menuitem-image: url("../icons/document-endnote.svg"); - } - - /* menuWebDeveloperPopup sub menu */ - #menu_devToolbox { - /* checkbox */ - --menuitem-image: url("../icons/developer.svg"); - } - - #menu_taskManager { - --menuitem-image: url("../icons/performance.svg"); - } - - #menu_devtools_remotedebugging { - --menuitem-image: url("../icons/bug.svg"); - } - - #menu_browserToolbox { - --menuitem-image: url("../icons/window-dev-tools.svg"); - } - - #menu_browserContentToolbox { - --menuitem-image: url("../icons/command-frames.svg"); - } - - #menu_browserConsole { - --menuitem-image: url("chrome://devtools/skin/images/command-console.svg"); - } - - #menu_responsiveUI { - /* checkbox */ - --menuitem-image: url("../icons/command-responsivemode.svg"); - } - - #menu_eyedropper { - /* checkbox */ - --menuitem-image: url("chrome://devtools/skin/images/command-eyedropper.svg"); - } - - #menu_pageSource { - --menuitem-image: url("../icons/document-search.svg"); - } - - #extensionsForDevelopers { - --menuitem-image: url("chrome://devtools/skin/images/debugging-addons.svg"); - } - - /*= windowPopup ==============================================================*/ - #windowPopup > menuitem[command="minimizeWindow"] { - --menuitem-image: url("../icons/arrow-between-down.svg"); - } - #windowPopup > menuitem[command="zoomWindow"] { - --menuitem-image: url("../icons/auto-fit-width.svg"); - } - - /*= menu_HelpPopup ===========================================================*/ - #menu_openHelp { - --menuitem-image: url("chrome://global/skin/icons/help.svg"); - } - - #feedbackPage { - --menuitem-image: url("../icons/send.svg"); - } - - #helpSafeMode { - --menuitem-image: url("chrome://devtools/skin/images/debugging-workers.svg"); - } - - #troubleShooting { - --menuitem-image: url("chrome://global/skin/icons/more.svg"); - } - - #help_reportSiteIssue { - --menuitem-image: url("chrome://global/skin/icons/lightbulb.svg"); - } - - #menu_HelpPopup_reportPhishingtoolmenu { - --menuitem-image: url("chrome://global/skin/icons/warning.svg"); - } - - #aboutName { - --menuitem-image: url("chrome://global/skin/icons/info.svg"); - } - } -} -/** Libray Menu ***************************************************************/ -@supports -moz-bool-pref("userChrome.icon.library") { - @supports -moz-bool-pref("userChrome.icon.menu") { - /*= organizeButtonPopup ======================================================*/ - #newbookmark { - --menuitem-image: url("chrome://browser/skin/bookmark.svg"); - } - - #newfolder { - --menuitem-image: url("chrome://global/skin/icons/folder.svg"); } @supports -moz-bool-pref("userChrome.icon.library") { + /*= organizeButtonPopup ======================================================*/ + #newbookmark { + --menuitem-image: url("chrome://browser/skin/bookmark.svg"); + } #newfolder { - --menuitem-image: url("../icons/folder.svg"); + --menuitem-image: url("chrome://global/skin/icons/folder.svg"); + } + @supports -moz-bool-pref("userChrome.icon.library") { + #newfolder { + --menuitem-image: url("../icons/folder.svg"); + } + } + #newseparator { + --menuitem-image: url("../icons/vertical-line.svg"); + } + #orgUndo { + --menuitem-image: url("../icons/undo.svg"); + } + #orgCut { + --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); + } + #orgCopy { + --menuitem-image: url("../icons/edit-copy.svg"); + } + #orgPaste { + --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); + } + #orgDelete { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + #orgSelectAll { + --menuitem-image: url("../icons/select-all-on.svg"); + } + #orgClose { + --menuitem-image: url("chrome://global/skin/icons/close.svg"); + } + /*= viewMenuPopup ============================================================*/ + #viewColumns { + --menuitem-image: url("chrome://global/skin/icons/columnpicker.svg"); + } + #viewSort { + --menuitem-image: url("../icons/text-sort-ascending.svg"); + } + /*= maintenanceButtonPopup ===================================================*/ + #backupBookmarks { + --menuitem-image: url("chrome://devtools/skin/images/datastore.svg"); + } + #fileImport { + --menuitem-image: url("../icons/toolbarButton-download.svg"); + } + #fileExport { + --menuitem-image: url("chrome://browser/skin/open.svg"); + } + #browserImport { + --menuitem-image: url("chrome://browser/skin/import.svg"); } } - - #newseparator { - --menuitem-image: url("../icons/vertical-line.svg"); + } + /** Waterfox ******************************************************************/ + @supports -moz-bool-pref("userChrome.icon.panel") { + #appMenu-restart-button { + list-style-image: url("../icons/refresh-cw.svg") !important; } - - #orgUndo { - --menuitem-image: url("../icons/undo.svg"); + } + @supports -moz-bool-pref("userChrome.icon.menu") { + #menu_FileRestartItem { + --menuitem-image: url("../icons/refresh-cw.svg"); } - - #orgCut { - --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); + menuitem.privatetab-icon { + --menuitem-image: url("../icons/private-favicon.svg"); } - - #orgCopy { - --menuitem-image: url("../icons/edit-copy.svg"); + } + /** Tor Browser ***************************************************************/ + @supports -moz-bool-pref("userChrome.icon.panel") { + #appMenuNewIdentity { + list-style-image: url("chrome://browser/skin/new_identity.svg"); } - - #orgPaste { - --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); + #appMenuNewCircuit { + list-style-image: url("chrome://browser/skin/new_circuit.svg"); } - - #orgDelete { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + #appMenu_torBrowserUserManual { + list-style-image: url("chrome://browser/skin/onion.svg"); } - - #orgSelectAll { - --menuitem-image: url("../icons/select-all-on.svg"); + } + @supports -moz-bool-pref("userChrome.icon.menu") { + #menu_newIdentity { + --menuitem-image: url("chrome://browser/skin/new_identity.svg"); } - - #orgClose { - --menuitem-image: url("chrome://global/skin/icons/close.svg"); + #menu_newCircuit { + --menuitem-image: url("chrome://browser/skin/new_circuit.svg"); } - - /*= viewMenuPopup ============================================================*/ - #viewColumns { - --menuitem-image: url("chrome://global/skin/icons/columnpicker.svg"); - } - - #viewSort { - --menuitem-image: url("../icons/text-sort-ascending.svg"); - } - - /*= maintenanceButtonPopup ===================================================*/ - #backupBookmarks { - --menuitem-image: url("chrome://devtools/skin/images/datastore.svg"); - } - - #fileImport { - --menuitem-image: url("chrome://browser/skin/save.svg"); - } - - #fileExport { - --menuitem-image: url("chrome://browser/skin/open.svg"); - } - - #browserImport { - --menuitem-image: url("chrome://browser/skin/import.svg"); + #torBrowserUserManual { + --menuitem-image: url("chrome://browser/skin/onion.svg"); } } } -/** Waterfox ******************************************************************/ -@supports -moz-bool-pref("userChrome.icon.panel") { - #appMenu-restart-button { - list-style-image: url("../icons/refresh-cw.svg") !important; - } -} -@supports -moz-bool-pref("userChrome.icon.menu") { - #menu_FileRestartItem { - --menuitem-image: url("../icons/refresh-cw.svg"); - } - - menuitem.privatetab-icon { - --menuitem-image: url("../icons/private-favicon.svg"); - } -} -@supports -moz-bool-pref("userChrome.theme.fully_color") { - /* New Folder Button */ - #editBMPanel_newFolderButton { - appearance: none; - border: 0; - border-radius: 4px; - background-color: var(--button-bgcolor); - color: var(--button-color, inherit); - font-weight: 600; - min-width: 0; - padding: 8px 16px; - /* This button is deeper in the visual hierarchy than others (notably the - buttons at the bottom of the panel), so it should be slightly smaller. */ - font-size: 90%; - /* This button needs to align with the tree above it. */ - margin-inline-start: 4px; - } - #editBMPanel_newFolderButton:hover { - background-color: var(--button-hover-bgcolor); - } - #editBMPanel_newFolderButton:hover:active { - background-color: var(--button-active-bgcolor); - } -} -/** Tor Browser ***************************************************************/ -@supports -moz-bool-pref("userChrome.icon.panel") { - #appMenuNewIdentity { - list-style-image: url("chrome://browser/skin/new_identity.svg"); - } - - #appMenuNewCircuit { - list-style-image: url("chrome://browser/skin/new_circuit.svg"); - } - - #appMenu_torBrowserUserManual { - list-style-image: url("chrome://browser/skin/onion.svg"); - } -} -@supports -moz-bool-pref("userChrome.icon.menu") { - #menu_newIdentity { - --menuitem-image: url("chrome://browser/skin/new_identity.svg"); - } - - #menu_newCircuit { - --menuitem-image: url("chrome://browser/skin/new_circuit.svg"); - } - - #torBrowserUserManual { - --menuitem-image: url("chrome://browser/skin/onion.svg"); - } -} diff --git a/css/leptonContent.css b/css/leptonContent.css index 10cf40b..18ebc63 100644 --- a/css/leptonContent.css +++ b/css/leptonContent.css @@ -4,35 +4,24 @@ /* Control Bar Size */ @supports -moz-bool-pref("userContent.player.size") { #controlsContainer { - --controlBar-height: 40px; - /* Original: 40px, Replace to this value */ + --controlBar-height: 40px; /* Original: 40px, Replace to this value */ } #controlsContainer .touch { - --button-size: 48px !important; - /* Original: 40px */ - --controlBar-height: 52px; - /* Original: 52px */ + --button-size: 48px !important; /* Original: 40px */ + --controlBar-height: 52px; /* Original: 52px */ } #controlsContainer .controlBar { - height: var(--controlBar-height) !important; - /* Original: 40px */ + height: var(--controlBar-height) !important; /* Original: 40px */ } - .videocontrols[inDOMFullscreen] #controlsContainer { - --button-size: 64px !important; - /* Original: 30px */ - --track-size: 6px !important; - /* Original: 5px, Touch: 7px */ - --thumb-size: 15px !important; - /* Original: 13px, Touch: 16px */ - --controlBar-height: 64px; - /* Original: 40px */ + --button-size: 64px !important; /* Original: 30px */ + --track-size: 6px !important; /* Original: 5px, Touch: 7px */ + --thumb-size: 15px !important; /* Original: 13px, Touch: 16px */ + --controlBar-height: 64px; /* Original: 40px */ } .videocontrols[inDOMFullscreen] #controlsContainer .touch { - --button-size: 72px !important; - /* Original: 40px */ - --controlBar-height: 64px; - /* Original: 52px */ + --button-size: 72px !important; /* Original: 40px */ + --controlBar-height: 64px; /* Original: 52px */ } .videocontrols[inDOMFullscreen] #controlsContainer .controlBar { padding-bottom: 8px !important; @@ -41,10 +30,8 @@ /* Control Bar UI */ @supports -moz-bool-pref("userContent.player.ui") { audio { - --duration-color: #929292; - /* Like Original */ - --media-background: rgba(26, 26, 26, 0.8); - /* Like Original */ + --duration-color: #929292; /* Like Original */ + --media-background: rgba(26, 26, 26, 0.8); /* Like Original */ border-radius: 8px; --box-shadow1: rgba(14, 13, 26, 0.12); --box-shadow2: rgba(7, 48, 114, 0.12); @@ -59,28 +46,22 @@ --box-shadow3: rgba(82, 82, 94, 0.04); } } - video { --duration-color: #eee; --media-background: linear-gradient(transparent, rgba(26, 26, 26, 0.85)); } @media (prefers-contrast) { video { - --duration-color: #929292; - /* Like Original */ - --media-background: rgba(26, 26, 26, 0.8); - /* Like Original */ + --duration-color: #929292; /* Like Original */ + --media-background: rgba(26, 26, 26, 0.8); /* Like Original */ } } - #controlsContainer .controlBar { background: var(--media-background) !important; } #controlsContainer .duration { - color: var(--duration-color) !important; - /* Original: #929292 */ + color: var(--duration-color) !important; /* Original: #929292 */ } - @supports -moz-bool-pref("userContent.player.ui.twoline") { audio { /* #controlsContainer .controlBar */ @@ -103,20 +84,17 @@ /* Others */ --button-outside-margin: 0; } - video { /* #scrubber .scrubber::-moz-range-thumb */ --scrubber-thumb-scale: 0; - --scrubber-thumb-color: #48a0f7; - /* Color as hover, Prevent flashing */ + --scrubber-thumb-color: #48a0f7; /* Color as hover, Prevent flashing */ /* .progressBar::-moz-progress-bar */ --progressBar-scale: 0.65; /* #controlsContainer .controlBar */ --controlBar-flex-wrap: wrap; --controlBar-justify-content: space-between; --controlBar-align-content: space-around; - --controlBar-padding-inline: 0 !important; - /* Original: 9px */ + --controlBar-padding-inline: 0 !important; /* Original: 9px */ /* #controlsContainer .scrubberStack */ /* .scrubberStack - Vertical */ --scrubberStack-order: -1; @@ -132,29 +110,24 @@ --duration-color: #dadada; --button-outside-margin: 9px; } - .scrubber:not(:hover)::-moz-range-thumb { transform: scale(var(--scrubber-thumb-scale, 1)); background-color: var(--scrubber-thumb-color, currentColor) !important; } - .progressStack { transform-origin: bottom; transform: scaleY(var(--progressBar-scale, 1)); } - .scrubber:hover::-moz-range-thumb, .progressContainer:hover .progressStack { transform: scale(1); } - #controlsContainer .controlBar { flex-wrap: var(--controlBar-flex-wrap); justify-content: var(--controlBar-justify-content); align-content: var(--controlBar-align-content); height: calc(var(--controlBar-height) + var(--controlBar-twoline-more-height, var(--thumb-size))) !important; - padding-inline: var(--controlBar-padding-inline) !important; - /* Original: 9px */ + padding-inline: var(--controlBar-padding-inline) !important; /* Original: 9px */ } #controlsContainer .scrubberStack { /* Vertical */ @@ -171,11 +144,9 @@ margin-left: var(--positionDurationBox-margin-left); text-align: var(--positionDurationBox-text-align) !important; } - #playButton { margin-left: var(--button-outside-margin) !important; } - #fullscreenButton { margin-right: var(--button-outside-margin) !important; } @@ -206,8 +177,7 @@ } #controlsContainer .controlsSpacerStack:hover > .clickToPlay:hover { opacity: 1 !important; - fill: #48a0f7 !important; - /* color as .scrubber */ + fill: #48a0f7 !important; /* color as .scrubber */ } } /* Animation */ @@ -229,13 +199,11 @@ opacity: 0.55; transition: opacity 150ms ease 50ms; } - /* Two line Control Bar */ .scrubber::-moz-range-thumb, .progressStack { transition: transform 0.1s cubic-bezier(0, 0, 0.2, 1); } - /* Click to play */ #controlsContainer .clickToPlay { transition: opacity 150ms ease-in-out, fill 150ms ease-in-out; @@ -253,10 +221,13 @@ body[style*="--newtab-background-color: rgba(43, 42, 51, 1);"], body[style*="--newtab-background-color: rgb(43, 42, 51);"] { /* inner */ - --newtab-focus-border: rgba(0, 221, 255, 0.5) !important; - /* Original: #B5D3FF, Better color-mix(in srgb, #B5D3FF 70%, transparent) */ - --newtab-focus-border-selected: var(--newtab-focus-border) !important; - /* Original: #B5D3FF */ + --newtab-focus-border: rgba( + 0, + 221, + 255, + 0.5 + ) !important; /* Original: #B5D3FF, Better color-mix(in srgb, #B5D3FF 70%, transparent) */ + --newtab-focus-border-selected: var(--newtab-focus-border) !important; /* Original: #B5D3FF */ /* For Nightly */ --newtab-primary-action-background: var(--newtab-focus-border) !important; } @@ -271,53 +242,46 @@ } } } - } - /** Activity Stream - Menu Icons ********************************************/ + } /** Activity Stream - Menu Icons ********************************************/ @supports -moz-bool-pref("userChrome.icon.context_menu") { .context-menu-list .context-menu-item button { padding-inline-start: 0 !important; } - .context-menu-list .context-menu-item button span { - padding-inline-start: 24px; - /* 16p + (4px * 2) */ - -moz-context-properties: fill, fill-opacity !important; + /* Color */ + -moz-context-properties: fill, fill-opacity, stroke !important; fill: currentColor !important; /* Layout */ - background-size: 16px; - background-repeat: no-repeat; + background-size: 16px !important; + background-repeat: no-repeat !important; background-image: var(--menuitem-image); - background-position: left 4px center; + padding-inline-start: 24px; /* 16p + (4px * 2) */ + background-position: var(--uc-menu-background-position, left) 4px center; + } + .context-menu-list .context-menu-item button span:dir(rtl) { + --uc-menu-background-position: right; } - .context-menu-item span[data-l10n-id="newtab-menu-pin"] { --menuitem-image: url("../icons/pin-tab.svg"); } - .context-menu-item span[data-l10n-id="newtab-menu-unpin"] { --menuitem-image: url("../icons/unpin-tab.svg"); } - .context-menu-item span[data-l10n-id="newtab-menu-edit-topsites"] { --menuitem-image: url("chrome://global/skin/icons/edit.svg"); } - .context-menu-item span[data-l10n-id="newtab-menu-bookmark"] { --menuitem-image: url("chrome://browser/skin/bookmark.svg"); } - .context-menu-item span[data-l10n-id="newtab-menu-remove-bookmark"] { --menuitem-image: url("chrome://browser/skin/bookmark-hollow.svg"); } - .context-menu-item span[data-l10n-id="newtab-menu-save-to-pocket"] { --menuitem-image: url("../icons/pocket-outline.svg"); } - .context-menu-item span[data-l10n-id="newtab-menu-open-file"] { --menuitem-image: url("../icons/fluid.svg"); } - .context-menu-item span[data-l10n-id="newtab-menu-show-file"] { --menuitem-image: url("chrome://global/skin/icons/folder.svg"); } @@ -326,19 +290,15 @@ --menuitem-image: url("../icons/folder.svg"); } } - .context-menu-item span[data-l10n-id="newtab-menu-open-new-window"] { --menuitem-image: url("chrome://browser/skin/window.svg"); } - .context-menu-item span[data-l10n-id="newtab-menu-open-new-private-window"] { --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg"); } - .context-menu-item span[data-l10n-id="newtab-menu-dismiss"] { --menuitem-image: url("chrome://global/skin/icons/delete.svg"); } - .context-menu-item span[data-l10n-id="newtab-menu-delete-history"] { --menuitem-image: url("../icons/eraser.svg"); } @@ -349,10 +309,8 @@ overflow: hidden; } .top-site-outer .tile .icon-wrapper { - width: 100% !important; - /* Original: 48px */ - height: 100% !important; - /* Original: 48px */ + width: 100% !important; /* Original: 48px */ + height: 100% !important; /* Original: 48px */ } } /** Activity Stream - Animate ***********************************************/ @@ -361,7 +319,6 @@ :root { --animation-easing-function: cubic-bezier(0.07, 0.95, 0, 1); } - /* Background */ .top-site-outer, #searchSubmit, @@ -375,18 +332,15 @@ button.close-button:hover { transition: background 0.5s var(--animation-easing-function); } - /* Search Bar */ .search-inner-wrapper input { transition: 1s var(--animation-easing-function); transition-property: border-color, box-shadow; } - .search-wrapper .search-inner-wrapper:active input, .search-wrapper input:focus { transition: border-color 0.5s var(--animation-easing-function), box-shadow 1s var(--animation-easing-function); } - @supports -moz-bool-pref("userContent.page.field_border") { .search-wrapper .search-inner-wrapper:hover input { border-color: var(--newtab-primary-action-background) !important; @@ -404,7 +358,6 @@ .body-wrapper.on > .discovery-stream.ds-layout { flex-basis: 100%; } - .body-wrapper.on > .collapsible-section[data-section-id="topstories"], .home-section > #pocket-section, .home-section > .divider, @@ -413,11 +366,10 @@ } } /** Activity Stream - Home Search Bar looks like proton *********************/ - @supports -moz-bool-pref("userContent.newTab.animate") { + @supports -moz-bool-pref("userContent.newTab.searchbar") { /* Dropdown Colors */ #root { - --newtab-search-background-color: rgba(255, 255, 255, 1); - /* Same as light theme's --panel-background */ + --newtab-search-background-color: rgba(255, 255, 255, 1); /* Same as light theme's --panel-background */ /* Set search dropdown background */ --newtab-search-dropdown-header-color: var(--newtab-search-background-color) !important; --newtab-search-dropdown-color: var(--newtab-search-background-color) !important; @@ -426,22 +378,18 @@ @media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) { #root { /* Default Dark Mode */ - --newtab-search-background-color: rgba(66, 65, 77, 1); - /* Same as dark theme's --panel-background */ + --newtab-search-background-color: rgba(66, 65, 77, 1); /* Same as dark theme's --panel-background */ } } - .activity-stream[lwt-sidebar]:not([style*="--newtab-background-color: rgba(43, 42, 51, 1);"]) #root { /* Light weight theme */ --newtab-search-background-color: var(--lwt-sidebar-background-color); } - /* Padding */ #searchSuggestionTable { border-radius: 4px !important; -moz-window-shadow: cliprounded; } - .contentSearchSuggestionTable .contentSearchOneOffItem { width: 32px !important; height: 32px !important; @@ -451,12 +399,9 @@ margin-inline-end: 8px !important; /* Border */ border-radius: 4px !important; - border-image: none !important; - /* Original: linear-gradient(transparent 18%, var(--newtab-border-secondary-color) 18%, var(--newtab-border-secondary-color) 82%, transparent 82%) 1; */ - border-inline-end: none !important; - /* Original: 1px solid; */ + border-image: none !important; /* Original: linear-gradient(transparent 18%, var(--newtab-border-secondary-color) 18%, var(--newtab-border-secondary-color) 82%, transparent 82%) 1; */ + border-inline-end: none !important; /* Original: 1px solid; */ } - #contentSearchSettingsButton::before { content: url("chrome://global/skin/icons/settings.svg") !important; display: -moz-inline-box; @@ -467,13 +412,11 @@ margin-inline-end: 5px; vertical-align: -25%; } - /* Pointer */ .contentSearchSuggestionTable .contentSearchOneOffItem, #contentSearchSettingsButton { cursor: pointer; } - /*- Fix Color For Nightly ------------------------------------------------*/ .contentSearchSuggestionTable, .contentSearchHeaderRow, @@ -482,7 +425,6 @@ color: var(--newtab-text-primary-color) !important; background: var(--newtab-search-background-color) !important; } - .contentSearchSuggestionTable .contentSearchSuggestionRow.selected, .contentSearchSuggestionTable .contentSearchSettingsButton:hover { color: var(--newtab-text-primary-color) !important; @@ -509,30 +451,26 @@ { /* Illustrations Position */ #errorPageContainer, + .neterror > .container, .description-wrapper { min-height: 300px; background-position: left center; background-repeat: no-repeat; background-size: 38%; + background-image: var(--uc-error-llustration); } - #errorPageContainer { display: flex; flex-direction: column; } - .description-wrapper { padding-inline-start: 38%; } - /* Container */ .container { - min-width: var(--in-content-container-min-width); - /* 13em */ - max-width: var(--in-content-container-max-width); - /* 52em */ + min-width: var(--in-content-container-min-width); /* 13em */ + max-width: var(--in-content-container-max-width); /* 52em */ } - /* Text Position */ #text-container { margin: auto; @@ -541,36 +479,41 @@ } @-moz-document url-prefix("about:neterror?e=connectionFailure"), url-prefix("about:neterror?e=netInterrupt"), - url-prefix("about:neterror?e=netTimeout"), url-prefix("about:neterror?e=netReset"), + url-prefix("about:neterror?e=netTimeout"), url-prefix("about:neterror?e=netOffline"), url("about:restartrequired"), url("chrome://browser/content/aboutRestartRequired.xhtml") { - #errorPageContainer { - background-image: url("../icons/error-connection-failure.svg"); + :root { + --uc-error-llustration: url(../icons/error-connection-failure.svg); } } @-moz-document url-prefix("about:neterror?e=dnsNotFound") { - #errorPageContainer { - background-image: url("../icons/error-server-not-found.svg"); + :root { + --uc-error-llustration: url(../icons/error-server-not-found.svg); } } - @-moz-document url-prefix("about:neterror?e=malformedURI") { - #errorPageContainer { - background-image: url("chrome://browser/skin/illustrations/error-malformed-url.svg"); + @-moz-document url-prefix("about:neterror?e=blockedByPolicy"), + url-prefix("about:neterror?e=deniedPortAccess"), + url-prefix("about:neterror?e=malformedURI") { + :root { + --uc-error-llustration: url(chrome://browser/skin/illustrations/error-malformed-url.svg); } } @-moz-document url-prefix("about:neterror?e=clockSkewError"), url-prefix("about:neterror?e=nssFailure") { - #errorPageContainer { - background-image: url("../icons/blue-berror.svg"); + :root { + --uc-error-llustration: url(../icons/blue-berror.svg); + } + #errorPageContainer, + .neterror > .container { background-size: 18.5em; } } @-moz-document url("about:sessionrestore"), url("chrome://browser/content/aboutSessionRestore.xhtml") { - .description-wrapper { - background-image: url("../icons/error-session-restore.svg"); + :root { + --uc-error-llustration: url(../icons/error-session-restore.svg); } } @-moz-document url-prefix("about:neterror?e=fileNotFound") { @@ -627,8 +570,7 @@ --in-content-text-color: var(--in-content-page-color); --in-content-deemphasized-text: rgb(91, 91, 102); --in-content-box-background: #fff; - --in-content-box-background-odd: rgba(12, 12, 13, 0.05); - /* grey 90 a05 */ + --in-content-box-background-odd: rgba(12, 12, 13, 0.05); /* grey 90 a05 */ --in-content-box-border-color: color-mix(in srgb, currentColor 41%, transparent); --in-content-box-info-background: #f0f0f4; --in-content-item-hover: color-mix(in srgb, var(--in-content-primary-button-background) 20%, transparent); @@ -646,7 +588,7 @@ --in-content-link-color-hover: var(--blue-70); --in-content-link-color-active: var(--blue-80); --in-content-link-color-visited: var(--blue-60); - /* button background states are also used for checkboxes and radiobuttons */ + /* button background states are also used for checkboxes and radio buttons */ --in-content-button-text-color: var(--in-content-text-color); --in-content-button-text-color-hover: var(--in-content-text-color); --in-content-button-background: rgba(207, 207, 216, 0.33); @@ -667,13 +609,16 @@ --in-content-button-horizontal-padding: 15px; --in-content-button-vertical-padding: 7px; --in-content-table-background: #f8f8fa; - --in-content-table-border-color: var(--in-content-box-border-color); - /* Legacy: #d1d1d1; rgba(249, 249, 250, 0.2) */ + --in-content-table-border-color: var( + --in-content-box-border-color + ); /* Legacy: #d1d1d1; rgba(249, 249, 250, 0.2) */ --in-content-table-border-dark-color: var(--in-content-table-border-color); - --in-content-table-header-background: var(--in-content-primary-button-background); - /* Legacy: #0a84ff; rgb(5, 64, 150); */ - --in-content-table-header-color: var(--in-content-primary-button-text-color); - /* Legacy: #ffffff; var(--in-content-page-color); */ + --in-content-table-header-background: var( + --in-content-primary-button-background + ); /* Legacy: #0a84ff; rgb(5, 64, 150); */ + --in-content-table-header-color: var( + --in-content-primary-button-text-color + ); /* Legacy: #ffffff; var(--in-content-page-color); */ --in-content-sidebar-width: 240px; --dialog-warning-text-color: var(--red-60); --checkbox-border-color: var(--in-content-box-border-color); @@ -722,7 +667,6 @@ --card-outline-color: var(--grey-30); --card-shadow-hover: var(--card-shadow), 0 0 0 5px var(--card-outline-color); } - @media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) { :host, :root { @@ -793,12 +737,9 @@ darken(#0060df, 15.5%): #003e90; darken(#0060df, 28.1%): #002250; */ - --blue-20: #b6d6ff; - /* lighten(#0060df, 42%) - rgb(182, 214, 255), Add for link active color*/ - --blue-30: #74c0ff; - /* rgb(116, 192, 255), Add for active color */ + --blue-20: #b6d6ff; /* lighten(#0060df, 42%) - rgb(182, 214, 255), Add for link active color*/ + --blue-30: #74c0ff; /* rgb(116, 192, 255), Add for active color */ } - :host, :root { --in-content-primary-button-text-color: var(--in-content-page-color) !important; @@ -823,14 +764,17 @@ :host, :root { --in-content-primary-button-text-color: AccentColorText !important; - --in-content-primary-button-background: Highlight !important; - --in-content-primary-button-background-hover: color-mix(in srgb, black 10%, Highlight) !important; - --in-content-primary-button-background-active: color-mix(in srgb, black 20%, Highlight) !important; + --in-content-primary-button-background: AccentColor !important; + --in-content-primary-button-background-hover: color-mix(in srgb, black 10%, AccentColor) !important; + --in-content-primary-button-background-active: color-mix(in srgb, black 20%, AccentColor) !important; } @supports -moz-bool-pref("userChrome.compatibility.accent_color") { :host, :root { - --in-content-primary-button-text-color: -moz-accent-color-foreground !important; + --in-content-primary-button-text-color: HighlightText !important; + --in-content-primary-button-background: Highlight !important; + --in-content-primary-button-background-hover: color-mix(in srgb, black 10%, Highlight) !important; + --in-content-primary-button-background-active: color-mix(in srgb, black 20%, Highlight) !important; } } } @@ -849,7 +793,6 @@ color: var(--in-content-page-color) !important; background: var(--in-content-page-background) !important; } - /* Text */ input, textarea, @@ -876,7 +819,6 @@ .blogpost-nav * { color: var(--in-content-text-color) !important; } - .AutoSearchInput-suggestions-item:is(:active, :focus, :hover), .AutoSearchInput-suggestions-item--highlighted, .SecondaryHero-message-link, @@ -913,7 +855,6 @@ .blogpost-nav-next:hover p { color: var(--in-content-link-color) !important; } - .SearchResult--meta-section, .MetadataCard-title, .MetadataCard-title a, @@ -941,11 +882,9 @@ .PromotedBadge-label--line { color: var(--in-content-deemphasized-text) !important; } - .PromotedBadge-label--recommended { color: color-mix(in srgb, #712b00 15%, #ff9400) !important; } - /* Background */ .Button--action, .DevHub-Navigation ul li.DevHub-Navigation-Register .Button, @@ -953,7 +892,6 @@ color: var(--in-content-primary-button-text-color) !important; background: var(--in-content-primary-button-background) !important; } - select, .Select, .Button--primary, @@ -963,25 +901,21 @@ .AMInstallButton .AMInstallButton-loading-button { background-color: var(--in-content-button-background) !important; } - .Button--primary:hover, .Button--neutral.Button--micro:not(.Button--disabled):hover, .Button--neutral:not(.Button--disabled):hover, .Notice-button:hover { background: var(--in-content-button-background-hover) !important; } - .Button--action.Button--micro:not(.Button--disabled):hover, .Button--action:not(.Button--disabled):hover, .DevHub-Navigation ul li.DevHub-Navigation-Register .Button:hover, .DevHub-MyAddons-item-buttons-submit .Button:hover { background: var(--in-content-primary-button-background-hover) !important; } - .ShowMoreCard-contents::after { - background: linear-gradient(rgba(255, 255, 255, 0), var(--in-content-table-background)) !important; + background: linear-gradient(hsla(0deg, 0%, 100%, 0), var(--in-content-table-background)) !important; } - input, textarea, .AutoSearchInput-query, @@ -1003,11 +937,9 @@ .blogpost-nav * { background: var(--in-content-table-background) !important; } - .Paginate .Button.Paginate-item:is(:active, :hover) { background: var(--in-content-button-background-hover) !important; } - .Notice-generic, .Notice-genericWarning { background: color-mix( @@ -1016,64 +948,51 @@ var(--in-content-table-background) ) !important; } - .LanguageTools-header-row { color: var(--in-content-table-header-color) !important; background: var(--in-content-table-header-background) !important; } - .LanguageTools-table.responsiveTable tbody tr:nth-child(2n) { background-color: var(--in-content-box-background-odd) !important; } - /* Fill */ .Icon-arrow-blue.SearchSuggestion-icon-arrow { filter: hue-rotate(330deg) brightness(1.3) !important; } - .SecondaryHero-module-icon { filter: invert(85%) !important; } - .Icon-magnifying-glass, .Notice-icon { filter: invert(65%) !important; } - .PermissionsCard-learn-more .Icon, .Permission .Icon { filter: invert(100%) !important; } - .Icon-heart { filter: brightness(0) !important; } - /* Others */ .DropdownMenu-items { box-shadow: 0 0 2px var(--in-content-border-color) !important; } - input, textarea, select { border-color: var(--in-content-box-border-color) !important; } - .UserProfileEdit input:disabled, .UserProfileEdit textarea:disabled { background-color: var(--in-content-box-background-odd) !important; } - .AutoSearchInput-query { border: 1px solid var(--in-content-table-background) !important; } - .AutoSearchInput-query:is(:hover, :focus), .UserProfileEditNotifications .UserProfileEditNotification-input:checked ~ .UserProfileEditNotification-checkbox { border-color: var(--in-content-primary-button-background) !important; } - .UserProfileEdit input:focus, .UserProfileEdit textarea:focus, .AutoSearchInput-query:focus, @@ -1081,31 +1000,25 @@ box-shadow: inset 0 0 0 1px var(--in-content-primary-button-background), 0 0 0 1px var(--in-content-primary-button-background), 0 0 0 4px rgba(0, 211, 255, 0.3) !important; } - .PromotedBadge-link--line { border-color: var(--in-content-deemphasized-text) !important; } - .PromotedBadge-link--line:hover { border-color: var(--in-content-button-background-hover) !important; } - .blog-entry-read-more-link { border-color: var(--in-content-link-color) !important; } - .blogpost-nav-arrow-left .cls-1, .blogpost-nav-arrow-right .cls-1 { stroke: var(--in-content-text-color) !important; } - /* /developers/ */ .DevHub-Navigation-Logo > .Logo::before { -moz-context-properties: fill !important; fill: var(--in-content-primary-button-background) !important; background-image: url("../icons/addons-logo.svg") !important; } - .DevHub-Navigation, .DevHub-submit-addon, .DevHub-get-involved, @@ -1113,17 +1026,14 @@ background: var(--in-content-page-background) !important; color: var(--in-content-page-color) !important; } - .DevHub-Footer { background: var(--in-content-box-background) !important; color: var(--in-content-page-color) !important; } - .DevHub-callout-box { background: var(--in-content-box-background-odd) !important; color: var(--in-content-page-color) !important; } - .DevHub-Navigation.scheme-light ul li a, .DevHub-Footer-sections-header, .DevHub-Footer-section h4, @@ -1131,12 +1041,10 @@ .DevHub-content-copy h2 { color: var(--in-content-page-color) !important; } - .DevHub-content-copy p, .DevHub-callout-box p { color: var(--in-content-deemphasized-text) !important; } - .DevHub-Banner a, .DevHub-Footer a, .DevHub-MyAddons-list a, @@ -1145,7 +1053,6 @@ .DevHub-callout-box a { color: var(--in-content-link-color) !important; } - body:is(.developer-hub, .statistics) { /* Elements */ /* .developer-hub */ @@ -1153,7 +1060,7 @@ /* .developer-hub */ /* Background */ /* Border */ - /* Othres */ + /* Others */ } body:is(.developer-hub, .statistics) #main-wrapper, body:is(.developer-hub, .statistics) .menu-nav > ul > li > ul::after, @@ -1446,11 +1353,9 @@ --focus-shadow: 0 0 0 4px color-mix(in srgb, var(--in-content-primary-button-background) 30%, transparent), 0 0 0 2px var(--in-content-primary-button-background-active); } - .warning { --color-link: rgb(55, 255, 255) !important; } - body, #main-content, #instant-search-content, @@ -1460,24 +1365,19 @@ color: var(--in-content-page-color) !important; background: var(--in-content-page-background) !important; } - #editor { border: 2px solid var(--in-content-border-color) !important; } - .CodeMirror-linenumbers { background: var(--in-content-table-background); } - .CodeMirror-lines { color: var(--in-content-deemphasized-text) !important; background: var(--in-content-page-background) !important; } - .CodeMirror-scroll { background: var(--in-content-page-background) !important; } - /* Text */ .mzp-c-menu-category .mzp-c-menu-title, .mzp-c-menu-item .mzp-c-menu-item-link, @@ -1489,7 +1389,6 @@ .tag-name a { color: var(--in-content-page-color) !important; } - .ts-select-trigger, input[type="date"], input[type="email"], @@ -1510,54 +1409,43 @@ .forum--entry-content .key { color: var(--in-content-deemphasized-text) !important; } - .tag-list a { color: var(--color-marketing-gray-10) !important; } - .tag-list a:hover, .sidebar-nav a:hover { color: var(--color-link) !important; } - .tag-list li { background: var(--in-content-page-color) !important; } - .tag-list li:hover { background: var(--in-content-deemphasized-text) !important; } - #remaining-characters { color: var(--in-content-page-color) !important; } - /* Background */ .sidebar-nav.topics, .sidebar-nav.topics > li { background: var(--in-content-page-background) !important; } - .mzp-c-menu-panel { color: var(--in-content-page-color) !important; background: var(--in-content-page-background) !important; } - .mzp-c-menu-list-list, .mzp-c-menu-list-list:hover { color: var(--in-content-page-color) !important; background: var(--in-content-box-background) !important; } - .mzp-c-menu-list-item:focus, .mzp-c-menu-list-item:hover { background: var(--in-content-button-background-hover) !important; } - .cm-bold { color: var(--in-content-page-color) !important; } - /* Fill */ .sumo-nav--logo, .sumo-nav--search-button, @@ -1574,33 +1462,26 @@ .search-button { filter: invert(95%) !important; } - button.markup-toolbar-button { /*using 0.5 because in middle*/ filter: invert(0.5) !important; } - /* Others */ .support-callouts > .card.is-inverse { background: #20133a !important; } - .support-callouts > .card.is-inverse :is(h1, h2, h3, h4, h5, h6, li, p) { color: var(--in-content-page-color) !important; } - .sumo-button.secondary-button { border-color: transparent !important; } - .mzp-c-menu-panel { border-color: var(--in-content-button-background-hover) !important; } - .mzp-c-menu-item:is(:focus, :hover, :active) .mzp-c-menu-item-link .mzp-c-menu-item-title { border-color: var(--in-content-page-color) !important; } - @media screen and (-moz-toolbar-prefers-color-scheme: dark) and (min-width: 768px), screen and (prefers-color-scheme: dark) and (min-width: 768px) { .mzp-c-menu-panel { @@ -1622,7 +1503,6 @@ color: var(--in-content-page-color) !important; background: var(--in-content-page-background) !important; } - .button.primary-button, .button[type="submit"]:not(.secondary-button), .settings-button.primary-button, @@ -1632,7 +1512,6 @@ color: var(--in-content-primary-button-text-color) !important; background: var(--in-content-primary-button-background) !important; } - /* Text */ header h1, .info, @@ -1642,18 +1521,15 @@ .cta-neutral:hover { color: var(--in-content-page-color) !important; } - #main-content.panel a, .links a, .link-blue, .text-blue-500 { color: var(--in-content-link-color) !important; } - .link-blue:hover { color: var(--in-content-link-color-hover) !important; } - .signed-in-email-message, .verification-email-message, .verification-message, @@ -1665,22 +1541,20 @@ .input-row input[type="tel"], .input-row input[type="text"], .input-row input::placeholder, + .input-text, .firefox-family-services > ul > .firefox-service, .faint, .faint a, .text-grey-400 { color: var(--in-content-deemphasized-text) !important; } - /* Background */ .flex .flex-wrap { background: var(--in-content-page-background); } - .password-row .show-password-label { background-color: unset !important; } - #main-content, .modal, .firefox-family-services, @@ -1689,32 +1563,29 @@ .input-row input[type="password"], .input-row input[type="tel"], .input-row input[type="text"], + .input-text, header, + .card, .bg-white:not(nav) { background: var(--in-content-box-background) !important; } - #suggest-sync, .cta-neutral { background: var(--in-content-button-background) !important; } - .cta-neutral:hover, .bg-grey-50:hover, .hover\:bg-grey-100:hover { background: var(--in-content-button-background-hover) !important; } - .text-blue-500 .cta-neutral, .text-blue-500 .bg-grey-50, .text-blue-500 .hover\:bg-grey-100 { background: var(--in-content-button-background) !important; } - .hover\:bg-grey-200:hover { background: var(--in-content-button-background-active) !important; } - .button.primary-button:hover:enabled, .button[type="submit"]:not(.secondary-button):hover:enabled, .settings-button.primary-button:hover:enabled, @@ -1723,12 +1594,10 @@ button[type="submit"]:not(.secondary-button):hover:enabled { background: var(--in-content-primary-button-background-hover) !important; } - .tooltip, .tooltip::before { background: var(--in-content-danger-button-background) !important; } - /* Fill */ .dismiss, #about-mozilla, @@ -1736,18 +1605,15 @@ footer a[data-testid="link-mozilla"] { filter: invert(95%) !important; } - header button svg, header .rounded svg, #service svg { filter: brightness(15) !important; } - button.relative, #fxa-settings nav svg { filter: brightness(2) !important; } - /* Others */ .input-row input[type="email"], .input-row input[type="number"], @@ -1757,7 +1623,6 @@ .unit-row-hr .border-grey-100 { border-color: var(--in-content-border-color) !important; } - .input-row input[type="email"]:hover, .input-row input[type="number"]:hover, .input-row input[type="password"]:hover, @@ -1765,12 +1630,10 @@ .input-row input[type="text"]:hover { border-color: var(--in-content-border-hover) !important; } - #main-content { box-shadow: 0 12px 18px 2px rgba(249, 249, 250, 0.12), 0 6px 22px 4px rgba(91, 91, 102, 0.12), 0 6px 10px -4px rgba(82, 82, 94, 0.04) !important; } - .input-row input[type="email"]:focus, .input-row input[type="number"]:focus, .input-row input[type="password"]:focus, @@ -1783,8 +1646,7 @@ } /** Fully Proton Mode *********************************************************/ @supports -moz-bool-pref("userContent.page.proton") { - /*= Common contents ==========================================================*/ - /*= abouts' common ===========================================================*/ + /*= Common contents ==========================================================*/ /*= abouts' common ===========================================================*/ @-moz-document url-prefix("about:plugins"), url-prefix("about:cache"), url-prefix("about:checkerboard"), @@ -1800,61 +1662,50 @@ background-color: var(--in-content-page-background) !important; color: var(--in-content-page-color) !important; } - body { font-size: 15px !important; font-weight: normal !important; margin: 0 !important; } - h1 { line-height: 1.2 !important; } - h2 { line-height: 1.4em !important; } - /* Link */ a { color: var(--in-content-link-color) !important; } - a:hover, .text-link:hover { color: var(--in-content-link-color-hover) !important; text-decoration: underline !important; } - a:visited { color: var(--in-content-link-color-visited) !important; } - a:hover:active, .text-link:hover:active { color: var(--in-content-link-color-active) !important; } - a:-moz-focusring, .text-link:-moz-focusring { outline: 2px solid var(--in-content-focus-outline-color) !important; outline-offset: 1px !important; border-radius: 4px !important; } - /* Button */ button { font: inherit; } - button, select, input[type="color"] { appearance: none !important; min-height: 32px !important; color: var(--in-content-button-text-color, inherit) !important; - border: 1px solid transparent !important; - /* shows up in high-contrast mode */ + border: 1px solid transparent !important; /* shows up in high-contrast mode */ border-radius: var(--in-content-button-border-radius) !important; background-color: var(--in-content-button-background) !important; font-weight: 400 !important; @@ -1864,14 +1715,12 @@ /* Ensure font-size isn't overridden by widget styling (e.g. in forms.css) */ font-size: 1em !important; } - button { font-weight: 600 !important; /* Use the same margin of other elements for the alignment */ margin-inline: 4px !important; min-width: 6.3em !important; } - /* Medium and small buttons get sized to 7/14 and 6/12px padding (when adding * the 1px border): */ button.medium { @@ -1880,66 +1729,55 @@ min-height: 28px !important; font-size: 0.95em !important; } - button.small { --in-content-button-vertical-padding: 5px; --in-content-button-horizontal-padding: 11px; min-height: 24px !important; font-size: 0.9em !important; } - ::-moz-focus-inner { border: none !important; } - button:-moz-focusring { box-shadow: none !important; outline: 2px solid var(--in-content-focus-outline-color) !important; outline-offset: 2px !important; } - button:enabled:hover, input[type="color"]:hover { background-color: var(--in-content-button-background-hover) !important; color: var(--in-content-button-text-color-hover) !important; border-color: transparent !important; } - button:enabled:hover:active, input[type="color"]:enabled:hover:active { background-color: var(--in-content-button-background-active) !important; } - button:disabled, input[type="color"]:disabled { opacity: 0.4 !important; } - button[autofocus], button[type="submit"], button.primary { background-color: var(--in-content-primary-button-background) !important; color: var(--in-content-primary-button-text-color) !important; } - button[autofocus]:enabled:hover, button[type="submit"]:enabled:hover, button.primary:enabled:hover { background-color: var(--in-content-primary-button-background-hover) !important; color: var(--in-content-primary-button-text-color-hover) !important; } - button[autofocus]:enabled:hover:active, button[type="submit"]:enabled:hover:active, button.primary:enabled:hover:active { background-color: var(--in-content-primary-button-background-active) !important; } - /* Checkbox */ input[type="checkbox"] { margin-block: 2px !important; } - input[type="checkbox"] { appearance: none !important; height: 16px !important; @@ -1948,18 +1786,14 @@ background-color: var(--checkbox-unchecked-bgcolor) !important; border-radius: 2px !important; margin-inline: 0 6px !important; - flex-shrink: 0 !important; - /* avoid shrinking inside flex container */ + flex-shrink: 0 !important; /* avoid shrinking inside flex container */ } - input[type="checkbox"]:enabled:hover { background-color: var(--checkbox-unchecked-hover-bgcolor) !important; } - input[type="checkbox"]:enabled:hover:active { background-color: var(--checkbox-unchecked-active-bgcolor) !important; } - input[type="checkbox"]:checked { border-color: var(--checkbox-checked-border-color) !important; background-color: var(--checkbox-checked-bgcolor) !important; @@ -1972,15 +1806,12 @@ /* Style the button also when printing with "Print Backgrounds" unchecked */ color-adjust: exact !important; } - input[type="checkbox"]:enabled:checked:hover { background-color: var(--checkbox-checked-hover-bgcolor) !important; } - input[type="checkbox"]:enabled:checked:hover:active { background-color: var(--checkbox-checked-active-bgcolor) !important; } - /* Textarea */ input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]), textarea { @@ -1990,7 +1821,6 @@ color: inherit !important; background-color: var(--in-content-box-background) !important; } - input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]), textarea { font-family: inherit !important; @@ -1998,7 +1828,6 @@ padding: 8px !important; margin: 2px 4px !important; } - input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]):focus, textarea:focus, search-textbox[focused], @@ -2006,24 +1835,19 @@ richlistbox:focus-visible { border-color: transparent !important; outline: 2px solid var(--in-content-focus-outline-color) !important; - outline-offset: -1px !important; - /* Prevents antialising around the corners */ + outline-offset: -1px !important; /* Prevents antialiasing around the corners */ } - input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]):-moz-ui-invalid, textarea:-moz-ui-invalid { border-color: transparent !important; outline: 2px solid var(--in-content-border-invalid) !important; - outline-offset: -1px !important; - /* Prevents antialising around the corners */ + outline-offset: -1px !important; /* Prevents antialiasing around the corners */ } - input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]):disabled, textarea:disabled, search-textbox[disabled="true"] { opacity: 0.4 !important; } - /* Table */ table { width: 100% !important; @@ -2043,7 +1867,6 @@ td { border: 1px solid var(--in-content-table-border-color) !important; } - th { background-color: var(--in-content-table-header-background) !important; color: var(--in-content-table-header-color) !important; @@ -2065,16 +1888,12 @@ /*= View Source ==============================================================*/ @-moz-document url-prefix("view-source") { :root { - background-color: var(--in-content-page-background) !important; - /* Original: white */ - color: var(--in-content-page-color) !important; - /* Original: black */ + background-color: var(--in-content-page-background) !important; /* Original: white */ + color: var(--in-content-page-color) !important; /* Original: black */ /* Colors */ --view-source-green: var(--green-80); - --view-source-purple: #800080; - /* Like alphenglow */ + --view-source-purple: #800080; /* Like alphenglow */ } - @media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) { :root { --view-source-green: var(--green-60); @@ -2083,62 +1902,45 @@ } pre[id]::before, span[id]::before { - color: color-mix(in srgb, var(--in-content-page-color) 70%, var(--in-content-page-background)) !important; - /* Original: #ccc */ + color: color-mix( + in srgb, + var(--in-content-page-color) 70%, + var(--in-content-page-background) + ) !important; /* Original: #ccc */ } - .highlight .start-tag, .highlight .end-tag { - color: var(--view-source-purple) !important; - /* Original: purple */ + color: var(--view-source-purple) !important; /* Original: purple */ } - .highlight .comment { - color: var(--view-source-green) !important; - /* Original: green */ + color: var(--view-source-green) !important; /* Original: green */ } - .highlight .cdata { - color: var(--in-content-border-invalid) !important; - /* Original: #CC0066 */ + color: var(--in-content-border-invalid) !important; /* Original: #CC0066 */ } - .highlight .doctype { - color: #4682b4 !important; - /* Original: steelblue */ + color: #4682b4 !important; /* Original: steelblue */ } - .highlight .pi { - color: orchid !important; - /* Original: orchid */ + color: orchid !important; /* Original: orchid */ } - .highlight .entity { - color: #ff4500 !important; - /* Original: #FF4500 */ + color: #ff4500 !important; /* Original: #FF4500 */ } - .highlight .attribute-name { - color: var(--view-source-green) !important; - /* Original: black */ + color: var(--view-source-green) !important; /* Original: black */ } - .highlight .attribute-value { - color: var(--in-content-link-color) !important; - /* Original: blue */ + color: var(--in-content-link-color) !important; /* Original: blue */ } - .highlight .markupdeclaration { - color: #4682b4 !important; - /* Original: steelblue */ + color: #4682b4 !important; /* Original: steelblue */ } - .highlight .error, .highlight .error > :-moz-any(.start-tag, .end-tag, .comment, .cdata, .doctype, .pi, .entity, .attribute-name, .attribute-value) { - color: var(--in-content-error-text-color) !important; - /* Original: red */ + color: var(--in-content-error-text-color) !important; /* Original: red */ } } /*= Directory View ===========================================================*/ @@ -2147,14 +1949,11 @@ { body { background-color: var(--in-content-box-background) !important; - margin: 4em auto !important; - /* Override to default */ + margin: 4em auto !important; /* Override to default */ } - thead a { color: var(--in-content-page-color) !important; } - td ::before { vertical-align: top !important; } @@ -2171,7 +1970,6 @@ table { padding: 0 !important; } - th, td { padding: 4px !important; @@ -2183,7 +1981,6 @@ #canvas { border: 1px solid var(--in-content-border-color) !important; } - #excludePageFromZoom { vertical-align: bottom !important; } @@ -2195,7 +1992,6 @@ background-color: var(--in-content-box-background) !important; color: var(--in-content-page-color) !important; } - .opsRowLabel input { vertical-align: bottom !important; } @@ -2216,7 +2012,6 @@ .downloadIconShow > .button-box > .button-icon { list-style-image: url("../icons/folder.svg") !important; } - /* Standard Folder - Open */ :-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) .bookmark-item[container="true"]:not([query="true"], [tagContainer], [dayContainer])[open="true"], @@ -2224,7 +2019,6 @@ treechildren::-moz-tree-image(title, container, open) { list-style-image: url("../icons/folder-open.svg") !important; } - /*= Other Folder - Inbox Icon ================================================*/ /* on Menus */ #PlacesToolbar #OtherBookmarks, @@ -2238,7 +2032,6 @@ #editBMPanel_folderMenuList[selectedGuid="unfiled_____"] { list-style-image: url("../icons/mail-inbox-all.svg") !important; } - /* Other Folder - Open */ #PlacesToolbar #OtherBookmarks[open="true"], #BMB_bookmarksPopup #BMB_unsortedBookmarks[open="true"], @@ -2249,37 +2042,31 @@ treechildren::-moz-tree-image(container, open, queryFolder_unfiled_____) { list-style-image: url("../icons/mail-inbox.svg") !important; } - /*= Default Icon - Override ===================================================*/ /* https://github.com/mozilla/gecko-dev/blob/master/browser/themes/shared/places/tree-icons.css */ /* Query */ :-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, query) { list-style-image: url("chrome://browser/skin/places/folder-smart.svg") !important; } - /* History */ :-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, query, dayContainer), :-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_history____v) { list-style-image: url("chrome://browser/skin/history.svg") !important; } - /* Downloads */ :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_downloads__v) { list-style-image: url("chrome://browser/skin/downloads/downloads.svg") !important; } - /* Tag */ :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(title, query, tagContainer), :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_tags_______v) { list-style-image: url("chrome://browser/skin/places/tag.svg") !important; } - - /* Boomark */ + /* Bookmark */ :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_allbms_____v) { list-style-image: url("chrome://browser/skin/bookmark.svg") !important; } - /* Bookmark Toolbar */ #BMB_bookmarksPopup #BMB_bookmarksToolbar, #bookmarksMenuPopup #bookmarksToolbarFolderMenu, @@ -2287,13 +2074,11 @@ treechildren::-moz-tree-image(container, queryFolder_toolbar_____) { list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.svg") !important; } - /* Bookmark Menu */ :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(container, queryFolder_menu________) { list-style-image: url("chrome://browser/skin/places/bookmarksMenu.svg") !important; } - /*= Default Icon - Open ======================================================*/ /* Query */ :-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) @@ -2302,7 +2087,6 @@ > .menu-iconic-icon { transform: rotate(15deg) !important; } - /* History */ :-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, query, open, dayContainer), @@ -2310,7 +2094,6 @@ treechildren::-moz-tree-image(query, open, OrganizerQuery_history____v) { list-style-image: url("../icons/history-reverse.svg") !important; } - /* Tag */ :-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) .bookmark-item[container="true"][tagContainer="true"][open="true"], @@ -2318,12 +2101,10 @@ :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, open, OrganizerQuery_tags_______v) { list-style-image: url("../icons/tag-open.svg") !important; } - - /* Boomark */ + /* Bookmark */ :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, open, OrganizerQuery_allbms_____v) { list-style-image: url("chrome://browser/skin/bookmark-hollow.svg") !important; } - /* Bookmark Toolbar */ #BMB_bookmarksPopup #BMB_bookmarksToolbar[open="true"], #bookmarksMenuPopup #bookmarksToolbarFolderMenu[open="true"], @@ -2331,14 +2112,11 @@ treechildren::-moz-tree-image(container, open, queryFolder_toolbar_____) { list-style-image: url("../icons/bookmarksToolbar-open.svg") !important; } - /* Bookmark Menu */ :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(container, open, queryFolder_menu________) { - list-style-image: url("../icons/bookmarksMenu-open.svg") !important; - /* or bookmarksMenu-open2.svg" */ + list-style-image: url("../icons/bookmarksMenu-open.svg") !important; /* or bookmarksMenu-open2.svg" */ } - /*= Menubar - Icons ==========================================================*/ #organizeButton, #viewMenu, @@ -2347,26 +2125,21 @@ #forward-button, #clearDownloadsButton { fill: currentColor !important; - -moz-context-properties: fill !important; + -moz-context-properties: fill, fill-opacity, stroke !important; } - /* Add */ #organizeButton { list-style-image: url("chrome://global/skin/icons/settings.svg") !important; } - #viewMenu { list-style-image: url("../icons/sort.svg") !important; } - #maintenanceButton { list-style-image: url("../icons/import-export.svg") !important; } - #clearDownloadsButton { list-style-image: url("chrome://global/skin/icons/delete.svg") !important; } - #clearDownloadsButton > .toolbarbutton-icon { display: -moz-inline-box !important; margin-top: 0; @@ -2374,16 +2147,13 @@ margin-inline-start: 0; margin-inline-end: 2px; } - /* Replace */ #back-button { list-style-image: url("chrome://browser/skin/back.svg") !important; } - #forward-button { list-style-image: url("chrome://browser/skin/forward.svg") !important; } - #back-button:-moz-locale-dir(rtl) > .toolbarbutton-icon, #forward-button:-moz-locale-dir(rtl) > .toolbarbutton-icon { transform: scaleX(-1) !important; @@ -2394,14 +2164,11 @@ menupopup menu { padding-block: 4px; } - .menu-right { - width: 16px !important; - /* Original: 1ex */ + width: 16px !important; /* Original: 1ex */ background-image: url("chrome://global/skin/icons/arrow-right.svg"); background-position: right center; } - /*= Proton ===============================================================*/ @supports -moz-bool-pref("userContent.page.proton") { :root { @@ -2428,10 +2195,8 @@ :root { --organizer-color: var(--in-content-page-color); --organizer-deemphasized-color: var(--in-content-deemphasized-text); - --organizer-toolbar-background: rgb(249, 249, 251); - /* --toolbar-bgcolor */ - --organizer-pane-background: rgb(229, 229, 235); - /* --lwt-accent-color */ + --organizer-toolbar-background: rgb(249, 249, 251); /* --toolbar-bgcolor */ + --organizer-pane-background: rgb(229, 229, 235); /* --lwt-accent-color */ --organizer-content-background: var(--in-content-page-background); --organizer-hover-background: var(--in-content-button-background-hover); --organizer-hover-color: var(--organizer-color); @@ -2440,8 +2205,7 @@ --organizer-outline-color: var(--in-content-focus-outline-color); --organizer-separator-color: var(--organizer-pane-field-border-color); --organizer-border-color: var(--in-content-border-color); - --organizer-toolbar-field-background: rgb(240, 240, 244); - /* --lwt-accent-color */ + --organizer-toolbar-field-background: rgb(240, 240, 244); /* --lwt-accent-color */ --organizer-toolbar-field-background-focused: Field; --organizer-toolbar-field-border-color: transparent; --organizer-toolbar-field-focus-border-color: color-mix( @@ -2467,7 +2231,6 @@ } } } - /*- Toolbar & Menus ------------------------------------------------------*/ #placesToolbar { appearance: none !important; @@ -2492,14 +2255,12 @@ #placesToolbar > toolbarbutton:not([disabled]):hover:active { background-color: var(--organizer-selected-background) !important; } - #placesToolbar > toolbarbutton > .toolbarbutton-icon, #placesMenu > menu > image, #placesMenu > menu > .menubar-text { -moz-context-properties: fill !important; fill: currentColor !important; } - #placesMenu { margin-inline-start: 6px !important; } @@ -2522,11 +2283,9 @@ color: var(--organizer-selected-color) !important; } #placesMenu > menu > .menubar-text { - margin-block: 0 !important; - /* override menu.css */ + margin-block: 0 !important; /* override menu.css */ padding-inline-end: 4px !important; } - /*- Search Bar & Input ---------------------------------------------------*/ #searchFilter, #detailsPane html|input { @@ -2539,7 +2298,6 @@ padding-block: 2px !important; min-height: 24px !important; } - #searchFilter[focused] { box-shadow: var(--organizer-toolbar-field-focus-box-shadow) !important; background-color: var(--organizer-toolbar-field-background-focused) !important; @@ -2547,12 +2305,10 @@ outline: 2px solid var(--organizer-toolbar-field-focus-border-color) !important; outline-offset: -2px !important; } - /*- Sidebar & Splitter ---------------------------------------------------*/ #placesList { background-color: var(--organizer-pane-background) !important; } - #placesView > splitter { border: 0 !important; border-inline-end: 1px solid var(--organizer-border-color) !important; @@ -2562,28 +2318,23 @@ margin-inline-start: -3px !important; position: relative !important; } - /*- Downloads Pane -------------------------------------------------------*/ #downloadsRichListBox, #downloadsListBox { color: var(--organizer-color) !important; background-color: var(--organizer-content-background) !important; } - #clearDownloadsButton:focus-visible { outline: 2px solid var(--organizer-outline-color) !important; } - richlistitem[selected="true"], richlistitem:hover { background-color: var(--organizer-hover-background) !important; color: var(--organizer-color) !important; } - richlistbox:where(:focus) > richlistitem[selected="true"] { background-color: var(--organizer-selected-background) !important; } - /*- Tree -----------------------------------------------------------------*/ #contentView treecol { /* Use box-shadow to draw a bottom border instead of border-bottom @@ -2591,12 +2342,10 @@ * aligned with the items on the sidebar. */ box-shadow: inset 0 -1px var(--organizer-border-color) !important; } - tree { background-color: var(--organizer-content-background) !important; color: var(--organizer-color) !important; } - treecol:not([hideheader="true"]), treecolpicker { appearance: none !important; @@ -2605,7 +2354,6 @@ color: var(--organizer-color, inherit) !important; padding: 5px 10px !important; } - treecol:not([hideheader="true"], [sortable="false"]):hover, treecolpicker:hover { background-color: var(--organizer-hover-background) !important; @@ -2615,7 +2363,6 @@ treecolpicker:hover:active { background-color: var(--organizer-selected-background) !important; } - treecol:not([hideheader="true"], :first-child), treecolpicker { padding-left: 10px !important; @@ -2631,13 +2378,11 @@ ) 1 1 !important; } - treecol[sortDirection]:not([hideheader="true"]) > xul|*.treecol-sortdirection { fill: currentColor !important; width: 18px !important; height: 18px !important; } - treechildren::-moz-tree-row { background-color: transparent !important; } @@ -2669,7 +2414,10 @@ treechildren::-moz-tree-separator(selected) { border-color: var(--organizer-selected-color) !important; } - + treechildren::-moz-tree-cell-text(primary, dropOn), + treechildren::-moz-tree-drop-feedback { + background-color: var(--organizer-outline-color) !important; + } /*- Info Box -------------------------------------------------------------*/ #detailsPane { background-color: var(--organizer-pane-background) !important; @@ -2677,7 +2425,6 @@ padding: 5px !important; border-top: 1px solid var(--organizer-border-color) !important; } - #editBookmarkPanelRows .expander-up, #editBookmarkPanelRows .expander-down { appearance: none !important; @@ -2711,14 +2458,12 @@ #editBookmarkPanelRows .expander-down > .button-box { padding: 0 !important; } - #editBookmarkPanelRows .expander-up { list-style-image: url("chrome://global/skin/icons/arrow-up-12.svg"); } #editBookmarkPanelRows .expander-down { list-style-image: url("chrome://global/skin/icons/arrow-down-12.svg"); } - #places input { border: 1px solid var(--organizer-pane-field-border-color) !important; border-radius: 4px !important; @@ -2734,12 +2479,10 @@ #places input:not(:read-write):focus { outline: none !important; } - .caption-label { margin-inline-start: 8px !important; color: var(--organizer-deemphasized-color) !important; } - #editBMPanel_tagsSelectorRow > richlistbox { appearance: none !important; color: var(--organizer-color) !important; @@ -2758,8 +2501,7 @@ background-color: var(--organizer-selected-background) !important; color: var(--organizer-selected-color) !important; } - - /*- Radio Button ---------------------------------------------------------*/ + /*- Radio Button -------------------------------------------------------------*/ menuitem[type="radio"] { /* margin-inline-start: 0 !important; */ appearance: none !important; @@ -2772,12 +2514,10 @@ border-radius: 100% !important; padding: 0 !important; margin-inline: 0 6px !important; - margin-block: 2px !important; - /* extend the vertical clicktarget */ + margin-block: 2px !important; /* extend the vertical clicktarget */ background-color: var(--in-content-button-background) !important; background-position: center !important; - flex-shrink: 0 !important; - /* avoid shrinking inside flex container */ + flex-shrink: 0 !important; /* avoid shrinking inside flex container */ } menuitem[type="radio"] > .menu-iconic-left[checked="true"] > .menu-iconic-icon { -moz-context-properties: fill !important; @@ -2809,15 +2549,13 @@ margin-inline: 0 8px !important; padding-inline-start: 0 !important; } - /* Disabled checkboxes, radios and labels */ menuitem[type="radio"][disabled="true"], menuitem[type="checkbox"][disabled="true"] { color: inherit !important; opacity: 0.5 !important; } - - /*- Check Box ------------------------------------------------------------*/ + /*- Check Box ----------------------------------------------------------------*/ /* From checkbox.css */ menuitem[type="checkbox"] { appearance: none !important; @@ -2832,10 +2570,8 @@ border-radius: 2px !important; color: var(--checkbox-border-color, ThreeDDarkShadow) !important; background-color: var(--checkbox-unchecked-bgcolor, Field) !important; - margin-inline-end: 6px !important; - /* or 2px */ - margin-block: 2px !important; - /* From common.css */ + margin-inline-end: 6px !important; /* or 2px */ + margin-block: 2px !important; /* From common.css */ } menuitem[type="checkbox"] > .menu-iconic-left[checked="true"] > .menu-iconic-icon { -moz-context-properties: fill !important; @@ -2973,8 +2709,7 @@ menuitem[type="checkbox"][disabled="true"] { opacity: 0.4 !important; } - - /*- Menu Separtor --------------------------------------------------------*/ + /*- Menu Separator -----------------------------------------------------------*/ menuseparator { appearance: none !important; min-width: 2px; @@ -3000,73 +2735,14 @@ } } /** Menu - Icons Layout *******************************************************/ -@supports -moz-bool-pref("userChrome.icon.menu") { - @-moz-document url("chrome://browser/content/places/places.xhtml"), +@supports not -moz-bool-pref("userChrome.icon.disabled") { + @supports -moz-bool-pref("userChrome.icon.menu") { + @-moz-document url("chrome://browser/content/places/places.xhtml"), url("about:downloads") { - menupopup menuitem:not([type="checkbox"][checked="true"], [type="radio"]), - menupopup menu:not([type="checkbox"][checked="true"], [type="radio"]) { - -moz-appearance: none !important; - /* Linux: menulist */ - } - - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) - menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) - menu:not(.menu-iconic, .in-menulist, [checked="true"]), - menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) - > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]) { - /* Color */ - -moz-context-properties: fill, fill-opacity !important; - fill: currentColor !important; - /* Layout */ - background-size: 16px !important; - background-repeat: no-repeat !important; - background-image: var(--menuitem-image); - } - - /* For native context menus */ - @supports -moz-bool-pref("widget.macos.native-context-menus") or -moz-bool-pref("widget.gtk.native-context-menus") { - :not(menu, #ContentSelectDropdown) - > menupopup - > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - :not(menu, #ContentSelectDropdown) > menupopup > menu:not(.menu-iconic, .in-menulist, [checked="true"]) { - list-style-image: var(--menuitem-image, url("../icons/blank.svg")) !important; + menupopup menuitem:not([type="checkbox"][checked="true"], [type="radio"]), + menupopup menu:not([type="checkbox"][checked="true"], [type="radio"]) { + -moz-appearance: none !important; /* Linux: menulist */ } - } - - /* Padding */ - :root { - --context-menu-background-padding-default: 5px; - --context-menu-background-padding: var(--context-menu-background-padding-default); - } - - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) - menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) - menu:not(.menu-iconic, .in-menulist, [checked="true"]), - menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) - > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]) { - background-position: left var(--context-menu-background-padding) center !important; - padding-inline-start: var(--context-menu-background-padding) !important; - } - - /* Padding - Windows */ - @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7) { - :root { - --context-menu-background-padding-default: 2px; - } - } - @media (-moz-os-version: windows-win8), (-moz-platform: windows-win8) { - :root { - --context-menu-background-padding-default: 3px; - } - } - @media (-moz-os-version: windows-win7), - (-moz-platform: windows-win7), - (-moz-os-version: windows-win8), - (-moz-platform: windows-win8) { menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) @@ -3074,318 +2750,328 @@ menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]) { - background-position: left var(--context-menu-background-padding) center !important; - padding-inline-start: 0 !important; + /* Color */ + -moz-context-properties: fill, fill-opacity, stroke !important; + fill: currentColor !important; + /* Layout */ + background-size: 16px !important; + background-repeat: no-repeat !important; + background-image: var(--menuitem-image); } - } - @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { - :root { - --context-menu-background-padding: 1em; - --context-menu-text-padding: 24px; - /* 16px + 8px */ - --menu-background-padding-default: calc( - var(--context-menu-background-padding) + var(--context-menu-text-padding) - ); - } - - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) - menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) - menu:not(.menu-iconic, .in-menulist, [checked="true"]), - menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) - > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]) { - padding-inline-start: var(--menu-background-padding-default) !important; - margin-left: 0 !important; - } - } - /* Padding - Linux */ - @media (-moz-gtk-csd-available) { - :root { - --context-menu-background-padding-default: 6px; - } - - /* Contextmenu Checkbox Unset */ - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) menuitem[type="checkbox"] { - margin-inline: 0 !important; - } - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) - menuitem[type="checkbox"] - > .menu-iconic-left - > .menu-iconic-icon { - margin-inline-end: 0 !important; - } - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) - menuitem[type="checkbox"]:not([checked="true"]) - > .menu-iconic-left - > .menu-iconic-icon { - border: none !important; - background-color: unset !important; - } - } - /* Padding - Mac */ - @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { - :root { - --context-menu-background-padding-default: 10px; - --context-menu-mac-padding: 21px; - } - - /* context menu width */ - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) - menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) - menu:not(.menu-iconic, .in-menulist, [checked="true"]) { - padding-inline-end: var(--context-menu-background-padding) !important; - } - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) - menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) - > .menu-text, - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) - menu:not(.menu-iconic, .in-menulist, [checked="true"]) - > .menu-text { - /* text position */ - padding-inline-start: var(--context-menu-mac-padding) !important; - } - - /* Checkbox menuitem, None iconic menu */ - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) menuitem[checked="true"], - menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) menu:not(.menu-iconic) { - padding-inline-start: calc(var(--context-menu-background-padding) + var(--context-menu-mac-padding)) !important; - } - } - /*= Context Menu ===========================================================*/ - @supports -moz-bool-pref("userChrome.icon.context_menu") { - /* Icon lists */ - /*= downloadsContextMenu =====================================================*/ - .downloadPauseMenuItem { - --menuitem-image: url("chrome://global/skin/media/pause-fill.svg"); - } - - .downloadResumeMenuItem { - --menuitem-image: url("chrome://global/skin/media/play-fill.svg"); - } - - .downloadUnblockMenuItem { - --menuitem-image: url("../icons/checkmark-circle.svg"); - } - - .downloadUseSystemDefaultMenuItem { - --menuitem-image: url("chrome://browser/skin/open.svg"); - } - - .downloadAlwaysUseSystemDefaultMenuItem { - /* checkbox */ - --menuitem-image: url("../icons/folder-globe.svg"); - } - - .downloadAlwaysOpenSimilarFilesMenuItem { - /* checkbox */ - --menuitem-image: url("../icons/fluid.svg"); - } - - .downloadShowMenuItem { - --menuitem-image: url("chrome://global/skin/icons/folder.svg"); - } - @supports -moz-bool-pref("userChrome.icon.library") { - .downloadShowMenuItem { - --menuitem-image: url("../icons/folder.svg"); + /* For native context menus */ + @supports -moz-bool-pref("widget.macos.native-context-menus") or -moz-bool-pref("widget.gtk.native-context-menus") { + :not(menu, #ContentSelectDropdown) + > menupopup + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + :not(menu, #ContentSelectDropdown) > menupopup > menu:not(.menu-iconic, .in-menulist, [checked="true"]) { + list-style-image: var(--menuitem-image, url("../icons/blank.svg")) !important; } } - - #downloadsContextMenu > menuitem.downloadOpenReferrerMenuItem, - #downloadsContextMenu > menuitem[command="downloadsCmd_openReferrer"] { - --menuitem-image: url("../icons/link-square.svg"); + /* Padding */ + :root { + --uc-menu-background-position: left; + --context-menu-background-padding-default: 5px; + --context-menu-background-padding: var(--context-menu-background-padding-default); } - #downloadsContextMenu > menuitem.downloadCopyLocationMenuItem, - #downloadsContextMenu > menuitem[command="downloadsCmd_copyLocation"] { - --menuitem-image: url("../icons/link.svg"); + :root:-moz-locale-dir(rtl) { + --uc-menu-background-position: right; } - - .downloadDeleteFileMenuItem { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) + menu:not(.menu-iconic, .in-menulist, [checked="true"]), + menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]) { + background-position: var(--uc-menu-background-position) var(--context-menu-background-padding) center !important; + padding-inline-start: var(--context-menu-background-padding) !important; } - - .downloadRemoveFromHistoryMenuItem { - --menuitem-image: url("../icons/eraser.svg"); + /* Padding - Windows */ + @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7) { + :root { + --context-menu-background-padding-default: 2px; + } } - - #downloadsContextMenu > menuitem[command="downloadsCmd_clearList"], - #downloadsContextMenu > menuitem[command="downloadsCmd_clearDownloads"] { - --menuitem-image: url("../icons/broom.svg"); + @media (-moz-os-version: windows-win8), (-moz-platform: windows-win8) { + :root { + --context-menu-background-padding-default: 3px; + } } - - /*= placeContext =============================================================*/ - #placesContext_open { - --menuitem-image: url("../icons/link-square.svg"); + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8) { + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) + menu:not(.menu-iconic, .in-menulist, [checked="true"]), + menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]) { + background-position: left var(--context-menu-background-padding) center !important; + padding-inline-start: 0 !important; + } } - - #placesContext_openBookmarkContainer\:tabs, - #placesContext_openBookmarkLinks\:tabs { - --menuitem-image: url("../icons/movetowindow-16.svg"); + @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { + :root { + --context-menu-background-padding: 1em; + --context-menu-text-padding: 24px; /* 16px + 8px */ + --menu-background-padding-default: calc( + var(--context-menu-background-padding) + var(--context-menu-text-padding) + ); + } + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) + menu:not(.menu-iconic, .in-menulist, [checked="true"]), + menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) + > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]) { + padding-inline-start: var(--menu-background-padding-default) !important; + margin-left: 0 !important; + } } - - #placesContext_open\:newtab, - #placesContext_openContainer\:tabs, - #placesContext_openLinks\:tabs { - --menuitem-image: url("chrome://browser/skin/new-tab.svg"); + /* Padding - Linux */ + @media (-moz-gtk-csd-available) { + :root { + --context-menu-background-padding-default: 6px; + } + /* Contextmenu Checkbox Unset */ + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) menuitem[type="checkbox"] { + margin-inline: 0 !important; + } + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) + menuitem[type="checkbox"] + > .menu-iconic-left + > .menu-iconic-icon { + margin-inline-end: 0 !important; + } + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) + menuitem[type="checkbox"]:not([checked="true"]) + > .menu-iconic-left + > .menu-iconic-icon { + border: none !important; + background-color: unset !important; + } } - - #placesContext_open\:newcontainertab { - --menuitem-image: url("../icons/container-openin-16.svg"); + /* Padding - Mac */ + @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { + :root { + --context-menu-background-padding-default: 10px; + --context-menu-mac-padding: 21px; + } + /* context menu width */ + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) + menu:not(.menu-iconic, .in-menulist, [checked="true"]) { + padding-inline-end: var(--context-menu-background-padding) !important; + } + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) + menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]) + > .menu-text, + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) + menu:not(.menu-iconic, .in-menulist, [checked="true"]) + > .menu-text { + /* text position */ + padding-inline-start: var(--context-menu-mac-padding) !important; + } + /* Checkbox menuitem, None iconic menu */ + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) menuitem[checked="true"], + menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) menu:not(.menu-iconic) { + padding-inline-start: calc( + var(--context-menu-background-padding) + var(--context-menu-mac-padding) + ) !important; + } } - - #placesContext_open\:newwindow { - --menuitem-image: url("chrome://browser/skin/window.svg"); - } - - #placesContext_open\:newprivatewindow { - --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg"); - } - - #placesContext_show_bookmark\:info, - #placesContext_show\:info, - #placesContext_show_folder\:info { - --menuitem-image: url("chrome://global/skin/icons/edit.svg"); - } - - #placesContext_deleteBookmark, - #placesContext_deleteFolder, - #placesContext_delete, - #placesContext_delete_history { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); - } - - #placesContext_deleteHost { - --menuitem-image: url("../icons/eye-hide.svg"); - } - - #placesContext_sortBy\:name { - --menuitem-image: url("../icons/text-sort-ascending.svg"); - } - - #placesContext_cut { - --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); - } - - #placesContext_copy { - --menuitem-image: url("../icons/edit-copy.svg"); - } - - #placesContext_paste_group { - --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); - } - - #placesContext_new\:bookmark { - --menuitem-image: url("chrome://browser/skin/bookmark.svg"); - } - - #placesContext_showInFolder, - #placesContext_new\:folder { - --menuitem-image: url("chrome://global/skin/icons/folder.svg"); - } - @supports -moz-bool-pref("userChrome.icon.library") { + /*= Context Menu ===========================================================*/ + @supports -moz-bool-pref("userChrome.icon.context_menu") { + /* Icon lists */ + /*= downloadsContextMenu =====================================================*/ + .downloadPauseMenuItem { + --menuitem-image: url("chrome://global/skin/media/pause-fill.svg"); + } + .downloadResumeMenuItem { + --menuitem-image: url("chrome://global/skin/media/play-fill.svg"); + } + .downloadUnblockMenuItem { + --menuitem-image: url("../icons/checkmark-circle.svg"); + } + .downloadUseSystemDefaultMenuItem { + --menuitem-image: url("chrome://browser/skin/open.svg"); + } + .downloadAlwaysUseSystemDefaultMenuItem { + /* checkbox */ + --menuitem-image: url("../icons/folder-globe.svg"); + } + .downloadAlwaysOpenSimilarFilesMenuItem { + /* checkbox */ + --menuitem-image: url("../icons/fluid.svg"); + } + .downloadShowMenuItem { + --menuitem-image: url("chrome://global/skin/icons/folder.svg"); + } + @supports -moz-bool-pref("userChrome.icon.library") { + .downloadShowMenuItem { + --menuitem-image: url("../icons/folder.svg"); + } + } + #downloadsContextMenu > menuitem.downloadOpenReferrerMenuItem, + #downloadsContextMenu > menuitem[command="downloadsCmd_openReferrer"] { + --menuitem-image: url("../icons/link-square.svg"); + } + #downloadsContextMenu > menuitem.downloadCopyLocationMenuItem, + #downloadsContextMenu > menuitem[command="downloadsCmd_copyLocation"] { + --menuitem-image: url("../icons/link.svg"); + } + .downloadDeleteFileMenuItem { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + .downloadRemoveFromHistoryMenuItem { + --menuitem-image: url("../icons/eraser.svg"); + } + #downloadsContextMenu > menuitem[command="downloadsCmd_clearList"], + #downloadsContextMenu > menuitem[command="downloadsCmd_clearDownloads"] { + --menuitem-image: url("../icons/broom.svg"); + } + /*= placeContext =============================================================*/ + #placesContext_open { + --menuitem-image: url("../icons/link-square.svg"); + } + #placesContext_openBookmarkContainer\:tabs, + #placesContext_openBookmarkLinks\:tabs { + --menuitem-image: url("../icons/movetowindow-16.svg"); + } + #placesContext_open\:newtab, + #placesContext_openContainer\:tabs, + #placesContext_openLinks\:tabs { + --menuitem-image: url("chrome://browser/skin/new-tab.svg"); + } + #placesContext_open\:newcontainertab { + --menuitem-image: url("../icons/container-openin-16.svg"); + } + #placesContext_open\:newwindow { + --menuitem-image: url("chrome://browser/skin/window.svg"); + } + #placesContext_open\:newprivatewindow { + --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg"); + } + #placesContext_show_bookmark\:info, + #placesContext_show\:info, + #placesContext_show_folder\:info { + --menuitem-image: url("chrome://global/skin/icons/edit.svg"); + } + #placesContext_deleteBookmark, + #placesContext_deleteFolder, + #placesContext_delete, + #placesContext_delete_history { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + #placesContext_deleteHost { + --menuitem-image: url("../icons/eye-hide.svg"); + } + #placesContext_sortBy\:name { + --menuitem-image: url("../icons/text-sort-ascending.svg"); + } + #placesContext_cut { + --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); + } + #placesContext_copy { + --menuitem-image: url("../icons/edit-copy.svg"); + } + #placesContext_paste_group { + --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); + } + #placesContext_new\:bookmark { + --menuitem-image: url("chrome://browser/skin/bookmark.svg"); + } #placesContext_showInFolder, #placesContext_new\:folder { - --menuitem-image: url("../icons/folder.svg"); + --menuitem-image: url("chrome://global/skin/icons/folder.svg"); + } + @supports -moz-bool-pref("userChrome.icon.library") { + #placesContext_showInFolder, + #placesContext_new\:folder { + --menuitem-image: url("../icons/folder.svg"); + } + } + #placesContext_new\:separator { + --menuitem-image: url("../icons/vertical-line.svg"); + } + #placesContext_paste { + --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); + } + #placesContext_createBookmark { + --menuitem-image: url("chrome://browser/skin/bookmark.svg"); + } + #show-other-bookmarks_PersonalToolbar { + /* checkbox */ + --menuitem-image: url("../icons/star-line-horizontal.svg"); + } + #placesContext_showAllBookmarks { + --menuitem-image: url("chrome://browser/skin/bookmark-star-on-tray.svg"); + } + .openintabs-menuitem { + --menuitem-image: url("../icons/movetowindow-16.svg"); } } - - #placesContext_new\:separator { - --menuitem-image: url("../icons/vertical-line.svg"); - } - - #placesContext_paste { - --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); - } - - #placesContext_createBookmark { - --menuitem-image: url("chrome://browser/skin/bookmark.svg"); - } - - #show-other-bookmarks_PersonalToolbar { - /* checkbox */ - --menuitem-image: url("../icons/star-line-horizontal.svg"); - } - - #placesContext_showAllBookmarks { - --menuitem-image: url("chrome://browser/skin/bookmark-star-on-tray.svg"); - } - - .openintabs-menuitem { - --menuitem-image: url("../icons/movetowindow-16.svg"); - } - } - @supports -moz-bool-pref("userChrome.icon.global_menu") { - /*= organizeButtonPopup ======================================================*/ - #newbookmark { - --menuitem-image: url("chrome://browser/skin/bookmark.svg"); - } - - #newfolder { - --menuitem-image: url("chrome://global/skin/icons/folder.svg"); - } - @supports -moz-bool-pref("userChrome.icon.library") { + @supports -moz-bool-pref("userChrome.icon.global_menu") { + /*= organizeButtonPopup ======================================================*/ + #newbookmark { + --menuitem-image: url("chrome://browser/skin/bookmark.svg"); + } #newfolder { - --menuitem-image: url("../icons/folder.svg"); + --menuitem-image: url("chrome://global/skin/icons/folder.svg"); + } + @supports -moz-bool-pref("userChrome.icon.library") { + #newfolder { + --menuitem-image: url("../icons/folder.svg"); + } + } + #newseparator { + --menuitem-image: url("../icons/vertical-line.svg"); + } + #orgUndo { + --menuitem-image: url("../icons/undo.svg"); + } + #orgCut { + --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); + } + #orgCopy { + --menuitem-image: url("../icons/edit-copy.svg"); + } + #orgPaste { + --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); + } + #orgDelete { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); + } + #orgSelectAll { + --menuitem-image: url("../icons/select-all-on.svg"); + } + #orgClose { + --menuitem-image: url("chrome://global/skin/icons/close.svg"); + } + /*= viewMenuPopup ============================================================*/ + #viewColumns { + --menuitem-image: url("chrome://global/skin/icons/columnpicker.svg"); + } + #viewSort { + --menuitem-image: url("../icons/text-sort-ascending.svg"); + } + /*= maintenanceButtonPopup ===================================================*/ + #backupBookmarks { + --menuitem-image: url("chrome://devtools/skin/images/datastore.svg"); + } + #fileImport { + --menuitem-image: url("../icons/toolbarButton-download.svg"); + } + #fileExport { + --menuitem-image: url("chrome://browser/skin/open.svg"); + } + #browserImport { + --menuitem-image: url("chrome://browser/skin/import.svg"); } - } - - #newseparator { - --menuitem-image: url("../icons/vertical-line.svg"); - } - - #orgUndo { - --menuitem-image: url("../icons/undo.svg"); - } - - #orgCut { - --menuitem-image: url("chrome://browser/skin/edit-cut.svg"); - } - - #orgCopy { - --menuitem-image: url("../icons/edit-copy.svg"); - } - - #orgPaste { - --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); - } - - #orgDelete { - --menuitem-image: url("chrome://global/skin/icons/delete.svg"); - } - - #orgSelectAll { - --menuitem-image: url("../icons/select-all-on.svg"); - } - - #orgClose { - --menuitem-image: url("chrome://global/skin/icons/close.svg"); - } - - /*= viewMenuPopup ============================================================*/ - #viewColumns { - --menuitem-image: url("chrome://global/skin/icons/columnpicker.svg"); - } - - #viewSort { - --menuitem-image: url("../icons/text-sort-ascending.svg"); - } - - /*= maintenanceButtonPopup ===================================================*/ - #backupBookmarks { - --menuitem-image: url("chrome://devtools/skin/images/datastore.svg"); - } - - #fileImport { - --menuitem-image: url("chrome://browser/skin/save.svg"); - } - - #fileExport { - --menuitem-image: url("chrome://browser/skin/open.svg"); - } - - #browserImport { - --menuitem-image: url("chrome://browser/skin/import.svg"); } } } @@ -3401,7 +3087,6 @@ #downloadsListBox .download-state[exists] .downloadDetails.downloadDetailsHover { color: var(--button-primary-hover-bgcolor); } - /* File moved or missing */ #downloadsListBox .download-state:not([exists], [state="0"]) .downloadTarget { text-decoration: line-through; diff --git a/docs/Omni_ja.md b/docs/Omni_ja.md index e71753e..a315163 100644 --- a/docs/Omni_ja.md +++ b/docs/Omni_ja.md @@ -15,14 +15,14 @@ - [UDN: omni.ja (formerly omni.jar)](https://udn.realityripple.com/docs/Mozilla/About_omni.ja_(formerly_omni.jar)) - [Firefox 4: jar jar jar](https://web.archive.org/web/20161003115800/https://blog.mozilla.org/tglek/2010/09/14/firefox-4-jar-jar-jar/) - [Firefox's Optimized Zip Format: Reading Zip Files Really Quickly](https://taras.glek.net/post/optimized-zip-format/) -- [How to Optimize or Deoptimize Firefox OMNI.JA File](https://www.raymond.cc/blog/edit-files-inside-firefox-4-omni-jar-to-auto-save-password/) +- [How to Optimize or De-optimize Firefox OMNI.JA File](https://www.raymond.cc/blog/edit-files-inside-firefox-4-omni-jar-to-auto-save-password/) **Explanation** -Firefox achieve performance improvements by moving many of their internal parts from being standalone files or sets of JAR files into just one JAR file called `omni.ja`. +Firefox achieves performance improvements by moving many of their internal parts from being standalone files or sets of JAR files into just one JAR file called `omni.ja`. This reduces the amount of I/O needed to load the application. -Chrome content, modules, non-binary components, and many other elements are packaged in an omni.jar file for each base directory. +Chrome content, modules, non-binary components, and many other elements are packaged in an omni.ja file for each base directory. - `actors/`: [JSActors](https://firefox-source-docs.mozilla.org/dom/ipc/jsactors.html) related files. - `chrome.manifest`: The [chrome manifest](https://udn.realityripple.com/docs/Mozilla/Chrome_Registration) file. diff --git a/docs/Preference.md b/docs/Preference.md index acb6351..116cb0e 100644 --- a/docs/Preference.md +++ b/docs/Preference.md @@ -27,7 +27,7 @@ - Convention is to use a dotted segmented form (Ex. `browser.cache.disk.enable`) - Value: - Type: bool, 32-bit ints, 8-bit C string - - When you need an float, use a string. (Ex. `general.smoothScroll.currentVelocityWeighting`: `"0.25"`) + - When you need a float, use a string (Ex. `general.smoothScroll.currentVelocityWeighting`: `"0.25"`) **Main Purpose** - Feature enable/disable flags (Ex. `xpinstall.signatures.required`). @@ -47,7 +47,7 @@ Key information on the sets that can be used in the configuration file. - `user_pref()`: Set user pref The following is a method of operating the configuration file parser. -See [EBNF(Extended Backus-Naur form)](https://en.wikipedia.org/wiki/Extended_Backus%E2%80%93Naur_form) if you want to know about syntax. +See [EBNF (Extended Backus-Naur form)](https://en.wikipedia.org/wiki/Extended_Backus%E2%80%93Naur_form) if you want to know about syntax. ```ebnf = * @@ -73,7 +73,7 @@ See [EBNF(Extended Backus-Naur form)](https://en.wikipedia.org/wiki/Extended_Bac ## Default Config - [`modules/libpref/init/all.js`](https://github.com/mozilla/gecko-dev/blob/master/modules/libpref/init/all.js): all products -- [`browser/app/profile/firefox.js`](https://github.com/mozilla/gecko-dev/blob/master/browser/app/profile/firefox.js): only firefox deskstop +- [`browser/app/profile/firefox.js`](https://github.com/mozilla/gecko-dev/blob/master/browser/app/profile/firefox.js): only firefox desktop In release builds these are all put into [`omni.ja`](./Omni_ja.md). @@ -107,7 +107,7 @@ It is written to `prefs.js` in a way that can be set by the GUI. **Basics** It exists in the profile directory, and is used to store settings that are changed from *defaults* or when users added *new settings*. -In general, Do NOT edit `prefs.js` directly. +In general, do NOT edit `prefs.js` directly. ### user.js **Related Docs** @@ -141,6 +141,9 @@ user_pref("general.smoothScroll.currentVelocityWeighting", "0.12"); // String **Basics** Customizations that cannot be done with add-on and [`User Custom CSS`](./README.md#user-custom-css), such as adding browser UI elements directly or changing default behavior, must use `Auto Config`. +`.mjs`(ES6 Module) is also used in FF `v102` or above. +- [Bug 1432901 - Prototype loading ES6 Module as JSM](https://bugzilla.mozilla.org/show_bug.cgi?id=1432901) + **How to** ```javascript pref("general.config.filename", "config.js"); // alternative to "firefox.cfg", for using highlight diff --git a/docs/Project_Structure.md b/docs/Project_Structure.md index 0be4940..480d383 100644 --- a/docs/Project_Structure.md +++ b/docs/Project_Structure.md @@ -23,12 +23,12 @@ root |- src/: Source files |- src/leptonChrome.scss: Entry of SCSS for Browser UI |- src/leptonContent.scss: Entry of SCSS for Web pages -|- .gitattributes: Exclude at `Download Zip` +|- .gitattributes: Exclude at `Download ZIP` |- .github: Issue/PR Template, Github Actions |- .prettierignore: Exclude coding style |- .prettierrc.json: Coding style -|- install.ps1: Install script write in powersehll -|- install.sh: Install script write in bash +|- install.ps1: Install script written in powershell +|- install.sh: Install script written in bash |- package.json: Build setup, package dependency |- LEPTON: Meta infos (branch, version) |- user.js: about:config settings @@ -47,7 +47,7 @@ Icons are mainly [FirefoxUX/photon-icons](https://github.com/FirefoxUX/photon-ic or [microsoft/fluentui-system-icons](https://github.com/microsoft/fluentui-system-icons). Although not yet used, [tabler/tabler-icons](https://github.com/tabler/tabler-icons) and [feathericons/feather](https://github.com/feathericons/feather) can also be referred to. -You can see more in the issue, [Unify icon design langauge #213](https://github.com/black7375/Firefox-UI-Fix/issues/213). +You can see more in the issue, [Unify icon design language #213](https://github.com/black7375/Firefox-UI-Fix/issues/213). ## Install Scripts ### Meta Info files @@ -88,7 +88,7 @@ Path= Inspired by [arkenfox](https://github.com/arkenfox/user.js/wiki/3.1-Overrides). These files need to use a shell script and has some priorities. -CSS override settings(`userChrome-overrides.css`, `userContent-overrides.css`) are relatively simple. +CSS override settings (`userChrome-overrides.css`, `userContent-overrides.css`) are relatively simple. - `./` (Will be copied `/chrome/`) - `/chrome/` diff --git a/docs/README.md b/docs/README.md index 3b335b2..6f00496 100644 --- a/docs/README.md +++ b/docs/README.md @@ -1,4 +1,4 @@ -# Develper Documents for Firefox Custom +# Developer Documents for Firefox Custom **Table of Contents** @@ -31,15 +31,15 @@ Firefox Source Code: - [Firefox Source Docs](https://firefox-source-docs.mozilla.org/) Firefox Documents: -- [Support Mozilla: Firefox advanced customization and configuration options](https://support.mozilla.org/en-US/kb/firefox-advanced-customization-and-configuration) -- [Support Mozilla: Profiles - Where Firefox stores your bookmarks, passwords and other user data](https://support.mozilla.org/en-US/kb/profiles-where-firefox-stores-user-data) +- [Mozilla Support: Firefox advanced customization and configuration options](https://support.mozilla.org/en-US/kb/firefox-advanced-customization-and-configuration) +- [Mozilla Support: Profiles - Where Firefox stores your bookmarks, passwords and other user data](https://support.mozilla.org/en-US/kb/profiles-where-firefox-stores-user-data) -Test for None mac users: +Test for non-Mac users: - [Docker-OSX](https://github.com/sickcodes/Docker-OSX) ## Project-Specific ### Environment -[`git`](https://git-scm.com/) and [`yarn`](https://yarnpkg.com/) should be installed. +[`git`](https://git-scm.com/) and [`yarn`](https://yarnpkg.com/) must be installed. You can configure it as follows: ```shell @@ -62,7 +62,7 @@ yarn build You can check test and css validate: ```shell ## test - When you make mixin or function -# __tests__ direcory, You can also find out how to use internal utils. +# __tests__ directory, You can also find out how to use internal utils. yarn test ## validate - Will be failed, this project uses non-standard features. @@ -93,7 +93,7 @@ This is a rough guideline. (Not forced) ### Basics `userChrome.css` file is for browser UI, `userContent.css` file is for web contents. -Unlike [User config](./Preference.md#user-config), they are located in `/chrome/`. +Unlike [User config](./Preference.md#user-config), they are located in `/chrome/`. Start Guide: - [What is userChrome.css? What can it do?](https://www.userchrome.org/what-is-userchrome-css.html) diff --git a/docs/Restrictions.md b/docs/Restrictions.md index 4c8029a..f01d3ae 100644 --- a/docs/Restrictions.md +++ b/docs/Restrictions.md @@ -6,7 +6,10 @@ * [Cross Platform](#cross-platform) * [Firefox Version](#firefox-version) * [Side Effect](#side-effect) - * [`-moz-accent-color` Related](#-moz-accent-color-related) + * [RTL](#rtl) + * [`-moz-accent-color`](#-moz-accent-color) + * [Fork Browsers](#fork-browsers) + * [Add-ons](#add-ons) - [Internals](#internals) * [CSS Loading Order](#css-loading-order) * [DOM structure cannot be modified](#dom-structure-cannot-be-modified) @@ -59,12 +62,9 @@ This project is using SCSS to make a [reusable compatible mixins](../src/utils). - `-moz-os-version` -> `-moz-platform` [#331](https://github.com/black7375/Firefox-UI-Fix/issues/331) - Breaking change with `-moz-accent-color`/`-moz-accent-color-foreground` -> `AccentColor`/`AccentColorText` [#433](https://github.com/black7375/Firefox-UI-Fix/issues/433) -### `-moz-accent-color` - -I don't know the exact reason, but it can be a problem if it is not applied to [CSS Variable](https://developer.mozilla.org/en-US/docs/Web/CSS/var). [#437](https://github.com/black7375/Firefox-UI-Fix/issues/437) - ### Side Effect -Only CSS modifications can cause bugs that are hard to think of in the general web, such as the [context menu not appearing](https://github.com/black7375/Firefox-UI-Fix/issues/114). +Only CSS modifications can cause bugs that are hard to think of in the general web, such as the [context menu not appearing](https://github.com/black7375/Firefox-UI-Fix/issues/114). +Sometimes there are times when there is a really hard to understand. [#503](https://github.com/black7375/Firefox-UI-Fix/issues/503#issuecomment-1312685684) Especially be careful when customizing XUL elements. The following code will cause extension panels fail to open and trying to open them might even crash Firefox. ([@MrOtherGuy](https://www.reddit.com/r/FirefoxCSS/comments/u1mdld/comment/i4eg29n/?utm_source=share&utm_medium=web2x&context=3) reports) @@ -77,14 +77,59 @@ Info: `#nav-bar` is [`toolbar`](https://udn.realityripple.com/docs/Archive/Mozil Another `display: flex`'s side effect examples. [#368](https://github.com/black7375/Firefox-UI-Fix/issues/368) [#372](https://github.com/black7375/Firefox-UI-Fix/issues/372) +### RTL + +It can be detected using [`:-moz-locale-dir(rtl)`](https://developer.mozilla.org/en-US/docs/Web/CSS/:-moz-locale-dir(rtl)) on the interface(chrome) and [`:dir(rtl)`](https://developer.mozilla.org/en-US/docs/Web/CSS/:dir) on the content. + +[`margin-inline`](https://developer.mozilla.org/en-US/docs/Web/CSS/margin-inline) and [`padding-inline`](https://developer.mozilla.org/en-US/docs/Web/CSS/padding-inline) works as desired, but [`background-position-x`](https://developer.mozilla.org/en-US/docs/Web/CSS/background-position-x) and [`translateX()`](https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/translateX) should use the opposite values. + +### `-moz-accent-color` + +I don't know the exact reason, but it can be a problem if it is not applied to [CSS Variable](https://developer.mozilla.org/en-US/docs/Web/CSS/var). [#437](https://github.com/black7375/Firefox-UI-Fix/issues/437) + +### Fork Browsers + +Fork browsers have a different installation location ([bash](https://github.com/black7375/Firefox-UI-Fix/blob/2e87567b662922810d53959e46084b78f330f54e/install.sh#L336-L353), [powershell](https://github.com/black7375/Firefox-UI-Fix/blob/2e87567b662922810d53959e46084b78f330f54e/install.ps1#L387-L395)), and there may be a menu that Firefox does not have. + +List of fork browsers supported by this project: +- [Waterfox](https://www.waterfox.net/) +- [LibreWolf](https://librewolf.net/) +- [Tor Browser](https://www.torproject.org/download/) +- [Pulse Browser](https://pulsebrowser.app/) +- [Firedragon](https://dr460nf1r3.org/projects/firedragon/) +- [Ghostery Broser](https://www.ghostery.com/dawn) + +### Add-ons + +**Web extentions** + +You can apply [Web extentions](https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions)'s context menu icons. + +At this time, we recommend that the [explicit ID](https://extensionworkshop.com/documentation/develop/extensions-and-the-add-on-id/) is set. +If not, an anonymous ID is created in the local, so you need a [UUID replacer](https://github.com/overdodactyl/ShadowFox/blob/master/scripts/uuids.sh). + +List of web extentions supported by this project: +- [Tree Style Tab](https://addons.mozilla.org/en-US/firefox/addon/tree-style-tab/) +- [Tab Center Reborn](https://addons.mozilla.org/en-US/firefox/addon/tabcenter-reborn/) +- [Sidebar Tabs](https://addons.mozilla.org/en-US/firefox/addon/sidebartabs/) + +**Legacy Addons** + +We should consider [Legacy addons](https://extensionworkshop.com/documentation/develop/porting-a-legacy-firefox-extension/), not web extentions. + +Legacy addons can be loaded by [Auto config's feature](./Preference.md#auto-config) or [bootstrapLoder](https://github.com/xiaoxiaoflood/firefox-scripts/tree/master/extensions/bootstrapLoader) and can directly manipulate the DOM structure and style. [onemen/TabMixPlus#168](https://github.com/onemen/TabMixPlus/issues/168) + +List of legacy addons supported by this project: +- [Tab Mix Plus](https://github.com/onemen/TabMixPlus) + ## Internals ### CSS Loading Order -User CSS(`userChrome.css`, `userContent.css`) is usually loaded first. +User CSS (`userChrome.css`, `userContent.css`) is usually loaded first. -In many cases, overriding should be prevented with [`important!`](https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity#the_!important_exception)(Anti-pattern in general web), and side effects should also be considered. [#11](https://github.com/black7375/Firefox-UI-Fix/issues/11) +In many cases, overriding should be prevented with [`!important`](https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity#the_!important_exception) (Anti-pattern in general web), and side effects should also be considered. [#11](https://github.com/black7375/Firefox-UI-Fix/issues/11) ### DOM structure cannot be modified -It is possible with [JS(Autoconfig)](./Preference.md#auto-config), but there are security and configuration issues, so we should make the most of CSS. +It is possible with [JS (Auto config)](./Preference.md#auto-config), but there are security and configuration issues, so we should make the most of CSS. [`::before`](https://developer.mozilla.org/en-US/docs/Web/CSS/::before) and [`::after`](https://developer.mozilla.org/en-US/docs/Web/CSS/::after) can indirectly add CSS elements. @@ -93,7 +138,7 @@ Many implementations using `::before`, `::after`. - [Dynamic Tab Separator](https://github.com/black7375/Firefox-UI-Fix/blob/36e9c94844fee2417662251cbd50c2b874d5b576/userChrome.css#L3394-L3457) - [Static Tab Separator](https://github.com/black7375/Firefox-UI-Fix/blob/0f78a73b856e1335954ecded93d377b85134bd61/userChrome.css#L3387-L3428) - [Picture In Picture Indicator](https://github.com/black7375/Firefox-UI-Fix/blob/36e9c94844fee2417662251cbd50c2b874d5b576/userChrome.css#L3716-L3753) -- [Contaner Indicator](https://github.com/black7375/Firefox-UI-Fix/blob/36e9c94844fee2417662251cbd50c2b874d5b576/userChrome.css#L3754-L3852) +- [Container Indicator](https://github.com/black7375/Firefox-UI-Fix/blob/36e9c94844fee2417662251cbd50c2b874d5b576/userChrome.css#L3754-L3852) For icons, [`list-style-image`](https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-image) and [`background-image`](https://developer.mozilla.org/en-US/docs/Web/CSS/background-image) are available. @@ -104,7 +149,7 @@ It is recommended to use `list-style-image` when a layout is provided for the im - [Menu Item Icon](https://github.com/black7375/Firefox-UI-Fix/blob/36e9c94844fee2417662251cbd50c2b874d5b576/userChrome.css#L4551-L4744) - [Error Illustration](https://github.com/black7375/Firefox-UI-Fix/blob/36e9c94844fee2417662251cbd50c2b874d5b576/userContent.css#L275-L380) -You can use [`-moz-box-ordinal-group`](https://udn.realityripple.com/docs/Web/CSS/box-ordinal-group)([`-moz-box`](https://udn.realityripple.com/docs/Web/CSS/Mozilla_Extensions#display)) and [`order`](https://developer.mozilla.org/en-US/docs/Web/CSS/order)(at [flex](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox)) to change the order of the layout. +You can use [`-moz-box-ordinal-group`](https://udn.realityripple.com/docs/Web/CSS/box-ordinal-group) ([`-moz-box`](https://udn.realityripple.com/docs/Web/CSS/Mozilla_Extensions#display)) and [`order`](https://developer.mozilla.org/en-US/docs/Web/CSS/order) (at [flex](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox)) to change the order of the layout. In experience, the detailed actions of `-moz-box` and `flex` are different, so tests are required. - [Separator Order](https://github.com/black7375/Firefox-UI-Fix/blob/36e9c94844fee2417662251cbd50c2b874d5b576/userChrome.css#L4286-L4288) - [Sync Menu Item's Image Order](https://github.com/black7375/Firefox-UI-Fix/blob/36e9c94844fee2417662251cbd50c2b874d5b576/userChrome.css#L4234-L4238) @@ -116,42 +161,42 @@ By default, [attribute selectors](https://developer.mozilla.org/en-US/docs/Web/C If there is no state attributes, you can bypass by using [both transitions and keyframes](https://github.com/black7375/Firefox-UI-Fix/blob/36e9c94844fee2417662251cbd50c2b874d5b576/userChrome.css#L2704-L2730) for animation. ### Shadow DOM -Firefox actively uses [shadow dom](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM) internally. +Firefox actively uses [shadow DOM](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM) internally. To modify, it is often a roundabout approach or impossible to inherit. -Onething bypass method is to declare [`var()`](https://developer.mozilla.org/en-US/docs/Web/CSS/var) to shadow root. +One bypass method is to declare [`var()`](https://developer.mozilla.org/en-US/docs/Web/CSS/var) to shadow root. - [Scrollbutton Padding](https://github.com/black7375/Firefox-UI-Fix/blob/36e9c94844fee2417662251cbd50c2b874d5b576/userChrome.css#L2906-L2924) - [Audio, Video Player UI](https://github.com/black7375/Firefox-UI-Fix/blob/36e9c94844fee2417662251cbd50c2b874d5b576/userContent.css#L5-L47) - [Video Player Twoline UI](https://github.com/black7375/Firefox-UI-Fix/blob/cbf14cd55a9edada7ab2f5f1b626608fb9fe38a2/src/contents/_video_player.scss#L68-L171): It is pretty difficult when the condition becomes complicated. -Another limitation of shadow dom in user style is that you cannot use shadow dom related selectors like [`:host`](https://developer.mozilla.org/en-US/docs/Web/CSS/:host_function) and [`::part`](https://developer.mozilla.org/en-US/docs/Web/CSS/::part). +Another limitation of shadow DOM in user style is that you cannot use shadow DOM related selectors like [`:host`](https://developer.mozilla.org/en-US/docs/Web/CSS/:host_function) and [`::part`](https://developer.mozilla.org/en-US/docs/Web/CSS/::part). - [Using ::part() selector in userchrome.css?](https://www.reddit.com/r/FirefoxCSS/comments/d2sukj/using_part_selector_in_userchromecss/) - [Can't change some shadow-dom properties](https://www.reddit.com/r/FirefoxCSS/comments/rebn3s/cant_change_some_shadowdom_properties/) - [Bug 1575507 - Shadow parts should work in user-origin stylesheets.](https://bugzilla.mozilla.org/show_bug.cgi?id=1575507) ### XUL -Sometimes firefox can use [XUL](https://en.wikipedia.org/wiki/XUL) that have been written and binded with C++ for performance like a treeview of bookmarks. +Sometimes firefox can use [XUL](https://en.wikipedia.org/wiki/XUL) that have been written and bound with C++ for performance like a treeview of bookmarks. XUL's [box model](https://udn.realityripple.com/docs/Archive/Mozilla/XUL/Tutorial/The_Box_Model) and [DOM](https://udn.realityripple.com/docs/Archive/Mozilla/XUL/Tutorial/Document_Object_Model) are different from HTML. -There ar few appropriate documents, so we have to read the source code and work. (Ex. [1](https://github.com/mozilla/gecko-dev/blob/master/layout/style/nsCSSAnonBoxList.h), [2](https://github.com/mozilla/gecko-dev/blob/master/layout/xul/tree/nsITreeView.idl)) +There are a few appropriate documents, so we have to read the source code and work. (Ex. [1](https://github.com/mozilla/gecko-dev/blob/master/layout/style/nsCSSAnonBoxList.h), [2](https://github.com/mozilla/gecko-dev/blob/master/layout/xul/tree/nsITreeView.idl)) Available CSS features are also restricted. -Example of legacy documents that will help. +Examples of legacy documents that will help: - [UDN: ::-moz-tree-cell](https://udn.realityripple.com/docs/Mozilla/Gecko/Chrome/CSS/::-moz-tree-cell) - [UDN: ::-moz-tree-cell-text](https://udn.realityripple.com/docs/Mozilla/Gecko/Chrome/CSS/::-moz-tree-cell-text) Another case. -Like [``](https://udn.realityripple.com/docs/Archive/Mozilla/XUL/Attribute/align), [`attributes`](https://udn.realityripple.com/docs/Archive/Mozilla/XUL/Attribute) is set and CSS of same property may not be appplied. (Ex. [`box-align: start`](https://udn.realityripple.com/docs/Web/CSS/box-align)) +Like [``](https://udn.realityripple.com/docs/Archive/Mozilla/XUL/Attribute/align), [`attributes`](https://udn.realityripple.com/docs/Archive/Mozilla/XUL/Attribute) is set and CSS of same property may not be applied. (Ex. [`box-align: start`](https://udn.realityripple.com/docs/Web/CSS/box-align)) ### Supports [`@supports`](https://developer.mozilla.org/en-US/docs/Web/CSS/@supports) change in CSS is not detected in real time. (Caching after checking only once) -So a restart is required, and if the mozilla need real time changes, are using `@media` to handle it. +So a restart is required, and if Mozilla needs real time changes, they are using `@media` to handle it. -If project only use pure CSS, we cannot add `@media rules`. +If project only uses pure CSS, we cannot add `@media rules`. - [Bug 1267890 - Support detecting bool preferences in chrome stylesheets](https://bugzilla.mozilla.org/show_bug.cgi?id=1267890) - [Bug 1698132 - Improve caching behaviour of -moz-bool-pref](https://bugzilla.mozilla.org/show_bug.cgi?id=1698132) diff --git a/docs/Rules.md b/docs/Rules.md index a1cc771..dbb4ce8 100644 --- a/docs/Rules.md +++ b/docs/Rules.md @@ -46,7 +46,7 @@ It comes from [#109](https://github.com/black7375/Firefox-UI-Fix/issues/109#issu Stable: Only bugfix, Documentation. - `master`: Common bugfix, documentation. - `photon-style`: Bugfix, documentation specified in `photon-style`. -- `proton-sryle`: Bugfix, documentation specified in `proton-style`. +- `proton-style`: Bugfix, documentation specified in `proton-style`. Development: New Features. - `dev`: Common new features. diff --git a/docs/Smart_Bookmarks.md b/docs/Smart_Bookmarks.md index 32dce1d..b3de43f 100644 --- a/docs/Smart_Bookmarks.md +++ b/docs/Smart_Bookmarks.md @@ -1,4 +1,4 @@ -# Smart Bookmarks(Query Bookmarks) +# Smart Bookmarks (Query Bookmarks) **Table of Contents** @@ -12,7 +12,7 @@ ## Basics **Related Docs** -- [Support Mozilla: Restore the default Smart Bookmarks Folders](https://support.mozilla.org/en-US/kb/restore-default-smart-bookmarks-folders) (Not works) +- [Mozilla Support: Restore the default Smart Bookmarks Folders](https://support.mozilla.org/en-US/kb/restore-default-smart-bookmarks-folders) (does not work) - [Smart Bookmarks. A quick guide.](https://www.reddit.com/r/firefox/comments/2i4qcy/smart_bookmarks_a_quick_guide/) - [Smart Bookmarks. A quick guide. (extended)](https://www.reddit.com/r/firefox/comments/fvcw96/query_bookmarks_smart_bookmarks_a_quick_guide/) - [How to Create Custom Smart Bookmarks Folders in Firefox](https://www.howtogeek.com/111820/how-to-create-custom-smart-bookmarks-folders-in-firefox/) diff --git a/icons/bookmark-multiple.svg b/icons/bookmark-multiple.svg new file mode 100644 index 0000000..14dcee9 --- /dev/null +++ b/icons/bookmark-multiple.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/edit-paste-go.svg b/icons/edit-paste-go.svg new file mode 100644 index 0000000..f7abda4 --- /dev/null +++ b/icons/edit-paste-go.svg @@ -0,0 +1,4 @@ + + + + diff --git a/icons/edit-paste-search.svg b/icons/edit-paste-search.svg new file mode 100644 index 0000000..c2ab698 --- /dev/null +++ b/icons/edit-paste-search.svg @@ -0,0 +1,4 @@ + + + + diff --git a/icons/error-malformed-url.svg b/icons/error-malformed-url.svg new file mode 100644 index 0000000..831328d --- /dev/null +++ b/icons/error-malformed-url.svg @@ -0,0 +1,61 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/icons/filter-dismiss.svg b/icons/filter-dismiss.svg new file mode 100644 index 0000000..bb9ce9b --- /dev/null +++ b/icons/filter-dismiss.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/filter-reload.svg b/icons/filter-reload.svg new file mode 100644 index 0000000..71b4c68 --- /dev/null +++ b/icons/filter-reload.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/lock-closed.svg b/icons/lock-closed.svg new file mode 100644 index 0000000..528e69f --- /dev/null +++ b/icons/lock-closed.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/merge.svg b/icons/merge.svg new file mode 100644 index 0000000..e6060cd --- /dev/null +++ b/icons/merge.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/new-tab-forward.svg b/icons/new-tab-forward.svg new file mode 100644 index 0000000..6c87642 --- /dev/null +++ b/icons/new-tab-forward.svg @@ -0,0 +1,4 @@ + + + + diff --git a/icons/new-tab-multiple.svg b/icons/new-tab-multiple.svg new file mode 100644 index 0000000..9007367 --- /dev/null +++ b/icons/new-tab-multiple.svg @@ -0,0 +1,4 @@ + + + + diff --git a/icons/new-tab-skip-forward.svg b/icons/new-tab-skip-forward.svg new file mode 100644 index 0000000..9ab9e8a --- /dev/null +++ b/icons/new-tab-skip-forward.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/notebook-subsection.svg b/icons/notebook-subsection.svg deleted file mode 100644 index d85c15a..0000000 --- a/icons/notebook-subsection.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - \ No newline at end of file diff --git a/icons/panelarrow-vertical-reverse.svg b/icons/panelarrow-vertical-reverse.svg new file mode 100644 index 0000000..d274759 --- /dev/null +++ b/icons/panelarrow-vertical-reverse.svg @@ -0,0 +1,4 @@ + + + + diff --git a/icons/panelarrow-vertical.svg b/icons/panelarrow-vertical.svg new file mode 100644 index 0000000..55d016c --- /dev/null +++ b/icons/panelarrow-vertical.svg @@ -0,0 +1,7 @@ + + + + + diff --git a/icons/reload-auto.svg b/icons/reload-auto.svg new file mode 100644 index 0000000..c55fc24 --- /dev/null +++ b/icons/reload-auto.svg @@ -0,0 +1,4 @@ + + + + diff --git a/icons/shield-task.svg b/icons/shield-task.svg new file mode 100644 index 0000000..662087e --- /dev/null +++ b/icons/shield-task.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/tab-bottom-corner-left-australis-clipped.svg b/icons/tab-bottom-corner-left-australis-clipped.svg new file mode 100644 index 0000000..6467247 --- /dev/null +++ b/icons/tab-bottom-corner-left-australis-clipped.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/tab-bottom-corner-left-australis.svg b/icons/tab-bottom-corner-left-australis.svg new file mode 100644 index 0000000..955e390 --- /dev/null +++ b/icons/tab-bottom-corner-left-australis.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/icons/tab-bottom-corner-left-chrome-clipped.svg b/icons/tab-bottom-corner-left-chrome-clipped.svg new file mode 100644 index 0000000..24ae50b --- /dev/null +++ b/icons/tab-bottom-corner-left-chrome-clipped.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/tab-bottom-corner-left-chrome.svg b/icons/tab-bottom-corner-left-chrome.svg new file mode 100644 index 0000000..fda2f96 --- /dev/null +++ b/icons/tab-bottom-corner-left-chrome.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/icons/tab-bottom-corner-left-chromeLegacy-clipped.svg b/icons/tab-bottom-corner-left-chromeLegacy-clipped.svg new file mode 100644 index 0000000..da5e1b8 --- /dev/null +++ b/icons/tab-bottom-corner-left-chromeLegacy-clipped.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/tab-bottom-corner-left-chromeLegacy.svg b/icons/tab-bottom-corner-left-chromeLegacy.svg new file mode 100644 index 0000000..5b71bd8 --- /dev/null +++ b/icons/tab-bottom-corner-left-chromeLegacy.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/icons/tab-bottom-corner-left-edge-clipped.svg b/icons/tab-bottom-corner-left-edge-clipped.svg new file mode 100644 index 0000000..e92817e --- /dev/null +++ b/icons/tab-bottom-corner-left-edge-clipped.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/tab-bottom-corner-left-edge.svg b/icons/tab-bottom-corner-left-edge.svg new file mode 100644 index 0000000..d24d02c --- /dev/null +++ b/icons/tab-bottom-corner-left-edge.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/icons/tab-bottom-corner-left-wave-clipped.svg b/icons/tab-bottom-corner-left-wave-clipped.svg new file mode 100644 index 0000000..5d70865 --- /dev/null +++ b/icons/tab-bottom-corner-left-wave-clipped.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/tab-bottom-corner-left-wave.svg b/icons/tab-bottom-corner-left-wave.svg new file mode 100644 index 0000000..32e0c1b --- /dev/null +++ b/icons/tab-bottom-corner-left-wave.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/icons/tab-bottom-corner-right-australis-cilpped.svg b/icons/tab-bottom-corner-right-australis-cilpped.svg new file mode 100644 index 0000000..409e3bd --- /dev/null +++ b/icons/tab-bottom-corner-right-australis-cilpped.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/tab-bottom-corner-right-australis.svg b/icons/tab-bottom-corner-right-australis.svg new file mode 100644 index 0000000..aef6e0e --- /dev/null +++ b/icons/tab-bottom-corner-right-australis.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/icons/tab-bottom-corner-right-chrome-clipped.svg b/icons/tab-bottom-corner-right-chrome-clipped.svg new file mode 100644 index 0000000..96baab9 --- /dev/null +++ b/icons/tab-bottom-corner-right-chrome-clipped.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/tab-bottom-corner-right-chrome.svg b/icons/tab-bottom-corner-right-chrome.svg new file mode 100644 index 0000000..ace5206 --- /dev/null +++ b/icons/tab-bottom-corner-right-chrome.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/icons/tab-bottom-corner-right-chromeLegacy-clipped.svg b/icons/tab-bottom-corner-right-chromeLegacy-clipped.svg new file mode 100644 index 0000000..1e4b049 --- /dev/null +++ b/icons/tab-bottom-corner-right-chromeLegacy-clipped.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/tab-bottom-corner-right-chromeLegacy.svg b/icons/tab-bottom-corner-right-chromeLegacy.svg new file mode 100644 index 0000000..9749ab7 --- /dev/null +++ b/icons/tab-bottom-corner-right-chromeLegacy.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/icons/tab-bottom-corner-right-edge-clipped.svg b/icons/tab-bottom-corner-right-edge-clipped.svg new file mode 100644 index 0000000..20bde7c --- /dev/null +++ b/icons/tab-bottom-corner-right-edge-clipped.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/tab-bottom-corner-right-edge.svg b/icons/tab-bottom-corner-right-edge.svg new file mode 100644 index 0000000..a9de51f --- /dev/null +++ b/icons/tab-bottom-corner-right-edge.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/icons/tab-bottom-corner-right-wave-clipped.svg b/icons/tab-bottom-corner-right-wave-clipped.svg new file mode 100644 index 0000000..6bbb9ac --- /dev/null +++ b/icons/tab-bottom-corner-right-wave-clipped.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/tab-bottom-corner-right-wave.svg b/icons/tab-bottom-corner-right-wave.svg new file mode 100644 index 0000000..343b26d --- /dev/null +++ b/icons/tab-bottom-corner-right-wave.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/icons/tab-copy.svg b/icons/tab-copy.svg new file mode 100644 index 0000000..3d3bad5 --- /dev/null +++ b/icons/tab-copy.svg @@ -0,0 +1,4 @@ + + + + diff --git a/icons/tab-desktop-multiple-bottom.svg b/icons/tab-desktop-multiple-bottom.svg new file mode 100644 index 0000000..97457b4 --- /dev/null +++ b/icons/tab-desktop-multiple-bottom.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/tab-unload.svg b/icons/tab-unload.svg new file mode 100644 index 0000000..8907267 --- /dev/null +++ b/icons/tab-unload.svg @@ -0,0 +1,4 @@ + + + + diff --git a/icons/timer10.svg b/icons/timer10.svg new file mode 100644 index 0000000..e6311bb --- /dev/null +++ b/icons/timer10.svg @@ -0,0 +1,3 @@ + + + diff --git a/icons/toolbarButton-download.svg b/icons/toolbarButton-download.svg new file mode 100644 index 0000000..6d64757 --- /dev/null +++ b/icons/toolbarButton-download.svg @@ -0,0 +1,4 @@ + + + + diff --git a/icons/weather-snowflake.svg b/icons/weather-snowflake.svg new file mode 100644 index 0000000..fe7c53f --- /dev/null +++ b/icons/weather-snowflake.svg @@ -0,0 +1,3 @@ + + + diff --git a/install.ps1 b/install.ps1 index af21842..eb5ef71 100644 --- a/install.ps1 +++ b/install.ps1 @@ -31,7 +31,7 @@ Shows this help message .PARAMETER WhatIf Runs the installer without actioning any file copies/moves -Equivelant to a dry-run +Equivalent to a dry-run .EXAMPLE PS> .\Install.ps1 -u -f C:\Users\someone\ff-profiles diff --git a/install.sh b/install.sh index 994d470..185af73 100755 --- a/install.sh +++ b/install.sh @@ -67,7 +67,7 @@ mac_command_line_developer_tools() { check_git() { if ! [ -x "$(command -v git)" ]; then - if [ "${OSTYPE}" == "linux-gnu" ] || [ "${OSTYPE}" == "FreeBSD" ]; then + if [[ "${OSTYPE}" == "linux"* || "${OSTYPE}" == "FreeBSD" ]]; then pacapt_install sudo pacapt -S git pacapt_uninstall @@ -185,8 +185,8 @@ write_file() { get_ini_section() { local filePath="$1" - local ouput=$(grep -E "^\[" "${filePath}" |sed -e "s/^\[//g" -e "s/\]$//g") - echo "${ouput}" + local output=$(grep -E "^\[" "${filePath}" |sed -e "s/^\[//g" -e "s/\]$//g") + echo "${output}" } get_ini_value() { local filePath="$1" diff --git a/package.json b/package.json index 1b53499..50cdabd 100644 --- a/package.json +++ b/package.json @@ -21,10 +21,14 @@ }, "devDependencies": { "csstree-validator": "^3.0.0", - "fast-glob": "^3.2.11", - "jest": "^27.5.1", - "prettier": "^2.6.1", - "sass": "^1.49.0", + "fast-glob": "^3.2.12", + "jest": "^29.3.1", + "jest-environment-node-single-context": "^29.0.0", + "prettier": "^2.7.1", + "sass": "^1.56.1", "sass-true": "^6.1.0" + }, + "jest": { + "testEnvironment": "jest-environment-node-single-context" } } diff --git a/src/autohide/_back_button.scss b/src/autohide/_back_button.scss index beab781..21cc162 100644 --- a/src/autohide/_back_button.scss +++ b/src/autohide/_back_button.scss @@ -1,5 +1,5 @@ #back-button[disabled="true"] { - margin-left: -36px !important; + margin-left: var(--uc-toolbarbutton-hide-size) !important; opacity: 0 !important; pointer-events: none; } diff --git a/src/autohide/_bookmarkbar.scss b/src/autohide/_bookmarkbar.scss index af0f9e4..081b5b8 100644 --- a/src/autohide/_bookmarkbar.scss +++ b/src/autohide/_bookmarkbar.scss @@ -5,9 +5,13 @@ will-change: margin-bottom, opacity; @include Option("userChrome.autohide.toolbar_overlap") { - &[collapsed="true"] { - visibility: visible !important; - max-height: unset !important; + @include NotOption("userChrome.autohide.toolbar_overlap.allow_layout_shift") { + @include NotHas { + &[collapsed="true"] { + visibility: visible !important; + max-height: unset !important; + } + } } } } @@ -20,8 +24,8 @@ @include Animate { #PersonalToolbar:not([customizing]) { // --ext-theme-background-transition: background-color 0.1s cubic-bezier(.17,.67,.83,.67); - transition: margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), - opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + transition: margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + opacity var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), min-height 170ms ease-out, max-height 170ms ease-out, var(--ext-theme-background-transition) !important; } #navigator-toolbox:is(:hover, :focus-within) #PersonalToolbar:not([customizing]) { diff --git a/src/autohide/_common.scss b/src/autohide/_common.scss index 8347e8a..98a4cb8 100644 --- a/src/autohide/_common.scss +++ b/src/autohide/_common.scss @@ -1,12 +1,34 @@ -@include Option("userChrome.autohide.tabbar", "userChrome.autohide.navbar", "userChrome.autohide.bookmarkbar", "userChrome.tabbar.one_liner") { +:root { + --uc-autohide-toolbar-speed: 0.25s; + --uc-autohide-toolbar-delay: 600ms; +} + +@include Option("userChrome.autohide.tabbar", "userChrome.autohide.navbar", "userChrome.autohide.bookmarkbar", "userChrome.tabbar.one_liner", "userChrome.tabbar.on_bottom.menubar_on_top", "userChrome.hidden.tabbar", "userChrome.navbar.as_sidebar") { :root { - --uc-tabbar-height: var(--tab-min-height); // calc((var(--tab-block-margin) * 2) + var(--tab-min-height)); + --uc-tabbar-height: var(--uc-tabbar-height-default); + --uc-tabbar-height-default: var(--tab-min-height); // calc((var(--tab-block-margin) * 2) + var(--tab-min-height)); --uc-tabbar-hide-height: calc(-1 * var(--uc-tabbar-height)); - --uc-navbar-height: calc(16px + 2 * (var(--toolbarbutton-inner-padding) + var(--toolbarbutton-outer-padding))); + + --uc-navbar-height: var(--uc-navbar-height-default); + --uc-navbar-height-default: calc(16px + 2 * (var(--toolbarbutton-inner-padding) + var(--toolbarbutton-outer-padding))); --uc-navbar-hide-height: calc(-1 * var(--uc-navbar-height)); - --uc-bm-height: calc(20px + (2 * var(--bookmark-block-padding, 4px))); /* 20px = 16px + (2px * 2) [margin block] */ + + --uc-bm-height: var(--uc-bm-height-default); + --uc-bm-height-default: calc(20px + (2 * var(--bookmark-block-padding, 4px))); /* 20px = 16px + (2px * 2) [margin block] */ --uc-bm-hide-height: calc(-1 * var(--uc-bm-height)); + // Mac - None exist + // https://github.com/mozilla/gecko-dev/blob/92d3050ecbbdd077ffa4cb78e0dffc4bd5021109/browser/base/content/browser.css#L131 + // https://github.com/mozilla/gecko-dev/blob/92d3050ecbbdd077ffa4cb78e0dffc4bd5021109/browser/themes/linux/browser.css#L327 + // https://github.com/mozilla/gecko-dev/blob/92d3050ecbbdd077ffa4cb78e0dffc4bd5021109/browser/themes/windows/browser-aero.css#L14 + // https://github.com/mozilla/gecko-dev/blob/92d3050ecbbdd077ffa4cb78e0dffc4bd5021109/browser/themes/windows/browser.css#L65 + $_menubarPadding: 1px * 2; // menubar padding block 1px + $_menubarHeightDefault: 1rem + 0.3rem * 2; // text 1rem, menu padding 0.3em + --uc-titlebar-buttonbox-height: #{ 32px + $_menubarPadding }; + --uc-menubar-height: 0px; + --uc-menubar-height-default: #{ calc($_menubarHeightDefault + $_menubarPadding) }; + --uc-menubar-inner-height: #{ calc($_menubarHeightDefault - $_menubarPadding) }; + @include Option("userChrome.hidden.tabbar") { @include OneLinerNavbarContent() { --uc-tabbar-height: 0px; @@ -16,18 +38,64 @@ --uc-navbar-height: 0px; } } + @include Has { + :root { + &:not([tabsintitlebar]):has(#toolbar-menubar) { + --uc-menubar-height: var(--uc-menubar-height-default); // text 1rem, menu padding 0.3em + } + + &[tabsintitlebar]:has(#toolbar-menubar[autohide="true"]) { + @include OS($linux) { + --uc-menubar-height: calc(var(--tab-min-height) + 2 * var(--tab-block-margin)); + } + @include OS($win10) { + --uc-menubar-height: calc(var(--tab-min-height) - var(--tabs-navbar-shadow-size)); + } + @include OS($win7, $win8) { + --uc-menubar-height: calc(var(--tab-min-height) + var(--tab-block-margin)); + } + } + &[tabsintitlebar]:has(#toolbar-menubar[autohide="false"]) { + --uc-menubar-height: var(--uc-titlebar-buttonbox-height); + } + + &:not([tabsintitlebar]), + &[tabsintitlebar] { + &:has(#toolbar-menubar[autohide="true"][inactive="true"]) { + --uc-menubar-height: 0px; + } + } + } + + #navigator-toolbox:has(#PersonalToolbar[collapsed="true"]) { + --uc-bm-height: 0px; + } + + @include Option("userChrome.navbar.as_sidebar") { + #navigator-toolbox:has(#PersonalToolbar[collapsed="false"]) #nav-bar { + --uc-bm-height: var(--uc-bm-height-default); // Re-calculate to force!! + } + @include Option("userChrome.autohide.bookmarkbar") { + #navigator-toolbox:has(#PersonalToolbar[collapsed="false"]):not(:hover) #nav-bar { + --uc-bm-height: 0px; + } + } + } + } } @include Option("userChrome.autohide.tabbar", "userChrome.autohide.navbar", "userChrome.autohide.bookmarkbar", "userChrome.autohide.infobar") { - :root { - --uc-autohide-toolbar-delay: 600ms; - } - #navigator-toolbox { position: relative; - z-index: 2; + &:is(:hover, :focus-within) { + z-index: 2; + + #PersonalToolbar { + z-index: -1; + } + } } - #navigator-toolbox:not(:hover) { + #navigator-toolbox:not(:hover):not(:focus-within) { animation: 1s keepfront; } @keyframes keepfront { diff --git a/src/autohide/_fill_urlbar.scss b/src/autohide/_fill_urlbar.scss index 6101b6b..b1cca3f 100644 --- a/src/autohide/_fill_urlbar.scss +++ b/src/autohide/_fill_urlbar.scss @@ -12,7 +12,7 @@ @include Animate { @include OneLiner { #nav-bar { - transition: margin-inline 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + transition: margin-inline var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), var(--ext-theme-background-transition) !important; } #nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) { @@ -22,7 +22,7 @@ @include OneLinerNavbarContent { #urlbar-container { - transition: min-width 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay); + transition: min-width var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay); } #nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) #urlbar-container { transition-delay: 0s !important; diff --git a/src/autohide/_forward_button.scss b/src/autohide/_forward_button.scss index 5024524..4e6e240 100644 --- a/src/autohide/_forward_button.scss +++ b/src/autohide/_forward_button.scss @@ -1,5 +1,5 @@ #forward-button[disabled="true"] { - margin-left: -36px !important; + margin-left: var(--uc-toolbarbutton-hide-size) !important; opacity: 0 !important; pointer-events: none; } diff --git a/src/autohide/_index.scss b/src/autohide/_index.scss index 3864d5e..805c44e 100644 --- a/src/autohide/_index.scss +++ b/src/autohide/_index.scss @@ -1,3 +1,9 @@ +@include Option("userChrome.autohide.back_button", "userChrome.autohide.forward_button") { + :root { + --uc-toolbarbutton-hide-size: calc(-1 * (16px + (2 * var(--toolbarbutton-outer-padding) + var(--toolbarbutton-inner-padding)))); + } +} + @include Option("userChrome.autohide.back_button") { @import "back_button"; } diff --git a/src/autohide/_infobar.scss b/src/autohide/_infobar.scss index 39c9fb8..1d08f61 100644 --- a/src/autohide/_infobar.scss +++ b/src/autohide/_infobar.scss @@ -1,6 +1,6 @@ #tab-notification-deck:not([customizing]) > .notificationbox-stack { $infobarFixedHeight: 13px + ((1px + 5px) * 2); // button height + (button border + [button.small-button padding]) * 2 - // fiexedHeight + (button margin * 2) + messagebar margin + // fixedHeight + (button margin * 2) + messagebar margin --infobar-height: calc(#{ $infobarFixedHeight } + (var(--infobar-button-vertical-margin, 4px) * 2) + var(--infobar-message-vertical-margin, 8px)); } #tab-notification-deck:not([customizing]) > .notificationbox-stack[slot="selected"] > notification-message { @@ -22,8 +22,8 @@ @include Animate { #tab-notification-deck:not([customizing]) > .notificationbox-stack[slot="selected"] > notification-message { - transition: margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), - opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + transition: margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + opacity var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), var(--ext-theme-background-transition) !important; } #navigator-toolbox:is(:hover, :focus-within) #tab-notification-deck:not([customizing]) > .notificationbox-stack[slot="selected"] > notification-message { diff --git a/src/autohide/_navbar.scss b/src/autohide/_navbar.scss index 43a1102..5b7b47b 100644 --- a/src/autohide/_navbar.scss +++ b/src/autohide/_navbar.scss @@ -12,14 +12,14 @@ @include Animate { #nav-bar:not([customizing]) { - transition: margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), - opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + transition: margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + opacity var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), var(--ext-theme-background-transition) !important; @include Option("userChrome.autohide.fill_urlbar") { - transition: margin-inline 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), - margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), - opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + transition: margin-inline var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + opacity var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), var(--ext-theme-background-transition) !important; } } diff --git a/src/autohide/_tabbar.scss b/src/autohide/_tabbar.scss index 5781a34..fe377cb 100644 --- a/src/autohide/_tabbar.scss +++ b/src/autohide/_tabbar.scss @@ -1,7 +1,10 @@ //-- Mixin --------------------------------------------------------------------- @mixin _autohide_tabbar() { @include NotOption("userChrome.tabbar.on_bottom") { - @content; + &, + & .titlebar-buttonbox-container { + @content; + } } @include Option("userChrome.tabbar.on_bottom") { > *:not(.titlebar-buttonbox-container) { @@ -20,8 +23,8 @@ #TabsToolbar:not([customizing]) { @include _autohide_tabbar { opacity: 0; - will-change: opacity; } + will-change: opacity; } #navigator-toolbox:is(:hover, :focus-within) { @@ -38,13 +41,13 @@ @include Animate { #titlebar:not([customizing]) { - transition: margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + transition: margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), background-color 1s var(--animation-easing-function) !important; } #TabsToolbar:not([customizing]) { @include _autohide_tabbar { - transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay) !important; + transition: opacity var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay) !important; } } diff --git a/src/autohide/_toolbar_overlap.scss b/src/autohide/_toolbar_overlap.scss index be1ea04..7b19dce 100644 --- a/src/autohide/_toolbar_overlap.scss +++ b/src/autohide/_toolbar_overlap.scss @@ -5,7 +5,7 @@ @include Animate { @include Option("userChrome.decoration.animate") { transition: margin-top 1s ease, - margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay); + margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay); &:is(:hover, :focus-within) { transition-delay: 0s !important; @@ -13,11 +13,11 @@ &[inFullscreen="true"] { transition: margin-top 1.3s var(--animation-easing-function) 50ms, - margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay); + margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay); } } @include NotOption("userChrome.decoration.animate") { - transition: margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay); + transition: margin-bottom var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay); &:is(:hover, :focus-within) { transition-delay: 0s !important; diff --git a/src/autohide/sidebar/_overlap.scss b/src/autohide/sidebar/_overlap.scss index c282701..4a20e52 100644 --- a/src/autohide/sidebar/_overlap.scss +++ b/src/autohide/sidebar/_overlap.scss @@ -1,3 +1,4 @@ +#sidebar-header, #sidebar { min-width: var(--uc-sidebar-width) !important; max-width: var(--uc-sidebar-width) !important; @@ -5,9 +6,12 @@ will-change: min-width, max-width; } -#sidebar-box:is(:hover, :focus-within) > #sidebar { - min-width: var(--uc-sidebar-activate-width) !important; - max-width: var(--uc-sidebar-activate-width) !important; +#sidebar-box:is(:hover, :focus-within) > { + #sidebar-header, + #sidebar { + min-width: var(--uc-sidebar-activate-width) !important; + max-width: var(--uc-sidebar-activate-width) !important; + } } :root[inFullscreen="true"] #sidebar-box { @@ -29,16 +33,20 @@ } @include Animate { + #sidebar-header, #sidebar { - transition: min-width 750ms var(--animation-easing-function) var(--uc-autohide-sidebar-delay) !important; + transition: min-width var(--uc-autohide-sidebar-speed) var(--animation-easing-function) var(--uc-autohide-sidebar-delay) !important; } - #sidebar-box:is(:hover, :focus-within) > #sidebar { - transition-delay: 0ms !important; + #sidebar-box:is(:hover, :focus-within) > { + #sidebar-header, + #sidebar { + transition-delay: 0ms !important; + } } :root[inFullscreen="true"] #sidebar-box { - transition: padding-inline-start 1s var(--animation-easing-function) var(--uc-autohide-sidebar-delay) !important; + transition: padding-inline-start var(--uc-autohide-fullscreen-sidebar-speed) var(--animation-easing-function) var(--uc-autohide-sidebar-delay) !important; &:is(:hover, :focus-within) { transition-delay: 0ms !important; diff --git a/src/autohide/sidebar/_static.scss b/src/autohide/sidebar/_static.scss index c1756c2..41ff435 100644 --- a/src/autohide/sidebar/_static.scss +++ b/src/autohide/sidebar/_static.scss @@ -32,7 +32,7 @@ @include Animate { #sidebar-box { - transition: min-width 750ms var(--animation-easing-function) var(--uc-autohide-sidebar-delay) !important; + transition: min-width var(--uc-autohide-sidebar-speed) var(--animation-easing-function) var(--uc-autohide-sidebar-delay) !important; &:is(:hover, :focus-within) { transition-delay: 0ms !important; @@ -40,7 +40,7 @@ } :root[inFullscreen="true"] #sidebar-box { - transition: margin-inline-start 1s var(--animation-easing-function) var(--uc-autohide-sidebar-delay) !important; + transition: margin-inline-start var(--uc-autohide-fullscreen-sidebar-speed) var(--animation-easing-function) var(--uc-autohide-sidebar-delay) !important; &[positionend="true"] { transition-property: margin-inline-end !important; diff --git a/src/bookmarkbar/_index.scss b/src/bookmarkbar/_index.scss new file mode 100644 index 0000000..360dee0 --- /dev/null +++ b/src/bookmarkbar/_index.scss @@ -0,0 +1,3 @@ +@include Option("userChrome.bookmarkbar.multi_row") { + @import "_multi_row"; +} diff --git a/src/bookmarkbar/_multi_row.scss b/src/bookmarkbar/_multi_row.scss new file mode 100644 index 0000000..06dbd38 --- /dev/null +++ b/src/bookmarkbar/_multi_row.scss @@ -0,0 +1,34 @@ +// Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/multi-row_bookmarks.css made available under Mozilla Public License v. 2.0 +// See the above repository for updates as well as full license text. + +#PersonalToolbar { + --uc-multirow-bookmark-rows: 3; + --uc-multirow-bookmark-row-margin: 2px; + max-height: none !important; +} + +#PlacesToolbar > hbox { + display: block; + width: 100vw; +} + +#PlacesToolbarItems { + display: flex; + flex-wrap: wrap; + overflow-y: auto; + scroll-snap-type: y mandatory; + max-height: calc(var(--uc-multirow-bookmark-rows) * + (var(--uc-bm-height, calc(20px + (2 * var(--bookmark-block-padding, 4px)))) + + (2 * var(--uc-multirow-bookmark-row-margin)))) !important; +} + +// Hide the all-bookmarks button +#PlacesChevron { + display: none; +} + +// Add some spacing between rows +#PlacesToolbarItems > .bookmark-item { + scroll-snap-align: start; + margin-block: var(--uc-multirow-bookmark-row-margin) !important; +} diff --git a/src/combined/_back_forward_button.scss b/src/combined/_back_forward_button.scss new file mode 100644 index 0000000..d99dcc3 --- /dev/null +++ b/src/combined/_back_forward_button.scss @@ -0,0 +1,143 @@ +//-- Mixin --------------------------------------------------------------------- +@mixin _combined_nav_button_background() { + > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-background); + } + &:not([disabled], [open]):hover > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-hover-background) !important; + box-shadow: 0 1px 6px hsla(0,0%,0%,.1); + border-color: hsla(240,5%,5%,.35); + } + &[open] > .toolbarbutton-icon, + &:not([disabled]):hover:active > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-active-background) !important; + border-color: hsla(240,5%,5%,.40); + } + + &[disabled="true"] { + > .toolbarbutton-icon { + background-color: color-mix(in srgb, var(--toolbarbutton-hover-background), var(--toolbar-field-background-color) 40%) !important; + fill: color-mix(in srgb, var(--toolbarbutton-icon-fill), transparent 60%); + } + } +} + +@mixin _back_button_circle_shape() { + z-index: 3 !important; + background-color: var(--toolbar-bgcolor) !important; + background-clip: content-box !important; + border-radius: 100%; + + padding-block: 0 !important; + @include NotOption("userChrome.autohide.back_button") { + padding-inline-end: 0 !important; + } + @include Option("userChrome.autohide.back_button") { + &:not([disabled="true"]) { + padding-inline-end: 0 !important; + } + &[disabled="true"] { + padding-inline-end: calc(var(--toolbarbutton-outer-padding) + 1px) !important; + } + } + + > menupopup { + margin-top: -1px !important; + } + + > .toolbarbutton-icon { + background-origin: padding-box; + background-clip: padding-box; + border: 1px solid var(--uc-combined-circlebutton-border-color); + border-radius: 10000px !important; + + padding-inline-end: var(--urlbar-icon-padding) !important; + height: auto !important + } +} + +//------------------------------------------------------------------------------ + +#nav-bar-customization-target > { + #forward-button { + --uc-forward-button-margin: calc(-1 * var(--uc-toolbarbutton-boundary) + 1px); + + z-index: 2; + position: relative; + + > .toolbarbutton-icon { + padding-inline-end: var(--urlbar-icon-padding) !important; /* Original: var(--toolbarbutton-inner-padding) */ + padding-block: var(--urlbar-icon-padding) !important; + height: var(--uc-urlbar-icon-size) !important; + } + + @include Option("userChrome.combined.urlbar.nav_button") { + padding-inline-end: 0px !important; /* Original: var(--toolbarbutton-outer-padding) */ + } + @include NotOption("userChrome.combined.urlbar.nav_button") { + @include NotOption("userChrome.combined.nav_button.none_forward_background") { + @include Option("userChrome.combined.urlbar.home_button") { + @include NotOption("userChrome.combined.nav_button.home_button") { + @include _combined_nav_button_background; + @include NotOption("userChrome.autohide.forward_button") { + &[disabled="true"] { + opacity: 1 !important; /* Original: 0.4 */ + } + } + } + } + @include NotOption("userChrome.combined.urlbar.home_button") { + @include _combined_nav_button_background; + @include NotOption("userChrome.autohide.forward_button") { + &[disabled="true"] { + opacity: 1 !important; /* Original: 0.4 */ + } + } + } + } + } + + @include NotOption("userChrome.autohide.forward_button") { + margin-inline-start: var(--uc-forward-button-margin) !important; + } + @include Option("userChrome.autohide.forward_button") { + &:not([disabled="true"]) { + margin-inline-start: var(--uc-forward-button-margin) !important; + } + } + } + + #back-button { + position: relative; + + @include _combined_nav_button_background; + @include NotOption("userChrome.autohide.back_button") { + &[disabled="true"] { + opacity: 1 !important; /* Original: 0.4 */ + } + } + @include Option("userChrome.combined.nav_button.home_button", "userChrome.combined.urlbar.home_button") { + z-index: 2; + + margin-inline-end: calc(-1 * var(--uc-toolbarbutton-boundary) - 1px) !important; + padding-inline-start: 0px !important; /* Original: var(--toolbarbutton-outer-padding) */ + + > .toolbarbutton-icon { + padding-inline-start: var(--urlbar-icon-padding) !important; /* Original: var(--toolbarbutton-inner-padding) */ + padding-block: var(--urlbar-icon-padding) !important; + height: var(--uc-urlbar-icon-size) !important; + } + } + + @include NotOption("userChrome.combined.nav_button.home_button") { + @include Option("userChrome.combined.urlbar.nav_button") { + @include NotOption("userChrome.combined.urlbar.home_button") { + @include _back_button_circle_shape; + } + } + @include NotOption("userChrome.combined.urlbar.nav_button") { + @include _back_button_circle_shape; + } + } + } +} diff --git a/src/combined/_home_button.scss b/src/combined/_home_button.scss new file mode 100644 index 0000000..3fb5a18 --- /dev/null +++ b/src/combined/_home_button.scss @@ -0,0 +1,31 @@ +#nav-bar-customization-target > #home-button { + z-index: 3; + position: relative; + + background-color: var(--toolbar-bgcolor) !important; + background-clip: content-box !important; + border-radius: 100%; + + padding-block: 0 !important; + padding-inline-end: 0 !important; + + > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-background); + background-origin: padding-box; + background-clip: padding-box; + border: 1px solid var(--uc-combined-circlebutton-border-color); + border-radius: 10000px !important; + + padding-inline-end: var(--urlbar-icon-padding) !important; + height: auto !important + } + &:hover > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-hover-background) !important; + box-shadow: 0 1px 6px hsla(0,0%,0%,.1); + border-color: hsla(240,5%,5%,.35); + } + &:hover:active > .toolbarbutton-icon { + background-color: var(--uc-combined-circlebutton-active-background) !important; + border-color: hsla(240,5%,5%,.40); + } +} diff --git a/src/combined/_index.scss b/src/combined/_index.scss new file mode 100644 index 0000000..1497da8 --- /dev/null +++ b/src/combined/_index.scss @@ -0,0 +1,114 @@ +/*= Combined - At URL bar ====================================================*/ +@include Option( + "userChrome.combined.nav_button", "userChrome.combined.nav_button.home_button", + "userChrome.combined.urlbar.nav_button", "userChrome.combined.urlbar.home_button", "userChrome.combined.urlbar.reload_button" +) { + // Init + #nav-bar { + // Color + --uc-combined-circlebutton-background: hsla(0,100%,100%,.5); + --uc-combined-circlebutton-hover-background: var(--uc-combined-circlebutton-background); + --uc-combined-circlebutton-active-background: var(--toolbarbutton-active-background); + --uc-combined-circlebutton-border-color: hsla(240,5%,5%,.3); + &[brighttext] { + // Original: Using :-moz-lwtheme + --uc-combined-circlebutton-background: var(--toolbarbutton-hover-background); + --uc-combined-circlebutton-hover-background: var(--toolbarbutton-active-background); + --uc-combined-circlebutton-active-background: color-mix(in srgb, currentColor 20%, transparent); + } + + // Padding & Size + --uc-toolbarbutton-boundary: calc(var(--toolbarbutton-outer-padding) + var(--toolbarbutton-inner-padding)); + --uc-toolbarbutton-padding: calc(2 * var(--uc-toolbarbutton-boundary)); + --uc-toolbarbutton-size: calc(12px + var(--uc-toolbarbutton-padding)); + --uc-toolbarbutton-halfsize: calc(6px + var(--uc-toolbarbutton-boundary)); + + --uc-urlbar-icon-size: calc(16px + 2 * var(--urlbar-icon-padding)); + } + + #nav-bar-customization-target > * { + -moz-box-ordinal-group: 1; + } + // Preserve + // `back` -> 2 + // `home` -> 3 + // `forward` -> 4 + #nav-bar-customization-target > #urlbar-container { + -moz-box-ordinal-group: 5; + } + // `reload` -> 6 + #nav-bar-customization-target > #urlbar-container ~ * { + -moz-box-ordinal-group: 7; + } +} + +@include Option("userChrome.combined.urlbar.nav_button", "userChrome.combined.urlbar.home_button") { + #nav-bar-customization-target > #urlbar-container { + /* var(--urlbar-margin-inline) */ + margin-inline-start: calc(-1 * var(--uc-urlbar-combined-margin, 0px)) !important; + + > #urlbar:not([breakout][breakout-extend]) { + padding-left: var(--uc-urlbar-combined-margin, 0px); + } + + @include Option("userChrome.combined.urlbar.nav_button") { + --uc-urlbar-combined-margin: var(--uc-toolbarbutton-size); + } + @include NotOption("userChrome.combined.urlbar.nav_button") { + --uc-urlbar-combined-margin: var(--uc-toolbarbutton-halfsize); + + @include Option("userChrome.combined.nav_button") { + @include Option("userChrome.combined.nav_button.home_button") { + @include Option("userChrome.combined.urlbar.home_button") { + --uc-urlbar-combined-margin: var(--uc-toolbarbutton-size); + } + } + } + } + } + #nav-bar-customization-target > #forward-button[disabled="true"] ~ #urlbar-container > #urlbar { + @include Option("userChrome.combined.urlbar.nav_button") { + @include Option("userChrome.autohide.forward_button") { + &:not([breakout][breakout-extend]) { + padding-left: calc(var(--uc-urlbar-combined-margin, 0px) - var(--urlbar-icon-padding)); + } + } + @include Animate { + transition-property: margin-left, padding-left; + transition-duration: 0.5s; + transition-timing-function: var(--animation-easing-function); + } + } + } +} + +@include Option("userChrome.combined.nav_button", "userChrome.combined.urlbar.nav_button") { + @import "back_forward_button"; +} +@include Option("userChrome.combined.nav_button") { + @include Option("userChrome.combined.nav_button.home_button") { + @import "home_button"; + } +} + +@include Option("userChrome.combined.urlbar.nav_button") { + #nav-bar-customization-target > #back-button { + -moz-box-ordinal-group: 2; + } + #nav-bar-customization-target > #forward-button { + -moz-box-ordinal-group: 4; + } +} +@include Option("userChrome.combined.urlbar.home_button") { + #nav-bar-customization-target > #home-button { + -moz-box-ordinal-group: 3; + } + @import "home_button"; +} +@include Option("userChrome.combined.urlbar.reload_button") { + #nav-bar-customization-target > #stop-reload-button { + -moz-box-ordinal-group: 6; + } + + @import "reload_button"; +} diff --git a/src/combined/_reload_button.scss b/src/combined/_reload_button.scss new file mode 100644 index 0000000..011eae7 --- /dev/null +++ b/src/combined/_reload_button.scss @@ -0,0 +1,22 @@ +// Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/reload_button_in_urlbar.css made available under Mozilla Public License v. 2.0 +// See the above repository for updates as well as full license text. +#urlbar { + padding-right: calc(var(--uc-toolbarbutton-size) - (var(--urlbar-margin-inline) / 2)); +} + +#nav-bar-customization-target > #stop-reload-button { + z-index: 3; + position: relative; + + --toolbarbutton-hover-background: var(--urlbar-box-hover-bgcolor); + color: var(--urlbar-box-hover-text-color) !important; + + margin-left: calc( -1 * (var(--uc-toolbarbutton-size) + var(--urlbar-margin-inline))); +} + +#nav-bar-customization-target > #stop-reload-button > .toolbarbutton-1 > .toolbarbutton-icon { + width: var(--uc-urlbar-icon-size) !important; + height: var(--uc-urlbar-icon-size) !important; + + padding: var(--urlbar-icon-padding) !important; +} diff --git a/src/compatibility/_os.scss b/src/compatibility/_os.scss index 905289e..30072d8 100644 --- a/src/compatibility/_os.scss +++ b/src/compatibility/_os.scss @@ -131,7 +131,7 @@ } /*= Linux - Titlebar button at lwtheme =====================================*/ - @include NotOption("userChrome.compatiblity.os.linux_non_native_titlebar_button") { + @include NotOption("userChrome.compatibility.os.linux_non_native_titlebar_button") { .titlebar-button:-moz-lwtheme { appearance: auto !important; } @@ -183,14 +183,28 @@ $_os_linuxDefaultShadow: 0 0 4px rgba(128, 128, 142, 0.5); } /*= Titlebar Container Size at maximized #384 ================================*/ -@include Option("userChrome.compatibility.os.windows_maximized") { - @include OS($win) { - :root[tabsintitlebar][sizemode="maximized"] #titlebar { - /* -moz-default-appearance: -moz-window-titlebar */ - appearance: none !important; +@include OS($win) { + :root[tabsintitlebar] { + @include NotOption("userChrome.compatibility.os.windows_maximized") { + #titlebar { + // Prevent #476 FF v105 above + /* -moz-default-appearance: -moz-window-titlebar */ + appearance: none !important; + } + @include OS($win7, $win8) { + &[sizemode="maximized"] #titlebar { + // Only win7, win8 #480 + padding-top: 8px; // Don't use margin-top for reserved fullscreen animation + } + } + } + @include Option("userChrome.compatibility.os.windows_maximized") { + &[sizemode="maximized"] #titlebar { + appearance: none !important; - // Prevent sideeffect #370 - padding-top: 8px; // Don't use margin-top for reserved fullscreen animation + // Prevent side effect #370 + padding-top: 8px; // Don't use margin-top for reserved fullscreen animation + } } } } diff --git a/src/compatibility/_theme.scss b/src/compatibility/_theme.scss index d426e15..3414cfe 100644 --- a/src/compatibility/_theme.scss +++ b/src/compatibility/_theme.scss @@ -48,7 +48,7 @@ menu { /*= Remove Tab Border ========================================================*/ @mixin _theme_removeTabBorder($options...) { %noneBorder { - /* Nigtly 96: 1px solid var(--tab-line-color, rgba(128,128,142,0.9)); */ + /* Nightly 96: 1px solid var(--tab-line-color, rgba(128,128,142,0.9)); */ border: unset !important; } @each $prefix, $postfix in $options { @@ -82,6 +82,13 @@ menu { } } +/*= Tab Separator Color ======================================================*/ +#TabsToolbar, +#nav-bar { + --toolbarseparator-color: color-mix(in srgb, currentColor 20%, transparent); /* 60% at v105 */ +} + + /*= Light Weight Theme =======================================================*/ /* Header Image */ :root[lwtheme-image] { @@ -109,11 +116,65 @@ menu { /* Navbar Border */ #navigator-toolbox:-moz-lwtheme { - --tabs-border-color: rgba(0, 0, 0, 0.3); /* Legacy: v96 */ - --lwt-tabs-border-color: rgba(0, 0, 0, 0.3); + --tabs-border-color: rgba(0, 0, 0, 0.4); /* Legacy: v96, (0, 0, 0, 0.3) -> (0, 0, 0, 0.4) */ + --lwt-tabs-border-color: rgba(0, 0, 0, 0.4); } /*= Findbar Border Color =====================================================*/ html|input.findbar-textbox { border: 1px solid var(--input-border-color, var(--toolbar-field-border-color, ThreeDShadow)) !important; /* Original: 1px solid var(--input-border-color, var(--toolbar-field-border-color)) */ } + +/*= Drop Indicator Color #473 ================================================*/ +treechildren::-moz-tree-cell-text(primary, dropOn), +treechildren::-moz-tree-drop-feedback, +vbox[part="drop-indicator-bar"] > image[part="drop-indicator"] { + background-color: var(--button-primary-bgcolor, var(--focus-outline-color)) !important; /* Original: SelectedItem or AccentColor*/ +} + +#bookmarksPanel[lwt-sidebar="true"] { + --focus-outline-color: var(--in-content-focus-outline-color, AccentColor) !important; +} + +/*= Menu color #477 ==========================================================*/ +@media (-moz-windows-non-native-menus) { + :root { + /* Override some menu color variables for light browser themes. */ + --menuitem-hover-background-color: #e0e0e6; + --menu-background-color: #f9f9fb; + --menu-color: #15141a; + --menuitem-disabled-hover-background-color: rgba(224, 224, 230, 0.4); + --menu-disabled-color: rgba(21, 20, 26, 0.4); + --menu-border-color: #cfcfd8; + --menu-icon-opacity: 0.7; + + /* Declare menu colors for dark themes, but don't override anything yet. */ + --dark-menuitem-hover-background-color: #52525e; + --dark-menu-background-color: #2b2a33; + --dark-menu-color: #fbfbfe; + --dark-menuitem-disabled-hover-background-color: rgba(82, 82, 94, 0.4); + --dark-menu-disabled-color: rgba(251, 251, 254, 0.4); + --dark-menu-border-color: #5b5b66; + --dark-menu-icon-opacity: 1; + } + + /* Override the menu color variables for dark browser themes. */ + @include Dark { + :root { + --menuitem-hover-background-color: var(--dark-menuitem-hover-background-color); + --menu-background-color: var(--dark-menu-background-color); + --menu-color: var(--dark-menu-color); + --menuitem-disabled-hover-background-color: var(--dark-menuitem-disabled-hover-background-color); + --menu-disabled-color: var(--dark-menu-disabled-color); + --menu-border-color: var(--dark-menu-border-color); + --menu-icon-opacity: var(--dark-menu-icon-opacity); + } + } +} + +/*= Firefox View Border #498 =================================================*/ +:root:not([privatebrowsingmode=temporary])[firefoxviewhidden] #firefox-view-button + #tabbrowser-tabs { + border-inline-start: none !important; + padding-inline-start: var(--tab-overflow-pinned-tabs-width) !important; + margin-inline-start: 0 !important; +} diff --git a/src/contents/_activity_stream.scss b/src/contents/_activity_stream.scss index acc839e..9fe952b 100644 --- a/src/contents/_activity_stream.scss +++ b/src/contents/_activity_stream.scss @@ -101,7 +101,7 @@ } /** Activity Stream - Home Search Bar looks like proton *********************/ - @include Option("userContent.newTab.animate") { + @include Option("userContent.newTab.searchbar") { /* Dropdown Colors */ #root { --newtab-search-background-color: rgba(255, 255, 255, 1); /* Same as light theme's --panel-background */ diff --git a/src/contents/_error_page.scss b/src/contents/_error_page.scss index aac860c..26283c9 100644 --- a/src/contents/_error_page.scss +++ b/src/contents/_error_page.scss @@ -4,11 +4,13 @@ { /* Illustrations Position */ #errorPageContainer, + .neterror > .container, .description-wrapper { min-height: 300px; background-position: left center; background-repeat: no-repeat; background-size: 38%; + background-image: var(--uc-error-llustration); } #errorPageContainer { @@ -34,33 +36,30 @@ //-- Mixin --------------------------------------------------------------------- -@mixin _backgroundImage($imgURL, $important: false) { - background-image: url($imgURL) if($important, !important, null); - @content; -} - @mixin _errorContainerImage($imgURL) { - #errorPageContainer { - @include _backgroundImage($imgURL) { - @content; - } + :root { + --uc-error-llustration: url(#{$imgURL}); + } + #errorPageContainer, + .neterror > .container { + @content; } } @mixin _errorDescriptionImage($imgURL) { + :root { + --uc-error-llustration: url(#{$imgURL}); + } .description-wrapper { - @include _backgroundImage($imgURL) { - @content; - } + @content; } } @mixin _errorTitleImage($imgURL) { @media (min-width: 970px) { .title { - @include _backgroundImage($imgURL, true) { - @content; - } + background-image: url($imgURL) !important; + @content; } } } @@ -69,8 +68,8 @@ @-moz-document url-prefix("about:neterror?e=connectionFailure"), url-prefix("about:neterror?e=netInterrupt"), - url-prefix("about:neterror?e=netTimeout"), url-prefix("about:neterror?e=netReset"), + url-prefix("about:neterror?e=netTimeout"), url-prefix("about:neterror?e=netOffline"), url("about:restartrequired"), url("chrome://browser/content/aboutRestartRequired.xhtml") { @@ -79,7 +78,9 @@ @-moz-document url-prefix("about:neterror?e=dnsNotFound") { @include _errorContainerImage("../icons/error-server-not-found.svg"); } -@-moz-document url-prefix("about:neterror?e=malformedURI") { +@-moz-document url-prefix("about:neterror?e=blockedByPolicy"), + url-prefix("about:neterror?e=deniedPortAccess"), + url-prefix("about:neterror?e=malformedURI") { @include _errorContainerImage("chrome://browser/skin/illustrations/error-malformed-url.svg"); } @-moz-document url-prefix("about:neterror?e=clockSkewError"), diff --git a/src/contents/_proton_color.scss b/src/contents/_proton_color.scss index ab1fc38..61a7ab8 100644 --- a/src/contents/_proton_color.scss +++ b/src/contents/_proton_color.scss @@ -19,12 +19,13 @@ @include Option("userContent.page.proton_color.system_accent") { :host, :root { - @include AccentColor { + @include AccentColor("Highlight") { --in-content-primary-button-text-color: #{$accentTextColor} !important; + + --in-content-primary-button-background: #{$accentColor} !important; + --in-content-primary-button-background-hover: color-mix(in srgb, black 10%, #{$accentColor}) !important; + --in-content-primary-button-background-active: color-mix(in srgb, black 20%, #{$accentColor}) !important; } - --in-content-primary-button-background: Highlight !important; - --in-content-primary-button-background-hover: color-mix(in srgb, black 10%, Highlight) !important; - --in-content-primary-button-background-active: color-mix(in srgb, black 20%, Highlight) !important; } } } diff --git a/src/contents/dark_mode/_accounts_com.scss b/src/contents/dark_mode/_accounts_com.scss index 7fef1fd..9796370 100644 --- a/src/contents/dark_mode/_accounts_com.scss +++ b/src/contents/dark_mode/_accounts_com.scss @@ -46,6 +46,7 @@ .input-row input[type="tel"], .input-row input[type="text"], .input-row input::placeholder, + .input-text, .firefox-family-services > ul > .firefox-service, .faint, .faint a, @@ -68,7 +69,9 @@ .input-row input[type="password"], .input-row input[type="tel"], .input-row input[type="text"], + .input-text, header, + .card, .bg-white:not(nav) { background: var(--in-content-box-background) !important; } diff --git a/src/contents/dark_mode/_addons_org.scss b/src/contents/dark_mode/_addons_org.scss index 39e8ec5..d5de91c 100644 --- a/src/contents/dark_mode/_addons_org.scss +++ b/src/contents/dark_mode/_addons_org.scss @@ -486,7 +486,7 @@ background: var(--in-content-border-color) !important; } - /* Othres */ + /* Others */ #promos .view-button a, #upload-file-finish.button, #upload-file-widget .button.prominent, diff --git a/src/contents/proton_contents/_proton_commons.scss b/src/contents/proton_contents/_proton_commons.scss index 6ce5de0..757bc58 100644 --- a/src/contents/proton_contents/_proton_commons.scss +++ b/src/contents/proton_contents/_proton_commons.scss @@ -191,13 +191,13 @@ richlistbox:focus-visible { border-color: transparent !important; outline: 2px solid var(--in-content-focus-outline-color) !important; - outline-offset: -1px !important; /* Prevents antialising around the corners */ + outline-offset: -1px !important; /* Prevents antialiasing around the corners */ } input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]):-moz-ui-invalid, textarea:-moz-ui-invalid { border-color: transparent !important; outline: 2px solid var(--in-content-border-invalid) !important; - outline-offset: -1px !important; /* Prevents antialising around the corners */ + outline-offset: -1px !important; /* Prevents antialiasing around the corners */ } input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]):disabled, textarea:disabled, diff --git a/src/counter/_bookmark_menu.scss b/src/counter/_bookmark_menu.scss new file mode 100644 index 0000000..62359f8 --- /dev/null +++ b/src/counter/_bookmark_menu.scss @@ -0,0 +1,17 @@ +menupopup[placespopup="true"] > menu.bookmark-item > .menu-right { + counter-reset: bookmark-counts 0; +} +menupopup[placespopup="true"] > menu.bookmark-item::after { + display: -moz-inline-box; + content: "(" counter(bookmark-counts) ")"; +} + +menupopup[placespopup="true"] > menu.bookmark-item > .menu-iconic-highlightable-text, +menupopup[placespopup="true"] > menu.bookmark-item > .menu-accel-container, +menupopup[placespopup="true"] > menu.bookmark-item > .menu-right { + -moz-box-ordinal-group: 2; +} + +menu.bookmark-item > menupopup[placespopup="true"] > .bookmark-item { + counter-increment: bookmark-counts; +} diff --git a/src/counter/_index.scss b/src/counter/_index.scss new file mode 100644 index 0000000..2fea34a --- /dev/null +++ b/src/counter/_index.scss @@ -0,0 +1,9 @@ +/*= Counter for Tab ==========================================================*/ +@include Option("userChrome.counter.tab") { + @import "tab"; +} + +/*= Counter for Bookmark menu ================================================*/ +@include Option("userChrome.counter.bookmark_menu") { + @import "bookmark_menu"; +} diff --git a/src/counter/_tab.scss b/src/counter/_tab.scss new file mode 100644 index 0000000..baeae33 --- /dev/null +++ b/src/counter/_tab.scss @@ -0,0 +1,100 @@ +//-- Mixin --------------------------------------------------------------------- +@mixin _tab_counter_without_centered() { + @include Option("userChrome.centered.tab") { + @include NotOption("userChrome.centered.tab.label") { + @content; + } + } + @include NotOption("userChrome.centered.tab") { + @content; + } +} + +// Copy from "../tab/sound_tab/show_with_favicons" +@mixin _hidden_tabIcon_soundTabLabel() { + @include NotOption("userChrome.hidden.tab_icon") { + @content; + } + @include Option("userChrome.hidden.tab_icon") { + @include NotOption("userChrome.hidden.tab_icon.always") { + @content; + } + } +} + +//------------------------------------------------------------------------------ + +#tabbrowser-tabs { + counter-reset: tab-counts; +} + +.tabbrowser-tab:not([hidden="true"]) { + counter-increment: tab-counts; + + // https://www.designcise.com/web/tutorial/how-to-add-space-before-or-after-an-element-using-css-pseudo-elements + &[pinned="true"] .tab-label-container::before { + content: "\00a0" counter(tab-counts); + } + &:not([pinned="true"]) .tab-label-container::before { + content: counter(tab-counts) ":\00a0"; + } + + .tab-label-container { + display: grid; + + align-content: safe center; + align-items: safe center; + + @include _tab_counter_without_centered { + justify-content: start; + justify-items: start; + } + + &::before { + display: inline-block; + grid-row: 1; + } + > .tab-text { + grid-row: 1; + } + + &[pinned] { + width: unset !important; /* Original: 0 */ + > .tab-text, + > .tab-secondary-label { + width: 0; + } + } + } +} + +// Like centered label +.tab-label, +.tab-secondary-label { + overflow: hidden; +} + +// Compatibility with sound tab +@include Option("userChrome.tab.sound_with_favicons") { + @include _hidden_tabIcon_soundTabLabel { + .tabbrowser-tab:not([sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) { + &[pinned] .tab-label-container { + &[labeldirection=ltr], + &:not([labeldirection]):-moz-locale-dir(ltr) { + --uc-sound-tab-label-position-x: 2px; + } + &[labeldirection=rtl], + &:not([labeldirection]):-moz-locale-dir(rtl) { + --uc-sound-tab-label-position-x: -2px; + } + } + .tab-label-container::before { + transform: translateX(var(--uc-sound-tab-label-position-x, 0px)); + } + } + } + + .tab-label-container::beforee { + transition: transform 0.25s var(--animation-easing-function); + } +} diff --git a/src/decoration/_animate.scss b/src/decoration/_animate.scss index 6b969fe..07deccc 100644 --- a/src/decoration/_animate.scss +++ b/src/decoration/_animate.scss @@ -40,9 +40,7 @@ margin-inline-start 0.2s var(--animation-easing-function), min-width 0.1s ease-out, max-width 0.1s ease-out !important; } &[pinned] { - transition: -moz-box-flex 0.2s var(--animation-easing-function), - margin-inline-start 0.2s var(--animation-easing-function) !important; - + transition: margin-inline-start 0.2s var(--animation-easing-function), min-width 0.1s ease-out, max-width 0.1s ease-out !important; } } @@ -81,6 +79,15 @@ } } +@include Option("userChrome.combined.urlbar_with_reload") { + #nav-bar-customization-target > #stop-reload-button .toolbarbutton-icon { + transition: background-color 2.5s var(--animation-easing-function) !important; + &:hover { + transition: background-color 1.25s var(--animation-easing-function) !important; + } + } +} + /*- Border - Other Fields --------------------------------------------------*/ #search-box, xul|search-textbox.tabsFilter, @@ -144,7 +151,7 @@ xul|search-textbox.tabsFilter, from { margin-top: 0; } - /* Dont' use `to`: Depending on density */ + /* Don't use `to`: Depending on density */ } /*- Expand - Synced Tabs ---------------------------------------------------*/ diff --git a/src/decoration/_cursor.scss b/src/decoration/_cursor.scss index 7166ca9..74aec7c 100644 --- a/src/decoration/_cursor.scss +++ b/src/decoration/_cursor.scss @@ -21,7 +21,9 @@ menuitem.openintabs-menuitem, #protections-popup-footer .protections-popup-footer-button, #protections-popup-multiView .panel-subview-footer-button, #identity-popup-clear-sitedata-button, -#identity-popup-more-info { +#identity-popup-more-info, +#unified-extensions-manage-extensions, +.unified-extensions-item-open-menu { cursor: pointer !important; } diff --git a/src/decoration/_field_border.scss b/src/decoration/_field_border.scss index 2198c57..6f88223 100644 --- a/src/decoration/_field_border.scss +++ b/src/decoration/_field_border.scss @@ -4,6 +4,12 @@ --toolbar-field-border-color: var(--toolbar-field-focus-border-color); } +@include Option("userChrome.combined.urlbar_with_reload") { + #nav-bar-customization-target > #stop-reload-button:hover ~ #urlbar-container #urlbar:not([focused="true"]) > #urlbar-background { + --toolbar-field-border-color: var(--toolbar-field-focus-border-color); + } +} + /*- Other Fields -----------------------------------------------------------*/ /* Sidebar */ .sidebar-panel[lwt-sidebar] #search-box:hover, diff --git a/src/decoration/_index.scss b/src/decoration/_index.scss index 711e9b2..e7f33d5 100644 --- a/src/decoration/_index.scss +++ b/src/decoration/_index.scss @@ -3,6 +3,16 @@ @import "cursor"; } +/*= Panel UI Button Separator ================================================*/ +@include Option("userChrome.decoration.panel_button_separator") { + @import "panel_button_separator"; +} + +/*= Panel UI Arrow ===========================================================*/ +@include Option("userChrome.decoration.panel_arrow") { + @import "panel_arrow"; +} + @include Animate { /*= Field Border ===========================================================*/ @include Option("userChrome.decoration.field_border") { diff --git a/src/decoration/_panel_arrow.scss b/src/decoration/_panel_arrow.scss new file mode 100644 index 0000000..ff3587b --- /dev/null +++ b/src/decoration/_panel_arrow.scss @@ -0,0 +1,22 @@ +#appMenu-popup { + background-image: url("../icons/panelarrow-vertical.svg"); + background-repeat: no-repeat; + background-position-x: right 10px; + background-position-y: top; + + -moz-context-properties: fill, stroke; + fill: var(--panel-background); + stroke: var(--panel-border-color); + + &[side="top"] { + margin-top: -8px !important; /* Original: -4px */ + padding-top: 4px; + } + &[side="bottom"] { + background-image: url("../icons/panelarrow-vertical-reverse.svg"); + background-position-y: bottom; + + margin-bottom: -8px !important; /* Original: -4px */ + padding-bottom: 4px; + } +} diff --git a/src/decoration/_panel_button_separator.scss b/src/decoration/_panel_button_separator.scss new file mode 100644 index 0000000..e236267 --- /dev/null +++ b/src/decoration/_panel_button_separator.scss @@ -0,0 +1,13 @@ +:root:not([chromehidden~="toolbar"]) #PanelUI-button { + // Original: not include at [uidensity=compact] + margin-inline-start: 3px; + padding-inline-start: 2px; + border-inline-start: 1px solid; + border-image: linear-gradient( + transparent 4px, + var(--toolbarseparator-color) 4px, + var(--toolbarseparator-color) calc(100% - 4px), + transparent calc(100% - 4px) + ); + border-image-slice: 1; +} diff --git a/src/fullscreen/_overlap.scss b/src/fullscreen/_overlap.scss index 387c057..686466f 100644 --- a/src/fullscreen/_overlap.scss +++ b/src/fullscreen/_overlap.scss @@ -8,7 +8,7 @@ } @include OS($linux) { - /* Fix transparent backgorund */ + /* Fix transparent background */ :root[tabsintitlebar][sizemode="fullscreen"] #TabsToolbar:not(:-moz-lwtheme) { appearance: auto !important; } diff --git a/src/hidden/_index.scss b/src/hidden/_index.scss index 8b38239..e305363 100644 --- a/src/hidden/_index.scss +++ b/src/hidden/_index.scss @@ -47,14 +47,32 @@ @include Option("userChrome.hidden.urlbar_iconbox") { #identity-box[pageproxystate="valid"] { - &.notSecureText #identity-icon-label, - &.chromeUI #identity-icon-box, - &.extensionPage #identity-icon-box { - display: none; - } + @include NotOption("userChrome.hidden.urlbar_iconbox.label_only") { + &.notSecureText #identity-icon-label, + &.chromeUI #identity-icon-box, + &.extensionPage #identity-icon-box { + display: none; + } - &.notSecureText #identity-icon-box { - padding-inline-end: 5px; /* Original: 8px */ + &.notSecureText #identity-icon-box { + padding-inline-end: 5px; /* Original: 8px */ + } + } + @include Option("userChrome.hidden.urlbar_iconbox.label_only") { + &.chromeUI #identity-icon-box, + &.extensionPage #identity-icon-box { + &:not(:hover) { + background-color: transparent !important; + } + + @include NotOption("userChrome.urlbar.iconbox_with_separator") { + padding-inline: var(--urlbar-icon-padding) !important; + } + } + + #identity-icon-label { + display: none !important; + } } } } @@ -76,7 +94,7 @@ menu, menuitem:not(#context-back, #context-forward) { &[disabled="true"] { - display: none !important; + visibility: collapse !important; } } @@ -84,7 +102,7 @@ #context-back, #context-forward { &[disabled="true"] { - display: none !important; + visibility: collapse !important; } } } diff --git a/src/icons/_global_menu.scss b/src/icons/_global_menu.scss index be303a1..0c20225 100644 --- a/src/icons/_global_menu.scss +++ b/src/icons/_global_menu.scss @@ -27,7 +27,7 @@ } #menu_savePage { - --menuitem-image: url("chrome://browser/skin/save.svg"); + --menuitem-image: url("../icons/toolbarButton-download.svg"); } #menu_sendLink { --menuitem-image: url("chrome://browser/skin/mail.svg"); @@ -230,6 +230,9 @@ menu.share-tab-url-item { #sync-reauthitem { } +#menu_openFirefoxView { + --menuitem-image: url("chrome://branding/content/icon32.png"); +} #webDeveloperMenu, /* Legacy */ #browserToolsMenu { --menuitem-image: url("../icons/developer.svg"); diff --git a/src/icons/_index.scss b/src/icons/_index.scss index 90c2e29..ee4a326 100644 --- a/src/icons/_index.scss +++ b/src/icons/_index.scss @@ -23,11 +23,13 @@ @include Option("userChrome.icon.global_menu") { @import "global_menu"; } -} - -/** Libray Menu ***************************************************************/ -@include Option("userChrome.icon.library") { - @include Option("userChrome.icon.menu") { + @include Option("userChrome.icon.library") { @import "library"; } } + +/** Waterfox ******************************************************************/ +@import "waterfox"; + +/** Tor Browser ***************************************************************/ +@import "tor_browser"; diff --git a/src/icons/_library.scss b/src/icons/_library.scss index fc2b57b..a65d505 100644 --- a/src/icons/_library.scss +++ b/src/icons/_library.scss @@ -55,7 +55,7 @@ } #fileImport { - --menuitem-image: url("chrome://browser/skin/save.svg"); + --menuitem-image: url("../icons/toolbarButton-download.svg"); } #fileExport { --menuitem-image: url("chrome://browser/skin/open.svg"); diff --git a/src/icons/_panel.scss b/src/icons/_panel.scss index 134724b..96974ae 100644 --- a/src/icons/_panel.scss +++ b/src/icons/_panel.scss @@ -41,21 +41,23 @@ padding-inline-start: var(--arrowpanel-menuimageblank-padding-horizontal) !important; } } -@include Option("userChrome.icon.panel_sparse") { - #appMenu-new-tab-button2, /* Seperate */ - #appMenu-passwords-button, /* Seperate */ - #appMenu-extensions-themes-button, - #appMenu-save-file-button2, /* Seperate */ - #appMenu-find-button2, - #appMenu-more-button2, /* Seperate */ - #appMenu-help-button2, - #appMenu-quit-button2 /* Seperate */ { - padding-top: var(--arrowpanel-menuitemblank-padding-block) !important; - padding-bottom: var(--arrowpanel-menuitemblank-padding-block) !important; - } - #appMenu-zoom-controls2, /* Legacy v104 */ - #appMenu-zoom-controls { - padding-inline-start: var(--arrowpanel-menuimageblank-padding-horizontal) !important; +@include NotOption("userChrome.icon.panel_photon") { + @include NotOption("userChrome.icon.panel_full") { + #appMenu-new-tab-button2, /* Separate */ + #appMenu-passwords-button, /* Separate */ + #appMenu-extensions-themes-button, + #appMenu-save-file-button2, /* Separate */ + #appMenu-find-button2, + #appMenu-more-button2, /* Separate */ + #appMenu-help-button2, + #appMenu-quit-button2 /* Separate */ { + padding-top: var(--arrowpanel-menuitemblank-padding-block) !important; + padding-bottom: var(--arrowpanel-menuitemblank-padding-block) !important; + } + #appMenu-zoom-controls2, /* Legacy v104 */ + #appMenu-zoom-controls { + padding-inline-start: var(--arrowpanel-menuimageblank-padding-horizontal) !important; + } } } #appMenu-new-window-button2 { @@ -88,7 +90,7 @@ } @include Option("userChrome.icon.panel_full") { #appMenu-save-file-button2 { - list-style-image: url("chrome://browser/skin/save.svg"); + list-style-image: url("../icons/toolbarButton-download.svg"); } #appMenu-find-button2 { list-style-image: url("chrome://global/skin/icons/search-glass.svg"); @@ -176,7 +178,7 @@ /* Color */ fill: currentColor; fill-opacity: var(--toolbarbutton-icon-fill-opacity); - -moz-context-properties: fill; + -moz-context-properties: fill, fill-opacity, stroke; background-size: 16px; background-repeat: no-repeat; @@ -416,7 +418,7 @@ panelMenuBookmarkThisPage[starred] { /*= protections-popup ========================================================*/ #protections-popup-settings-button > .protections-popup-settings-icon, #protections-popup-show-report-button > .protections-popup-show-report-icon { - -moz-context-properties: fill; + -moz-context-properties: fill, fill-opacity, stroke; fill: currentColor; margin-inline-end: 1em; } @@ -473,3 +475,8 @@ panelMenuBookmarkThisPage[starred] { #sidebarMenu-popup > .subviewbutton[data-l10n-id="sidebar-menu-close"] { list-style-image: url("chrome://global/skin/icons/close.svg"); } + +/*= unified-extensions-view ===================================================*/ +#unified-extensions-manage-extensions { + list-style-image: url("chrome://mozapps/skin/extensions/extension.svg"); +} diff --git a/src/icons/context_menu/_content_area.scss b/src/icons/context_menu/_content_area.scss index 416a09e..7821478 100644 --- a/src/icons/context_menu/_content_area.scss +++ b/src/icons/context_menu/_content_area.scss @@ -45,7 +45,7 @@ --menuitem-image: url("chrome://browser/skin/bookmark.svg"); } #context-savelink { - --menuitem-image: url("chrome://browser/skin/save.svg"); + --menuitem-image: url("../icons/toolbarButton-download.svg"); } #context-savelinktopocket { --menuitem-image: url("../icons/pocket-outline.svg"); @@ -148,7 +148,7 @@ } #context-savepage { - --menuitem-image: url("chrome://browser/skin/save.svg"); + --menuitem-image: url("../icons/toolbarButton-download.svg"); } #context-pocket { --menuitem-image: url("../icons/pocket-outline.svg"); @@ -243,7 +243,7 @@ /* iconic */ } -@include NativeMenu { +@include OS($mac) { #context-back { --menuitem-image: url("chrome://browser/skin/back.svg"); } @@ -261,3 +261,53 @@ --menuitem-image: url("chrome://browser/skin/bookmark.svg"); } } + +/*= Tab Mix Plus =============================================================*/ +#tm-autoreload_menu { + // --menuitem-image: url("../icons/reload-auto.svg"); + --menuitem-image: url("../icons/timer10.svg"); +} + +#tm-linkWithhistory { + // ic_fluent_skip_forward_tab_24_regular + --menuitem-image: url("../icons/new-tab-skip-forward.svg"); +} +#tm-openAllLinks { + --menuitem-image: url("../icons/new-tab-multiple.svg"); +} +#tm-openinverselink { + --menuitem-image: url("../icons/new-tab-forward.svg"); +} + +#tm-content-closetab { + --menuitem-image: url("../icons/dismiss-filled.svg"); +} +#tm-duplicateTabContext { + --menuitem-image: url("../icons/tab-copy.svg"); +} +#tm-duplicateinWinContext { + --menuitem-image: url("../icons/tab-desktop-multiple-bottom.svg"); +} +#tm-detachTabContext { + --menuitem-image: url("../icons/convert-range.svg"); +} +#tm-mergeWindows { + --menuitem-image: url("../icons/merge.svg"); +} +#tm-content-freezeTab { + --menuitem-image: url("../icons/weather-snowflake.svg"); +} +#tm-content-protectTab { + --menuitem-image: url("../icons/shield-task.svg"); +} +#tm-content-lockTab { + --menuitem-image: url("../icons/lock-closed.svg"); +} +#tm-tabsList { +} + +#tm-content-undoCloseTab { + --menuitem-image: url("../icons/undo.svg"); +} +#tm-content-undoCloseList { +} diff --git a/src/icons/context_menu/_others.scss b/src/icons/context_menu/_others.scss index 453f405..bb37ded 100644 --- a/src/icons/context_menu/_others.scss +++ b/src/icons/context_menu/_others.scss @@ -1,3 +1,15 @@ +/*= Notification =============================================================*/ +// https://github.com/mozilla/gecko-dev/blob/master/toolkit/components/alerts/alert.xhtml +#doNotDisturbMenuItem { + --menuitem-image: url(chrome://global/skin/media/pause-fill.svg); +} +#disableForOriginMenuItem { + --menuitem-image: url("chrome://global/skin/icons/blocked.svg"); +} +#openSettingsMenuItem { + --menuitem-image: url("chrome://global/skin/icons/settings.svg"); +} + /*= blockedPopupOptions ======================================================*/ #blockedPopupAllowSite { --menuitem-image: url("chrome://global/skin/icons/check.svg"); @@ -138,6 +150,9 @@ --menuitem-image: url("chrome://browser/skin/edit-paste.svg"); } #paste-and-go { + @include Option("userChrome.icon.menu.full") { + --menuitem-image: url("../icons/edit-paste-go.svg"); + } } #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_delete"] { --menuitem-image: url("chrome://global/skin/icons/delete.svg"); @@ -147,7 +162,7 @@ } /*= textbox-contextmenu ======================================================*/ -/* Browser's Searchbar, Libray's Searchbar, Page Info */ +/* Browser's Searchbar, Library's Searchbar, Page Info */ .textbox-contextmenu > menuitem[data-l10n-id="text-action-undo"] { --menuitem-image: url("../icons/undo.svg"); } @@ -175,6 +190,9 @@ /* Only searchbar */ menuitem.searchbar-paste-and-search { + @include Option("userChrome.icon.menu.full") { + --menuitem-image: url("../icons/edit-paste-search.svg"); + } } menuitem.searchbar-clear-history { --menuitem-image: url("chrome://browser/skin/forget.svg"); @@ -207,3 +225,14 @@ menuitem.searchbar-clear-history { #treestyletab_piro_sakura_ne_jp-menuitem-_context_sendTabsToDevice\:manage { --menuitem-image: url("chrome://global/skin/icons/settings.svg"); } + +/*= unified-extensions-context-menu ==========================================*/ +.unified-extensions-context-menu-manage-extension { + --menuitem-image: url("chrome://global/skin/icons/settings.svg"); +} +.unified-extensions-context-menu-remove-extension { + --menuitem-image: url("chrome://global/skin/icons/delete.svg"); +} +.unified-extensions-context-menu-report-extension { + --menuitem-image: url("../icons/send.svg"); +} diff --git a/src/icons/context_menu/_tab_toolbar.scss b/src/icons/context_menu/_tab_toolbar.scss index 2a38cb3..b704859 100644 --- a/src/icons/context_menu/_tab_toolbar.scss +++ b/src/icons/context_menu/_tab_toolbar.scss @@ -55,9 +55,10 @@ #treestyletab_piro_sakura_ne_jp-menuitem-_context_duplicateTab, #tabcenter-reborn_ariasuni-menuitem-_contextMenuDuplicateTab, #sidebartabs_asamuzak_jp-menuitem-_dupeTab { - --menuitem-image: url("../icons/notebook-subsection.svg"); + --menuitem-image: url("../icons/tab-copy.svg"); } #tabcenter-reborn_ariasuni-menuitem-_contextMenuUnloadTab { + --menuitem-image: url("../icons/tab-unload.svg"); } #context_bookmarkTab, @@ -119,10 +120,13 @@ #sidebartabs_asamuzak_jp-menuitem-_closeTab { --menuitem-image: url("chrome://global/skin/icons/close.svg"); } +#context_closeTabOptions, +#treestyletab_piro_sakura_ne_jp-menuitem-_context_closeMultipleTabs, #tabcenter-reborn_ariasuni-menuitem-_contextMenuCloseTabs, #sidebartabs_asamuzak_jp-menuitem-_closeMultipleTabs { -} -#context_closeTabOptions { + @include Option("userChrome.icon.menu.full") { + --menuitem-image: url("../icons/filter-dismiss.svg"); + } } #context_undoCloseTab, #treestyletab_piro_sakura_ne_jp-menuitem-_context_undoCloseTab, @@ -215,3 +219,66 @@ menuitem.viewCustomizeToolbar { #toolbar-context-menu > menuitem[data-l10n-id="full-screen-exit"] { --menuitem-image: url("chrome://browser/skin/fullscreen-exit.svg"); } + +/*= Tab Mix Plus =============================================================*/ +#context_openANewTab.tabmix-newtab-menu-icon { + .menu-iconic-left { + @include OS($win) { + display: none; + } + } +} +@include Option("userChrome.icon.menu.full") { + #tm-duplicateinWin { + --menuitem-image: url("../icons/tab-desktop-multiple-bottom.svg"); + } + #tm-mergeWindowsTab { + --menuitem-image: url("../icons/merge.svg"); + } +} +#tm-renameTab { + --menuitem-image: url("chrome://global/skin/icons/edit.svg"); +} +#tm-copyTabUrl { + --menuitem-image: url("../icons/link.svg"); +} + +#tm-autoreloadTab_menu { + // --menuitem-image: url("../icons/reload-auto.svg"); + --menuitem-image: url("../icons/timer10.svg"); +} +#context_reloadTabOptions { + --menuitem-image: url("../icons/reload.svg"); + @include Option("userChrome.icon.menu.full") { + --menuitem-image: url("../icons/filter-reload.svg"); + } + + #context_reloadTab { + @include NotOption("userChrome.icon.menu.full") { + --menuitem-image: url("../icons/blank.svg"); + } + } +} + +#tm-undoCloseList { +} + +#tm-docShell { + --menuitem-image: url("chrome://browser/skin/permissions.svg"); +} +#tm-freezeTab { + --menuitem-image: url("../icons/weather-snowflake.svg"); +} +#tm-protectTab { + --menuitem-image: url("../icons/shield-task.svg"); +} +#tm-lockTab { + @include Option("userChrome.icon.menu.full") { + --menuitem-image: url("../icons/lock-closed.svg"); + } +} + +#context_bookmarkAllTabs { + @include Option("userChrome.icon.menu.full") { + --menuitem-image: url("../icons/bookmark-multiple.svg"); + } +} diff --git a/src/icons/layout/_activity_stream.scss b/src/icons/layout/_activity_stream.scss index fb5fcae..20d6121 100644 --- a/src/icons/layout/_activity_stream.scss +++ b/src/icons/layout/_activity_stream.scss @@ -1,16 +1,15 @@ +@import "./menu_common"; + .context-menu-list .context-menu-item button { padding-inline-start: 0 !important; } .context-menu-list .context-menu-item button span { + @include _layout_icon_menus; + padding-inline-start: 24px; /* 16p + (4px * 2) */ - - -moz-context-properties: fill, fill-opacity !important; - fill: currentColor !important; - - /* Layout */ - background-size: 16px; - background-repeat: no-repeat; - background-image: var(--menuitem-image); - background-position: left 4px center; + background-position: var(--uc-menu-background-position, left) 4px center; + &:dir(rtl) { + --uc-menu-background-position: right; + } } diff --git a/src/icons/layout/_bookmark_menu.scss b/src/icons/layout/_bookmark_menu.scss index 5b55528..7e3a8a3 100644 --- a/src/icons/layout/_bookmark_menu.scss +++ b/src/icons/layout/_bookmark_menu.scss @@ -1,5 +1,5 @@ /*= Bookmark Menu - Layout ===================================================*/ -/* #goPopup(Legacy of historyMenuPoup), #historyMenuPopup, #bookmarksMenuPopup: looks like global menu +/* #goPopup(Legacy of historyMenuPopup), #historyMenuPopup, #bookmarksMenuPopup: looks like global menu * #BMB_bookmarksPopup: looks like arrow panel */ @@ -66,7 +66,7 @@ $_bookmarkToolbarMenus: selector.nest( } @include _layoutBookmarkMenu() { margin-inline: var(--arrowpanel-menuitem-padding-inline) !important; - background-position: left calc(var(--arrowpanel-menuicon-padding)) center !important; + background-position: var(--uc-menu-background-position) calc(var(--arrowpanel-menuicon-padding)) center !important; } @include _layoutBookmarkPopup() { padding-inline-start: calc(var(--arrowpanel-menuicon-padding) + var(--context-menu-text-padding) + 2px) !important; @@ -82,7 +82,7 @@ $_bookmarkToolbarMenus: selector.nest( @include _layoutBookmarkMenu() { margin-inline: var(--arrowpanel-menuitem-padding-inline) !important; padding-inline-start: calc(var(--arrowpanel-menuicon-padding) + var(--context-menu-text-padding)) !important; - background-position: left calc(var(--arrowpanel-menuicon-padding)) center !important; + background-position: var(--uc-menu-background-position) calc(var(--arrowpanel-menuicon-padding)) center !important; } } @@ -101,6 +101,12 @@ $_bookmarkToolbarMenus: selector.nest( /* Bookmark Popup - None icon menu */ @include _layoutBookmarkMenu() { padding-inline-start: calc(var(--arrowpanel-menuitem-padding-inline) + 1px) !important; + + .menu-text { + // https://github.com/mozilla/gecko-dev/commit/e54707888510dec75db59a170b287d1db031505a + // https://github.com/mozilla/gecko-dev/blob/e54707888510dec75db59a170b287d1db031505a/toolkit/themes/linux/global/menu.css#L103 + margin-inline-start: 21px !important; + } } } @@ -108,11 +114,19 @@ $_bookmarkToolbarMenus: selector.nest( /* Bookmark Popup - As Arrow Panel */ #PersonalToolbar menupopup menuitem, #PersonalToolbar menupopup menu { - padding-inline: calc(var(--arrowpanel-menuicon-padding) + var(--arrowpanel-menuitem-padding-inline)) !important; + padding-inline: var(--arrowpanel-menuitem-padding-inline) !important; } /* Bookmark Popup - None icon menu */ @include _layoutBookmarkPopup() { padding-inline-start: calc(var(--arrowpanel-menuitem-padding-inline) + 3px) !important; } + @include _layoutBookmarkToolbar() { + padding-inline-start: calc(var(--arrowpanel-menuitem-padding-inline) + 1px) !important; + } + @include _layoutBookmarkMenu() { + > .menu-text { + padding-inline-start: var(--context-menu-mac-padding) !important; + } + } } diff --git a/src/icons/layout/_menu.scss b/src/icons/layout/_menu.scss index 93aac39..b0b8baf 100644 --- a/src/icons/layout/_menu.scss +++ b/src/icons/layout/_menu.scss @@ -7,7 +7,8 @@ $_layoutCommonMenus: ( $_libraryMenuitem, $_libraryMenu, $_sendTabMenuitem, - $_otherIconMenu + $_otherIconMenu, + "#context_openANewTab.tabmix-newtab-menu-icon" ); @mixin _layoutInitIconMenus() { #{$_globalMenus}, @@ -41,6 +42,10 @@ $_layoutCommonMenus: ( @include _layoutInitIconMenus { @include _layout_icon_menus; } +#tabContextMenu > .tabmix-newtab-menu-icon { + -moz-context-properties: fill, fill-opacity, stroke !important; + fill: currentColor !important; +} /* For native context menus */ #{$_nestedPopupIconMenus} { @@ -56,12 +61,12 @@ $_layoutCommonMenus: ( /* Menubar */ @include Option("userChrome.icon.global_menubar") { #{$_globalMenus} { - background-position: left var(--context-menu-background-padding-default) center !important; + background-position: var(--uc-menu-background-position) var(--context-menu-background-padding-default) center !important; padding-inline-start: calc(16px + var(--context-menu-background-padding-default)) !important; padding-inline-end: 3px; &:first-child { - background-position: left calc(3px + var(--context-menu-background-padding-default)) center !important; + background-position: var(--uc-menu-background-position) calc(3px + var(--context-menu-background-padding-default)) center !important; padding-inline-start: calc(19px + var(--context-menu-background-padding-default)) !important; } > menupopup { @@ -113,7 +118,8 @@ $_layoutCommonMenus: ( } /* Checkbox menuitem, None iconic menu */ - #{selector.nest($_nestedPopupPadding, "menuitem[checked=\"true\"], menu:not(.menu-iconic)")} { + #{selector.nest($_nestedPopupPadding, "menuitem[type=\"checkbox\"]")} { + // "menuitem[checked=\"true\"], menu:not(.menu-iconic)" @include _layout_init_mac_others; } diff --git a/src/icons/layout/_menu_common.scss b/src/icons/layout/_menu_common.scss index 5ed7246..079960a 100644 --- a/src/icons/layout/_menu_common.scss +++ b/src/icons/layout/_menu_common.scss @@ -1,6 +1,6 @@ //-- Variables ----------------------------------------------------------------- // Items -// .menu-iconic, .menuitem-iconic: Alreay exist, not target. +// .menu-iconic, .menuitem-iconic: Already exist, not target. // .in-menulist: Not a range because it is a select menu of web content. // [checked="true"]: There should be a check mark instead of an icon. $_iconNoneCommon: ".in-menulist, [checked=\"true\"]"; @@ -44,7 +44,7 @@ $_initialMenus: selector.append( // Icon @mixin _layout_icon_menus() { /* Color */ - -moz-context-properties: fill, fill-opacity !important; + -moz-context-properties: fill, fill-opacity, stroke !important; fill: currentColor !important; /* Layout */ @@ -62,12 +62,16 @@ $_initialMenus: selector.append( // Padding @mixin _layout_root_padding() { :root { + --uc-menu-background-position: left; --context-menu-background-padding-default: 5px; --context-menu-background-padding: var(--context-menu-background-padding-default); + &:-moz-locale-dir(rtl) { + --uc-menu-background-position: right; + } } } @mixin _layout_init_padding() { - background-position: left var(--context-menu-background-padding) center !important; + background-position: var(--uc-menu-background-position) var(--context-menu-background-padding) center !important; padding-inline-start: var(--context-menu-background-padding) !important; } diff --git a/src/icons/layout/_panel.scss b/src/icons/layout/_panel.scss index 546fd63..b003c25 100644 --- a/src/icons/layout/_panel.scss +++ b/src/icons/layout/_panel.scss @@ -9,7 +9,7 @@ width: 16px; } -@include Option("userChrome.icon.panel_photon", "userChrome.icon.panel_sparse") { +@include NotOption("userChrome.icon.panel_full") { :root { /* Global */ --arrowpanel-menuicon-paddingx2: calc(var(--arrowpanel-menuicon-padding) * 2); @@ -39,6 +39,7 @@ } #appMenu-proton-update-banner .toolbarbutton-text { margin-inline-start: 0 !important; + padding-inline-start: 0 !important; /* FF v107 */ } #appMenu-multiView .subviewbutton::before, @@ -50,9 +51,7 @@ } #appMenu-proton-update-banner { margin-bottom: 2px !important; -} -#appMenu-proton-update-banner::before { - margin-inline-start: var(--arrowpanel-menuitem-padding-inline) !important; + padding-inline-start: var(--arrowpanel-menuitem-padding-inline) !important; } #appMenu-fxa-status2, #appMenu-zoom-controls2, /* Legacy v104 */ @@ -80,15 +79,14 @@ #appMenu-multiView .subviewbutton::before, #appMenu-proton-update-banner::before, #downloadsHistory .button-icon, -.subviewbutton > image { +.subviewbutton:not(#appMenu-proton-update-banner) > image { fill: currentColor !important; fill-opacity: var(--toolbarbutton-icon-fill-opacity) !important; - -moz-context-properties: fill !important; + -moz-context-properties: fill, fill-opacity, stroke !important; } #appMenu-zoomReduce-button2 > .toolbarbutton-icon, #appMenu-zoomEnlarge-button2 > .toolbarbutton-icon { stroke: var(--zoom-controls-bgcolor, var(--button-bgcolor, ButtonFace)) !important; - -moz-context-properties: fill, stroke !important; } #appMenu-zoomReduce-button2:not([disabled], [open], :active):is(:hover) > .toolbarbutton-icon, #appMenu-zoomEnlarge-button2:not([disabled], [open], :active):is(:hover) > .toolbarbutton-icon { diff --git a/src/leptonChrome.scss b/src/leptonChrome.scss index 762566e..d9959d8 100644 --- a/src/leptonChrome.scss +++ b/src/leptonChrome.scss @@ -5,13 +5,15 @@ @use "utils/accent_color" as *; @use "utils/native_menu" as *; @use "utils/one_liner" as *; +@use "utils/window_control" as *; +@use "utils/has" as *; @use "utils/proton_elements" as Proton; @use "sass:selector"; @namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"; @namespace html "http://www.w3.org/1999/xhtml"; -/** Default Thme - Contrast ***************************************************/ +/** Default Theme - Contrast **************************************************/ @include Option("userChrome.theme.built_in_contrast") { @import "theme/built_in"; } @@ -34,9 +36,15 @@ /** Tab Bar UI ****************************************************************/ @import "tabbar/index"; -/** Tab UI ****************************************************************/ +/** Tab UI ********************************************************************/ @import "tab/index"; +/** Nav Bar UI ****************************************************************/ +@import "navbar/index"; + +/** Bookark Bar UI ************************************************************/ +@import "bookmarkbar/index"; + /** Url View UI ***************************************************************/ @import "urlview/index"; @@ -46,6 +54,13 @@ /** Sidebar UI ****************************************************************/ @import "sidebar/index"; +/** Combined UI ***************************************************************/ +@import "combined/index"; + +/** Others UI *****************************************************************/ +@import "counter/index"; +@import "others/index"; + /** Fullscreen - Overlap toolbar **********************************************/ @import "fullscreen/index"; @@ -59,13 +74,6 @@ @import "hidden/index"; /** Icons *********************************************************************/ -@import "icons/index"; - -/** Waterfox ******************************************************************/ -@import "icons/waterfox"; -@include Option("userChrome.theme.fully_color") { - @import "theme/waterfox"; +@include NotOption("userChrome.icon.disabled") { + @import "icons/index"; } - -/** Tor Browser ***************************************************************/ -@import "icons/tor_browser"; diff --git a/src/leptonContent.scss b/src/leptonContent.scss index 01e47c2..50af254 100644 --- a/src/leptonContent.scss +++ b/src/leptonContent.scss @@ -40,8 +40,10 @@ } /** Menu - Icons Layout *******************************************************/ -@include Option("userChrome.icon.menu") { - @import "contents/context_menu"; +@include NotOption("userChrome.icon.disabled") { + @include Option("userChrome.icon.menu") { + @import "contents/context_menu"; + } } /** Download Panel ************************************************************/ diff --git a/src/library/_folder_icons.scss b/src/library/_folder_icons.scss index 9b33496..931b7e8 100644 --- a/src/library/_folder_icons.scss +++ b/src/library/_folder_icons.scss @@ -3,7 +3,7 @@ :-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) .bookmark-item[container="true"]:not([query="true"], [tagContainer], [dayContainer]), /* in Sidebar, Library, Add/Edit Bookmark dialog */ /* https://github.com/rillian/firefox/blob/1f88437d263f56bdede4f20f69ba9c7b62f57001/layout/style/nsCSSAnonBoxList.h#L85-L98 */ -/* Need to overide!!, can not use :not() */ +/* Need to override!!, can not use :not() */ :-moz-any(#bookmarks-view, #historyTree, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, container), #editBMPanel_folderMenuList:not([selectedGuid="toolbar_____"], [selectedGuid="menu________"]), #editBMPanel_folderMenuList .folder-icon:not([id]), @@ -69,7 +69,7 @@ list-style-image: url("chrome://browser/skin/places/tag.svg") !important; } -/* Boomark */ +/* Bookmark */ :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_allbms_____v) { list-style-image: url("chrome://browser/skin/bookmark.svg") !important; } @@ -111,7 +111,7 @@ list-style-image: url("../icons/tag-open.svg") !important; } -/* Boomark */ +/* Bookmark */ :-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, open, OrganizerQuery_allbms_____v) { list-style-image: url("chrome://browser/skin/bookmark-hollow.svg") !important; } diff --git a/src/library/_menubar.scss b/src/library/_menubar.scss index c9624a5..9fd615f 100644 --- a/src/library/_menubar.scss +++ b/src/library/_menubar.scss @@ -6,7 +6,7 @@ #forward-button, #clearDownloadsButton { fill: currentColor !important; - -moz-context-properties: fill !important; + -moz-context-properties: fill, fill-opacity, stroke !important; } /* Add */ diff --git a/src/library/_proton.scss b/src/library/_proton.scss index 86ba436..8a1d961 100644 --- a/src/library/_proton.scss +++ b/src/library/_proton.scss @@ -275,6 +275,11 @@ treechildren { &::-moz-tree-separator(selected) { border-color: var(--organizer-selected-color) !important; } + + &::-moz-tree-cell-text(primary, dropOn), + &::-moz-tree-drop-feedback { + background-color: var(--organizer-outline-color) !important; + } } /*- Info Box -------------------------------------------------------------*/ diff --git a/src/library/_proton_contents.scss b/src/library/_proton_contents.scss index 9753ce8..f50b6de 100644 --- a/src/library/_proton_contents.scss +++ b/src/library/_proton_contents.scss @@ -1,7 +1,7 @@ $iconSelector: "> .menu-iconic-left > .menu-iconic-icon"; $checkedIconSelector: "> .menu-iconic-left[checked=\"true\"] > .menu-iconic-icon"; -/*- Radio Button ---------------------------------------------------------*/ +/*- Radio Button -------------------------------------------------------------*/ menuitem[type="radio"] { @include Proton.RadioGlobal; @@ -41,7 +41,7 @@ menuitem[type="checkbox"][disabled="true"] { @include Proton.DisabledMenuItem; } -/*- Check Box ------------------------------------------------------------*/ +/*- Check Box ----------------------------------------------------------------*/ /* From checkbox.css */ menuitem[type="checkbox"] { @include Proton.CheckboxGlobal(true); @@ -99,7 +99,7 @@ menuitem[type="checkbox"] { } } -/*- Menu Separtor --------------------------------------------------------*/ +/*- Menu Separator -----------------------------------------------------------*/ menuseparator { appearance: none !important; min-width: 2px; diff --git a/src/navbar/_as_sidebar.scss b/src/navbar/_as_sidebar.scss new file mode 100644 index 0000000..8d813d4 --- /dev/null +++ b/src/navbar/_as_sidebar.scss @@ -0,0 +1,139 @@ +:root { + --uc-navbar-margin-block: var(--toolbarbutton-inner-padding); + --uc-urlbar-margin-top: calc(var(--uc-navbar-height) + var(--uc-navbar-margin-block)); + + --uc-urlbar-container-height: 36px; + --uc-navbar-sideblock-height: calc(var(--uc-urlbar-margin-top) + var(--uc-urlbar-container-height)); +} + +#nav-bar, +#sidebar-box, +#sidebar-header, +#sidebar { + min-width: var(--uc-sidebar-activate-width) !important; + max-width: var(--uc-sidebar-activate-width) !important; +} + +#nav-bar, +#wrapper-urlbar-container, +#urlbar-container { + position: absolute !important; +} + +#nav-bar-customization-target { + -moz-box-pack: justify; +} +#nav-bar { + // --toolbarbutton-outer-padding: 0px !important; + z-index: 1; + + margin-top: calc(var(--uc-tabbar-height) + var(--uc-bm-height) + var(--uc-menubar-height) + var(--uc-navbar-margin-block)); // drag space + overflow-y: visible !important; // show urlbar + + background: none !important; + box-shadow: none !important; + + -moz-window-dragging: drag; +} +@include Has { + :root:has(#sidebar-box[hidden="true"]) #nav-bar { + margin-inline-start: var(--uc-sidebar-activate-width-reverse) !important; + opacity: 0; + visibility: hidden; // If use `collapse`, inline `--urlbar-toolbar-height` variable is calculated strangely small. + } + :root:has(#sidebar-box[positionend="true"]) #nav-bar { + right: 0; + } +} +@include Animate { + @include Option("userChrome.decoration.animate") { + @include NotOption("userChrome.decoration.disable_sidebar_animate") { + #nav-bar { + transition: margin-inline-start 0.25s var(--animation-easing-function), + opacity 0.25s ease-in-out, + visibility 0s linear, + margin-top var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), + var(--ext-theme-background-transition)!important; + will-change: margin-inline-start, opacity, visibility, margin-top; + } + :root:has(#sidebar-box[hidden="true"]) #nav-bar, + #navigator-toolbox:is(:hover, :focus-within) #nav-bar { + transition-delay: 0s, 0s, 0.25s, 0s, 0s !important; + } + } + @include Option("userChrome.decoration.disable_sidebar_animate") { + #nav-bar { + transition: margin-top var(--uc-autohide-toolbar-speed) var(--animation-easing-function) var(--uc-autohide-toolbar-delay), var(--ext-theme-background-transition) !important; + will-change: margin-top; + } + #navigator-toolbox:is(:hover, :focus-within) #nav-bar { + transition-delay: 0s !important; + } + } + } +} + +#urlbar-container { + top: var(--uc-urlbar-margin-top); + min-width: calc(var(--uc-sidebar-activate-width) - (2 * var(--toolbarbutton-inner-padding))) !important; + + margin-inline: auto !important; /* Original: var(--urlbar-margin-inline) */ + left: 50%; + transform: translateX(-50%); +} +#customizableui-special-spring1, +#customizableui-special-spring2, +#wrapper-customizableui-special-spring1, +#wrapper-customizableui-special-spring2 { + display: none !important; +} + +#sidebar-header { + margin-top: var(--uc-navbar-sideblock-height) !important; + -moz-window-dragging: drag; +} + +:root[customizing="true"] { + #wrapper-urlbar-container { + left: 50%; + } + + #browser[collapsed="true"] { + visibility: visible !important; + + #appcontent { + visibility: collapse; + } + + #sidebar-box { + position: absolute; + height: 100%; + + &[positionend="true"] { + right: 0; + } + } + } + + #customization-container { + --uc-customization-conatiner-margin: var(--uc-navbar-height-default); + @include Option("userChrome.hidden.tabbar") { + --uc-customization-conatiner-margin: calc(var(--uc-navbar-height-default) - var(--uc-tabbar-height-default)); + } + + width: calc(100% - var(--uc-sidebar-activate-width)); + height: calc(100% - var(--uc-customization-conatiner-margin)); + } + + &:has(#sidebar-box:not([positionend="true"])) #customization-container { + margin-inline-start: var(--uc-sidebar-activate-width); + } + &:has(#sidebar-box[positionend="true"]) #customization-container { + margin-inline-end: var(--uc-sidebar-activate-width); + } + + #customization-palette-container, + #customization-panel-container { + flex-shrink: 0.5 !important; + } +} diff --git a/src/navbar/_index.scss b/src/navbar/_index.scss new file mode 100644 index 0000000..6d9b9fe --- /dev/null +++ b/src/navbar/_index.scss @@ -0,0 +1,4 @@ +/*= Nav Bar - Navbar comabine with sidebar===================================*/ +@include Option("userChrome.navbar.as_sidebar") { + @import "as_sidebar"; +} diff --git a/src/others/_findbar_floating_on_top.scss b/src/others/_findbar_floating_on_top.scss new file mode 100644 index 0000000..0019efe --- /dev/null +++ b/src/others/_findbar_floating_on_top.scss @@ -0,0 +1,74 @@ +/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/floating_findbar_on_top.css made available under Mozilla Public License v. 2.0 +See the above repository for updates as well as full license text. */ + +/* Note that privacy.resistFingerprinting.letterboxing prevents this from working properly */ + +findbar { + -moz-box-ordinal-group: 0; + position: relative; + + height: 0 !important; + overflow: visible; + border-top: none !important; + padding: 0 !important; + background: none !important; + pointer-events: none; + z-index: 1; + + // Move findbar so it isn't over the scrollbar + // Delete if you want findbar to begin from right window edge + margin-right: 16px; + border-right: 1px solid var(--chrome-content-separator-color); + + &::before { + content:""; + display: -moz-box; + -moz-box-flex: 200; + } +} + +.findbar-container, +.findbar-closebutton { + border: 1px solid var(--chrome-content-separator-color); + border-width: 0 0 1px 0px; + background: var(--uc-light-bkgnd-color, var(--toolbar-bgcolor)) !important; + pointer-events: auto; + height: 33px !important; +} + +.findbar-container { + -moz-box-direction: reverse; + border-left-width: 1px; + border-bottom-left-radius: 4px; + + > .findbar-find-fast { + padding: var(--toolbarbutton-inner-padding) 1px; + margin: 0 !important; + } + > .findbar-find-status { + display: -moz-box; + overflow: hidden; + text-overflow: ellipsis; + -moz-box-flex: 1; + } + > hbox { + margin-inline: 5px; + } +} + +.findbar-closebutton { + box-sizing: padding-box; + width: 30px !important; /* Original: 24px */ + margin: 0 !important; + border-radius: 0 4px 4px 0 !important; + padding: 2px 5px 2px 3px !important; + overflow: clip; + + image { + padding: 4px; + border-radius: var(--toolbarbutton-border-radius); + } + &:hover > image{ + background: var(--toolbarbutton-hover-background) !important; + } +} diff --git a/src/others/_index.scss b/src/others/_index.scss new file mode 100644 index 0000000..d968582 --- /dev/null +++ b/src/others/_index.scss @@ -0,0 +1,3 @@ +@include Option("userChrome.findbar.floating_on_top") { + @import "findbar_floating_on_top"; +} diff --git a/src/padding/_bookmarkbar.scss b/src/padding/_bookmarkbar.scss index aee9f5e..39e4d5b 100644 --- a/src/padding/_bookmarkbar.scss +++ b/src/padding/_bookmarkbar.scss @@ -1,3 +1,3 @@ :root[uidensity="compact"] #PersonalToolbar toolbarbutton { - margin-top: 0px; /* Original: 2px */ + margin-top: 0px !important; /* Original: 2px */ } diff --git a/src/padding/_drag_space.scss b/src/padding/_drag_space.scss index 2cfa38e..07e0f75 100644 --- a/src/padding/_drag_space.scss +++ b/src/padding/_drag_space.scss @@ -1,7 +1,7 @@ /* for Extra Drag Space */ // https://searchfox.org/mozilla-esr78/search?q=--space-above-tabbar&path=&case=false®exp=false :root { - --space-above-tabbar: 8px; /* If the option is not specified, it is equivalent to 0px. */ + --uc-space-above-tabbar: 8px; /* If the option is not specified, it is equivalent to 0px. */ } //-- Mixin --------------------------------------------------------------------- @@ -33,28 +33,28 @@ @include OS($win10) { @include _dragSpaceHeight { - height: calc(var(--tab-min-height) + var(--space-above-tabbar) - var(--tabs-navbar-shadow-size)); + height: calc(var(--tab-min-height) + var(--uc-space-above-tabbar) - var(--tabs-navbar-shadow-size)); } } @include OS($win7, $win8, $linux) { @include _dragSpaceHeight { - height: calc(var(--tab-min-height) + var(--space-above-tabbar)); + height: calc(var(--tab-min-height) + var(--uc-space-above-tabbar)); } } @include OS($mac) { #TabsToolbar > .toolbar-items { - padding-top: var(--space-above-tabbar) !important; + padding-top: var(--uc-space-above-tabbar) !important; } } @include OS($win7) { /* Add 4px extra margin on top of the tabs toolbar on Windows 7. */ @include _dragSpacePadding { - padding-top: calc(var(--space-above-tabbar) + 4px) !important; + padding-top: calc(var(--uc-space-above-tabbar) + 4px) !important; } } @include OS($win8, $win10, $linux) { @include _dragSpacePadding { - padding-top: var(--space-above-tabbar) !important; + padding-top: var(--uc-space-above-tabbar) !important; } } diff --git a/src/padding/_first_tab.scss b/src/padding/_first_tab.scss index 64c3033..508a964 100644 --- a/src/padding/_first_tab.scss +++ b/src/padding/_first_tab.scss @@ -1,9 +1,18 @@ /* for First Tab Space */ :root { - --space-left-tabbar: 8px; /* If the option is not specified, it is equivalent to 0px. */ + --uc-space-left-tabbar: 8px; /* If the option is not specified, it is equivalent to 0px. */ } -:root:not([tabsintitlebar]) #tabbrowser-tabs:not([positionpinnedtabs]), -:root:is([sizemode="maximized"], [sizemode="fullscreen"]) #tabbrowser-tabs:not([positionpinnedtabs]) { - padding-inline-start: var(--space-left-tabbar) !important; +@include NotOption("userChrome.padding.first_tab.always") { + :root:not([tabsintitlebar]) #tabbrowser-tabs:not([positionpinnedtabs]), + :root:is([sizemode="maximized"], [sizemode="fullscreen"]) #tabbrowser-tabs:not([positionpinnedtabs]) { + padding-inline-start: var(--uc-space-left-tabbar) !important; + } +} + +@include Option("userChrome.padding.first_tab.always") { + :root:not([tabsintitlebar]) #tabbrowser-tabs, + :root:is([sizemode="maximized"], [sizemode="fullscreen"]) #tabbrowser-tabs { + padding-inline-start: calc(var(--tab-overflow-pinned-tabs-width, 0px) + var(--uc-space-left-tabbar)) !important; + } } diff --git a/src/padding/_index.scss b/src/padding/_index.scss index 6acdb09..c2089a9 100644 --- a/src/padding/_index.scss +++ b/src/padding/_index.scss @@ -30,8 +30,23 @@ } /*= URL Bar - Reduce Padding =================================================*/ -@include Option("userChrome.padding.urlbar") { - @import "urlbar"; +@include NotOption("userChrome.urlView.as_commandbar") { + @include Option("userChrome.padding.urlbar") { + @import "urlbar"; + } +} +@include Option("userChrome.padding.urlView_expanding", "userChrome.urlView.as_commandbar") { + #urlbar[breakout][breakout-extend] { + top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important; + left: 0 !important; + width: 100% !important; + } + + #urlbar[breakout][breakout-extend] > #urlbar-input-container { + height: var(--urlbar-height) !important; + padding-block: 0 !important; + padding-inline: var(--urlbar-container-padding, 0px) !important; + } } @include Option("userChrome.padding.urlView_expanding") { @import "urlview_expanding"; diff --git a/src/padding/_infobar.scss b/src/padding/_infobar.scss index 9697bc6..be1e043 100644 --- a/src/padding/_infobar.scss +++ b/src/padding/_infobar.scss @@ -1,16 +1,16 @@ -:root:not([uidensity]) #tab-notification-deck { +:root:not([uidensity]) notification-message { --infobar-message-vertical-margin: 3px; --infobar-vertical-margin: 7px; --infobar-button-vertical-margin: 3px; } -:root[uidensity="compact"] #tab-notification-deck { +:root[uidensity="compact"] notification-message { --infobar-message-vertical-margin: 2px; --infobar-vertical-margin: 6px; --infobar-button-vertical-margin: 2px; } -:root[uidensity="touch"] #tab-notification-deck { +:root[uidensity="touch"] notification-message { --infobar-message-vertical-margin: 4px; --infobar-vertical-margin: 8px; diff --git a/src/padding/_panel.scss b/src/padding/_panel.scss index f8c4e76..8d1fde8 100644 --- a/src/padding/_panel.scss +++ b/src/padding/_panel.scss @@ -1,5 +1,5 @@ :root { - --arrowpanel-menuitem-margin: 0 var(--arrowpanel-menuicon-padding) !important; /* Original: 0 8px */ + --arrowpanel-menuitem-margin: 0 var(--arrowpanel-menuicon-padding, 8px) !important; /* Original: 0 8px */ --arrowpanel-menuitem-padding-block: 5px !important; /* Original: 8px */ --arrowpanel-menuitem-padding-inline: 5px !important; /* Original: 8px */ --arrowpanel-menuitem-padding: var(--arrowpanel-menuitem-padding-block) var(--arrowpanel-menuitem-padding-inline) !important; /* Compatibility */ @@ -14,3 +14,11 @@ --arrowpanel-menuitem-padding-block: 8px !important; /* Original: 8px */ --arrowpanel-menuitem-padding-inline: 8px !important; /* Original: 8px */ } + +@include NotOption("userChrome.icon.disabled") { + @include NotOption("userChrome.icon.panel") { + .subviewbutton { + min-height: calc(16px + (var(--arrowpanel-menuitem-padding-block) * 2)) !important; + } + } +} diff --git a/src/padding/_popup_panel.scss b/src/padding/_popup_panel.scss index 00b4447..8725396 100644 --- a/src/padding/_popup_panel.scss +++ b/src/padding/_popup_panel.scss @@ -25,7 +25,7 @@ } /* not cut off for Protection popup Footer on windows */ :root[uidensity="compact"] #protections-popup-multiView #protections-popup-footer { - padding: 3px 0 10px !important; + padding: 0 !important; } /* Button and disabled category in Protection popup */ :root[uidensity="compact"] #protections-popup-multiView .protections-popup-footer-button, diff --git a/src/padding/_tabbar_height.scss b/src/padding/_tabbar_height.scss index 02456f7..8b0b6a9 100644 --- a/src/padding/_tabbar_height.scss +++ b/src/padding/_tabbar_height.scss @@ -43,19 +43,34 @@ } } } + +:root { + /* Works with TabMixPlus */ + --tab-min-height_mlt: calc(var(--tab-min-height) + 2 * (var(--tab-block-margin, var(--proton-tab-block-margin, 0px)))) !important; +} +#TabsToolbar[multibar] .tabbrowser-tab { + height: unset !important; /* Original: var(--tab-min-height_mlt) */ +} + @include Option("userChrome.tab.connect_to_window") { + :root { + --tab-min-height_mlt: calc(var(--tab-min-height) + var(--tab-block-margin, var(--proton-tab-block-margin, 0px))) !important; + } + #TabsToolbar { --toolbarbutton-inner-padding: calc((var(--tab-min-height) - 18px) / 2) !important; /* Prevent overflow pinned tab bottom margin */ } - :root:not([uidensity="compact"]) #tabbrowser-arrowscrollbox, - #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"], - #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"] .tab-stack, - #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"] .tab-content { - max-height: var(--tab-min-height) !important; /* Force apply height */ - } - :root[uidensity="compact"] #tabbrowser-arrowscrollbox { - height: var(--tab-min-height) !important; + @include NotOption("userChrome.tabbar.multi_row") { + :root:not([uidensity="compact"]) #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox, + #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"], + #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"] .tab-stack, + #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox[overflowing="true"] > .tabbrowser-tab[pinned="true"] .tab-content { + max-height: var(--tab-min-height) !important; /* Force apply height */ + } + :root[uidensity="compact"] #TabsToolbar:not([multibar]) #tabbrowser-arrowscrollbox { + height: var(--tab-min-height) !important; + } } } diff --git a/src/padding/_tabbar_width.scss b/src/padding/_tabbar_width.scss index 12e0ec8..5c3047c 100644 --- a/src/padding/_tabbar_width.scss +++ b/src/padding/_tabbar_width.scss @@ -2,12 +2,26 @@ :root { --uc-title-pre-spacer: 30px; /* Original: 40px */ --uc-title-post-spacer: 25px; /* Original: 40px */ + &:-moz-locale-dir(rtl) { + --uc-title-pre-spacer: 25px; + --uc-title-post-spacer: 30px; + } } -.titlebar-spacer[type="pre-tabs"] { - width: var(--uc-title-pre-spacer) !important; +@include WindowControl_Left { + .titlebar-spacer[type="pre-tabs"] { + width: var(--uc-title-pre-spacer) !important; + } + .titlebar-spacer[type="post-tabs"] { + width: var(--uc-title-post-spacer) !important; + } } -.titlebar-spacer[type="post-tabs"] { - width: var(--uc-title-post-spacer) !important; +@include WindowControl_Right { + .titlebar-spacer[type="pre-tabs"] { + width: var(--uc-title-post-spacer) !important; + } + .titlebar-spacer[type="post-tabs"] { + width: var(--uc-title-pre-spacer) !important; + } } /* Tabbar Buttons */ @@ -81,8 +95,10 @@ padding-inline: 1px !important; } } - .tabbrowser-tab:not([last-visible-tab]) { - margin-inline-end: -1px !important; + @include NotOption("userChrome.tabbar.multi_row") { + #TabsToolbar:not([multibar]) .tabbrowser-tab:not([last-visible-tab]) { + margin-inline-end: -1px !important; + } } } @include Option("userChrome.tab.photon_like_padding") { diff --git a/src/padding/_urlbar.scss b/src/padding/_urlbar.scss index b5cd2bc..d167c05 100644 --- a/src/padding/_urlbar.scss +++ b/src/padding/_urlbar.scss @@ -1,7 +1,6 @@ :root:not([uidensity="touch"]) #urlbar-container, :root:not([uidensity="touch"]) #search-container { padding-block: 3px !important; /* Original: 4px */ - margin-inline: 5px !important; /* Original: 5px */ } :root:not([uidensity="compact"]) #urlbar-container, :root:not([uidensity="compact"]) #search-container { diff --git a/src/padding/_urlview_expanding.scss b/src/padding/_urlview_expanding.scss index b2481eb..e541a24 100644 --- a/src/padding/_urlview_expanding.scss +++ b/src/padding/_urlview_expanding.scss @@ -1,15 +1,3 @@ -#urlbar[breakout][breakout-extend] { - top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important; - left: 0 !important; - width: 100% !important; -} - -#urlbar[breakout][breakout-extend] > #urlbar-input-container { - height: var(--urlbar-height) !important; - padding-block: 0 !important; - padding-inline: 0 !important; -} - #urlbar[breakout][breakout-extend] > #urlbar-background { animation-name: none !important; box-shadow: 0 1px 4px rgba(0, 0, 0, .05) !important; diff --git a/src/rounding/_square.scss b/src/rounding/_square.scss index 10d9ab7..9c86f15 100644 --- a/src/rounding/_square.scss +++ b/src/rounding/_square.scss @@ -5,19 +5,32 @@ } @include Option("userChrome.rounding.square_button") { :root { - --toolbarbutton-border-radius: 0 !important; /* Original: 4px */ + --urlbar-icon-border-radius: 0 !important; /* Original: calc(var(--toolbarbutton-border-radius) - 1px); */ } - button { + + .toolbarbutton-1, + .toolbarbutton-icon, + .panel-info-button, + .searchbar-engine-one-off-item, + .urlbarView-button, + .urlbarView-tip-button, + .urlbarView-action, + toolbarbutton.bookmark-item:not(.subviewbutton), + #sidebar-switcher-target { + --toolbarbutton-border-radius: 0; /* Original: 4px */ + } + + button, + findbar toolbarbutton, + .notification-button { border-radius: 0 !important; } } -@include Option("userChrome.rounding.square_tab", "userChrome.round.square_button") { - /* Fix Tab bar button radious */ - #TabsToolbar .toolbarbutton-1:not(#tabs-newtab-button) > .toolbarbutton-icon, - #TabsToolbar .toolbarbutton-1:not(#tabs-newtab-button) > .toolbarbutton-text, - #TabsToolbar .toolbarbutton-1:not(#tabs-newtab-button) > .toolbarbutton-badge-stack, +@include Option("userChrome.rounding.square_tab", "userChrome.rounding.square_button") { + /* Fix Tab bar button radius */ + #TabsToolbar .toolbarbutton-1:not(#tabs-newtab-button), .tab-close-button { - --tab-border-radius: var(--toolbarbutton-border-radius) !important; + --tab-border-radius: var(--toolbarbutton-border-radius); } } @@ -54,6 +67,18 @@ html|input { border-radius: 0 !important; } + + #urlbar-input-container, + #urlbar-background, + #searchbar { + --toolbarbutton-border-radius: 0; + } +} + +@include Option("userChrome.rounding.square_urlView_item") { + .urlbarView-row-inner { + --toolbarbutton-border-radius: 0; + } } @include Option("userChrome.rounding.square_checklabel") { diff --git a/src/sidebar/_overlap.scss b/src/sidebar/_overlap.scss index f877334..797e026 100644 --- a/src/sidebar/_overlap.scss +++ b/src/sidebar/_overlap.scss @@ -1,17 +1,28 @@ -@include Option("userChrome.sidebar.overlap", "userChrome.autohide.sidebar") { - #sidebar-box { +@include Option("userChrome.sidebar.overlap", "userChrome.autohide.sidebar", "userChrome.navbar.as_sidebar") { + :root { /* Original min-width: 14em; width: 18em; max-width: 36em; */ - --uc-sidebar-width: 40px; - --uc-sidebar-activate-width: 18em; + --uc-sidebar-activate-width: 18rem; --uc-sidebar-activate-width-reverse: calc(-1 * var(--uc-sidebar-activate-width)); --uc-sidebar-fullscreen-width: 4px; - --uc-sidebar-shadow-color: #28282F; + + --uc-autohide-sidebar-speed: 750ms; + --uc-autohide-fullscreen-sidebar-speed: 1s; --uc-autohide-sidebar-delay: 600ms; /* Wait 0.6s before hiding sidebar */ + } + + #sidebar-splitter { + display: none !important; + } +} + +@include Option("userChrome.sidebar.overlap", "userChrome.autohide.sidebar") { + #sidebar-box { + --uc-sidebar-shadow-color: #28282F; z-index: 1 !important; position: relative !important; @@ -25,10 +36,6 @@ #sidebar { display: block; } - - #sidebar-splitter { - display: none !important; - } } @include Option("userChrome.sidebar.overlap") { @@ -36,14 +43,24 @@ direction: rtl; } - #sidebar-header { + #sidebar-header, + #sidebar { background-color: var(--sidebar-background-color) !important; color: var(--sidebar-text-color) !important; overflow: hidden; } + #sidebar-header { + font-size: unset !important; + + > #sidebar-switcher-target { + font-size: 1.333em; + } + } + @include NotOption("userChrome.autohide.sidebar") { #sidebar-box, + #sidebar-header, #sidebar { min-width: var(--uc-sidebar-activate-width) !important; max-width: var(--uc-sidebar-activate-width) !important; @@ -54,7 +71,7 @@ will-change: padding-inline; &:not([hidden="true"]) { - padding-inline-start: var(--uc-sidebar-activate-width); + padding-inline-start: var(--uc-sidebar-activate-width) !important; } @include Animate { diff --git a/src/tab/_connect_to_window.scss b/src/tab/_connect_to_window.scss index e163495..24ed9a4 100644 --- a/src/tab/_connect_to_window.scss +++ b/src/tab/_connect_to_window.scss @@ -16,8 +16,10 @@ #tabbrowser-tabs { z-index: 1 !important; } -#TabsToolbar { - overflow: hidden; /* Prevent toolbar area over */ +@include NotOption("userChrome.tabbar.multi_row") { + #TabsToolbar:not([multibar]) { + overflow: clip; /* Prevent toolbar area over */ + } } /* Pinned Tab - tabbrowser-arrowscrollbox overflowing */ diff --git a/src/tab/_container_tab.scss b/src/tab/_container_tab.scss index b3a966d..a52f9d1 100644 --- a/src/tab/_container_tab.scss +++ b/src/tab/_container_tab.scss @@ -4,21 +4,34 @@ } } -.tabbrowser-tab { - --container-position-y: 11px; +#tabbrowser-tabs { + $containerPositionX: 9px; + --uc-container-position-x: #{ $containerPositionX }; + &:-moz-locale-dir(rtl) { + --uc-container-position-x: #{ $containerPositionX * -1 }; + } + + --uc-container-position-y-default: 11.5px; + --uc-container-position-y: calc(50% + var(--uc-container-position-y-default)); + + // Pinned Tab - Titlechanged Indicator override + --uc-titlechanged-container-position-x: 32%, 50%, 70%; } -:root[uidensity="compact"] .tabbrowser-tab { - --container-position-y: 10px; +:root[uidensity="compact"] #tabbrowser-tabs { + --uc-container-position-y-default: 10.5px; + + --uc-titlechanged-container-position-x: 30%, 50%, 70%; } -:root[uidensity="touch"] .tabbrowser-tab { - --container-position-y: 12px; +:root[uidensity="touch"] #tabbrowser-tabs { + --uc-container-position-y-default: 12.5px; } .tab-content:not([titlechanged])::before { /* Box Model */ content: ""; display: block; - position: absolute !important; - transform: translate(9px, var(--container-position-y)) !important; + position: absolute; + top: 50%; + transform: translate(var(--uc-container-position-x), var(--uc-container-position-y)); /* Shape */ border-bottom: 2px solid var(--identity-icon-color); @@ -36,14 +49,14 @@ /* Animate */ @include Animate { .tab-content:not([titlechanged])::before { - transition: 0.15s var(--animation-easing-function) !important; + transition: 0.15s var(--animation-easing-function); transition-property: width, opacity; } } /* Pinned Tab */ .tabbrowser-tab[pinned] .tab-content::before { - transform: translateY(var(--container-position-y)) !important; + transform: translateY(var(--uc-container-position-y)); width: 16px; } @include Option("userChrome.tab.close_button_at_pinned") { @@ -64,24 +77,13 @@ transparent 2px ); background-image: var(--dotted-identity-image), var(--dotted-identity-image), var(--dotted-identity-image) !important; - background-position-x: 32%, 50%, 70% !important; -} -:root[uidensity="compact"] - .tabbrowser-tab:is([image], [pinned])[usercontextid] - > .tab-stack - > .tab-content[attention]:not([selected="true"]), -:root[uidensity="compact"] - .tabbrowser-tab[usercontextid] - > .tab-stack - > .tab-content[pinned][titlechanged]:not([selected="true"]) { - /* Original: radial-gradient(circle, var(--attention-icon-color), var(--attention-icon-color) 2px, transparent 2px); */ - background-position-x: 30%, 50%, 70% !important; + background-position-x: var(--uc-titlechanged-container-position-x) !important; } .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]), .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { /* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */ - background-position-y: top calc(0.5px + 50% + var(--container-position-y)) !important; + background-position-y: top var(--uc-container-position-y) !important; } /* Pinned Tab - Titlechanged & soundplaying */ @@ -91,7 +93,7 @@ .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { - background-position-x: calc(32% - 1px), calc(50% - 1px), calc(70% - 1px) !important; + --uc-titlechanged-container-position-x: calc(32% - 1px), calc(50% - 1px), calc(70% - 1px); } :root[uidensity="compact"] .tabbrowser-tab:is([image], [pinned])[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) @@ -101,5 +103,5 @@ .tabbrowser-tab[usercontextid]:is([soundplaying], [muted], [activemedia-blocked]) > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) { - background-position-x: calc(30% - 1px), calc(50% - 1px), calc(70% - 1px) !important; + --uc-titlechanged-container-position-x: calc(30% - 1px), calc(50% - 1px), calc(70% - 1px); } diff --git a/src/tab/_selected_tab.scss b/src/tab/_selected_tab.scss index 8ef7dd8..fc23332 100644 --- a/src/tab/_selected_tab.scss +++ b/src/tab/_selected_tab.scss @@ -15,10 +15,45 @@ /*= Selected Tab - Bottom Rounded Corner =====================================*/ @include Option("userChrome.tab.bottom_rounded_corner") { - @import "selected_tab/bottom_rounded_corner"; + @include NotOption("userChrome.tab.bottom_rounded_corner.wave") { + @include NotOption("userChrome.tab.bottom_rounded_corner.australis") { + @include NotOption("userChrome.tab.bottom_rounded_corner.chrome") { + @include NotOption("userChrome.tab.bottom_rounded_corner.chrome_legacy") { + @include NotOption("userChrome.tab.bottom_rounded_corner.edge") { + @import "selected_tab/bottom_rounded_corner"; + } + } + } + } + } + @include Option( + "userChrome.tab.bottom_rounded_corner.wave", + "userChrome.tab.bottom_rounded_corner.australis", + "userChrome.tab.bottom_rounded_corner.chrome_legacy", + "userChrome.tab.bottom_rounded_corner.chrome", + "userChrome.tab.bottom_rounded_corner.edge" + ) { + @import "selected_tab/bottom_rounded_corner_others"; + } } /*= Selected Tab - Photon like contextline ===================================*/ +@include Option( + "userChrome.tab.photon_like_contextline", + "userChrome.tab.static_separator", + "userChrome.tab.bar_separator") { + :root[lwtheme-mozlightdark] #tabbrowser-tabs, /* Legacy: v96 */ + :root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + :root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] { + --tab-line-color: rgb(10, 132, 255) !important; + } + @media (-moz-gtk-csd-available) { + :root:not(:-moz-lwtheme) #tabbrowser-tabs { + --tab-line-color: Highlight !important; /* -moz-accent-color */ + } + } +} + @include Option("userChrome.tab.photon_like_contextline") { @import "selected_tab/photon_like_contextline"; } diff --git a/src/tab/_unload_tab.scss b/src/tab/_unload_tab.scss index 8b918f2..fbf5541 100644 --- a/src/tab/_unload_tab.scss +++ b/src/tab/_unload_tab.scss @@ -1,3 +1,3 @@ -#tabbrowser-tabs .tabbrowser-tab[pending] .tab-content { +.tabbrowser-tab[pending] .tab-content { opacity: 0.7; } diff --git a/src/tab/_unselected_tab.scss b/src/tab/_unselected_tab.scss index df326bb..b0e4b4d 100644 --- a/src/tab/_unselected_tab.scss +++ b/src/tab/_unselected_tab.scss @@ -1,5 +1,5 @@ /*= Unselected Tab - Dynamic Separator =======================================*/ -@include Option("userChrome.tab.dynamic_separtor") { +@include Option("userChrome.tab.dynamic_separator") { @import "unselected_tab/dynamic_separator"; } @@ -7,3 +7,8 @@ @include Option("userChrome.tab.static_separator") { @import "unselected_tab/static_separator"; } + +/*= Unselected Tab - Bar Separator ===========================================*/ +@include Option("userChrome.tab.bar_separator") { + @import "unselected_tab/bar_separator"; +} diff --git a/src/tab/clipped_tab/_show_close_button_at_hover.scss b/src/tab/clipped_tab/_show_close_button_at_hover.scss index 8751528..7f82d84 100644 --- a/src/tab/clipped_tab/_show_close_button_at_hover.scss +++ b/src/tab/clipped_tab/_show_close_button_at_hover.scss @@ -1,54 +1,50 @@ -#tabbrowser-tabs[closebuttons="activetab"] +@mixin _closeButtonAtHover() { + .tabbrowser-tab { + &:not([visuallyselected]) .tab-close-button { + visibility: collapse !important; + opacity: 0; + } + &:hover .tab-close-button { + visibility: visible !important; + opacity: 1; + } + + @include Option("userChrome.tab.close_button_at_hover.with_selected") { + &:not([pinned]):not(:hover) .tab-close-button { + visibility: collapse !important; + opacity: 0; + } + } + } +} + +#tabbrowser-tabs[closebuttons="activetab"] { > #tabbrowser-arrowscrollbox > .tabbrowser-tab:not([pinned]) > .tab-stack > .tab-content > .tab-close-button:not([selected="true"]) { - display: -moz-inline-box !important; + display: -moz-inline-box !important; + } + + @include _closeButtonAtHover; } -#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([visuallyselected]) .tab-close-button { - visibility: collapse !important; - opacity: 0; -} -#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:hover .tab-close-button { - visibility: visible !important; - opacity: 1; -} @include Option("userChrome.tab.close_button_at_hover.always") { - .tabbrowser-tab:not([visuallyselected]) .tab-close-button { - visibility: collapse !important; - opacity: 0; - } - .tabbrowser-tab:hover .tab-close-button { - visibility: visible !important; - opacity: 1; - } + @include _closeButtonAtHover; } /* Animate */ @include Animate { /* Fade out */ - #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([visuallyselected]) .tab-close-button { + .tabbrowser-tab .tab-close-button { transition: opacity 0.1s var(--animation-easing-function) !important; } /* Fade in */ - #tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:hover .tab-close-button { + .tabbrowser-tab:hover .tab-close-button { transition: opacity 0.25s var(--animation-easing-function) !important; } - - @include Option("userChrome.tab.close_button_at_hover.always") { - /* Fade out */ - .tabbrowser-tab:not([visuallyselected]) .tab-close-button { - transition: opacity 0.1s var(--animation-easing-function) !important; - } - - /* Fade in */ - .tabbrowser-tab:hover .tab-close-button { - transition: opacity 0.25s var(--animation-easing-function) !important; - } - } } /* Closed Button's icon thicker */ diff --git a/src/tab/newtab_button/_looks_like_tab.scss b/src/tab/newtab_button/_looks_like_tab.scss index bdda2a6..6f64617 100644 --- a/src/tab/newtab_button/_looks_like_tab.scss +++ b/src/tab/newtab_button/_looks_like_tab.scss @@ -1,35 +1,75 @@ #tabs-newtab-button { - /* Original: + @include Option("userChrome.tab.connect_to_window") { + /* Size */ + -moz-box-align: stretch !important; + padding-top: var(--tab-block-margin) !important; + } + + @include Option("userChrome.tab.bottom_rounded_corner") { + /* Original: margin: 0 0 var(--tabs-navbar-shadow-size) !important - => Can't ovrride style. Therefore, we should approach it by bypass. - */ - --tabs-navbar-shadow-size: -1px; /* Original: 1px */ - --tabs-navbar-original-shadow-size: 1px; - --tab-corner-rounding: 4px; /* Hardcorded */ + => Can't override style. Therefore, we should approach it by bypass. + */ + --tabs-navbar-shadow-size: -1px; /* Original: 1px */ + --uc-tabs-navbar-shadow-size: 0.5px; + --uc-tab-corner-rounding: 4px; /* Hardcoded */ + --uc-newtab-bgcolor: transparent; - /* Size */ - -moz-box-align: stretch !important; - padding-top: var(--tab-block-margin) !important; + /* Corner Rounding Image */ + --uc-newtab-position: calc((var(--uc-tab-corner-rounding) / 2) * -1); + background-image: var(--uc-tab-corner-left-side-svg), var(--uc-tab-corner-right-side-svg); + background-repeat: no-repeat; + background-position: left var(--uc-newtab-position) bottom var(--uc-tabs-navbar-shadow-size), + right var(--uc-newtab-position) bottom var(--uc-tabs-navbar-shadow-size); + background-size: var(--uc-tab-corner-rounding); - /* Corner Rounding Image */ - --newtab-position: calc((var(--tab-corner-rounding) / 2) * -1); - background-image: url("../icons/tab-bottom-corner-left.svg"), url("../icons/tab-bottom-corner-right.svg"); - background-repeat: no-repeat; - background-position: left var(--newtab-position) bottom var(--tabs-navbar-original-shadow-size), - right var(--newtab-position) bottom var(--tabs-navbar-original-shadow-size); - background-size: var(--tab-corner-rounding); + /* Corner Rounding Color */ + fill: var(--uc-newtab-bgcolor) !important; + -moz-context-properties: fill !important; - /* Corner Rounding Color */ - fill: transparent !important; - -moz-context-properties: fill !important; + @include Option( + "userChrome.tab.bottom_rounded_corner.wave", + "userChrome.tab.bottom_rounded_corner.australis", + "userChrome.tab.bottom_rounded_corner.chrome_legacy", + "userChrome.tab.bottom_rounded_corner.chrome", + "userChrome.tab.bottom_rounded_corner.edge" + ) { + --uc-newtab-position: 0px; + --uc-newtab-non-corner-bgwidth: 0px; + --uc-tab-corner-half-height: calc(var(--uc-tab-corner-height) / 2); + --uc-tab-corner-half-height-reverse: calc(var(--uc-tab-corner-half-height) * -1); + + transform: translateX(var(--uc-tab-corner-half-height-reverse)); + padding-inline: var(--uc-tab-corner-half-height) !important; + overflow-clip-margin: var(--uc-tab-corner-half-height) !important; + + background-image: var(--uc-tab-corner-left-side-svg), + linear-gradient(to left, var(--uc-newtab-bgcolor), var(--uc-newtab-bgcolor)), + var(--uc-tab-corner-right-side-svg); + background-position: left var(--uc-newtab-position) bottom var(--uc-tabs-navbar-shadow-size), + center bottom var(--uc-tabs-navbar-shadow-size), + right var(--uc-newtab-position) bottom var(--uc-tabs-navbar-shadow-size); + background-size: var(--uc-tab-corner-height) var(--uc-tab-corner-height), + var(--uc-newtab-non-corner-bgwidth) var(--uc-tab-corner-height), + var(--uc-tab-corner-height) var(--uc-tab-corner-height); + background-origin: padding-box; + + @include Option( + "userChrome.tab.bottom_rounded_corner.chrome", + "userChrome.tab.bottom_rounded_corner.edge" + ) { + --uc-newtab-non-corner-bgwidth: calc(2 * var(--toolbarbutton-inner-padding)); + } + } + } } /* Corner Rounding Color */ #tabs-newtab-button:hover { - fill: var(--toolbarbutton-hover-background) !important; + --uc-newtab-bgcolor: var(--toolbarbutton-hover-background); } #tabs-newtab-button:hover:active { - fill: var(--toolbarbutton-active-background) !important; + --uc-newtab-bgcolor: var(--toolbarbutton-active-background); } @media (-moz-windows-accent-color-in-titlebar) { @include AccentColor { @@ -39,7 +79,7 @@ in srgb, $accentTextColor 10%, transparent - ) !important; /* Hardcorded for compatibility */ + ) !important; /* Hardcoded for compatibility */ } :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #tabs-newtab-button:hover:active, :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) #tabs-newtab-button:hover:active { @@ -47,7 +87,30 @@ in srgb, $accentTextColor 15%, transparent - ) !important; /* Hardcorded for compatibility */ + ) !important; /* Hardcoded for compatibility */ + } + + @include Option("userChrome.tab.bottom_rounded_corner") { + @include Option( + "userChrome.tab.bottom_rounded_corner.wave", + "userChrome.tab.bottom_rounded_corner.australis", + "userChrome.tab.bottom_rounded_corner.chrome_legacy", + "userChrome.tab.bottom_rounded_corner.chrome", + "userChrome.tab.bottom_rounded_corner.edge" + ) { + :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #tabs-newtab-button:hover, + :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) #tabs-newtab-button:hover { + background-image: var(--uc-tab-corner-left-side-svg), + linear-gradient(to left, color-mix(in srgb, $accentTextColor 10%, transparent), color-mix(in srgb, $accentTextColor 10%, transparent)), + var(--uc-tab-corner-right-side-svg); + } + :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #tabs-newtab-button:hover:active, + :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) #tabs-newtab-button:hover:active { + background-image: var(--uc-tab-corner-left-side-svg), + linear-gradient(to left, color-mix(in srgb, $accentTextColor 15%, transparent), color-mix(in srgb, $accentTextColor 15%, transparent)), + var(--uc-tab-corner-right-side-svg); + } + } } } } @@ -57,8 +120,26 @@ border-radius: var(--tab-border-radius) var(--tab-border-radius) 0 0 !important; /* Original: var(--tab-border-radius) */ padding: calc(var(--toolbarbutton-inner-padding) - (var(--tab-block-margin) / 4)) var(--toolbarbutton-inner-padding) - calc(var(--toolbarbutton-inner-padding) + (var(--tab-block-margin) / 4) + var(--tabs-navbar-original-shadow-size)) !important; + calc(var(--toolbarbutton-inner-padding) + (var(--tab-block-margin) / 4) + var(--uc-tabs-navbar-shadow-size)) !important; -moz-context-properties: fill, fill-opacity; fill: var(--toolbarbutton-icon-fill); fill-opacity: var(--toolbarbutton-icon-fill-opacity); + + @include Option( + "userChrome.tab.bottom_rounded_corner.wave", + "userChrome.tab.bottom_rounded_corner.australis", + "userChrome.tab.bottom_rounded_corner.chrome_legacy", + "userChrome.tab.bottom_rounded_corner.chrome", + "userChrome.tab.bottom_rounded_corner.edge" + ) { + --tab-border-radius: 0px; + width: unset !important; + padding-inline: 0px !important; + margin-inline: calc(var(--uc-tab-corner-half-height) - #{( 15.5px / 2 )}) !important; + + background-color: transparent !important; + // background-size: calc((var(--toolbarbutton-inner-padding) * 2 + 16px) - var(--uc-tab-corner-size)) 100%; + // background-repeat: no-repeat; + // background-position: center; + } } diff --git a/src/tab/newtab_button/_proton_like_button.scss b/src/tab/newtab_button/_proton_like_button.scss index 3fd1017..1e24617 100644 --- a/src/tab/newtab_button/_proton_like_button.scss +++ b/src/tab/newtab_button/_proton_like_button.scss @@ -1,10 +1,3 @@ :root:not([uidensity="touch"]) #tabs-newtab-button > .toolbarbutton-icon { --toolbarbutton-inner-padding: calc((var(--tab-min-height) - 16px) / 2 - 1px); } - -:root:not([uidensity="compact"]) #tabs-newtab-button > .toolbarbutton-icon { - margin-left: 2px; -} -:root[uidensity="compact"] #tabs-newtab-button > .toolbarbutton-icon { - margin-left: 1px; -} diff --git a/src/tab/newtab_button/_smaller_button.scss b/src/tab/newtab_button/_smaller_button.scss index e992373..2d82a83 100644 --- a/src/tab/newtab_button/_smaller_button.scss +++ b/src/tab/newtab_button/_smaller_button.scss @@ -1,7 +1,9 @@ #tabs-newtab-button > .toolbarbutton-icon { + // Not like tab, as button + --tab-border-radius: var(--toolbarbutton-border-radius); margin-left: 1px; - /* Origianl: calc((var(--tab-min-height) - 16px) / 2) = 10px */ + /* Original: calc((var(--tab-min-height) - 16px) / 2) = 10px */ --toolbarbutton-inner-padding: 6px; } :root[uidensity="compact"] #tabs-newtab-button > .toolbarbutton-icon { diff --git a/src/tab/selected_tab/_bottom_rounded_corner.scss b/src/tab/selected_tab/_bottom_rounded_corner.scss index ff0bec3..33c396f 100644 --- a/src/tab/selected_tab/_bottom_rounded_corner.scss +++ b/src/tab/selected_tab/_bottom_rounded_corner.scss @@ -1,86 +1,129 @@ -#tabbrowser-tabs { - --tab-corner-rounding: 3px; /* 10px looks about like chromium - 17px looks close to Australis tabs */ - --tab-corner-padding: 0px; - --tab-corner-position: calc(var(--tab-corner-padding) - var(--tab-corner-rounding)); +#TabsToolbar { + --uc-tab-corner-rounding: 3px; /* 10px looks about like chromium - 17px looks close to Australis tabs */ + --uc-tab-corner-padding: 0px; + --uc-tab-corner-position: calc(var(--uc-tab-corner-padding) - var(--uc-tab-corner-rounding)); + + --uc-tab-corner-left-side-svg: url("../icons/tab-bottom-corner-left.svg"); + --uc-tab-corner-right-side-svg: url("../icons/tab-bottom-corner-right.svg"); } -:root:not([customizing="true"]) tab[visuallyselected] > stack::before, -:root:not([customizing="true"]) tab[visuallyselected] > stack::after { - content: "" !important; +:root:not([customizing="true"]) { + .tabbrowser-tab { + .tab-background { + &::before, + &::after { + /* Box */ + display: block; + position: absolute; + z-index: 1; + bottom: 0; - /* Box */ - display: block !important; - position: absolute !important; - z-index: 1 !important; + /* Shape */ + width: var(--uc-tab-corner-rounding); + height: 100%; - /* Shape */ - width: var(--tab-corner-rounding) !important; - height: 100% !important; + /* Color */ + fill: transparent; + stroke: transparent; + -moz-context-properties: fill, stroke; - /* Color */ - fill: var(--toolbar-bgcolor) !important; - stroke: var( - --tab-line-color, - var(--tabs-border-color, rgba(128, 128, 142, 0.9)) - ) !important; - -moz-context-properties: fill, stroke !important; + /* Image */ + background-size: var(--uc-tab-corner-rounding); + background-repeat: no-repeat; + background-position-y: bottom; - /* Image */ - background-size: var(--tab-corner-rounding); - background-repeat: no-repeat; - background-position-y: bottom; -} -:root:not([customizing="true"]):is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) - #TabsToolbar[brighttext] - #tabbrowser-tabs:not([noshadowfortests]) - tab[visuallyselected] - > stack:-moz-lwtheme::before, -:root:not([customizing="true"]):is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) - #TabsToolbar[brighttext] - #tabbrowser-tabs:not([noshadowfortests]) - tab[visuallyselected] - > stack:-moz-lwtheme::after { - /* As Selected Tab - Box Shadow */ - stroke: var(--toolbar-color) !important; -} + @include Option("userChrome.tab.bottom_rounded_corner.all") { + content: ""; + } + @include NotOption("userChrome.tab.color_like_toolbar") { + /* Based on tab background + background-image: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none); -tab[visuallyselected] > stack::before { - left: var(--tab-corner-position) !important; - background-image: url("../icons/tab-bottom-corner-left.svg"); -} -tab[visuallyselected] > stack::after { - left: auto; - right: var(--tab-corner-position); - background-image: url("../icons/tab-bottom-corner-right.svg"); -} + defaults + background-color: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); + background-image: var(--tab-selected-bgimage, var(--toolbar-bgimage)); + */ + fill: var(--lwt-selected-tab-background-color, var(--tab-selected-bgcolor, var(--toolbar-bgcolor))) !important; + } + } -@include OS($linux) { - /* Fill color for GTK */ - :root:not([customizing="true"]):not([lwtheme="true"]) tab[visuallyselected] > stack::before, - :root:not([customizing="true"]):not([lwtheme="true"]) tab[visuallyselected] > stack::after { - /* As GTK Toolbar's background-color + backround-image - * --toolbar-non-lwt-bgcolor: -moz-dialog; - * --toolbar-non-lwt-bgimage: linear-gradient(rgba(255,255,255,.15), rgba(255,255,255,.15)); - */ - fill: color-mix(in srgb, rgb(255, 255, 255) 15%, -moz-dialog) !important; - stroke: transparent !important; + &::before { + left: var(--uc-tab-corner-position); + background-image: var(--uc-tab-corner-left-side-svg); + } + &::after { + right: var(--uc-tab-corner-position); + background-image: var(--uc-tab-corner-right-side-svg); + } + } + + &[visuallyselected] .tab-background { + &::before, + &::after { + @include NotOption("userChrome.tab.bottom_rounded_corner.all") { + content: ""; + } + + fill: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); + stroke: var( + --tab-line-color, + var(--tabs-border-color, rgba(128, 128, 142, 0.9)) + ); + } + } + &[multiselected] .tab-background { + &::before, + &::after { + fill: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); + } + } + &:hover:not([visuallyselected], [multiselected]) .tab-background { + &::before, + &::after { + fill: color-mix(in srgb, currentColor 11%, transparent); + } + } } - :root:not([customizing="true"]):not([lwtheme="true"]) #TabsToolbar[brighttext] tab[visuallyselected] > stack::before, - :root:not([customizing="true"]):not([lwtheme="true"]) #TabsToolbar[brighttext] tab[visuallyselected] > stack::after { - stroke: transparent !important; - } -} - -@include NotOption("userChrome.tab.color_like_toolbar") { - :root:not([customizing="true"]) tab[visuallyselected] > stack::before, - :root:not([customizing="true"]) tab[visuallyselected] > stack::after { - /* Based on tab background - background-image: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none); - - defaults - background-color: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); - background-image: var(--tab-selected-bgimage, var(--toolbar-bgimage)); - */ - fill: var(--lwt-selected-tab-background-color, var(--tab-selected-bgcolor, var(--toolbar-bgcolor))) !important; + @include Option("userChrome.tab.multi_selected") { + .tabbrowser-tab[multiselected]:not([visuallyselected]) .tab-background { + &::before, + &::after { + fill: color-mix(in srgb, currentColor 65%, transparent); + opacity: 0.3; + } + } + } + + &::is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) + #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab[visuallyselected] .tab-background:-moz-lwtheme { + &::before, + &::after { + /* As Selected Tab - Box Shadow */ + stroke: var(--toolbar-color); + } + } + + @include OS($linux) { + /* Fill color for GTK */ + &:not([lwtheme="true"]) { + .tabbrowser-tab:is([visuallyselected], [multiselected]) .tab-background { + &::before, + &::after { + /* As GTK Toolbar's background-color + background-image + * --toolbar-non-lwt-bgcolor: -moz-dialog; + * --toolbar-non-lwt-bgimage: linear-gradient(rgba(255,255,255,.15), rgba(255,255,255,.15)); + */ + fill: color-mix(in srgb, rgb(255, 255, 255) 15%, -moz-dialog); + stroke: transparent; + opacity: 1; + } + } + #TabsToolbar[brighttext] .tabbrowser-tab[visuallyselected] .tab-background { + &::before, + &::after { + stroke: transparent; + } + } + } } } diff --git a/src/tab/selected_tab/_bottom_rounded_corner_others.scss b/src/tab/selected_tab/_bottom_rounded_corner_others.scss new file mode 100644 index 0000000..c8d7a11 --- /dev/null +++ b/src/tab/selected_tab/_bottom_rounded_corner_others.scss @@ -0,0 +1,250 @@ +//-- Mixin --------------------------------------------------------------------- +@function _clipPathURL($svg) { + @return url($svg + "#svgClipPath"); +} +@mixin _clipPath($svg, $position) { + $result: _clipPathURL($svg); + + @if $position == "left" { + --uc-tab-corner-left-side-svg: #{ url($svg) }; + --uc-tab-corner-left-side-clipPath: #{ $result }; + } + @else if $position == "right" { + --uc-tab-corner-right-side-svg: #{ url($svg) }; + --uc-tab-corner-right-side-clipPath: #{ $result }; + } +} +@mixin _tabCornerSVG($left, $right) { + @include _clipPath($left, "left" ); + @include _clipPath($right, "right"); +} + +@mixin _bottomRoundedCornerOtherPadding() { + padding-inline: 0 !important; + overflow-clip-margin: var(--uc-tab-corner-half-size) !important; + + .tab-background { + --tab-border-radius: 0px; + margin-inline: var(--uc-tab-corner-half-size) !important; + position: relative; + + @content; + } +} + +//------------------------------------------------------------------------------ + +#TabsToolbar { + --uc-tab-corner-height: calc(var(--tab-min-height) + 1px); + --uc-tab-corner-size: var(--uc-tab-corner-height); + --uc-tab-corner-half-size: calc(var(--uc-tab-corner-size) / 2); + --uc-tab-corner-half-size-reverse: calc(var(--uc-tab-corner-half-size) * -1); + + --uc-tab-corner-bgimage: none; + + @include Option("userChrome.tab.bottom_rounded_corner.wave") { + @include _tabCornerSVG( + "../icons/tab-bottom-corner-left-wave.svg", + "../icons/tab-bottom-corner-right-wave.svg" + ); + --uc-tab-corner-left-side-svg-clipped: url("../icons/tab-bottom-corner-left-wave-clipped.svg"); + --uc-tab-corner-right-side-svg-clipped: url("../icons/tab-bottom-corner-right-wave-clipped.svg"); + } + @include Option("userChrome.tab.bottom_rounded_corner.australis") { + @include _tabCornerSVG( + "../icons/tab-bottom-corner-left-australis.svg", + "../icons/tab-bottom-corner-right-australis.svg" + ); + --uc-tab-corner-left-side-svg-clipped: url("../icons/tab-bottom-corner-left-australis-clipped.svg"); + --uc-tab-corner-right-side-svg-clipped: url("../icons/tab-bottom-corner-right-australis-cilpped.svg"); + } + @include Option("userChrome.tab.bottom_rounded_corner.chrome") { + @include _tabCornerSVG( + "../icons/tab-bottom-corner-left-chrome.svg", + "../icons/tab-bottom-corner-right-chrome.svg" + ); + --uc-tab-corner-left-side-svg-clipped: url("../icons/tab-bottom-corner-left-chrome-clipped.svg"); + --uc-tab-corner-right-side-svg-clipped: url("../icons/tab-bottom-corner-right-chrome-clipped.svg"); + + --uc-tab-corner-size: 16px; // 18px; + } + @include Option("userChrome.tab.bottom_rounded_corner.chrome_legacy") { + @include _tabCornerSVG( + "../icons/tab-bottom-corner-left-chromeLegacy.svg", + "../icons/tab-bottom-corner-right-chromeLegacy.svg" + ); + --uc-tab-corner-left-side-svg-clipped: url("../icons/tab-bottom-corner-left-chromeLegacy-clipped.svg"); + --uc-tab-corner-right-side-svg-clipped: url("../icons/tab-bottom-corner-right-chromeLegacy-clipped.svg"); + } + @include Option("userChrome.tab.bottom_rounded_corner.edge") { + @include _tabCornerSVG( + "../icons/tab-bottom-corner-left-edge.svg", + "../icons/tab-bottom-corner-right-edge.svg" + ); + --uc-tab-corner-left-side-svg-clipped: url("../icons/tab-bottom-corner-left-edge-clipped.svg"); + --uc-tab-corner-right-side-svg-clipped: url("../icons/tab-bottom-corner-right-edge-clipped.svg"); + + --uc-tab-corner-size: 14px; + } +} + +.tabbrowser-tab { + @include Option("userChrome.tab.bottom_rounded_corner.all") { + @include _bottomRoundedCornerOtherPadding; + } + @include NotOption("userChrome.tab.bottom_rounded_corner.all") { + &[visuallyselected] { + @include _bottomRoundedCornerOtherPadding { + &::before, + &::after { + content: ""; + } + } + } + } + + .tab-background { + &::before, + &::after { + /* Box */ + display: block; + position: absolute; + z-index: -1; + bottom: 0; + + /* Shape */ + width: var(--uc-tab-corner-size); + height: var(--uc-tab-corner-height); + + /* Color */ + fill: transparent; + stroke: transparent; + -moz-context-properties: fill, stroke, stroke-opacity; + // For stroke + // box-shadow: 0 0 4px rgba(0,0,0,.4); + // box-shadow: 0 0 1px var(--toolbar-color) !important; + // box-shadow: 0 0 1px var(--tab-line-color, var(--lwt-tab-line-color, rgba(128, 128, 142, 0.9))) !important + + /* Image */ + // background-size: var(--tab-corner-rounding); + background-size: cover, auto auto; + background-repeat: no-repeat, no-repeat; + background-position: bottom, right top; + background-attachment: scroll, fixed; + + @include Option("userChrome.tab.bottom_rounded_corner.all") { + content: ""; + } + @include NotOption("userChrome.tab.color_like_toolbar") { + /* Based on tab background + background-image: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none); + + defaults + background-color: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); + background-image: var(--tab-selected-bgimage, var(--toolbar-bgimage)); + */ + fill: var(--lwt-selected-tab-background-color, var(--tab-selected-bgcolor, var(--toolbar-bgcolor))) !important; + } + } + &::before { + right: 100%; + background-image: var(--uc-tab-corner-left-side-svg), var(--uc-tab-corner-bgimage); + clip-path: var(--uc-tab-corner-left-side-clipPath); + } + &::after { + left: 100%; + background-image: var(--uc-tab-corner-right-side-svg), var(--uc-tab-corner-bgimage); + clip-path: var(--uc-tab-corner-right-side-clipPath); + } + } + + &[beforeselected-visible] .tab-background::after { + --uc-tab-corner-right-side-svg: var(--uc-tab-corner-right-side-svg-clipped); + } + &[visuallyselected] + .tabbrowser-tab .tab-background::before { + --uc-tab-corner-left-side-svg: var(--uc-tab-corner-left-side-svg-clipped); + } + // &[positionpinnedtabs] .tabbrowser-tab[first-visible-unpinned-tab] .tab-background::before { + // background-image: var(--uc-tab-corner-left-side-svg), var(--lwt-header-image, none) !important; + // } + + &:is([visuallyselected], [multiselected]) .tab-background { + --uc-tab-corner-bgimage: var(--lwt-header-image, none); + + &::before, + &::after { + fill: var(--tab-selected-bgcolor, var(--toolbar-bgcolor)); + + @include Option("userChrome.tab.box_shadow") { + stroke: var(--uc-tab-shadow-color); + } + } + } + &:hover:not([visuallyselected], [multiselected]) .tab-background { + &::before, + &::after { + fill: color-mix(in srgb, currentColor 11%, transparent); + } + } +} +@include Option("userChrome.tab.multi_selected") { + .tabbrowser-tab[multiselected]:not([visuallyselected]) .tab-background { + &::before, + &::after { + fill: var(--uc-multiselected-tab-bgcolor); + } + } +} +#tabbrowser-tabs[movingtab] .tabbrowser-tab:is([visuallyselected], [multiselected]) .tab-background:-moz-lwtheme { + --uc-tab-corner-bgimage: none; +} + +:root { + &:is( + [lwtheme-mozlightdark], + [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], + [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] + ) #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab:is([visuallyselected], [multiselected]) .tab-background { + @include Option("userChrome.tab.box_shadow") { + &::before, + &::after { + stroke-opacity: 0.3; + } + } + } + @include OS($linux) { + /* Fill color for GTK */ + &:not([lwtheme="true"]) .tabbrowser-tab { + @include Option("userChrome.tab.box_shadow") { + --uc-tab-shadow-color: rgba(0,0,0, 0.4); + } + &[visuallyselected] .tab-background { + background-clip: content-box; + + &::before, + &::after { + /* As GTK Toolbar's background-color + background-image + * --toolbar-non-lwt-bgcolor: -moz-dialog; + * --toolbar-non-lwt-bgimage: linear-gradient(rgba(255,255,255,.15), rgba(255,255,255,.15)); + */ + --uc-tab-corner-bgimage: linear-gradient(var(--toolbar-non-lwt-bgcolor), var(--toolbar-non-lwt-bgcolor)); + fill: rgba(255, 255, 255, .075); + @include NotOption("userChrome.tab.color_like_toolbar") { + fill: rgba(255, 255, 255, .15); + } + } + } + } + } +} + +#tabbrowser-tabs { + &[positionpinnedtabs], + &:not([overflow]) .tabbrowser-tab[first-visible-tab], + &[overflow] .tabbrowser-tab[first-visible-unpinned-tab] { + margin-left: var(--uc-tab-corner-half-size) !important; + } +} +.tabbrowser-tab[last-visible-tab] { + margin-right: vart(--uc-tab-corner-half-size) !important; +} diff --git a/src/tab/selected_tab/_box_shadow.scss b/src/tab/selected_tab/_box_shadow.scss index 00d28d2..642c700 100644 --- a/src/tab/selected_tab/_box_shadow.scss +++ b/src/tab/selected_tab/_box_shadow.scss @@ -1,36 +1,58 @@ -#TabsToolbar[brighttext] - #tabbrowser-tabs:not([noshadowfortests]) - .tabbrowser-tab[visuallyselected="true"]:not(:focus) - > .tab-stack - > .tab-background:-moz-lwtheme { - /* Origina: 0 0 1px var(--tab-line-color, rgba(128,128,142,0.9)) - Bright: 0 0 1px var(--tab-line-color, rgba(128,128,142,0.9)), 0 0 4px rgba(128,128,142,0.5) */ - box-shadow: 0 0 1px var(--toolbar-color) !important; -} -#TabsToolbar[brighttext] - #tabbrowser-tabs:not([noshadowfortests]) - .tabbrowser-tab[multiselected]:not([visuallyselected]) - > .tab-stack - > .tab-background:-moz-lwtheme { - box-shadow: 0 0 1px color-mix(in srgb, var(--toolbar-color) 80%, transparent) !important; +#TabsToolbar { + --uc-tab-background-shadow-soft: 0 0 1px; + --uc-tab-background-shadow-hard: 0 0 0 1px; + --uc-tab-shadow-color: var(--tab-line-color, var(--lwt-tab-line-color, var(--tabs-border-color, rgba(128, 128, 142, 0.9)))); + --uc-tab-shadow-color-bundle: var(--tab-line-color, var(--lwt-tab-line-color, rgba(128, 128, 142, 0.9))); + --uc-tab-basic-shadow: 0 0 4px rgba(0,0,0, 0.4); + --uc-tab-additional-shadow: 0 0 4px rgba(128, 128, 142, 0.5); + + @include Option("userChrome.tab.bottom_rounded_corner") { + @include Option( + "userChrome.tab.bottom_rounded_corner.wave", + "userChrome.tab.bottom_rounded_corner.australis", + "userChrome.tab.bottom_rounded_corner.chrome_legacy", + "userChrome.tab.bottom_rounded_corner.chrome", + "userChrome.tab.bottom_rounded_corner.edge" + ) { + // --uc-tab-background-shadow-soft: 0 -1px 1px -1px; + --uc-tab-background-shadow-hard: 0 -1px 0; + --uc-tab-basic-shadow: 0 -1px 0px rgba(0,0,0, 0.4); + --uc-tab-additional-shadow: 0 0 0 transparent; + } + } } -/* Consider 0 0 4px rgba(128,128,142,0.9) -> 0 0 4px rgba(0,0,0,.4) new default */ -#TabsToolbar:not([brighttext]) +#tabbrowser-tabs:not([noshadowfortests]) .tab-background:is([selected], [multiselected]) { + box-shadow: var(--uc-tab-basic-shadow) !important; +} + +:root:is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) + #TabsToolbar[brighttext] #tabbrowser-tabs:not([noshadowfortests]) .tabbrowser-tab { + &:is([selected], [multiselected]) { + > .tab-stack + > .tab-background:-moz-lwtheme { + box-shadow: var(--uc-tab-background-shadow-soft) var(--uc-tab-shadow-color) !important; + } + } + + /* Original: 0 0 1px var(--tab-line-color, rgba(128,128,142,0.9)) + Bright: 0 0 1px var(--tab-line-color, rgba(128,128,142,0.9)), 0 0 4px rgba(128,128,142,0.5) */ + /* Consider 0 0 4px rgba(128,128,142,0.9) -> 0 0 4px rgba(0,0,0,.4) new default */ + &[visuallyselected="true"]:not(:focus), + &[multiselected]:not([visuallyselected]) { + --uc-tab-shadow-color: var(--toolbar-color); + } +} + +:root:is([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"]) + #TabsToolbar:not([brighttext]) #tabbrowser-tabs:not([noshadowfortests]) - .tabbrowser-tab:is([visuallyselected="true"], [multiselected]) + .tabbrowser-tab:is([visuallyselected], [multiselected]) > .tab-stack > .tab-background { - box-shadow: 0 0 1px var(--tab-line-color, var(--lwt-tab-line-color, rgba(128, 128, 142, 0.9))), - 0 0 4px rgba(128, 128, 142, 0.5) !important; -} - -#TabsToolbar[brighttext] - #tabbrowser-tabs:not([noshadowfortests]) - .tabbrowser-tab:is([visuallyselected="true"], [multiselected]) - > .tab-stack - > .tab-background:-moz-lwtheme { - box-shadow: 0 0 1px var(--tab-line-color, var(--lwt-tab-line-color, rgba(128, 128, 142, 0.9))) !important; + --uc-tab-shadow-color: var(--uc-tab-shadow-color-bundle); + box-shadow: var(--uc-tab-background-shadow-soft) var(--uc-tab-shadow-color), + var(--uc-tab-additional-shadow) !important; } /* For themes outside of Light and Dark (which are curated by Mozilla), show a thicker border @@ -41,9 +63,8 @@ .tabbrowser-tab:is([visuallyselected="true"], [multiselected]) > .tab-stack > .tab-background:-moz-lwtheme { - box-shadow: 0 0 0 1px - var(--tab-line-color, var(--lwt-tab-line-color, var(--tabs-border-color, rgba(128, 128, 142, 0.9)))), - 0 0 4px rgba(128, 128, 142, 0.5) !important; + box-shadow: var(--uc-tab-background-shadow-hard) var(--uc-tab-shadow-color), + var(--uc-tab-additional-shadow) !important; } :root:not([lwtheme-mozlightdark], [style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"]) @@ -52,6 +73,5 @@ .tabbrowser-tab:is([visuallyselected="true"], [multiselected]) > .tab-stack > .tab-background:-moz-lwtheme { - box-shadow: 0 0 0 1px - var(--tab-line-color, var(--lwt-tab-line-color, var(--tabs-border-color, rgba(128, 128, 142, 0.9)))) !important; + box-shadow: var(--uc-tab-background-shadow-hard) var(--uc-tab-shadow-color) !important; } diff --git a/src/tab/selected_tab/_multi_selected.scss b/src/tab/selected_tab/_multi_selected.scss index 12c93c4..225d5c3 100644 --- a/src/tab/selected_tab/_multi_selected.scss +++ b/src/tab/selected_tab/_multi_selected.scss @@ -1,22 +1,37 @@ - #tabbrowser-tabs:not([movingtab]) +#TabsToolbar { + --uc-multiselected-tab-bgcolor: color-mix(in srgb, currentColor 28%, var(--toolbar-bgcolor, transparent)); + + &[brighttext] { + --uc-multiselected-tab-bgcolor: color-mix(in srgb, currentColor 16%, var(--toolbar-bgcolor, transparent)); + } +} + +#tabbrowser-tabs:not([movingtab]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab > .tab-stack - > .tab-background[multiselected]:not([selected]):-moz-lwtheme { - background-image: linear-gradient(var(--toolbar-bgcolor, transparent), var(--toolbar-bgcolor, transparent)), - linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none) !important; -} + > .tab-background[multiselected]:not([selected]) { + /* Original: + background-attachment: scroll, scroll, fixed; + background-color: transparent; + background-image: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), + linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), + var(--lwt-header-image, none); + background-position: 0 0, 0 0, right top; + background-repeat: repeat-x, repeat-x, no-repeat; + background-size: auto 100%, auto 100%, auto auto; + */ + // background-image: linear-gradient(var(--toolbar-bgcolor, transparent), var(--toolbar-bgcolor, transparent)), + // linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none) !important; -.tab-background[multiselected="true"]:not([selected="true"]) > .tab-loading-burst:not([bursting]) { - background: color-mix(in srgb, currentColor 65%, transparent); - opacity: 0.3; + background-attachment: scroll, fixed !important; + background-color: transparent !important; + background-image: linear-gradient(var(--uc-multiselected-tab-bgcolor), var(--uc-multiselected-tab-bgcolor)), + var(--lwt-header-image, none) !important; + background-position: 0 0, right top !important; + background-repeat: repeat-x, no-repeat !important; + background-size: auto 100%, auto auto !important; } -#TabsToolbar[brighttext] - .tab-background[multiselected="true"]:not([selected="true"]) - > .tab-loading-burst:not([bursting]) { - opacity: 0.15; -} - @include Option("userChrome.tab.connect_to_window") { .tab-background[multiselected=true] { diff --git a/src/tab/selected_tab/_photon_like_contextline.scss b/src/tab/selected_tab/_photon_like_contextline.scss index 6863996..13d7644 100644 --- a/src/tab/selected_tab/_photon_like_contextline.scss +++ b/src/tab/selected_tab/_photon_like_contextline.scss @@ -1,14 +1,3 @@ -:root[lwtheme-mozlightdark] #tabbrowser-tabs, /* Legacy: v96 */ -:root[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26);"], -:root[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254);"] { - --tab-line-color: rgb(10, 132, 255) !important; -} -@media (-moz-gtk-csd-available) { - :root:not(:-moz-lwtheme) #tabbrowser-tabs { - --tab-line-color: Highlight !important; /* -moz-accent-color */ - } -} - .tab-context-line { display: -moz-inline-box !important; height: 2px !important; @@ -37,7 +26,7 @@ background-color: rgba(255, 255, 255, 0.2) !important; } -/* Prevent identitiy color flashing */ +/* Prevent identity color flashing */ .tabbrowser-tab[usercontextid] .tab-context-line { --identity-icon-color: none; } diff --git a/src/tab/sound_tab/_show_with_favicons.scss b/src/tab/sound_tab/_show_with_favicons.scss index 8427e96..1b4ac30 100644 --- a/src/tab/sound_tab/_show_with_favicons.scss +++ b/src/tab/sound_tab/_show_with_favicons.scss @@ -31,13 +31,19 @@ } /* Makes the speaker icon to always appear if the tab is playing (not only on hover) */ +.tabbrowser-tab { + --uc-sound-tab-icon-position-x: -0.5px; + &:-moz-locale-dir(rtl) { + --uc-sound-tab-icon-position-x: 0.5px; + } +} .tab-icon-overlay:not([crashed]), .tab-icon-overlay[pinned][crashed][selected] { /* Position */ top: 0 !important; inset-inline-end: -9px !important; z-index: 1 !important; - transform: translateX(-0.5px) translateY(-6px); + transform: translateX(var(--uc-sound-tab-icon-position-x)) translateY(-6px); /* Shape */ padding: 1.5px !important; @@ -56,8 +62,21 @@ /* Label */ @include _hidden_tabIcon_soundTabLabel { - .tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) .tab-label { - transform: translateX(4px); + .tabbrowser-tab:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) { + .tab-label-container { + &[labeldirection=ltr], + &:not([labeldirection]):-moz-locale-dir(ltr) { + --uc-sound-tab-label-position-x: 4px; + } + &[labeldirection=rtl], + &:not([labeldirection]):-moz-locale-dir(rtl) { + --uc-sound-tab-label-position-x: -4px; + } + + > * { + transform: translateX(var(--uc-sound-tab-label-position-x)); + } + } } } @@ -68,7 +87,7 @@ transition: 0.1s var(--animation-easing-function); } - .tab-label-container > .tab-label { + .tab-label-container > * { transition: transform 0.25s var(--animation-easing-function); } } @@ -76,9 +95,22 @@ /* None exist favicon - Size bigger */ @include NotOption("userChrome.tab.always_show_tab_icon") { .tabbrowser-tab { + .tab-label-container { + &[labeldirection=ltr], + &:not([labeldirection]):-moz-locale-dir(ltr) { + --uc-sound-tab-no-icon-position-x: -0.5px; + --uc-sound-tab-no-icon-label-position-x: 3px; + } + &[labeldirection=rtl], + &:not([labeldirection]):-moz-locale-dir(rtl) { + --uc-sound-tab-no-icon-position-x: 0.5px; + --uc-sound-tab-no-icon-label-position-x: -3px; + } + } + @include _hidden_tabIcon_soundTabIcon { .tab-icon-overlay:not([pinned], [sharing], [crashed]) { - transform: translateX(-0.5px) translateY(-1px); + transform: translateX(var(--uc-sound-tab-no-icon-position-x)) translateY(-1px); inset-inline-end: 0 !important; margin-inline-end: 0 !important; padding: 0 !important; @@ -87,8 +119,8 @@ opacity: 0 !important; /* Favicon hidden */ } &:not([image]):not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) - .tab-label { - transform: translateX(3px); + .tab-label-container > * { + transform: translateX(var(--uc-sound-tab-no-icon-label-position-x)); } } } @@ -102,7 +134,7 @@ /* Busy - Overlay Position */ .tabbrowser-tab:not([pinned])[busy] .tab-icon-overlay:is([soundplaying], [muted], [activemedia-blocked]) { - transform: translateX(-0.5px) translateY(-6px); + transform: translateX(var(--uc-sound-tab-icon-position-x)) translateY(-6px); } .tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing], [crashed])[busy] { inset-inline-end: -9px !important; diff --git a/src/tab/unselected_tab/_bar_separator.scss b/src/tab/unselected_tab/_bar_separator.scss new file mode 100644 index 0000000..ebd2b52 --- /dev/null +++ b/src/tab/unselected_tab/_bar_separator.scss @@ -0,0 +1,55 @@ +// Using --tab-line-color at photon_line_contextline + +.tab-stack::before { + $barWidth: 3px; + $barMargin: $barWidth + 2px; + + /* Box Model */ + content: ""; + display: block; + position: absolute; + + /* Position */ + top: 50%; + left: 0%; + transform: translateX(calc((var(--inline-tab-padding) - #{ $barMargin }) / 2)) translateY(calc(-50% + var(--tab-block-margin))); + z-index: 1; + + /* Bar shape */ + width: $barWidth; + height: 20px; + + /* Bar Color */ + background-color: var(--uc-bar-separator-color, var(--tab-line-color, var(--lwt-tab-line-color, rgb(10, 132, 255)))); + + @include Animate { + transition-property: opacity, background-color; + transition-duration: 0.2s; + transition-timing-function: var(--animation-easing-function); /* cubic-bezier(.07, .95, 0, 1) */ + } +} + +:root[sessionrestored] { + .tabbrowser-tab[busy] { + .tab-stack::before { + --uc-bar-separator-color: currentColor; + opacity: 0.7; + } + + &[progress] .tab-stack::before { + --uc-bar-separator-color: var(--tab-loading-fill); + opacity: 1; + } + } + #TabsToolbar[brighttext] .tabbrowser-tab[busy] { + &[progress]:not([selected=true]) .tab-stack::before { + --uc-bar-separator-color: var(--lwt-tab-loading-fill-inactive, #84c1ff); + } + } + + @include Option("userChrome.tab.unloaded") { + .tabbrowser-tab[pending] .tab-stack::before { + opacity: 0.7; + } + } +} diff --git a/src/tab/unselected_tab/_dynamic_separator.scss b/src/tab/unselected_tab/_dynamic_separator.scss index e997567..321437d 100644 --- a/src/tab/unselected_tab/_dynamic_separator.scss +++ b/src/tab/unselected_tab/_dynamic_separator.scss @@ -23,46 +23,58 @@ //------------------------------------------------------------------------------ -@include Option("userChrome.tab.newtab_button_like_tab") { - #tabbrowser-arrowscrollbox { - position: absolute; +#tabbrowser-arrowscrollbox { + --start-tab-separator-position-x: -1.5px; + --end-tab-separator-position-x: 1.5px; + --tab-separator-position-x: -2.5px; + --tab-separator-position-y: calc(-50% + 1px); + &:-moz-locale-dir(rtl) { + --start-tab-separator-position-x: 1.5px; + --end-tab-separator-position-x: -1.5px; + --tab-separator-position-x: 2.5px; } +} - .tab-background::before, +#tabbrowser-arrowscrollbox-periphery { + position: relative; +} + +@include Option("userChrome.tab.newtab_button_like_tab") { + .tab-stack::before, #tabs-newtab-button::before { @include _dynamicSeparatorShape; /* More position */ - transform: translateX(-2.5px) translateY(calc(-50% + 1px)); + transform: translateX(var(--tab-separator-position-x)) translateY(var(--tab-separator-position-y)); } } @include NotOption("userChrome.tab.newtab_button_like_tab") { - .tab-background::before, + .tab-stack::before, #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab:not([visuallyselected], [multiselected], :hover)[last-visible-tab] - .tab-background::after { + .tab-stack::after { @include _dynamicSeparatorShape; } - .tab-background::before { - transform: translateX(-2.5px) translateY(calc(-50% + 1px)) !important; + .tab-stack::before { + transform: translateX(var(--tab-separator-position-x)) translateY(var(--tab-separator-position-y)) !important; } - .tabbrowser-tab[last-visible-tab] .tab-background::after { + .tabbrowser-tab[last-visible-tab] .tab-stack::after { right: 0; - transform: translateX(1.5px) translateY(calc(-50% + 1px)) !important; + transform: translateX(var(--end-tab-separator-position-x)) translateY(var(--tab-separator-position-y)) !important; } } -.tabbrowser-tab:not([visuallyselected], [multiselected], :hover, :first-child) .tab-background::before { +.tabbrowser-tab:not([visuallyselected], [multiselected], :hover, :first-child) .tab-stack::before { opacity: var(--tab-separator-opacity); } @include Option("userChrome.tabbar.one_liner") { @include NotOption("userChrome.tabbar.one_liner.tabbar_first") { @include OneLinerContent { - .tabbrowser-tab:not([visuallyselected], [multiselected], :hover):first-child .tab-background::before { + .tabbrowser-tab:not([visuallyselected], [multiselected], :hover):first-child .tab-stack::before { opacity: var(--tab-separator-opacity); - transform: translateX(-1.5px) translateY(calc(-50% + 1px)); + transform: translateX(var(--start-tab-separator-position-x)) translateY(var(--tab-separator-position-y)); } } } @@ -73,32 +85,32 @@ } } @include NotOption("userChrome.tab.newtab_button_like_tab") { - #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab[first-visible-unpinned-tab] .tab-background::before, + #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab[first-visible-unpinned-tab] .tab-stack::before, #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab:not([visuallyselected], [multiselected], :hover)[last-visible-tab] - .tab-background::after { + .tab-stack::after { opacity: var(--tab-separator-opacity); } } #navigator-toolbox:not([movingtab]) .tabbrowser-tab[first-visible-unpinned-tab]:is([visuallyselected], [multiselected], :hover) - .tab-background::before, + .tab-stack::before, #navigator-toolbox:not([movingtab]) #tabbrowser-arrowscrollbox[overflowing] tab.tabbrowser-tab[first-visible-unpinned-tab] - .tab-background::before { + .tab-stack::before { opacity: 0 !important; } @include Option("userChrome.tab.newtab_button_like_tab") { #navigator-toolbox:not([movingtab]) .tabbrowser-tab:is([visuallyselected], [multiselected], :hover) + .tabbrowser-tab - .tab-background::before, + .tab-stack::before, #navigator-toolbox:not([movingtab]) .tabbrowser-tab:is([visuallyselected], [multiselected], :hover) ~ .tabbrowser-tab[afterhovered] - .tab-background::before, + .tab-stack::before, #navigator-toolbox:not([movingtab]) .tabbrowser-tab[last-visible-tab]:is([visuallyselected], [multiselected], :hover) ~ #tabs-newtab-button::before, /* Legacy - v103 */ @@ -111,14 +123,21 @@ @include NotOption("userChrome.tab.newtab_button_like_tab") { .tabbrowser-tab:is([visuallyselected], [multiselected], :hover) + .tabbrowser-tab:not([visuallyselected]) - .tab-background::before { + .tab-stack::before { opacity: 0 !important; } + + :root:not([uidensity="compact"]) #tabs-newtab-button > .toolbarbutton-icon { + margin-left: 2px; + } + :root[uidensity="compact"] #tabs-newtab-button > .toolbarbutton-icon { + margin-left: 1px; + } } /* Animate */ @include Animate { - .tab-background::before { + .tab-stack::before { transition: opacity 0.2s var(--animation-easing-function); /* cubic-bezier(.07, .95, 0, 1) */ } @include Option("userChrome.tab.newtab_button_like_tab") { @@ -129,7 +148,7 @@ @include NotOption("userChrome.tab.newtab_button_like_tab") { #tabbrowser-arrowscrollbox:not([overflowing]) .tabbrowser-tab:not([visuallyselected], [multiselected], :hover)[last-visible-tab] - .tab-background::after { + .tab-stack::after { transition: opacity 0.2s var(--animation-easing-function); /* cubic-bezier(.07, .95, 0, 1) */ } } diff --git a/src/tab/unselected_tab/_static_separator.scss b/src/tab/unselected_tab/_static_separator.scss index 2e7e625..0111a18 100644 --- a/src/tab/unselected_tab/_static_separator.scss +++ b/src/tab/unselected_tab/_static_separator.scss @@ -1,10 +1,10 @@ -.tabbrowser-tab[first-visible-tab="true"] .tab-background::before, -.tab-background::after { +.tabbrowser-tab[first-visible-tab="true"] .tab-stack::before, +.tab-stack::after { content: ""; } -.tab-background::before, -.tab-background::after { +.tab-stack::before, +.tab-stack::after { /* Box Model */ display: block; position: absolute; @@ -21,13 +21,13 @@ opacity: 0.3; border-right: 1px solid var(--lwt-background-tab-separator-color, currentColor) !important; } -.tab-background::after { +.tab-stack::after { right: 0; } -.tabbrowser-tab[visuallyselected] .tab-background::before, -.tabbrowser-tab[visuallyselected] .tab-background::after, -.tabbrowser-tab[beforeselected-visible] .tab-background::after { +.tabbrowser-tab[visuallyselected] .tab-stack::before, +.tabbrowser-tab[visuallyselected] .tab-stack::after, +.tabbrowser-tab[beforeselected-visible] .tab-stack::after { @include Option("userChrome.tab.static_separator.selected_accent") { --lwt-background-tab-separator-color: var(--tab-line-color, var(--lwt-tab-line-color, rgb(10, 132, 255))); opacity: 1; @@ -39,8 +39,8 @@ /* Animate */ @include Animate { - .tab-background::before, - .tab-background::after { + .tab-stack::before, + .tab-stack::after { transition: opacity 0.2s var(--animation-easing-function); /* cubic-bezier(.07, .95, 0, 1) */ } } diff --git a/src/tabbar/_as_titlebar.scss b/src/tabbar/_as_titlebar.scss index 2bdacab..7d6fcb0 100644 --- a/src/tabbar/_as_titlebar.scss +++ b/src/tabbar/_as_titlebar.scss @@ -28,7 +28,7 @@ spacer:is([part="overflow-start-indicator"], [part="overflow-end-indicator"]), .tabbrowser-tab[selected="true"] { -moz-window-dragging: drag; --tab-max-width: 100vw; - min-width: calc(var(--uc-tabbar-width, 100vw) - var(--uc-widow-control-space)) !important; + min-width: calc(var(--uc-tabbar-width, 100vw) - var(--uc-window-control-space)) !important; max-width: var(--tab-max-width) !important; margin-inline-start: calc(var(--tab-shadow-max-size) * -1) !important; diff --git a/src/tabbar/_fill_width.scss b/src/tabbar/_fill_width.scss new file mode 100644 index 0000000..2da94c5 --- /dev/null +++ b/src/tabbar/_fill_width.scss @@ -0,0 +1,8 @@ +// Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_fill_available_width.css made available under Mozilla Public License v. 2.0 +// See the above repository for updates as well as full license text. + +/* Why 100vw? Tab closing requires width animation to end and "none" can't be animated */ +.tabbrowser-tab[fadein]:not([style^="max-width"]) { + --tab-max-width: 100vw; + max-width: var(--tab-max-width) !important; +} diff --git a/src/tabbar/_index.scss b/src/tabbar/_index.scss index 0f5909d..a6691c4 100644 --- a/src/tabbar/_index.scss +++ b/src/tabbar/_index.scss @@ -42,3 +42,18 @@ @include Option("userChrome.tabbar.as_titlebar") { @import "as_titlebar"; } + +/*= Tab Bar - Multi Row ======================================================*/ +@include Option("userChrome.tabbar.multi_row") { + @import "multi_row"; +} + +/*= Tab Bar - Scollmode disabled =============================================*/ +@include Option("userChrome.tabbar.unscroll") { + @import "unscroll"; +} + +/*= Tab Bar - Fill width tab =================================================*/ +@include Option("userChrome.tabbar.fill_width") { + @import "fill_width"; +} diff --git a/src/tabbar/_layout.scss b/src/tabbar/_layout.scss index b6fed2c..3a57631 100644 --- a/src/tabbar/_layout.scss +++ b/src/tabbar/_layout.scss @@ -1,3 +1,15 @@ +//-- Mixin --------------------------------------------------------------------- +@mixin _oneLiner_windowControl() { + @include Option("userChrome.tabbar.one_liner.tabbar_first") { + @content; + } + @include OS($mac) { + @content; + } +} + +//------------------------------------------------------------------------------ + @include NotOption("userChrome.tabbar.one_liner") { @include Option("userChrome.tabbar.on_bottom", "userChrome.hidden.tabbar") { @import "layout/window_control"; @@ -5,7 +17,7 @@ } @include Option("userChrome.tabbar.one_liner") { @include NotOption("userChrome.tabbar.one_liner.responsive") { - @include Option("userChrome.tabbar.one_liner.tabbar_first") { + @include _oneLiner_windowControl() { @import "layout/window_control"; } } @@ -15,12 +27,14 @@ @import "layout/window_control"; } } - @include Option("userChrome.tabbar.one_liner.tabbar_first") { - @media screen and (min-width: 1100px) { + @media screen and (min-width: 1100px) { + @include _oneLiner_windowControl() { @import "layout/window_control"; } } } } -@import "layout/navbar_padding"; +@include NotOption("userChrome.navbar.as_sidebar") { + @import "layout/navbar_padding"; +} diff --git a/src/tabbar/_multi_row.scss b/src/tabbar/_multi_row.scss new file mode 100644 index 0000000..fa3f498 --- /dev/null +++ b/src/tabbar/_multi_row.scss @@ -0,0 +1,76 @@ +/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/multi-row_tabs.css made available under Mozilla Public License v. 2.0 +See the above repository for updates as well as full license text. */ + +:root { + --uc-multirow-tabbar-rows: 3; + --uc-multirow-tab-dynamic-width: 1; /* Change to 0 for fixed-width tabs using the above width. */ +} + +// Scrollbar can't be clicked but the rows can be scrolled with mouse wheel +// Uncomment the next line if you want to be able to use the scrollbar with mouse clicks +// #tabbrowser-arrowscrollbox{ -moz-window-dragging: no-drag } + +// Uncommenting the above makes you unable to drag the window from empty space in the tab strip but normal draggable spaces will continue to work + +#tabbrowser-tabs { + min-height: unset !important; + padding-inline-start: 0px !important; +} + +@-moz-document url(chrome://browser/content/browser.xhtml) { + #scrollbutton-up ~ spacer, + #scrollbutton-up, + #scrollbutton-down { + display: var(--scrollbutton-display-model, initial); + } + + scrollbox[part][orient="horizontal"] { + display: flex; + flex-wrap: wrap; + overflow-y: auto; + max-height: calc((var(--tab-min-height) + 2 * var(--tab-block-margin, 0px)) * var(--uc-multirow-tabbar-rows)); + // scrollbar-color: currentColor transparent; + // scrollbar-width: thin; + scroll-snap-type: y mandatory; + } +} + +.scrollbox-clip[orient="horizontal"], +#tabbrowser-arrowscrollbox { + overflow: -moz-hidden-unscrollable; + display: block; + --scrollbutton-display-model: none; +} + +.tabbrowser-tab { + scroll-snap-align: start; +} + +#tabbrowser-tabs .tabbrowser-tab[pinned] { + position: static !important; + margin-inline-start: 0px !important; +} + +.tabbrowser-tab[fadein]:not([pinned]) { + flex-grow: var(--uc-multirow-tab-dynamic-width); +} + +.tabbrowser-tab > stack { + width: 100%; + height: 100%; +} + +/* remove bottom margin so it doesn't throw off row height computation */ +#tabs-newtab-button { + margin-bottom: 0 !important; +} +#tabbrowser-tabs[hasadjacentnewtabbutton][overflow="true"] > #tabbrowser-arrowscrollbox > #tabbrowser-arrowscrollbox-periphery > #tabs-newtab-button { + display: -moz-box !important; +} + +#alltabs-button, +:root:not([customizing]) #TabsToolbar #new-tab-button, +#tabbrowser-arrowscrollbox > spacer, +.tabbrowser-tab::after { + display: none !important; +} diff --git a/src/tabbar/_on_bottom.scss b/src/tabbar/_on_bottom.scss index 6011748..b8095b0 100644 --- a/src/tabbar/_on_bottom.scss +++ b/src/tabbar/_on_bottom.scss @@ -36,7 +36,7 @@ See the above repository for updates as well as full license text. */ } } -/*= Tabbar - Hidden at singgle tab ===========================================*/ +/*= Tabbar - Hidden at single tab ===========================================*/ @include Option("userChrome.tabbar.on_bottom.hidden_single_tab") { #tabbrowser-tabs .tabbrowser-tab:only-of-type { display: none !important; @@ -60,17 +60,6 @@ See the above repository for updates as well as full license text. */ /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ - :root { - /* height if native titlebar is enabled, assumes empty menubar */ - --uc-menubar-height: 20px; - --uc-menubar-padding: 1px; /* FF's menubar padding */ - --uc-menubar-container-height: calc(var(--uc-menubar-height) - (2 * var(--uc-menubar-padding))); - } - :root[tabsintitlebar] { - /* height when native titlebar is disabled, more roomy so can fit buttons etc. */ - --uc-menubar-height: 30px; - } - /* Menubar on top patch - use with tabs_on_bottom.css */ /* Only really useful if menubar is ALWAYS visible */ :root:not([sizemode="fullscreen"]) { @@ -117,10 +106,6 @@ See the above repository for updates as well as full license text. */ --toolbarbutton-inner-padding: 3px; } - #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, - #TabsToolbar > .titlebar-buttonbox-container { - height: var(--uc-menubar-container-height); - } :root:not([chromehidden~="menubar"], [sizemode="fullscreen"]) #toolbar-menubar:not([autohide="true"]) + #TabsToolbar > .titlebar-buttonbox-container{ visibility: collapse !important; } diff --git a/src/tabbar/_one_liner.scss b/src/tabbar/_one_liner.scss index 2824363..a74fc22 100644 --- a/src/tabbar/_one_liner.scss +++ b/src/tabbar/_one_liner.scss @@ -16,7 +16,7 @@ height: calc(var(--uc-tabbar-height) - var(--uc-navbar-double-block)) !important; margin-top: calc(var(--uc-tabbar-hide-height) + var(--uc-navbar-double-block)) !important; margin-bottom: var(--uc-navbar-block, 0px) !important; - transform: translateY(calc(-1 * var(--uc-navbar-block, 0px))); + // transform: translateY(calc(-1 * var(--uc-navbar-block, 0px))); } #titlebar { @@ -26,6 +26,11 @@ transform: translateY(calc(-1 * var(--uc-navbar-block, 0px))); } +#navigator-toolbox { + position: relative; + z-index: 2; +} + @include NotOption("userChrome.tabbar.one_liner.combine_navbar") { :root { --uc-navbar-gap: 10px; @@ -49,8 +54,9 @@ -moz-box-align: center; } - #urlbar[breakout] { - top: 0px !important; /* Original: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2); */ + #urlbar-container { + // Minus --toolbarbutton-inner-padding + min-height: calc(var(--urlbar-container-height) - 2px) !important; } } @@ -67,7 +73,12 @@ } #urlbar-container { - min-width: calc(24px + 2 * var(--toolbarbutton-inner-padding)) !important; // Original: calc(350px + 24px + 2 * var(--toolbarbutton-inner-padding)) + // https://github.com/mozilla/gecko-dev/commit/f30aeeee449c753d7494c788cae58dae7e1a92e5 + // https://github.com/mozilla/gecko-dev/commit/42a66e80d97bc07b25be913c02fd004ee9c7ca1a + min-width: calc(var(--uc-oneliner-urlbar-base-width, 50px) + 24px + 2 * var(--toolbarbutton-inner-padding)) !important; // Original: calc(350px + 24px + 2 * var(--toolbarbutton-inner-padding)) +} +#urlbar[breakout][breakout-extend] { + min-width: calc(310px + 2 * (24px + 2 * var(--toolbarbutton-inner-padding))) !important; } #PersonalToolbar { diff --git a/src/tabbar/_unscroll.scss b/src/tabbar/_unscroll.scss new file mode 100644 index 0000000..f343b0f --- /dev/null +++ b/src/tabbar/_unscroll.scss @@ -0,0 +1,53 @@ +// https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Container_Queries +// https://bugzilla.mozilla.org/show_bug.cgi?id=1744221 + +// `layout.css.container-queries.enabled` to `true` +// `layout.css.overflow-moz-hidden-unscrollable.enabled` to `true` +// `browser.tabs.tabMinWidth` to `0` + +/* Disable scrollbox */ +spacer[part="overflow-start-indicator"] + .scrollbox-clip > scrollbox { + overflow: -moz-hidden-unscrollable !important; +} + +#tabbrowser-tabs[closebuttons="activetab"] { + .tabbrowser-tab:not([pinned]):not([visuallyselected]) { + /* Set minimum width below which tabs will not shrink */ + --tab-min-width: 16px; // or calc(16px + (var(--inline-tab-padding) * 2)) + + container-type: inline-size; + container-name: backgroundTab; + + @container backgroundTab (max-width: 46px) { + .tab-content { + --inline-tab-padding: 0px; + justify-self: center; + } + .tab-icon-stack > * { + margin-inline-end: 0 !important; + } + .tab-label-container, + &:hover .tab-close-button { + visibility: collapse !important; + } + } + } + + // New tab button + &[hasadjacentnewtabbutton="true"] { + #tabbrowser-arrowscrollbox-periphery { + position: absolute !important; + right: 0; + top: 50%; + transform: translateY(-50%); + + > #tabs-newtab-button { + z-index: 2 !important; + } + } + + #tabbrowser-arrowscrollbox { + padding-inline-end: calc(16px + (var(--toolbarbutton-inner-padding) + var(--toolbarbutton-outer-padding)) * 2) !important; + } + } +} diff --git a/src/tabbar/layout/_navbar_padding.scss b/src/tabbar/layout/_navbar_padding.scss index 41f22b5..52142e9 100644 --- a/src/tabbar/layout/_navbar_padding.scss +++ b/src/tabbar/layout/_navbar_padding.scss @@ -2,32 +2,6 @@ /* Customized https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/window_control_placeholder_support.css */ //-- Mixin --------------------------------------------------------------------- -@mixin _remove_spacer_pre() { - /* Don't need pre spacer */ - --uc-window-drag-space-pre: 0px; -} - -@mixin _remove_spacer_post() { - /* Don't need window control */ - --uc-widow-control-space: 0px; -} - -@mixin _remove_spacer_oneLiner() { - @include Option("userChrome.tabbar.one_liner.tabbar_first") { - @include _remove_spacer_pre; - @include Option("userChrome.tabbar.as_titlebar") { - #tabbrowser-tabs { - @include _remove_spacer_post; - } - } - } - @include NotOption("userChrome.tabbar.one_liner.tabbar_first") { - @include NotOption("userChrome.tabbar.as_titlebar") { - @include _remove_spacer_post; - } - } -} - @mixin _oneLiner_navBar_borderPadding() { @include NotOption("userChrome.tabbar.one_liner") { @content; @@ -61,66 +35,64 @@ //------------------------------------------------------------------------------ -@include Option("userChrome.tabbar.one_liner") { - :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - @include NotOption("userChrome.tabbar.one_liner.responsive") { - @include _remove_spacer_oneLiner; - } - @include Option("userChrome.tabbar.one_liner.responsive") { - @media screen and (max-width: 1100px) { - @include NotOption("userChrome.tabbar.on_bottom", "userChrome.hidden.tabbar") { - @include _remove_spacer_pre; - @include _remove_spacer_post; - } - } - @media screen and (min-width: 1100px) { - @include _remove_spacer_oneLiner; - } - } - } -} - #nav-bar { border-inline-style: solid !important; border-inline-color: transparent; - @include _oneLiner_navBar_borderPadding { - border-inline-start-width: var(--uc-window-drag-space-pre); - border-inline-end-width: var(--uc-widow-control-space); - } - - @include Option("userChrome.tabbar.one_liner") { - @include _oneLiner_navBar_marginGap { - @include NotOption("userChrome.tabbar.one_liner.tabbar_first") { - margin-inline-start: var(--uc-window-drag-space-pre) !important; - } - @include Option("userChrome.tabbar.one_liner.tabbar_first") { - margin-inline-end: var(--uc-widow-control-space) !important; - } - } - } -} - -/* Use this pref to check Mac OS where window controls are on left */ -/* This pref defaults to true on Mac and doesn't actually do anything on other platforms. So if your system has window controls on LEFT side you can set the pref to true */ -@include OS($mac) { - :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { + @include WindowControl_Right { @include _oneLiner_navBar_borderPadding { - border-inline-start-width: var(--uc-widow-control-space); - border-inline-end-width: var(--uc-window-drag-space-pre); + border-inline-start-width: var(--uc-window-drag-space-pre); + border-inline-end-width: var(--uc-window-control-space); } @include Option("userChrome.tabbar.one_liner") { @include _oneLiner_navBar_marginGap { @include NotOption("userChrome.tabbar.one_liner.tabbar_first") { - margin-inline-start: var(--uc-window-drag-space-pre, 0px) !important; + margin-inline-start: var(--uc-window-drag-space-pre) !important; } @include Option("userChrome.tabbar.one_liner.tabbar_first") { - margin-inline-end: var(--uc-widow-control-space, 0px) !important; + margin-inline-end: var(--uc-window-control-space) !important; } } } } +} + +@include WindowControl_Left { + #nav-bar { + @include _oneLiner_navBar_borderPadding { + border-inline-start-width: var(--uc-window-control-space); + border-inline-end-width: var(--uc-window-drag-space-pre); + } + @include Option("userChrome.tabbar.one_liner") { + @include _oneLiner_navBar_marginGap { + @include NotOption("userChrome.tabbar.one_liner.tabbar_first") { + margin-inline-start: var(--uc-window-control-space, 0px) !important; + } + @include Option("userChrome.tabbar.one_liner.tabbar_first") { + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + } + } + + #TabsToolbar { + @include Option("userChrome.tabbar.one_liner") { + @include _oneLiner_navBar_marginGap { + @include NotOption("userChrome.tabbar.one_liner.tabbar_first") { + margin-inline-end: var(--uc-window-drag-space-pre, 0px) !important; + } + } + @include Option("userChrome.tabbar.one_liner.tabbar_first") { + @include OneLinerContent { + margin-inline-start: var(--uc-window-control-width, 0px) !important; + } + } + } + } +} + +@include OS($mac) { :root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child, :root[sizemode="fullscreen"] #window-controls { right: unset; diff --git a/src/tabbar/layout/_window_control.scss b/src/tabbar/layout/_window_control.scss index eef3fc9..3e9e576 100644 --- a/src/tabbar/layout/_window_control.scss +++ b/src/tabbar/layout/_window_control.scss @@ -1,13 +1,19 @@ /*= Windows Control - Move to toolbar ========================================*/ /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ + +/* Titlebar Button Box */ :root { --uc-titlebar-padding: 0px; } -@include OS($win) { - :root[sizemode="maximized"][tabsintitlebar] { - --uc-titlebar-padding: 8px; +#navigator-toolbox { + padding-top: var(--uc-titlebar-padding) !important; + + @include Option("userChrome.tabbar.on_bottom") { + @include Option("userChrome.tabbar.on_bottom.menubar_on_top") { + padding-top: calc(max(var(--uc-menubar-height), var(--uc-menubar-height-default)) + var(--uc-titlebar-padding)) !important; + } } } @@ -15,29 +21,59 @@ See the above repository for updates as well as full license text. */ #TabsToolbar > .titlebar-buttonbox-container { position: fixed; display: block; - top: var(--uc-titlebar-padding); + top: 0; right:0; - height: 40px; z-index: 1; } -/* where window controls are on left */ -@include OS($mac) { - :root{ - --uc-titlebar-padding: 0px !important; +#toolbar-menubar[autohide="true"] { + > .titlebar-buttonbox-container { + height: var(--uc-titlebar-buttonbox-height, var(--uc-navbar-height, 36px)); } + + @include OS($win10) { + &[inactive="true"] > > .titlebar-buttonbox-container .titlebar-button { + stroke: var(--toolbar-color, currentColor) !important; + } + } +} + +.titlebar-buttonbox-container > .titlebar-buttonbox { + height: 100%; + @include OS($mac) { + margin-block: 10px; + } +} + +@include WindowControl_Left { .titlebar-buttonbox-container{ left:0; right: unset !important; } } -#navigator-toolbox { - padding-top: calc(var(--uc-menubar-height, 0px) + var(--uc-titlebar-padding)) !important; +@include OS($win) { + :root[sizemode="maximized"][tabsintitlebar] { + --uc-titlebar-padding: 8px; + + #navigator-toolbox-background { + margin-top: calc(-1 * var(--uc-titlebar-padding)); + } + } + :root[sizemode="normal"][tabsintitlebar] #titlebar, + :root[sizemode="maximized"][tabsintitlebar] #titlebar { + appearance: none !important; + } + .browser-toolbar:not(.titlebar-color) { + background-clip: border-box !important; + } } -:root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container { - height: 32px; +@include OS($mac) { + #toolbar-menubar:not([autohide="true"]) { + visibility: visible !important; + height: 0; + } } #toolbar-menubar[inactive] > .titlebar-buttonbox-container { @@ -55,6 +91,7 @@ See the above repository for updates as well as full license text. */ } } } + #navigator-toolbox:is(:hover, :focus-within) #toolbar-menubar[inactive]:not([customizing]) > .titlebar-buttonbox-container { @include Option("userChrome.hidden.tabbar") { @include Option("userChrome.autohide.navbar") { @@ -63,6 +100,7 @@ See the above repository for updates as well as full license text. */ } } } + @include Animate { #toolbar-menubar[inactive] > .titlebar-buttonbox-container { transition: opacity 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay, 600ms), @@ -73,25 +111,6 @@ See the above repository for updates as well as full license text. */ } } -.titlebar-buttonbox-container > .titlebar-buttonbox { - height: 100%; - @include OS($mac) { - margin-block: 10px; - } -} - -/* At Full Screen */ -:root[sizemode="fullscreen"] #window-controls { - position: fixed; - display: flex; - top: 0; - right: 0; - height: 40px; -} -:root[uidensity="compact"][sizemode="fullscreen"] #window-controls { - height: 32px; -} - @include Option("browser.fullscreen.autohide") { :root[sizemode="fullscreen"] #navigator-toolbox:not(:hover) .titlebar-buttonbox-container { visibility: hidden; diff --git a/src/tabbar/layout/_window_control_size.scss b/src/tabbar/layout/_window_control_size.scss index c3bb050..5bcb3bf 100644 --- a/src/tabbar/layout/_window_control_size.scss +++ b/src/tabbar/layout/_window_control_size.scss @@ -3,11 +3,44 @@ --uc-window-drag-space-pre: 0px; /* Same as .titlebar-spacer[type="pre-tabs"] - Extra space reserved on both sides of the nav-bar to be able to drag the window */ --uc-window-drag-space-post: 0px; /* Same as .titlebar-spacer[type="post-tabs"] */ - --uc-widow-control-space: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post)); + --uc-window-control-space: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post)); } +//-- Mixin --------------------------------------------------------------------- +@mixin _remove_spacer_pre() { + --uc-window-drag-space-pre: 0px; // Don't need pre spacer +} + +@mixin _remove_spacer_post() { + --uc-window-control-space: 0px; // Don't need window control +} + +@mixin _remove_spacer_oneLiner() { + @include Option("userChrome.tabbar.one_liner.tabbar_first") { + @include WindowControl_Right { + @include _remove_spacer_pre; + } + @include WindowControl_Left { + @include _remove_spacer_post; + } + @include Option("userChrome.tabbar.as_titlebar") { + #tabbrowser-tabs { + @include _remove_spacer_post; + } + } + } + @include NotOption("userChrome.tabbar.one_liner.tabbar_first") { + @include NotOption("userChrome.tabbar.as_titlebar") { + @include WindowControl_Right { + @include _remove_spacer_post; + } + } + } +} + +//------------------------------------------------------------------------------ + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { - --uc-window-control-width: 84px; /* 84px is default value of linux */ --uc-window-drag-space-pre: var(--uc-title-pre-spacer, 40px); // 30px --uc-window-drag-space-post: var(--uc-title-post-spacer, 40px); // 25px @@ -17,11 +50,61 @@ @include OS($win10) { --uc-window-control-width: 138px; } - @include OS($mac) { + @include OS($linux) { + $linuxWindowControlWidth: 84px / 3; /* 84px is default value of linux */ + + @media (-moz-gtk-csd-minimize-button), + (-moz-gtk-csd-maximize-button), + (-moz-gtk-csd-close-button) { + --uc-window-control-width: #{ $linuxWindowControlWidth }; + } + + @media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button), + (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-close-button), + (-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) { + --uc-window-control-width: #{ $linuxWindowControlWidth * 2 }; + } + + @media (-moz-gtk-csd-minimize-button) and (-moz-gtk-csd-maximize-button) and (-moz-gtk-csd-close-button) { + --uc-window-control-width: #{ $linuxWindowControlWidth * 3 }; + } + } +} +@include OS($mac) { + :root[tabsintitlebar] { --uc-window-control-width: 72px; } + :root[sizemode="fullscreen"] { + @include _remove_spacer_post; + } } :root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) { - --uc-window-drag-space-pre: 0px; /* Remove pre space */ + @include _remove_spacer_pre; +} + +@include Option("userChrome.tabbar.one_liner") { + :root:is([tabsintitlebar], [sizemode="fullscreen"]) { + @include NotOption("userChrome.tabbar.one_liner.responsive") { + @include _remove_spacer_oneLiner; + } + @include Option("userChrome.tabbar.one_liner.responsive") { + @media screen and (max-width: 1100px) { + @include NotOption("userChrome.tabbar.on_bottom", "userChrome.hidden.tabbar") { + @include _remove_spacer_pre; + @include _remove_spacer_post; + } + } + @media screen and (min-width: 1100px) { + @include _remove_spacer_oneLiner; + } + } + } +} + +@include Has { + #navigator-toolbox:has(#toolbar-menubar[autohide="false"]) { + @include _remove_spacer_pre; + @include _remove_spacer_post; + } } diff --git a/src/theme/_fully_color.scss b/src/theme/_fully_color.scss index b13d4ad..192df25 100644 --- a/src/theme/_fully_color.scss +++ b/src/theme/_fully_color.scss @@ -21,6 +21,52 @@ html#main-window menupopup:not(.in-menulist) { ) !important; } +@media (-moz-windows-non-native-menus) { + html#main-window menupopup { + &:not(.in-menulist) { + /* Above FF v105 #466 */ + --panel-color: var(--menu-color) !important; + --panel-background: var(--menu-background-color) !important; + --panel-border-color: var(--menu-border-color) !important; + + menuseparator { + border-top: 1px solid var(--menu-border-color); + } + + menu, + menuitem { + &[disabled="true"], + &[_moz-menuactive="true"][disabled="true"] { + color: var(--menu-disabled-color) !important; + } + + &[_moz-menuactive="true"]:not([disabled="true"]) { + background-color: var(--menuitem-hover-background-color) !important; + color: var(--menu-color) !important; + } + } + } + + #context-navigation > .menuitem-iconic[_moz-menuactive="true"] { + > .menu-iconic-left > .menu-iconic-icon { + background-color: var(--menuitem-hover-background-color) !important; + } + + &, + &[disabled="true"] > .menu-iconic-left > .menu-iconic-icon { + background-color: transparent !important; + } + } + } + + @include Light { + :root[style*="background-noodles-right"] menupopup { + // Alphen Glow Theme - Like darkmode + --toolbarbutton-hover-background: rgba(232, 224, 255, 0.11999999731779099)!important; + } + } +} + // TODO: `OS` not covered case @media not all and (-moz-gtk-csd-available) { window:is(#bookmarksPanel, #history-panel)[lwt-sidebar="true"] menupopup { @@ -38,6 +84,8 @@ html#main-window menupopup:not(.in-menulist) { /* or var(--lwt-sidebar-highlight-background-color) If this value is used, unset is required in the default theme. */ + + background-color: var(--menuitem-hover-background-color) !important; } /* Fallback background - Set to Legacy. It will be removed Next update @@ -63,22 +111,22 @@ html#main-window menupopup:not(.in-menulist) { window:is(#bookmarksPanel, #history-panel)[style*="--newtab-background-color: rgba(43, 42, 51, 1);"] menupopup { /* Default Dark Mode */ --panel-color: var(--menu-color) !important; - --panel-background: var(--menu-background-color) !important; + --panel-background: var(--menu-background-color, -moz-menuhover) !important; } } /*== Info Bar Color ==========================================================*/ .container.infobar { - background-color: var(--urlbar-box-bgcolor); + background-color: var(--urlbar-box-bgcolor) !important; } .notification-button { - background-color: var(--button-bgcolor); + background-color: var(--button-bgcolor) !important; &:hover { - background-color: var(--button-hover-bgcolor); + background-color: var(--button-hover-bgcolor) !important; } &:hover:active { - background-color: var(--button-active-bgcolor); + background-color: var(--button-active-bgcolor) !important; } } diff --git a/src/theme/_index.scss b/src/theme/_index.scss index 36f344e..f9542fa 100644 --- a/src/theme/_index.scss +++ b/src/theme/_index.scss @@ -17,6 +17,7 @@ } @include Option("userChrome.theme.fully_color") { @import "fully_color"; + @import "waterfox"; } /*= Fully Dark Mode ==========================================================*/ diff --git a/src/theme/_proton_color.scss b/src/theme/_proton_color.scss index cd69e70..27f547a 100644 --- a/src/theme/_proton_color.scss +++ b/src/theme/_proton_color.scss @@ -25,7 +25,7 @@ --in-content-link-color-hover: var(--blue-70); --in-content-link-color-active: var(--blue-80); --in-content-link-color-visited: var(--blue-60); - /* button background states are also used for checkboxes and radiobuttons */ + /* button background states are also used for checkboxes and radio buttons */ --in-content-button-text-color: var(--in-content-text-color); --in-content-button-text-color-hover: var(--in-content-text-color); --in-content-button-background: rgba(207, 207, 216, 0.33); @@ -156,4 +156,3 @@ --dialog-warning-text-color: var(--red-40); } } - diff --git a/src/theme/proton_chrome/_cert.scss b/src/theme/proton_chrome/_cert.scss index 152e45f..6e10d2a 100644 --- a/src/theme/proton_chrome/_cert.scss +++ b/src/theme/proton_chrome/_cert.scss @@ -7,7 +7,7 @@ } } -/*= Cert Exeption Dialog =====================================================*/ +/*= Cert Exception Dialog ====================================================*/ @-moz-document url("chrome://pippki/content/exceptionDialog.xhtml") { #locationTextBox { @@ -25,12 +25,12 @@ &:focus { border-color: transparent !important; outline: 2px solid var(--in-content-focus-outline-color) !important; - outline-offset: -1px !important; /* Prevents antialising around the corners */ + outline-offset: -1px !important; /* Prevents antialiasing around the corners */ } &:-moz-ui-invalid { border-color: transparent !important; outline: 2px solid var(--in-content-border-invalid) !important; - outline-offset: -1px !important; /* Prevents antialising around the corners */ + outline-offset: -1px !important; /* Prevents antialiasing around the corners */ } &:disabled { opacity: 0.4 !important; @@ -44,7 +44,7 @@ background-image: url("chrome://global/skin/icons/warning.svg") !important; background-size: 48px !important; background-repeat: no-repeat !important; - + -moz-context-properties: fill !important; fill: currentColor !important; } diff --git a/src/theme/system_default_theme/_mac.scss b/src/theme/system_default_theme/_mac.scss index a63537a..b3a2900 100644 --- a/src/theme/system_default_theme/_mac.scss +++ b/src/theme/system_default_theme/_mac.scss @@ -59,12 +59,12 @@ --toolbar-bgcolor: var(--mac-selected-bgcolor) !important; --toolbar-non-lwt-bgcolor: var(--mac-selected-bgcolor) !important; - /* Field Backround Color */ + /* Field Background Color */ --input-bgcolor: var(--mac-field-bgcolor) !important; --toolbar-field-background-color: var(--mac-field-bgcolor) !important; --tab-icon-overlay-stroke: var(--mac-field-bgcolor) !important; - /* Panel Backround Color */ + /* Panel Background Color */ --arrowpanel-background: var(--mac-panel-bgcolor) !important; /* Hover Background Color */ @@ -108,7 +108,7 @@ --autocomplete-popup-separator-color: var(--mac-bgcolor) !important; */ - /* Accent Color Forground */ + /* Accent Color Foreground */ --button-primary-color: var(--mac-primary-button-color) !important; --checkbox-checked-color: var(--mac-primary-button-color) !important; diff --git a/src/theme/system_default_theme/_win10.scss b/src/theme/system_default_theme/_win10.scss index 0024cc7..1bd608e 100644 --- a/src/theme/system_default_theme/_win10.scss +++ b/src/theme/system_default_theme/_win10.scss @@ -12,17 +12,17 @@ --win-field-bgcolor: #ffffff; --win-component-bgcolor: #f2f2f2; --win-border-color: #8a8a8a; - --win-tab-seperator-color: #a3a3a3; + --win-tab-separator-color: #a3a3a3; --win-sidebar-bgcolor: #e6e6e6; --win-sidebar-hover-bgcolor: #cfcfcf; --win-sidebar-button-hover-bgcolor: #b8b8b8; --win-sidebar-button-hover-active-bgcolor: #a3a3a3; --win-button-border: #747474; - --win-shorcut-text-color: #757575; + --win-shortcut-text-color: #757575; --win-error-color: #b31616; --win-red-border-color: #ff4343; @include AccentColor { - --win-accent-forground-color: #{$accentTextColor}; + --win-accent-foreground-color: #{$accentTextColor}; --win-accent-color: color-mix(in srgb, rgba(0, 0, 0, 0.8) 10%, #{$accentColor}); --win-accent-content-color: color-mix(in srgb, rgba(255, 255, 255, 0.8) 15%, #{$accentColor}); --win-accent-hover-color: color-mix(in srgb, rgba(255, 255, 255, 0.8) 27%, #{$accentColor}); @@ -42,13 +42,13 @@ --win-field-bgcolor: #373737; --win-component-bgcolor: #171717; --win-border-color: #5b5b5b; - --win-tab-seperator-color: #555555; + --win-tab-separator-color: #555555; --win-sidebar-bgcolor: #1f1f1f; --win-sidebar-hover-bgcolor: #353535; --win-sidebar-button-hover-bgcolor: #353535; --win-sidebar-button-hover-active-bgcolor: #4c4c4c; --win-button-border: #8f8f8f; - --win-shorcut-text-color: #adadad; + --win-shortcut-text-color: #adadad; --win-error-color: #ffb900; --win-red-border-color: #ff4343; @include AccentColor { @@ -85,8 +85,8 @@ --download-progress-paused-color: var(--win-disabled-color) !important; /* Text Shortcut Color */ - --panel-shortcut-color: var(--win-shorcut-text-color) !important; - --panel-description-color: var(--win-shorcut-text-color) !important; + --panel-shortcut-color: var(--win-shortcut-text-color) !important; + --panel-description-color: var(--win-shortcut-text-color) !important; /* Title Background */ --lwt-accent-color: var(--win-bgcolor) !important; @@ -103,10 +103,10 @@ /* Border Color */ // --menu-border-color: var(--win-border-color) !important; - /* Seperator */ - --toolbarseparator-color: var(--win-tab-seperator-color) !important; + /* Separator */ + --toolbarseparator-color: var(--win-tab-separator-color) !important; - /* Field Backround Color */ + /* Field Background Color */ --input-bgcolor: var(--win-field-bgcolor) !important; --toolbar-field-background-color: var(--win-field-bgcolor) !important; --toolbar-field-focus-background-color: var(--win-field-bgcolor) !important; @@ -145,9 +145,9 @@ --input-border-color: var(--win-button-border) !important; --autocomplete-popup-separator-color: var(--win-button-border) !important; - /* Accent Forground Color */ - --button-primary-color: var(--win-accent-forground-color) !important; - --checkbox-checked-color: var(--win-accent-forground-color) !important; + /* Accent Foreground Color */ + --button-primary-color: var(--win-accent-foreground-color) !important; + --checkbox-checked-color: var(--win-accent-foreground-color) !important; /* Accent Color */ --button-primary-bgcolor: var(--win-accent-color) !important; diff --git a/src/urlview/_as_launcher.scss b/src/urlview/_as_launcher.scss new file mode 100644 index 0000000..adfee8c --- /dev/null +++ b/src/urlview/_as_launcher.scss @@ -0,0 +1,137 @@ +//-- Mixin --------------------------------------------------------------------- +$_URL_ROW_INNER_PADDING: 6px; // .urlbarView-row-inner + +$_urlViewIcon: 32px; +$_urlViewTypeIcon: 18px; +$_urlViewTypeIconMargin: 2px; +$_searchBarIcon: 20px; +$_searchBarButton: 32px; +@mixin _urlViewCompact() { + $_urlViewIcon: 24px; + $_urlViewTypeIcon: 16px; + $_urlViewTypeIconMargin: 0px; + $_searchBarIcon: 18px; + $_searchBarButton: 30px; + + :root[uidensity="compact"] { + @content; + } +} +@mixin _urlViewCompactInit() { + --urlbarView-favicon-width: #{ $_urlViewIcon }; /* Original: 16px */ + --uc-urlView-typeIcon-size: #{ $_urlViewTypeIcon }; + --uc-urlView-icon-size-differ: #{ $_urlViewIcon - $_urlViewTypeIcon }; + + --uc-searchBar-icon-size: #{ $_searchBarIcon }; + --uc-searchBar-button-size: #{ $_searchBarButton }; +} + +$_urlRowPadding: 2px; //.urlbarView-row +@mixin _urlViewTouch() { + $_urlRowPadding: 11px; + + :root[uidensity="touch"] { + @content; + } +} +@mixin _urlViewTouchInit() { + --uc-urlView-row-padding: #{ $_URL_ROW_INNER_PADDING + $_urlRowPadding }; + --uc-urlView-row-bottom: #{ $_urlRowPadding }; +} + +//------------------------------------------------------------------------------ + +/* Init & Base Layout */ +.urlbarView { + @include _urlViewCompactInit; + @include _urlViewTouchInit; + + --uc-urlView-margin: calc(var(--uc-sidebar-activate-width, 18rem) + var(--toolbarbutton-inner-padding)); + + position: fixed !important; + left: 50vw; + transform: translateX(-50%); + top: 12vh !important; + width: calc(100vw - (var(--uc-urlView-margin) + var(--toolbarbutton-inner-padding))) !important; + + /* paddding as margin */ + @include NotOption("userChrome.urlView.full_width_padding") { + padding-inline: var(--uc-urlView-padding) !important; + } + + /* background */ + background-color: var(--toolbar-field-focus-background-color) !important; + background-clip: border-box; + border: 1px solid var(--arrowpanel-border-color) !important; + border-radius: var(--toolbarbutton-border-radius) !important; + box-shadow: 0 2px 14px rgba(0, 0, 0, 0.13); +} +.urlbarView-body-inner { + border-top: none !important; +} + +/* Big icons */ +@include _urlViewCompact { + .urlbarView { + @include _urlViewCompactInit; + } +} +@include _urlViewTouch { + .urlbarView { + @include _urlViewTouchInit; + } +} + +.urlbarView-row { + &:not([type="tip"], [type="dynamic"]) { + position: relative; + min-height: #{ calc(var(--urlbarView-favicon-width) + var(--uc-urlView-row-padding)) } !important; + + .urlbarView-row-inner { + height: var(--urlbarView-favicon-width) !important; + } + .urlbarView-favicon { + position: absolute; + // padding-block: $_URL_ROW_INNER_PADDING; + top: 50%; + transform: translateY(-50%); + } + .urlbarView-title { + padding-inline-start: calc(var(--urlbarView-item-inline-padding) + var(--identity-box-margin-inline) + var(--urlbarView-favicon-width)) !important; + } + .urlbarView-type-icon { + width: var(--uc-urlView-typeIcon-size) !important; + height: var(--uc-urlView-typeIcon-size) !important; + margin-inline-start: calc(var(--uc-urlView-icon-size-differ) + var(--urlbarView-item-inline-padding)) !important; /* Original: 8px */ + bottom: var(--uc-urlView-row-bottom); + } + } + + &[dynamicType="quickactions"] { + .urlbarView-favicon-img { + width: var(--urlbarView-favicon-width) !important; /* Original: 16px */ + height: var(--urlbarView-favicon-width) !important; /* Original: 16px */ + } + .urlbarView-label { + font-size: 0.95em !important; /* Original: 11px */ + } + } +} +@include _urlViewTouch { + .urlbarView-row { + padding-block: $_URL_ROW_INNER_PADDING !important; + } + .urlbarView-row-inner { + padding-block: $_urlRowPadding !important; + } +} + +#urlbar .searchbar-engine-one-off-item { + min-width: var(--uc-searchBar-button-size) !important; /* Original: 28px */ + height: var(--uc-searchBar-button-size) !important; + + > .button-box > .button-icon { + width: var(--uc-searchBar-icon-size) !important; /* Original: 16px */ + height: var(--uc-searchBar-icon-size) !important; + } +} diff --git a/src/urlview/_focus_item_border.scss b/src/urlview/_focus_item_border.scss new file mode 100644 index 0000000..0d608ba --- /dev/null +++ b/src/urlview/_focus_item_border.scss @@ -0,0 +1,4 @@ +.urlbarView-row:not([type="tip"], [type="dynamic"])[selected] > .urlbarView-row-inner, +.urlbarView-row-inner[selected] { + box-shadow: 3px 0 var(--toolbar-field-focus-border-color) inset !important; +} diff --git a/src/urlview/_full_width_padding.scss b/src/urlview/_full_width_padding.scss new file mode 100644 index 0000000..201ef94 --- /dev/null +++ b/src/urlview/_full_width_padding.scss @@ -0,0 +1,34 @@ +$_borderSize: 2px; + +.urlbarView { + --uc-urlView-padding-double: calc(var(--uc-urlView-padding) * 2); + --uc-urlView-full-width-padding: var(--uc-urlView-padding-double); + + @include NotOption("userChrome.urlView.as_commandbar") { + --uc-urlView-full-width-padding: var(--uc-urlView-padding); + width: 100% !important; + } +} + +#urlbar[open] > .urlbarView > .urlbarView-body-outer > .urlbarView-body-inner { + border-color: transparent !important; + + &::before { + content: ""; + position: absolute; + border-top: 1px solid var(--autocomplete-popup-separator-color); + transform: translate(-50%, -1px); + left: 50%; + } +} + +#urlbar[open] > .urlbarView > .urlbarView-body-outer > .urlbarView-body-inner::before, +.urlbarView .search-one-offs { + width: calc(100% + $_borderSize - var(--uc-urlView-padding-double)) !important; +} +.urlbarView .search-one-offs { + margin-inline: var(--uc-urlView-full-width-padding) !important; +} +.urlbarView-row-inner { + padding-inline: calc(var(--uc-urlView-full-width-padding) + var(--urlbarView-item-inline-padding)) !important; +} diff --git a/src/urlview/_iconbox_as_separator.scss b/src/urlview/_iconbox_as_separator.scss new file mode 100644 index 0000000..20d09d7 --- /dev/null +++ b/src/urlview/_iconbox_as_separator.scss @@ -0,0 +1,52 @@ +#identity-box { + /* separator */ + position: relative; +} + +#identity-box[pageproxystate="valid"] { + &.notSecureText, + &.chromeUI, + &.extensionPage { + > .identity-box-button { + &:not(:hover, [open]) { + /* remove background from urlbar box */ + background-color: transparent !important; + + &::after { + opacity: 0.375; + } + } + + &::after { + /* Box Model */ + content: ""; + position: absolute; + display: block; + + /* Position */ + right: 0; + top: 50%; + transform: translateY(-50%); + + /* Bar shape */ + width: 1px; + height: 1em; + + /* Bar Color */ + opacity: 0; + background-color: currentColor; + } + } + } + + #identity-icon-label { + /* increase space between icon and text - as identity box padding */ + padding-inline-start: 8px !important; + } +} + +@include Animate { + .identity-box-button::after { + transition: opacity 0.2s var(--animation-easing-function); + } +} diff --git a/src/urlview/_index.scss b/src/urlview/_index.scss index bfb6922..64a4442 100644 --- a/src/urlview/_index.scss +++ b/src/urlview/_index.scss @@ -1,3 +1,32 @@ +/*= Url Bar - Icon box as Separator ==========================================*/ +@include Option("userChrome.urlbar.iconbox_with_separator") { + @import "iconbox_as_separator"; +} + +/*= Url View - Share Layout ==================================================*/ +@include Option("userChrome.urlView.as_commandbar", "userChrome.urlView.full_width_padding") { + .urlbarView { + --uc-urlView-padding: calc(5px + var(--urlbar-container-padding)); + + margin-inline: 0 !important; /* Original: calc(5px + var(--urlbar-container-padding)) */ + } +} + +/*= Url View - Looks like Launcher ===========================================*/ +@include Option("userChrome.urlView.as_commandbar") { + @import "as_launcher"; +} + +/*= Url View - Full Width Pddding ============================================*/ +@include Option("userChrome.urlView.full_width_padding") { + @import "full_width_padding"; +} + +/*= Url View - Always show page actions ======================================*/ +@include Option("userChrome.urlbar.always_show_page_actions") { + @import "always_show_page_actions"; +} + /*= Url View - Move icon to left =============================================*/ @include Option("userChrome.urlView.move_icon_to_left") { @import "move_icon_to_left"; @@ -8,7 +37,7 @@ @import "go_button_when_typing"; } -/*= Url View - Always show page actions ======================================*/ -@include Option("userChrome.urlView.always_show_page_actions") { - @import "always_show_page_actions"; +/*= Url View - Item Focus Border =============================================*/ +@include Option("userChrome.urlView.focus_item_border") { + @import "focus_item_border"; } diff --git a/src/utils/_accent_color.scss b/src/utils/_accent_color.scss index 03742e5..9da9896 100644 --- a/src/utils/_accent_color.scss +++ b/src/utils/_accent_color.scss @@ -7,12 +7,18 @@ $accentColor: AccentColor; $accentTextColor: AccentColorText; -@mixin AccentColor() { +@mixin AccentColor($mode: "-moz-accent-color") { @content; @include Option("userChrome.compatibility.accent_color") { - $accentColor: -moz-accent-color !global; - $accentTextColor: -moz-accent-color-foreground !global; + @if $mode == "Highlight" { + $accentColor: Highlight !global; + $accentTextColor: HighlightText !global; + } + @else { + $accentColor: -moz-accent-color !global; + $accentTextColor: -moz-accent-color-foreground !global; + } @content; } diff --git a/src/utils/_each.scss b/src/utils/_each.scss index 06d7b44..c2c5691 100644 --- a/src/utils/_each.scss +++ b/src/utils/_each.scss @@ -3,13 +3,13 @@ @use "list" as list-utils; $_defaultOption: ( - "seperator": ", ", + "separator": ", ", "quoted": false ); @mixin AtEach($name, $list, $prefix: null, $option: $_defaultOption) { $option: map.merge($_defaultOption, $option); - $seperator: map.get($option, "seperator"); + $separator: map.get($option, "separator"); $quoted: map.get($option, "quoted"); $quoted: if($quoted, "\"", null); @@ -21,7 +21,7 @@ $_defaultOption: ( @if $listL > 1 { @for $i from 2 through ($listL) { $nextBlock: list.nth($list, $i); - $nextBlock: "#{$seperator}#{$prefix}(#{$quoted}#{$nextBlock}#{$quoted})"; + $nextBlock: "#{$separator}#{$prefix}(#{$quoted}#{$nextBlock}#{$quoted})"; $blocks: "#{$blocks}#{$nextBlock}"; } } diff --git a/src/utils/_has.scss b/src/utils/_has.scss new file mode 100644 index 0000000..89b8027 --- /dev/null +++ b/src/utils/_has.scss @@ -0,0 +1,13 @@ +// Need `:has selector` + +@mixin Has() { + @supports selector(:has(a)) { + @content; + } +} + +@mixin NotHas() { + @supports not selector(:has(a)) { + @content; + } +} diff --git a/src/utils/_option.scss b/src/utils/_option.scss index 3311464..b23fac6 100644 --- a/src/utils/_option.scss +++ b/src/utils/_option.scss @@ -1,13 +1,13 @@ @use "each"; @mixin Option($optionNames...) { - @include each.AtEach("supports", $optionNames, "-moz-bool-pref", ("seperator": " or ", "quoted": true)) { + @include each.AtEach("supports", $optionNames, "-moz-bool-pref", ("separator": " or ", "quoted": true)) { @content; } } @mixin NotOption($optionNames...) { - @include each.AtEach("supports", $optionNames, "not -moz-bool-pref", ("seperator": " or ", "quoted": true)) { + @include each.AtEach("supports", $optionNames, "not -moz-bool-pref", ("separator": " or ", "quoted": true)) { @content; } } diff --git a/src/utils/_window_control.scss b/src/utils/_window_control.scss new file mode 100644 index 0000000..4a062dd --- /dev/null +++ b/src/utils/_window_control.scss @@ -0,0 +1,23 @@ +@use "os" as *; + +@mixin WindowControl_Right() { + @include OS($win) { + @content; + } + @include OS($linux) { + @media (-moz-gtk-csd-reversed-placement: 0) { + @content; + } + } +} + +@mixin WindowControl_Left() { + @include OS($mac) { + @content; + } + @include OS($linux) { + @media (-moz-gtk-csd-reversed-placement) { + @content; + } + } +} diff --git a/user.js b/user.js index bf2fda4..f520897 100644 --- a/user.js +++ b/user.js @@ -5,9 +5,6 @@ user_pref("toolkit.legacyUserProfileCustomizations.stylesheets", true); // Proton Enabled #127 || Removed at 97 #328 (Maintained for compatibility with ESR) user_pref("browser.proton.enabled", true); -// Proton Tooltip -user_pref("browser.proton.places-tooltip.enabled", true); - // Fill SVG Color user_pref("svg.context-properties.content.enabled", true); @@ -23,6 +20,9 @@ user_pref("browser.compactmode.show", true); // about:home Search Bar - 89 Above user_pref("browser.newtabpage.activity-stream.improvesearch.handoffToAwesomebar", false); +// CSS's `:has()` selector #457 - 103 Above +user_pref("layout.css.has-selector.enabled", true); + // Browser Theme Based Scheme - Will be activate 95 Above // user_pref("layout.css.prefers-color-scheme.content-override", 3); @@ -36,9 +36,10 @@ user_pref("userChrome.tab.color_like_toolbar", true); // Original, Photo user_pref("userChrome.tab.lepton_like_padding", false); // Original user_pref("userChrome.tab.photon_like_padding", true); // Photon -user_pref("userChrome.tab.dynamic_separtor", false); // Original, Proton +user_pref("userChrome.tab.dynamic_separator", false); // Original, Proton user_pref("userChrome.tab.static_separator", true); // Photon user_pref("userChrome.tab.static_separator.selected_accent", false); // Just option +user_pref("userChrome.tab.bar_separator", false); // Just option user_pref("userChrome.tab.newtab_button_like_tab", false); // Original user_pref("userChrome.tab.newtab_button_smaller", true); // Photon @@ -46,7 +47,6 @@ user_pref("userChrome.tab.newtab_button_proton", false); // Proton user_pref("userChrome.icon.panel_full", false); // Original, Proton user_pref("userChrome.icon.panel_photon", true); // Photon -user_pref("userChrome.icon.panel_sparse", false); // Just option // Original Only user_pref("userChrome.tab.box_shadow", false); @@ -61,10 +61,10 @@ user_pref("userChrome.rounding.square_tab", true); // user_pref("userChrome.compatibility.covered_header_image", true); // user_pref("userChrome.compatibility.panel_cutoff", true); // user_pref("userChrome.compatibility.navbar_top_border", true); -// user_pref("userChrome.compatibility.dynamic_separator", true); // Need dynamic_seperator +// user_pref("userChrome.compatibility.dynamic_separator", true); // Need dynamic_separator -// user_pref("userChrome.compatiblity.os.linux_non_native_titlebar_button", true); -// user_pref("userChrome.compatibility.os.windows_maximized, true"); +// user_pref("userChrome.compatibility.os.linux_non_native_titlebar_button", true); +// user_pref("userChrome.compatibility.os.windows_maximized", true); // == Theme Custom Settings ==================================================== // -- User Chrome -------------------------------------------------------------- @@ -73,6 +73,8 @@ user_pref("userChrome.rounding.square_tab", true); // user_pref("userChrome.decoration.disable_panel_animate", true); // user_pref("userChrome.decoration.disable_sidebar_animate", true); +// user_pref("userChrome.decoration.panel_button_separator", true); +// user_pref("userChrome.decoration.panel_arrow", true); // user_pref("userChrome.autohide.tab", true); // user_pref("userChrome.autohide.tab.opacity", true); @@ -86,6 +88,7 @@ user_pref("userChrome.rounding.square_tab", true); // user_pref("userChrome.autohide.forward_button", true); // user_pref("userChrome.autohide.page_action", true); // user_pref("userChrome.autohide.toolbar_overlap", true); +// user_pref("userChrome.autohide.toolbar_overlap.allow_layout_shift", true); // user_pref("userChrome.hidden.tab_icon", true); // user_pref("userChrome.hidden.tab_icon.always", true); @@ -94,6 +97,7 @@ user_pref("userChrome.rounding.square_tab", true); // user_pref("userChrome.hidden.sidebar_header", true); // user_pref("userChrome.hidden.sidebar_header.vertical_tab_only", true); // user_pref("userChrome.hidden.urlbar_iconbox", true); +// user_pref("userChrome.hidden.urlbar_iconbox.label_only", true); // user_pref("userChrome.hidden.bookmarkbar_icon", true); // user_pref("userChrome.hidden.bookmarkbar_label", true); // user_pref("userChrome.hidden.disabled_menu", true); @@ -103,15 +107,27 @@ user_pref("userChrome.rounding.square_tab", true); // user_pref("userChrome.centered.urlbar", true); // user_pref("userChrome.centered.bookmarkbar", true); +// user_pref("userChrome.counter.tab", true); +// user_pref("userChrome.counter.bookmark_menu", true); + +// user_pref("userChrome.combined.nav_button", true); +// user_pref("userChrome.combined.nav_button.home_button", true); +// user_pref("userChrome.combined.nav_button.none_forward_background", true); +// user_pref("userChrome.combined.urlbar.nav_button", true); +// user_pref("userChrome.combined.urlbar.home_button", true); +// user_pref("userChrome.combined.urlbar.reload_button", true); + // user_pref("userChrome.rounding.square_button", true); // user_pref("userChrome.rounding.square_panel", true); // user_pref("userChrome.rounding.square_panelitem", true); // user_pref("userChrome.rounding.square_menupopup", true); // user_pref("userChrome.rounding.square_menuitem", true); // user_pref("userChrome.rounding.square_field", true); +// user_pref("userChrome.rounding.square_urlView_item", true); // user_pref("userChrome.rounding.square_checklabel", true); // user_pref("userChrome.padding.first_tab", true); +// user_pref("userChrome.padding.first_tab.always", true); // user_pref("userChrome.padding.drag_space", true); // user_pref("userChrome.padding.drag_space.maximized", true); @@ -121,11 +137,19 @@ user_pref("userChrome.rounding.square_tab", true); // user_pref("userChrome.padding.urlView_result", true); // user_pref("userChrome.padding.panel_header", true); +// user_pref("userChrome.urlbar.iconbox_with_separator", true); + +// user_pref("userChrome.urlView.as_commandbar", true); +// user_pref("userChrome.urlView.full_width_padding", true); +// user_pref("userChrome.urlView.always_show_page_actions", true); // user_pref("userChrome.urlView.move_icon_to_left", true); // user_pref("userChrome.urlView.go_button_when_typing", true); -// user_pref("userChrome.urlView.always_show_page_actions", true); +// user_pref("userChrome.urlView.focus_item_border", true); // user_pref("userChrome.tabbar.as_titlebar", true); +// user_pref("userChrome.tabbar.fill_width", true); +// user_pref("userChrome.tabbar.multi_row", true); +// user_pref("userChrome.tabbar.unscroll", true); // user_pref("userChrome.tabbar.on_bottom", true); // user_pref("userChrome.tabbar.on_bottom.above_bookmark", true); // Need on_bottom // user_pref("userChrome.tabbar.on_bottom.menubar_on_top", true); // Need on_bottom @@ -135,19 +159,33 @@ user_pref("userChrome.rounding.square_tab", true); // user_pref("userChrome.tabbar.one_liner.tabbar_first", true); // Need one_liner // user_pref("userChrome.tabbar.one_liner.responsive", true); // Need one_liner +// user_pref("userChrome.tab.bottom_rounded_corner.all", true); +// user_pref("userChrome.tab.bottom_rounded_corner.australis", true); +// user_pref("userChrome.tab.bottom_rounded_corner.edge", true); +// user_pref("userChrome.tab.bottom_rounded_corner.chrome", true); +// user_pref("userChrome.tab.bottom_rounded_corner.chrome_legacy", true); +// user_pref("userChrome.tab.bottom_rounded_corner.wave", true); // user_pref("userChrome.tab.always_show_tab_icon", true); // user_pref("userChrome.tab.close_button_at_pinned", true); // user_pref("userChrome.tab.close_button_at_pinned.always", true); // user_pref("userChrome.tab.close_button_at_pinned.background", true); // user_pref("userChrome.tab.close_button_at_hover.always", true); // Need close_button_at_hover +// user_pref("userChrome.tab.close_button_at_hover.with_selected", true); // Need close_button_at_hover // user_pref("userChrome.tab.sound_show_label", true); // Need remove sound_hide_label +// user_pref("userChrome.navbar.as_sidebar", true); + +// user_pref("userChrome.bookmarkbar.multi_row", true); + +// user_pref("userChrome.findbar.floating_on_top", true); + // user_pref("userChrome.panel.remove_strip", true); // user_pref("userChrome.panel.full_width_separator", true); // user_pref("userChrome.panel.full_width_padding", true); // user_pref("userChrome.sidebar.overlap", true); +// user_pref("userChrome.icon.disabled", true); // user_pref("userChrome.icon.account_image_to_right", true); // user_pref("userChrome.icon.account_label_to_right", true); // user_pref("userChrome.icon.menu.full", true); @@ -250,7 +288,7 @@ user_pref("general.smoothScroll.currentVelocityWeighting", "0.15"); // "0.25" user_pref("general.smoothScroll.stopDecelerationWeighting", "0.6"); // "0.4" */ -// == Smooth Scroling ========================================================== +// == Smooth Scrolling ========================================================== // ** Scrolling Options ******************************************************** // based on natural smooth scrolling v2 by aveyo // this preset will reset couple extra variables for consistency diff --git a/yarn.lock b/yarn.lock index b7386db..4bab050 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3,316 +3,162 @@ "@ampproject/remapping@^2.1.0": - version "2.1.2" - resolved "https://registry.yarnpkg.com/@ampproject/remapping/-/remapping-2.1.2.tgz#4edca94973ded9630d20101cd8559cedb8d8bd34" - integrity sha512-hoyByceqwKirw7w3Z7gnIIZC3Wx3J484Y3L/cMpXFbr7d9ZQj2mODrirNzcJa+SM3UlpWXYvKV4RlRpFXlWgXg== + version "2.2.0" + resolved "https://registry.yarnpkg.com/@ampproject/remapping/-/remapping-2.2.0.tgz#56c133824780de3174aed5ab6834f3026790154d" + integrity sha512-qRmjj8nj9qmLTQXXmaR1cck3UXSRMPrbsLJAasZpF+t3riI71BXed5ebIOYwQntykeZuhjsdweEc9BxH5Jc26w== dependencies: - "@jridgewell/trace-mapping" "^0.3.0" + "@jridgewell/gen-mapping" "^0.1.0" + "@jridgewell/trace-mapping" "^0.3.9" -"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.16.7": - version "7.16.7" - resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.16.7.tgz#44416b6bd7624b998f5b1af5d470856c40138789" - integrity sha512-iAXqUn8IIeBTNd72xsFlgaXHkMBMt6y4HJp1tIaK465CWLT/fG1aqB7ykr95gHHmlBdGbFeWWfyB4NJJ0nmeIg== +"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.12.13", "@babel/code-frame@^7.18.6": + version "7.18.6" + resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.18.6.tgz#3b25d38c89600baa2dcc219edfa88a74eb2c427a" + integrity sha512-TDCmlK5eOvH+eH7cdAFlNXeVJqWIQ7gW9tY1GJIpUtFb6CmjVyq2VM3u71bOyR8CRihcCgMUYoDNyLXao3+70Q== dependencies: - "@babel/highlight" "^7.16.7" + "@babel/highlight" "^7.18.6" -"@babel/code-frame@^7.12.13", "@babel/code-frame@^7.16.0": - version "7.16.0" - resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.16.0.tgz#0dfc80309beec8411e65e706461c408b0bb9b431" - integrity sha512-IF4EOMEV+bfYwOmNxGzSnjR2EmQod7f1UXOpZM3l4i4o4QNwzjtJAu/HxdjHq0aYBvdqMuQEY1eg0nqW9ZPORA== - dependencies: - "@babel/highlight" "^7.16.0" +"@babel/compat-data@^7.20.0": + version "7.20.1" + resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.20.1.tgz#f2e6ef7790d8c8dbf03d379502dcc246dcce0b30" + integrity sha512-EWZ4mE2diW3QALKvDMiXnbZpRvlj+nayZ112nK93SnhqOtpdsbVD4W+2tEoT3YNBAG9RBR0ISY758ZkOgsn6pQ== -"@babel/compat-data@^7.16.0": - version "7.16.4" - resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.16.4.tgz#081d6bbc336ec5c2435c6346b2ae1fb98b5ac68e" - integrity sha512-1o/jo7D+kC9ZjHX5v+EHrdjl3PhxMrLSOTGsOdHJ+KL8HCaEK6ehrVL2RS6oHDZp+L7xLirLrPmQtEng769J/Q== - -"@babel/compat-data@^7.17.7": - version "7.17.7" - resolved "https://registry.yarnpkg.com/@babel/compat-data/-/compat-data-7.17.7.tgz#078d8b833fbbcc95286613be8c716cef2b519fa2" - integrity sha512-p8pdE6j0a29TNGebNm7NzYZWB3xVZJBZ7XGs42uAKzQo8VQ3F0By/cQCtUEABwIqw5zo6WA4NbmxsfzADzMKnQ== - -"@babel/core@^7.1.0", "@babel/core@^7.12.3", "@babel/core@^7.7.2": - version "7.16.5" - resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.16.5.tgz#924aa9e1ae56e1e55f7184c8bf073a50d8677f5c" - integrity sha512-wUcenlLzuWMZ9Zt8S0KmFwGlH6QKRh3vsm/dhDA3CHkiTA45YuG1XkHRcNRl73EFPXDp/d5kVOU0/y7x2w6OaQ== - dependencies: - "@babel/code-frame" "^7.16.0" - "@babel/generator" "^7.16.5" - "@babel/helper-compilation-targets" "^7.16.3" - "@babel/helper-module-transforms" "^7.16.5" - "@babel/helpers" "^7.16.5" - "@babel/parser" "^7.16.5" - "@babel/template" "^7.16.0" - "@babel/traverse" "^7.16.5" - "@babel/types" "^7.16.0" - convert-source-map "^1.7.0" - debug "^4.1.0" - gensync "^1.0.0-beta.2" - json5 "^2.1.2" - semver "^6.3.0" - source-map "^0.5.0" - -"@babel/core@^7.8.0": - version "7.17.7" - resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.17.7.tgz#f7c28228c83cdf2dbd1b9baa06eaf9df07f0c2f9" - integrity sha512-djHlEfFHnSnTAcPb7dATbiM5HxGOP98+3JLBZtjRb5I7RXrw7kFRoG2dXM8cm3H+o11A8IFH/uprmJpwFynRNQ== +"@babel/core@^7.11.6", "@babel/core@^7.12.3": + version "7.20.2" + resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.20.2.tgz#8dc9b1620a673f92d3624bd926dc49a52cf25b92" + integrity sha512-w7DbG8DtMrJcFOi4VrLm+8QM4az8Mo+PuLBKLp2zrYRCow8W/f9xiXm5sN53C8HksCyDQwCKha9JiDoIyPjT2g== dependencies: "@ampproject/remapping" "^2.1.0" - "@babel/code-frame" "^7.16.7" - "@babel/generator" "^7.17.7" - "@babel/helper-compilation-targets" "^7.17.7" - "@babel/helper-module-transforms" "^7.17.7" - "@babel/helpers" "^7.17.7" - "@babel/parser" "^7.17.7" - "@babel/template" "^7.16.7" - "@babel/traverse" "^7.17.3" - "@babel/types" "^7.17.0" + "@babel/code-frame" "^7.18.6" + "@babel/generator" "^7.20.2" + "@babel/helper-compilation-targets" "^7.20.0" + "@babel/helper-module-transforms" "^7.20.2" + "@babel/helpers" "^7.20.1" + "@babel/parser" "^7.20.2" + "@babel/template" "^7.18.10" + "@babel/traverse" "^7.20.1" + "@babel/types" "^7.20.2" convert-source-map "^1.7.0" debug "^4.1.0" gensync "^1.0.0-beta.2" - json5 "^2.1.2" + json5 "^2.2.1" semver "^6.3.0" -"@babel/generator@^7.16.5", "@babel/generator@^7.7.2": - version "7.16.5" - resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.16.5.tgz#26e1192eb8f78e0a3acaf3eede3c6fc96d22bedf" - integrity sha512-kIvCdjZqcdKqoDbVVdt5R99icaRtrtYhYK/xux5qiWCBmfdvEYMFZ68QCrpE5cbFM1JsuArUNs1ZkuKtTtUcZA== +"@babel/generator@^7.20.1", "@babel/generator@^7.20.2", "@babel/generator@^7.7.2": + version "7.20.4" + resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.20.4.tgz#4d9f8f0c30be75fd90a0562099a26e5839602ab8" + integrity sha512-luCf7yk/cm7yab6CAW1aiFnmEfBJplb/JojV56MYEK7ziWfGmFlTfmL9Ehwfy4gFhbjBfWO1wj7/TuSbVNEEtA== dependencies: - "@babel/types" "^7.16.0" + "@babel/types" "^7.20.2" + "@jridgewell/gen-mapping" "^0.3.2" jsesc "^2.5.1" - source-map "^0.5.0" -"@babel/generator@^7.17.3", "@babel/generator@^7.17.7": - version "7.17.7" - resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.17.7.tgz#8da2599beb4a86194a3b24df6c085931d9ee45ad" - integrity sha512-oLcVCTeIFadUoArDTwpluncplrYBmTCCZZgXCbgNGvOBBiSDDK3eWO4b/+eOTli5tKv1lg+a5/NAXg+nTcei1w== +"@babel/helper-compilation-targets@^7.20.0": + version "7.20.0" + resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.20.0.tgz#6bf5374d424e1b3922822f1d9bdaa43b1a139d0a" + integrity sha512-0jp//vDGp9e8hZzBc6N/KwA5ZK3Wsm/pfm4CrY7vzegkVxc65SgSn6wYOnwHe9Js9HRQ1YTCKLGPzDtaS3RoLQ== dependencies: - "@babel/types" "^7.17.0" - jsesc "^2.5.1" - source-map "^0.5.0" - -"@babel/helper-compilation-targets@^7.16.3": - version "7.16.3" - resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.16.3.tgz#5b480cd13f68363df6ec4dc8ac8e2da11363cbf0" - integrity sha512-vKsoSQAyBmxS35JUOOt+07cLc6Nk/2ljLIHwmq2/NM6hdioUaqEXq/S+nXvbvXbZkNDlWOymPanJGOc4CBjSJA== - dependencies: - "@babel/compat-data" "^7.16.0" - "@babel/helper-validator-option" "^7.14.5" - browserslist "^4.17.5" + "@babel/compat-data" "^7.20.0" + "@babel/helper-validator-option" "^7.18.6" + browserslist "^4.21.3" semver "^6.3.0" -"@babel/helper-compilation-targets@^7.17.7": - version "7.17.7" - resolved "https://registry.yarnpkg.com/@babel/helper-compilation-targets/-/helper-compilation-targets-7.17.7.tgz#a3c2924f5e5f0379b356d4cfb313d1414dc30e46" - integrity sha512-UFzlz2jjd8kroj0hmCFV5zr+tQPi1dpC2cRsDV/3IEW8bJfCPrPpmcSN6ZS8RqIq4LXcmpipCQFPddyFA5Yc7w== +"@babel/helper-environment-visitor@^7.18.9": + version "7.18.9" + resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.18.9.tgz#0c0cee9b35d2ca190478756865bb3528422f51be" + integrity sha512-3r/aACDJ3fhQ/EVgFy0hpj8oHyHpQc+LPtJoY9SzTThAsStm4Ptegq92vqKoE3vD706ZVFWITnMnxucw+S9Ipg== + +"@babel/helper-function-name@^7.19.0": + version "7.19.0" + resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.19.0.tgz#941574ed5390682e872e52d3f38ce9d1bef4648c" + integrity sha512-WAwHBINyrpqywkUH0nTnNgI5ina5TFn85HKS0pbPDfxFfhyR/aNQEn4hGi1P1JyT//I0t4OgXUlofzWILRvS5w== dependencies: - "@babel/compat-data" "^7.17.7" - "@babel/helper-validator-option" "^7.16.7" - browserslist "^4.17.5" - semver "^6.3.0" + "@babel/template" "^7.18.10" + "@babel/types" "^7.19.0" -"@babel/helper-environment-visitor@^7.16.5": - version "7.16.5" - resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.16.5.tgz#f6a7f38b3c6d8b07c88faea083c46c09ef5451b8" - integrity sha512-ODQyc5AnxmZWm/R2W7fzhamOk1ey8gSguo5SGvF0zcB3uUzRpTRmM/jmLSm9bDMyPlvbyJ+PwPEK0BWIoZ9wjg== +"@babel/helper-hoist-variables@^7.18.6": + version "7.18.6" + resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.18.6.tgz#d4d2c8fb4baeaa5c68b99cc8245c56554f926678" + integrity sha512-UlJQPkFqFULIcyW5sbzgbkxn2FKRgwWiRexcuaR8RNJRy8+LLveqPjwZV/bwrLZCN0eUHD/x8D0heK1ozuoo6Q== dependencies: - "@babel/types" "^7.16.0" + "@babel/types" "^7.18.6" -"@babel/helper-environment-visitor@^7.16.7": - version "7.16.7" - resolved "https://registry.yarnpkg.com/@babel/helper-environment-visitor/-/helper-environment-visitor-7.16.7.tgz#ff484094a839bde9d89cd63cba017d7aae80ecd7" - integrity sha512-SLLb0AAn6PkUeAfKJCCOl9e1R53pQlGAfc4y4XuMRZfqeMYLE0dM1LMhqbGAlGQY0lfw5/ohoYWAe9V1yibRag== +"@babel/helper-module-imports@^7.18.6": + version "7.18.6" + resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.18.6.tgz#1e3ebdbbd08aad1437b428c50204db13c5a3ca6e" + integrity sha512-0NFvs3VkuSYbFi1x2Vd6tKrywq+z/cLeYC/RJNFrIX/30Bf5aiGYbtvGXolEktzJH8o5E5KJ3tT+nkxuuZFVlA== dependencies: - "@babel/types" "^7.16.7" + "@babel/types" "^7.18.6" -"@babel/helper-function-name@^7.16.0": - version "7.16.0" - resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.16.0.tgz#b7dd0797d00bbfee4f07e9c4ea5b0e30c8bb1481" - integrity sha512-BZh4mEk1xi2h4HFjWUXRQX5AEx4rvaZxHgax9gcjdLWdkjsY7MKt5p0otjsg5noXw+pB+clMCjw+aEVYADMjog== +"@babel/helper-module-transforms@^7.20.2": + version "7.20.2" + resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.20.2.tgz#ac53da669501edd37e658602a21ba14c08748712" + integrity sha512-zvBKyJXRbmK07XhMuujYoJ48B5yvvmM6+wcpv6Ivj4Yg6qO7NOZOSnvZN9CRl1zz1Z4cKf8YejmCMh8clOoOeA== dependencies: - "@babel/helper-get-function-arity" "^7.16.0" - "@babel/template" "^7.16.0" - "@babel/types" "^7.16.0" + "@babel/helper-environment-visitor" "^7.18.9" + "@babel/helper-module-imports" "^7.18.6" + "@babel/helper-simple-access" "^7.20.2" + "@babel/helper-split-export-declaration" "^7.18.6" + "@babel/helper-validator-identifier" "^7.19.1" + "@babel/template" "^7.18.10" + "@babel/traverse" "^7.20.1" + "@babel/types" "^7.20.2" -"@babel/helper-function-name@^7.16.7": - version "7.16.7" - resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.16.7.tgz#f1ec51551fb1c8956bc8dd95f38523b6cf375f8f" - integrity sha512-QfDfEnIUyyBSR3HtrtGECuZ6DAyCkYFp7GHl75vFtTnn6pjKeK0T1DB5lLkFvBea8MdaiUABx3osbgLyInoejA== +"@babel/helper-plugin-utils@^7.0.0", "@babel/helper-plugin-utils@^7.10.4", "@babel/helper-plugin-utils@^7.12.13", "@babel/helper-plugin-utils@^7.14.5", "@babel/helper-plugin-utils@^7.18.6", "@babel/helper-plugin-utils@^7.19.0", "@babel/helper-plugin-utils@^7.8.0": + version "7.20.2" + resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.20.2.tgz#d1b9000752b18d0877cff85a5c376ce5c3121629" + integrity sha512-8RvlJG2mj4huQ4pZ+rU9lqKi9ZKiRmuvGuM2HlWmkmgOhbs6zEAw6IEiJ5cQqGbDzGZOhwuOQNtZMi/ENLjZoQ== + +"@babel/helper-simple-access@^7.20.2": + version "7.20.2" + resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.20.2.tgz#0ab452687fe0c2cfb1e2b9e0015de07fc2d62dd9" + integrity sha512-+0woI/WPq59IrqDYbVGfshjT5Dmk/nnbdpcF8SnMhhXObpTq2KNBdLFRFrkVdbDOyUmHBCxzm5FHV1rACIkIbA== dependencies: - "@babel/helper-get-function-arity" "^7.16.7" - "@babel/template" "^7.16.7" - "@babel/types" "^7.16.7" + "@babel/types" "^7.20.2" -"@babel/helper-get-function-arity@^7.16.0": - version "7.16.0" - resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.16.0.tgz#0088c7486b29a9cb5d948b1a1de46db66e089cfa" - integrity sha512-ASCquNcywC1NkYh/z7Cgp3w31YW8aojjYIlNg4VeJiHkqyP4AzIvr4qx7pYDb4/s8YcsZWqqOSxgkvjUz1kpDQ== +"@babel/helper-split-export-declaration@^7.18.6": + version "7.18.6" + resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.18.6.tgz#7367949bc75b20c6d5a5d4a97bba2824ae8ef075" + integrity sha512-bde1etTx6ZyTmobl9LLMMQsaizFVZrquTEHOqKeQESMKo4PlObf+8+JA25ZsIpZhT/WEd39+vOdLXAFG/nELpA== dependencies: - "@babel/types" "^7.16.0" + "@babel/types" "^7.18.6" -"@babel/helper-get-function-arity@^7.16.7": - version "7.16.7" - resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.16.7.tgz#ea08ac753117a669f1508ba06ebcc49156387419" - integrity sha512-flc+RLSOBXzNzVhcLu6ujeHUrD6tANAOU5ojrRx/as+tbzf8+stUCj7+IfRRoAbEZqj/ahXEMsjhOhgeZsrnTw== +"@babel/helper-string-parser@^7.19.4": + version "7.19.4" + resolved "https://registry.yarnpkg.com/@babel/helper-string-parser/-/helper-string-parser-7.19.4.tgz#38d3acb654b4701a9b77fb0615a96f775c3a9e63" + integrity sha512-nHtDoQcuqFmwYNYPz3Rah5ph2p8PFeFCsZk9A/48dPc/rGocJ5J3hAAZ7pb76VWX3fZKu+uEr/FhH5jLx7umrw== + +"@babel/helper-validator-identifier@^7.18.6", "@babel/helper-validator-identifier@^7.19.1": + version "7.19.1" + resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.19.1.tgz#7eea834cf32901ffdc1a7ee555e2f9c27e249ca2" + integrity sha512-awrNfaMtnHUr653GgGEs++LlAvW6w+DcPrOliSMXWCKo597CwL5Acf/wWdNkf/tfEQE3mjkeD1YOVZOUV/od1w== + +"@babel/helper-validator-option@^7.18.6": + version "7.18.6" + resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.18.6.tgz#bf0d2b5a509b1f336099e4ff36e1a63aa5db4db8" + integrity sha512-XO7gESt5ouv/LRJdrVjkShckw6STTaB7l9BrpBaAHDeF5YZT+01PCwmR0SJHnkW6i8OwW/EVWRShfi4j2x+KQw== + +"@babel/helpers@^7.20.1": + version "7.20.1" + resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.20.1.tgz#2ab7a0fcb0a03b5bf76629196ed63c2d7311f4c9" + integrity sha512-J77mUVaDTUJFZ5BpP6mMn6OIl3rEWymk2ZxDBQJUG3P+PbmyMcF3bYWvz0ma69Af1oobDqT/iAsvzhB58xhQUg== dependencies: - "@babel/types" "^7.16.7" + "@babel/template" "^7.18.10" + "@babel/traverse" "^7.20.1" + "@babel/types" "^7.20.0" -"@babel/helper-hoist-variables@^7.16.0": - version "7.16.0" - resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.16.0.tgz#4c9023c2f1def7e28ff46fc1dbcd36a39beaa81a" - integrity sha512-1AZlpazjUR0EQZQv3sgRNfM9mEVWPK3M6vlalczA+EECcPz3XPh6VplbErL5UoMpChhSck5wAJHthlj1bYpcmg== +"@babel/highlight@^7.18.6": + version "7.18.6" + resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.18.6.tgz#81158601e93e2563795adcbfbdf5d64be3f2ecdf" + integrity sha512-u7stbOuYjaPezCuLj29hNW1v64M2Md2qupEKP1fHc7WdOA3DgLh37suiSrZYY7haUB7iBeQZ9P1uiRF359do3g== dependencies: - "@babel/types" "^7.16.0" - -"@babel/helper-hoist-variables@^7.16.7": - version "7.16.7" - resolved "https://registry.yarnpkg.com/@babel/helper-hoist-variables/-/helper-hoist-variables-7.16.7.tgz#86bcb19a77a509c7b77d0e22323ef588fa58c246" - integrity sha512-m04d/0Op34H5v7pbZw6pSKP7weA6lsMvfiIAMeIvkY/R4xQtBSMFEigu9QTZ2qB/9l22vsxtM8a+Q8CzD255fg== - dependencies: - "@babel/types" "^7.16.7" - -"@babel/helper-module-imports@^7.16.0": - version "7.16.0" - resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.16.0.tgz#90538e60b672ecf1b448f5f4f5433d37e79a3ec3" - integrity sha512-kkH7sWzKPq0xt3H1n+ghb4xEMP8k0U7XV3kkB+ZGy69kDk2ySFW1qPi06sjKzFY3t1j6XbJSqr4mF9L7CYVyhg== - dependencies: - "@babel/types" "^7.16.0" - -"@babel/helper-module-imports@^7.16.7": - version "7.16.7" - resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.16.7.tgz#25612a8091a999704461c8a222d0efec5d091437" - integrity sha512-LVtS6TqjJHFc+nYeITRo6VLXve70xmq7wPhWTqDJusJEgGmkAACWwMiTNrvfoQo6hEhFwAIixNkvB0jPXDL8Wg== - dependencies: - "@babel/types" "^7.16.7" - -"@babel/helper-module-transforms@^7.16.5": - version "7.16.5" - resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.16.5.tgz#530ebf6ea87b500f60840578515adda2af470a29" - integrity sha512-CkvMxgV4ZyyioElFwcuWnDCcNIeyqTkCm9BxXZi73RR1ozqlpboqsbGUNvRTflgZtFbbJ1v5Emvm+lkjMYY/LQ== - dependencies: - "@babel/helper-environment-visitor" "^7.16.5" - "@babel/helper-module-imports" "^7.16.0" - "@babel/helper-simple-access" "^7.16.0" - "@babel/helper-split-export-declaration" "^7.16.0" - "@babel/helper-validator-identifier" "^7.15.7" - "@babel/template" "^7.16.0" - "@babel/traverse" "^7.16.5" - "@babel/types" "^7.16.0" - -"@babel/helper-module-transforms@^7.17.7": - version "7.17.7" - resolved "https://registry.yarnpkg.com/@babel/helper-module-transforms/-/helper-module-transforms-7.17.7.tgz#3943c7f777139e7954a5355c815263741a9c1cbd" - integrity sha512-VmZD99F3gNTYB7fJRDTi+u6l/zxY0BE6OIxPSU7a50s6ZUQkHwSDmV92FfM+oCG0pZRVojGYhkR8I0OGeCVREw== - dependencies: - "@babel/helper-environment-visitor" "^7.16.7" - "@babel/helper-module-imports" "^7.16.7" - "@babel/helper-simple-access" "^7.17.7" - "@babel/helper-split-export-declaration" "^7.16.7" - "@babel/helper-validator-identifier" "^7.16.7" - "@babel/template" "^7.16.7" - "@babel/traverse" "^7.17.3" - "@babel/types" "^7.17.0" - -"@babel/helper-plugin-utils@^7.0.0", "@babel/helper-plugin-utils@^7.10.4", "@babel/helper-plugin-utils@^7.12.13", "@babel/helper-plugin-utils@^7.14.5", "@babel/helper-plugin-utils@^7.16.5", "@babel/helper-plugin-utils@^7.8.0": - version "7.16.5" - resolved "https://registry.yarnpkg.com/@babel/helper-plugin-utils/-/helper-plugin-utils-7.16.5.tgz#afe37a45f39fce44a3d50a7958129ea5b1a5c074" - integrity sha512-59KHWHXxVA9K4HNF4sbHCf+eJeFe0Te/ZFGqBT4OjXhrwvA04sGfaEGsVTdsjoszq0YTP49RC9UKe5g8uN2RwQ== - -"@babel/helper-simple-access@^7.16.0": - version "7.16.0" - resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.16.0.tgz#21d6a27620e383e37534cf6c10bba019a6f90517" - integrity sha512-o1rjBT/gppAqKsYfUdfHq5Rk03lMQrkPHG1OWzHWpLgVXRH4HnMM9Et9CVdIqwkCQlobnGHEJMsgWP/jE1zUiw== - dependencies: - "@babel/types" "^7.16.0" - -"@babel/helper-simple-access@^7.17.7": - version "7.17.7" - resolved "https://registry.yarnpkg.com/@babel/helper-simple-access/-/helper-simple-access-7.17.7.tgz#aaa473de92b7987c6dfa7ce9a7d9674724823367" - integrity sha512-txyMCGroZ96i+Pxr3Je3lzEJjqwaRC9buMUgtomcrLe5Nd0+fk1h0LLA+ixUF5OW7AhHuQ7Es1WcQJZmZsz2XA== - dependencies: - "@babel/types" "^7.17.0" - -"@babel/helper-split-export-declaration@^7.16.0": - version "7.16.0" - resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.16.0.tgz#29672f43663e936df370aaeb22beddb3baec7438" - integrity sha512-0YMMRpuDFNGTHNRiiqJX19GjNXA4H0E8jZ2ibccfSxaCogbm3am5WN/2nQNj0YnQwGWM1J06GOcQ2qnh3+0paw== - dependencies: - "@babel/types" "^7.16.0" - -"@babel/helper-split-export-declaration@^7.16.7": - version "7.16.7" - resolved "https://registry.yarnpkg.com/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.16.7.tgz#0b648c0c42da9d3920d85ad585f2778620b8726b" - integrity sha512-xbWoy/PFoxSWazIToT9Sif+jJTlrMcndIsaOKvTA6u7QEo7ilkRZpjew18/W3c7nm8fXdUDXh02VXTbZ0pGDNw== - dependencies: - "@babel/types" "^7.16.7" - -"@babel/helper-validator-identifier@^7.15.7": - version "7.15.7" - resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.15.7.tgz#220df993bfe904a4a6b02ab4f3385a5ebf6e2389" - integrity sha512-K4JvCtQqad9OY2+yTU8w+E82ywk/fe+ELNlt1G8z3bVGlZfn/hOcQQsUhGhW/N+tb3fxK800wLtKOE/aM0m72w== - -"@babel/helper-validator-identifier@^7.16.7": - version "7.16.7" - resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.16.7.tgz#e8c602438c4a8195751243da9031d1607d247cad" - integrity sha512-hsEnFemeiW4D08A5gUAZxLBTXpZ39P+a+DGDsHw1yxqyQ/jzFEnxf5uTEGp+3bzAbNOxU1paTgYS4ECU/IgfDw== - -"@babel/helper-validator-option@^7.14.5": - version "7.14.5" - resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.14.5.tgz#6e72a1fff18d5dfcb878e1e62f1a021c4b72d5a3" - integrity sha512-OX8D5eeX4XwcroVW45NMvoYaIuFI+GQpA2a8Gi+X/U/cDUIRsV37qQfF905F0htTRCREQIB4KqPeaveRJUl3Ow== - -"@babel/helper-validator-option@^7.16.7": - version "7.16.7" - resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.16.7.tgz#b203ce62ce5fe153899b617c08957de860de4d23" - integrity sha512-TRtenOuRUVo9oIQGPC5G9DgK4743cdxvtOw0weQNpZXaS16SCBi5MNjZF8vba3ETURjZpTbVn7Vvcf2eAwFozQ== - -"@babel/helpers@^7.16.5": - version "7.16.5" - resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.16.5.tgz#29a052d4b827846dd76ece16f565b9634c554ebd" - integrity sha512-TLgi6Lh71vvMZGEkFuIxzaPsyeYCHQ5jJOOX1f0xXn0uciFuE8cEk0wyBquMcCxBXZ5BJhE2aUB7pnWTD150Tw== - dependencies: - "@babel/template" "^7.16.0" - "@babel/traverse" "^7.16.5" - "@babel/types" "^7.16.0" - -"@babel/helpers@^7.17.7": - version "7.17.7" - resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.17.7.tgz#6fc0a24280fd00026e85424bbfed4650e76d7127" - integrity sha512-TKsj9NkjJfTBxM7Phfy7kv6yYc4ZcOo+AaWGqQOKTPDOmcGkIFb5xNA746eKisQkm4yavUYh4InYM9S+VnO01w== - dependencies: - "@babel/template" "^7.16.7" - "@babel/traverse" "^7.17.3" - "@babel/types" "^7.17.0" - -"@babel/highlight@^7.16.0": - version "7.16.0" - resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.16.0.tgz#6ceb32b2ca4b8f5f361fb7fd821e3fddf4a1725a" - integrity sha512-t8MH41kUQylBtu2+4IQA3atqevA2lRgqA2wyVB/YiWmsDSuylZZuXOUy9ric30hfzauEFfdsuk/eXTRrGrfd0g== - dependencies: - "@babel/helper-validator-identifier" "^7.15.7" + "@babel/helper-validator-identifier" "^7.18.6" chalk "^2.0.0" js-tokens "^4.0.0" -"@babel/highlight@^7.16.7": - version "7.16.10" - resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.16.10.tgz#744f2eb81579d6eea753c227b0f570ad785aba88" - integrity sha512-5FnTQLSLswEj6IkgVw5KusNUUFY9ZGqe/TRFnP/BKYHYgfh7tc+C7mwiy95/yNP7Dh9x580Vv8r7u7ZfTBFxdw== - dependencies: - "@babel/helper-validator-identifier" "^7.16.7" - chalk "^2.0.0" - js-tokens "^4.0.0" - -"@babel/parser@^7.1.0", "@babel/parser@^7.14.7", "@babel/parser@^7.16.0", "@babel/parser@^7.16.5": - version "7.16.6" - resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.16.6.tgz#8f194828193e8fa79166f34a4b4e52f3e769a314" - integrity sha512-Gr86ujcNuPDnNOY8mi383Hvi8IYrJVJYuf3XcuBM/Dgd+bINn/7tHqsj+tKkoreMbmGsFLsltI/JJd8fOFWGDQ== - -"@babel/parser@^7.16.7", "@babel/parser@^7.17.3", "@babel/parser@^7.17.7": - version "7.17.7" - resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.17.7.tgz#fc19b645a5456c8d6fdb6cecd3c66c0173902800" - integrity sha512-bm3AQf45vR4gKggRfvJdYJ0gFLoCbsPxiFLSH6hTVYABptNHY6l9NrhnucVjQ/X+SPtLANT9lc0fFhikj+VBRA== +"@babel/parser@^7.1.0", "@babel/parser@^7.14.7", "@babel/parser@^7.18.10", "@babel/parser@^7.20.1", "@babel/parser@^7.20.2": + version "7.20.3" + resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.20.3.tgz#5358cf62e380cf69efcb87a7bb922ff88bfac6e2" + integrity sha512-OP/s5a94frIPXwjzEcv5S/tpQfc6XhxYUnmWpgdqMWGgYCuErA3SzozaRAMQgSZWKeTJxht9aWAkUY+0UzvOFg== "@babel/plugin-syntax-async-generators@^7.8.4": version "7.8.4" @@ -349,6 +195,13 @@ dependencies: "@babel/helper-plugin-utils" "^7.8.0" +"@babel/plugin-syntax-jsx@^7.7.2": + version "7.18.6" + resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.18.6.tgz#a8feef63b010150abd97f1649ec296e849943ca0" + integrity sha512-6mmljtAedFGTWu2p/8WIORGwy+61PLgOMPOdazc7YoJ9ZCWUyFy3A6CpPkRKLKD1ToAesxX8KGEViAiLo9N+7Q== + dependencies: + "@babel/helper-plugin-utils" "^7.18.6" + "@babel/plugin-syntax-logical-assignment-operators@^7.8.3": version "7.10.4" resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-logical-assignment-operators/-/plugin-syntax-logical-assignment-operators-7.10.4.tgz#ca91ef46303530448b906652bac2e9fe9941f699" @@ -399,76 +252,44 @@ "@babel/helper-plugin-utils" "^7.14.5" "@babel/plugin-syntax-typescript@^7.7.2": - version "7.16.5" - resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.16.5.tgz#f47a33e4eee38554f00fb6b2f894fa1f5649b0b3" - integrity sha512-/d4//lZ1Vqb4mZ5xTep3dDK888j7BGM/iKqBmndBaoYAFPlPKrGU608VVBz5JeyAb6YQDjRu1UKqj86UhwWVgw== + version "7.20.0" + resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-typescript/-/plugin-syntax-typescript-7.20.0.tgz#4e9a0cfc769c85689b77a2e642d24e9f697fc8c7" + integrity sha512-rd9TkG+u1CExzS4SM1BlMEhMXwFLKVjOAFFCDx9PbX5ycJWDoWMcwdJH9RhkPu1dOgn5TrxLot/Gx6lWFuAUNQ== dependencies: - "@babel/helper-plugin-utils" "^7.16.5" + "@babel/helper-plugin-utils" "^7.19.0" -"@babel/template@^7.16.0", "@babel/template@^7.3.3": - version "7.16.0" - resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.16.0.tgz#d16a35ebf4cd74e202083356fab21dd89363ddd6" - integrity sha512-MnZdpFD/ZdYhXwiunMqqgyZyucaYsbL0IrjoGjaVhGilz+x8YB++kRfygSOIj1yOtWKPlx7NBp+9I1RQSgsd5A== +"@babel/template@^7.18.10", "@babel/template@^7.3.3": + version "7.18.10" + resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.18.10.tgz#6f9134835970d1dbf0835c0d100c9f38de0c5e71" + integrity sha512-TI+rCtooWHr3QJ27kJxfjutghu44DLnasDMwpDqCXVTal9RLp3RSYNh4NdBrRP2cQAoG9A8juOQl6P6oZG4JxA== dependencies: - "@babel/code-frame" "^7.16.0" - "@babel/parser" "^7.16.0" - "@babel/types" "^7.16.0" + "@babel/code-frame" "^7.18.6" + "@babel/parser" "^7.18.10" + "@babel/types" "^7.18.10" -"@babel/template@^7.16.7": - version "7.16.7" - resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.16.7.tgz#8d126c8701fde4d66b264b3eba3d96f07666d155" - integrity sha512-I8j/x8kHUrbYRTUxXrrMbfCa7jxkE7tZre39x3kjr9hvI82cK1FfqLygotcWN5kdPGWcLdWMHpSBavse5tWw3w== +"@babel/traverse@^7.20.1", "@babel/traverse@^7.7.2": + version "7.20.1" + resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.20.1.tgz#9b15ccbf882f6d107eeeecf263fbcdd208777ec8" + integrity sha512-d3tN8fkVJwFLkHkBN479SOsw4DMZnz8cdbL/gvuDuzy3TS6Nfw80HuQqhw1pITbIruHyh7d1fMA47kWzmcUEGA== dependencies: - "@babel/code-frame" "^7.16.7" - "@babel/parser" "^7.16.7" - "@babel/types" "^7.16.7" - -"@babel/traverse@^7.16.5", "@babel/traverse@^7.7.2": - version "7.16.5" - resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.16.5.tgz#d7d400a8229c714a59b87624fc67b0f1fbd4b2b3" - integrity sha512-FOCODAzqUMROikDYLYxl4nmwiLlu85rNqBML/A5hKRVXG2LV8d0iMqgPzdYTcIpjZEBB7D6UDU9vxRZiriASdQ== - dependencies: - "@babel/code-frame" "^7.16.0" - "@babel/generator" "^7.16.5" - "@babel/helper-environment-visitor" "^7.16.5" - "@babel/helper-function-name" "^7.16.0" - "@babel/helper-hoist-variables" "^7.16.0" - "@babel/helper-split-export-declaration" "^7.16.0" - "@babel/parser" "^7.16.5" - "@babel/types" "^7.16.0" + "@babel/code-frame" "^7.18.6" + "@babel/generator" "^7.20.1" + "@babel/helper-environment-visitor" "^7.18.9" + "@babel/helper-function-name" "^7.19.0" + "@babel/helper-hoist-variables" "^7.18.6" + "@babel/helper-split-export-declaration" "^7.18.6" + "@babel/parser" "^7.20.1" + "@babel/types" "^7.20.0" debug "^4.1.0" globals "^11.1.0" -"@babel/traverse@^7.17.3": - version "7.17.3" - resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.17.3.tgz#0ae0f15b27d9a92ba1f2263358ea7c4e7db47b57" - integrity sha512-5irClVky7TxRWIRtxlh2WPUUOLhcPN06AGgaQSB8AEwuyEBgJVuJ5imdHm5zxk8w0QS5T+tDfnDxAlhWjpb7cw== +"@babel/types@^7.0.0", "@babel/types@^7.18.10", "@babel/types@^7.18.6", "@babel/types@^7.19.0", "@babel/types@^7.20.0", "@babel/types@^7.20.2", "@babel/types@^7.3.0", "@babel/types@^7.3.3": + version "7.20.2" + resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.20.2.tgz#67ac09266606190f496322dbaff360fdaa5e7842" + integrity sha512-FnnvsNWgZCr232sqtXggapvlkk/tuwR/qhGzcmxI0GXLCjmPYQPzio2FbdlWuY6y1sHFfQKk+rRbUZ9VStQMog== dependencies: - "@babel/code-frame" "^7.16.7" - "@babel/generator" "^7.17.3" - "@babel/helper-environment-visitor" "^7.16.7" - "@babel/helper-function-name" "^7.16.7" - "@babel/helper-hoist-variables" "^7.16.7" - "@babel/helper-split-export-declaration" "^7.16.7" - "@babel/parser" "^7.17.3" - "@babel/types" "^7.17.0" - debug "^4.1.0" - globals "^11.1.0" - -"@babel/types@^7.0.0", "@babel/types@^7.16.0", "@babel/types@^7.3.0", "@babel/types@^7.3.3": - version "7.16.0" - resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.16.0.tgz#db3b313804f96aadd0b776c4823e127ad67289ba" - integrity sha512-PJgg/k3SdLsGb3hhisFvtLOw5ts113klrpLuIPtCJIU+BB24fqq6lf8RWqKJEjzqXR9AEH1rIb5XTqwBHB+kQg== - dependencies: - "@babel/helper-validator-identifier" "^7.15.7" - to-fast-properties "^2.0.0" - -"@babel/types@^7.16.7", "@babel/types@^7.17.0": - version "7.17.0" - resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.17.0.tgz#a826e368bccb6b3d84acd76acad5c0d87342390b" - integrity sha512-TmKSNO4D5rzhL5bjWFcVHHLETzfQ/AmbKpKPOSjlP0WoHZ6L911fgoOKY4Alp/emzG4cHJdyN49zpgkbXFEHHw== - dependencies: - "@babel/helper-validator-identifier" "^7.16.7" + "@babel/helper-string-parser" "^7.19.4" + "@babel/helper-validator-identifier" "^7.19.1" to-fast-properties "^2.0.0" "@bcoe/v8-coverage@^0.2.3": @@ -492,193 +313,238 @@ resolved "https://registry.yarnpkg.com/@istanbuljs/schema/-/schema-0.1.3.tgz#e45e384e4b8ec16bce2fd903af78450f6bf7ec98" integrity sha512-ZXRY4jNvVgSVQ8DL3LTcakaAtXwTVUxE81hslsyD2AtoXW/wVob10HkOJ1X/pAlcI7D+2YoZKg5do8G/w6RYgA== -"@jest/console@^27.5.1": - version "27.5.1" - resolved "https://registry.yarnpkg.com/@jest/console/-/console-27.5.1.tgz#260fe7239602fe5130a94f1aa386eff54b014bba" - integrity sha512-kZ/tNpS3NXn0mlXXXPNuDZnb4c0oZ20r4K5eemM2k30ZC3G0T02nXUvyhf5YdbXWHPEJLc9qGLxEZ216MdL+Zg== +"@jest/console@^29.3.1": + version "29.3.1" + resolved "https://registry.yarnpkg.com/@jest/console/-/console-29.3.1.tgz#3e3f876e4e47616ea3b1464b9fbda981872e9583" + integrity sha512-IRE6GD47KwcqA09RIWrabKdHPiKDGgtAL31xDxbi/RjQMsr+lY+ppxmHwY0dUEV3qvvxZzoe5Hl0RXZJOjQNUg== dependencies: - "@jest/types" "^27.5.1" + "@jest/types" "^29.3.1" "@types/node" "*" chalk "^4.0.0" - jest-message-util "^27.5.1" - jest-util "^27.5.1" + jest-message-util "^29.3.1" + jest-util "^29.3.1" slash "^3.0.0" -"@jest/core@^27.5.1": - version "27.5.1" - resolved "https://registry.yarnpkg.com/@jest/core/-/core-27.5.1.tgz#267ac5f704e09dc52de2922cbf3af9edcd64b626" - integrity sha512-AK6/UTrvQD0Cd24NSqmIA6rKsu0tKIxfiCducZvqxYdmMisOYAsdItspT+fQDQYARPf8XgjAFZi0ogW2agH5nQ== +"@jest/core@^29.3.1": + version "29.3.1" + resolved "https://registry.yarnpkg.com/@jest/core/-/core-29.3.1.tgz#bff00f413ff0128f4debec1099ba7dcd649774a1" + integrity sha512-0ohVjjRex985w5MmO5L3u5GR1O30DexhBSpuwx2P+9ftyqHdJXnk7IUWiP80oHMvt7ubHCJHxV0a0vlKVuZirw== dependencies: - "@jest/console" "^27.5.1" - "@jest/reporters" "^27.5.1" - "@jest/test-result" "^27.5.1" - "@jest/transform" "^27.5.1" - "@jest/types" "^27.5.1" + "@jest/console" "^29.3.1" + "@jest/reporters" "^29.3.1" + "@jest/test-result" "^29.3.1" + "@jest/transform" "^29.3.1" + "@jest/types" "^29.3.1" "@types/node" "*" ansi-escapes "^4.2.1" chalk "^4.0.0" - emittery "^0.8.1" + ci-info "^3.2.0" exit "^0.1.2" graceful-fs "^4.2.9" - jest-changed-files "^27.5.1" - jest-config "^27.5.1" - jest-haste-map "^27.5.1" - jest-message-util "^27.5.1" - jest-regex-util "^27.5.1" - jest-resolve "^27.5.1" - jest-resolve-dependencies "^27.5.1" - jest-runner "^27.5.1" - jest-runtime "^27.5.1" - jest-snapshot "^27.5.1" - jest-util "^27.5.1" - jest-validate "^27.5.1" - jest-watcher "^27.5.1" + jest-changed-files "^29.2.0" + jest-config "^29.3.1" + jest-haste-map "^29.3.1" + jest-message-util "^29.3.1" + jest-regex-util "^29.2.0" + jest-resolve "^29.3.1" + jest-resolve-dependencies "^29.3.1" + jest-runner "^29.3.1" + jest-runtime "^29.3.1" + jest-snapshot "^29.3.1" + jest-util "^29.3.1" + jest-validate "^29.3.1" + jest-watcher "^29.3.1" micromatch "^4.0.4" - rimraf "^3.0.0" + pretty-format "^29.3.1" slash "^3.0.0" strip-ansi "^6.0.0" -"@jest/environment@^27.5.1": - version "27.5.1" - resolved "https://registry.yarnpkg.com/@jest/environment/-/environment-27.5.1.tgz#d7425820511fe7158abbecc010140c3fd3be9c74" - integrity sha512-/WQjhPJe3/ghaol/4Bq480JKXV/Rfw8nQdN7f41fM8VDHLcxKXou6QyXAh3EFr9/bVG3x74z1NWDkP87EiY8gA== +"@jest/environment@^29.3.1": + version "29.3.1" + resolved "https://registry.yarnpkg.com/@jest/environment/-/environment-29.3.1.tgz#eb039f726d5fcd14698acd072ac6576d41cfcaa6" + integrity sha512-pMmvfOPmoa1c1QpfFW0nXYtNLpofqo4BrCIk6f2kW4JFeNlHV2t3vd+3iDLf31e2ot2Mec0uqZfmI+U0K2CFag== dependencies: - "@jest/fake-timers" "^27.5.1" - "@jest/types" "^27.5.1" + "@jest/fake-timers" "^29.3.1" + "@jest/types" "^29.3.1" "@types/node" "*" - jest-mock "^27.5.1" + jest-mock "^29.3.1" -"@jest/fake-timers@^27.5.1": - version "27.5.1" - resolved "https://registry.yarnpkg.com/@jest/fake-timers/-/fake-timers-27.5.1.tgz#76979745ce0579c8a94a4678af7a748eda8ada74" - integrity sha512-/aPowoolwa07k7/oM3aASneNeBGCmGQsc3ugN4u6s4C/+s5M64MFo/+djTdiwcbQlRfFElGuDXWzaWj6QgKObQ== +"@jest/expect-utils@^29.3.1": + version "29.3.1" + resolved "https://registry.yarnpkg.com/@jest/expect-utils/-/expect-utils-29.3.1.tgz#531f737039e9b9e27c42449798acb5bba01935b6" + integrity sha512-wlrznINZI5sMjwvUoLVk617ll/UYfGIZNxmbU+Pa7wmkL4vYzhV9R2pwVqUh4NWWuLQWkI8+8mOkxs//prKQ3g== dependencies: - "@jest/types" "^27.5.1" - "@sinonjs/fake-timers" "^8.0.1" + jest-get-type "^29.2.0" + +"@jest/expect@^29.3.1": + version "29.3.1" + resolved "https://registry.yarnpkg.com/@jest/expect/-/expect-29.3.1.tgz#456385b62894349c1d196f2d183e3716d4c6a6cd" + integrity sha512-QivM7GlSHSsIAWzgfyP8dgeExPRZ9BIe2LsdPyEhCGkZkoyA+kGsoIzbKAfZCvvRzfZioKwPtCZIt5SaoxYCvg== + dependencies: + expect "^29.3.1" + jest-snapshot "^29.3.1" + +"@jest/fake-timers@^29.3.1": + version "29.3.1" + resolved "https://registry.yarnpkg.com/@jest/fake-timers/-/fake-timers-29.3.1.tgz#b140625095b60a44de820876d4c14da1aa963f67" + integrity sha512-iHTL/XpnDlFki9Tq0Q1GGuVeQ8BHZGIYsvCO5eN/O/oJaRzofG9Xndd9HuSDBI/0ZS79pg0iwn07OMTQ7ngF2A== + dependencies: + "@jest/types" "^29.3.1" + "@sinonjs/fake-timers" "^9.1.2" "@types/node" "*" - jest-message-util "^27.5.1" - jest-mock "^27.5.1" - jest-util "^27.5.1" + jest-message-util "^29.3.1" + jest-mock "^29.3.1" + jest-util "^29.3.1" -"@jest/globals@^27.5.1": - version "27.5.1" - resolved "https://registry.yarnpkg.com/@jest/globals/-/globals-27.5.1.tgz#7ac06ce57ab966566c7963431cef458434601b2b" - integrity sha512-ZEJNB41OBQQgGzgyInAv0UUfDDj3upmHydjieSxFvTRuZElrx7tXg/uVQ5hYVEwiXs3+aMsAeEc9X7xiSKCm4Q== +"@jest/globals@^29.3.1": + version "29.3.1" + resolved "https://registry.yarnpkg.com/@jest/globals/-/globals-29.3.1.tgz#92be078228e82d629df40c3656d45328f134a0c6" + integrity sha512-cTicd134vOcwO59OPaB6AmdHQMCtWOe+/DitpTZVxWgMJ+YvXL1HNAmPyiGbSHmF/mXVBkvlm8YYtQhyHPnV6Q== dependencies: - "@jest/environment" "^27.5.1" - "@jest/types" "^27.5.1" - expect "^27.5.1" + "@jest/environment" "^29.3.1" + "@jest/expect" "^29.3.1" + "@jest/types" "^29.3.1" + jest-mock "^29.3.1" -"@jest/reporters@^27.5.1": - version "27.5.1" - resolved "https://registry.yarnpkg.com/@jest/reporters/-/reporters-27.5.1.tgz#ceda7be96170b03c923c37987b64015812ffec04" - integrity sha512-cPXh9hWIlVJMQkVk84aIvXuBB4uQQmFqZiacloFuGiP3ah1sbCxCosidXFDfqG8+6fO1oR2dTJTlsOy4VFmUfw== +"@jest/reporters@^29.3.1": + version "29.3.1" + resolved "https://registry.yarnpkg.com/@jest/reporters/-/reporters-29.3.1.tgz#9a6d78c109608e677c25ddb34f907b90e07b4310" + integrity sha512-GhBu3YFuDrcAYW/UESz1JphEAbvUjaY2vShRZRoRY1mxpCMB3yGSJ4j9n0GxVlEOdCf7qjvUfBCrTUUqhVfbRA== dependencies: "@bcoe/v8-coverage" "^0.2.3" - "@jest/console" "^27.5.1" - "@jest/test-result" "^27.5.1" - "@jest/transform" "^27.5.1" - "@jest/types" "^27.5.1" + "@jest/console" "^29.3.1" + "@jest/test-result" "^29.3.1" + "@jest/transform" "^29.3.1" + "@jest/types" "^29.3.1" + "@jridgewell/trace-mapping" "^0.3.15" "@types/node" "*" chalk "^4.0.0" collect-v8-coverage "^1.0.0" exit "^0.1.2" - glob "^7.1.2" + glob "^7.1.3" graceful-fs "^4.2.9" istanbul-lib-coverage "^3.0.0" istanbul-lib-instrument "^5.1.0" istanbul-lib-report "^3.0.0" istanbul-lib-source-maps "^4.0.0" istanbul-reports "^3.1.3" - jest-haste-map "^27.5.1" - jest-resolve "^27.5.1" - jest-util "^27.5.1" - jest-worker "^27.5.1" + jest-message-util "^29.3.1" + jest-util "^29.3.1" + jest-worker "^29.3.1" slash "^3.0.0" - source-map "^0.6.0" string-length "^4.0.1" - terminal-link "^2.0.0" - v8-to-istanbul "^8.1.0" + strip-ansi "^6.0.0" + v8-to-istanbul "^9.0.1" -"@jest/source-map@^27.5.1": - version "27.5.1" - resolved "https://registry.yarnpkg.com/@jest/source-map/-/source-map-27.5.1.tgz#6608391e465add4205eae073b55e7f279e04e8cf" - integrity sha512-y9NIHUYF3PJRlHk98NdC/N1gl88BL08aQQgu4k4ZopQkCw9t9cV8mtl3TV8b/YCB8XaVTFrmUTAJvjsntDireg== +"@jest/schemas@^29.0.0": + version "29.0.0" + resolved "https://registry.yarnpkg.com/@jest/schemas/-/schemas-29.0.0.tgz#5f47f5994dd4ef067fb7b4188ceac45f77fe952a" + integrity sha512-3Ab5HgYIIAnS0HjqJHQYZS+zXc4tUmTmBH3z83ajI6afXp8X3ZtdLX+nXx+I7LNkJD7uN9LAVhgnjDgZa2z0kA== dependencies: + "@sinclair/typebox" "^0.24.1" + +"@jest/source-map@^29.2.0": + version "29.2.0" + resolved "https://registry.yarnpkg.com/@jest/source-map/-/source-map-29.2.0.tgz#ab3420c46d42508dcc3dc1c6deee0b613c235744" + integrity sha512-1NX9/7zzI0nqa6+kgpSdKPK+WU1p+SJk3TloWZf5MzPbxri9UEeXX5bWZAPCzbQcyuAzubcdUHA7hcNznmRqWQ== + dependencies: + "@jridgewell/trace-mapping" "^0.3.15" callsites "^3.0.0" graceful-fs "^4.2.9" - source-map "^0.6.0" -"@jest/test-result@^27.5.1": - version "27.5.1" - resolved "https://registry.yarnpkg.com/@jest/test-result/-/test-result-27.5.1.tgz#56a6585fa80f7cdab72b8c5fc2e871d03832f5bb" - integrity sha512-EW35l2RYFUcUQxFJz5Cv5MTOxlJIQs4I7gxzi2zVU7PJhOwfYq1MdC5nhSmYjX1gmMmLPvB3sIaC+BkcHRBfag== +"@jest/test-result@^29.3.1": + version "29.3.1" + resolved "https://registry.yarnpkg.com/@jest/test-result/-/test-result-29.3.1.tgz#92cd5099aa94be947560a24610aa76606de78f50" + integrity sha512-qeLa6qc0ddB0kuOZyZIhfN5q0e2htngokyTWsGriedsDhItisW7SDYZ7ceOe57Ii03sL988/03wAcBh3TChMGw== dependencies: - "@jest/console" "^27.5.1" - "@jest/types" "^27.5.1" + "@jest/console" "^29.3.1" + "@jest/types" "^29.3.1" "@types/istanbul-lib-coverage" "^2.0.0" collect-v8-coverage "^1.0.0" -"@jest/test-sequencer@^27.5.1": - version "27.5.1" - resolved "https://registry.yarnpkg.com/@jest/test-sequencer/-/test-sequencer-27.5.1.tgz#4057e0e9cea4439e544c6353c6affe58d095745b" - integrity sha512-LCheJF7WB2+9JuCS7VB/EmGIdQuhtqjRNI9A43idHv3E4KltCTsPsLxvdaubFHSYwY/fNjMWjl6vNRhDiN7vpQ== +"@jest/test-sequencer@^29.3.1": + version "29.3.1" + resolved "https://registry.yarnpkg.com/@jest/test-sequencer/-/test-sequencer-29.3.1.tgz#fa24b3b050f7a59d48f7ef9e0b782ab65123090d" + integrity sha512-IqYvLbieTv20ArgKoAMyhLHNrVHJfzO6ARZAbQRlY4UGWfdDnLlZEF0BvKOMd77uIiIjSZRwq3Jb3Fa3I8+2UA== dependencies: - "@jest/test-result" "^27.5.1" + "@jest/test-result" "^29.3.1" graceful-fs "^4.2.9" - jest-haste-map "^27.5.1" - jest-runtime "^27.5.1" + jest-haste-map "^29.3.1" + slash "^3.0.0" -"@jest/transform@^27.5.1": - version "27.5.1" - resolved "https://registry.yarnpkg.com/@jest/transform/-/transform-27.5.1.tgz#6c3501dcc00c4c08915f292a600ece5ecfe1f409" - integrity sha512-ipON6WtYgl/1329g5AIJVbUuEh0wZVbdpGwC99Jw4LwuoBNS95MVphU6zOeD9pDkon+LLbFL7lOQRapbB8SCHw== +"@jest/transform@^29.3.1": + version "29.3.1" + resolved "https://registry.yarnpkg.com/@jest/transform/-/transform-29.3.1.tgz#1e6bd3da4af50b5c82a539b7b1f3770568d6e36d" + integrity sha512-8wmCFBTVGYqFNLWfcOWoVuMuKYPUBTnTMDkdvFtAYELwDOl9RGwOsvQWGPFxDJ8AWY9xM/8xCXdqmPK3+Q5Lug== dependencies: - "@babel/core" "^7.1.0" - "@jest/types" "^27.5.1" + "@babel/core" "^7.11.6" + "@jest/types" "^29.3.1" + "@jridgewell/trace-mapping" "^0.3.15" babel-plugin-istanbul "^6.1.1" chalk "^4.0.0" - convert-source-map "^1.4.0" - fast-json-stable-stringify "^2.0.0" + convert-source-map "^2.0.0" + fast-json-stable-stringify "^2.1.0" graceful-fs "^4.2.9" - jest-haste-map "^27.5.1" - jest-regex-util "^27.5.1" - jest-util "^27.5.1" + jest-haste-map "^29.3.1" + jest-regex-util "^29.2.0" + jest-util "^29.3.1" micromatch "^4.0.4" pirates "^4.0.4" slash "^3.0.0" - source-map "^0.6.1" - write-file-atomic "^3.0.0" + write-file-atomic "^4.0.1" -"@jest/types@^27.5.1": - version "27.5.1" - resolved "https://registry.yarnpkg.com/@jest/types/-/types-27.5.1.tgz#3c79ec4a8ba61c170bf937bcf9e98a9df175ec80" - integrity sha512-Cx46iJ9QpwQTjIdq5VJu2QTMMs3QlEjI0x1QbBP5W1+nMzyc2XmimiRR/CbX9TO0cPTeUlxWMOu8mslYsJ8DEw== +"@jest/types@^29.3.1": + version "29.3.1" + resolved "https://registry.yarnpkg.com/@jest/types/-/types-29.3.1.tgz#7c5a80777cb13e703aeec6788d044150341147e3" + integrity sha512-d0S0jmmTpjnhCmNpApgX3jrUZgZ22ivKJRvL2lli5hpCRoNnp1f85r2/wpKfXuYu8E7Jjh1hGfhPyup1NM5AmA== dependencies: + "@jest/schemas" "^29.0.0" "@types/istanbul-lib-coverage" "^2.0.0" "@types/istanbul-reports" "^3.0.0" "@types/node" "*" - "@types/yargs" "^16.0.0" + "@types/yargs" "^17.0.8" chalk "^4.0.0" -"@jridgewell/resolve-uri@^3.0.3": - version "3.0.5" - resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.0.5.tgz#68eb521368db76d040a6315cdb24bf2483037b9c" - integrity sha512-VPeQ7+wH0itvQxnG+lIzWgkysKIr3L9sslimFW55rHMdGu/qCQ5z5h9zq4gI8uBtqkpHhsF4Z/OwExufUCThew== - -"@jridgewell/sourcemap-codec@^1.4.10": - version "1.4.11" - resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.11.tgz#771a1d8d744eeb71b6adb35808e1a6c7b9b8c8ec" - integrity sha512-Fg32GrJo61m+VqYSdRSjRXMjQ06j8YIYfcTqndLYVAaHmroZHLJZCydsWBOTDqXS2v+mjxohBWEMfg97GXmYQg== - -"@jridgewell/trace-mapping@^0.3.0": - version "0.3.4" - resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.4.tgz#f6a0832dffd5b8a6aaa633b7d9f8e8e94c83a0c3" - integrity sha512-vFv9ttIedivx0ux3QSjhgtCVjPZd5l46ZOMDSCwnH1yUO2e964gO8LZGyv2QkqcgR6TnBU1v+1IFqmeoG+0UJQ== +"@jridgewell/gen-mapping@^0.1.0": + version "0.1.1" + resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz#e5d2e450306a9491e3bd77e323e38d7aff315996" + integrity sha512-sQXCasFk+U8lWYEe66WxRDOE9PjVz4vSM51fTu3Hw+ClTpUSQb718772vH3pyS5pShp6lvQM7SxgIDXXXmOX7w== dependencies: - "@jridgewell/resolve-uri" "^3.0.3" + "@jridgewell/set-array" "^1.0.0" "@jridgewell/sourcemap-codec" "^1.4.10" +"@jridgewell/gen-mapping@^0.3.2": + version "0.3.2" + resolved "https://registry.yarnpkg.com/@jridgewell/gen-mapping/-/gen-mapping-0.3.2.tgz#c1aedc61e853f2bb9f5dfe6d4442d3b565b253b9" + integrity sha512-mh65xKQAzI6iBcFzwv28KVWSmCkdRBWoOh+bYQGW3+6OZvbbN3TqMGo5hqYxQniRcH9F2VZIoJCm4pa3BPDK/A== + dependencies: + "@jridgewell/set-array" "^1.0.1" + "@jridgewell/sourcemap-codec" "^1.4.10" + "@jridgewell/trace-mapping" "^0.3.9" + +"@jridgewell/resolve-uri@3.1.0": + version "3.1.0" + resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.1.0.tgz#2203b118c157721addfe69d47b70465463066d78" + integrity sha512-F2msla3tad+Mfht5cJq7LSXcdudKTWCVYUgw6pLFOOHSTtZlj6SWNYAp+AhuqLmWdBO2X5hPrLcu8cVP8fy28w== + +"@jridgewell/set-array@^1.0.0", "@jridgewell/set-array@^1.0.1": + version "1.1.2" + resolved "https://registry.yarnpkg.com/@jridgewell/set-array/-/set-array-1.1.2.tgz#7c6cf998d6d20b914c0a55a91ae928ff25965e72" + integrity sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw== + +"@jridgewell/sourcemap-codec@1.4.14", "@jridgewell/sourcemap-codec@^1.4.10": + version "1.4.14" + resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz#add4c98d341472a289190b424efbdb096991bb24" + integrity sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw== + +"@jridgewell/trace-mapping@^0.3.12", "@jridgewell/trace-mapping@^0.3.15", "@jridgewell/trace-mapping@^0.3.9": + version "0.3.17" + resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.17.tgz#793041277af9073b0951a7fe0f0d8c4c98c36985" + integrity sha512-MCNzAp77qzKca9+W/+I0+sEpaUnZoeasnghNeVc41VZCEKaCH73Vq3BZZ/SzWIgrqE4H4ceI+p+b6C0mHf9T4g== + dependencies: + "@jridgewell/resolve-uri" "3.1.0" + "@jridgewell/sourcemap-codec" "1.4.14" + "@nodelib/fs.scandir@2.1.5": version "2.1.5" resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz#7619c2eb21b25483f6d167548b4cfd5a7488c3d5" @@ -700,29 +566,29 @@ "@nodelib/fs.scandir" "2.1.5" fastq "^1.6.0" +"@sinclair/typebox@^0.24.1": + version "0.24.51" + resolved "https://registry.yarnpkg.com/@sinclair/typebox/-/typebox-0.24.51.tgz#645f33fe4e02defe26f2f5c0410e1c094eac7f5f" + integrity sha512-1P1OROm/rdubP5aFDSZQILU0vrLCJ4fvHt6EoqHEM+2D/G5MK3bIaymUKLit8Js9gbns5UyJnkP/TZROLw4tUA== + "@sinonjs/commons@^1.7.0": - version "1.8.3" - resolved "https://registry.yarnpkg.com/@sinonjs/commons/-/commons-1.8.3.tgz#3802ddd21a50a949b6721ddd72da36e67e7f1b2d" - integrity sha512-xkNcLAn/wZaX14RPlwizcKicDk9G3F8m2nU3L7Ukm5zBgTwiT0wsoFAHx9Jq56fJA1z/7uKGtCRu16sOUCLIHQ== + version "1.8.5" + resolved "https://registry.yarnpkg.com/@sinonjs/commons/-/commons-1.8.5.tgz#e280c94c95f206dcfd5aca00a43f2156b758c764" + integrity sha512-rTpCA0wG1wUxglBSFdMMY0oTrKYvgf4fNgv/sXbfCVAdf+FnPBdKJR/7XbpTCwbCrvCbdPYnlWaUUYz4V2fPDA== dependencies: type-detect "4.0.8" -"@sinonjs/fake-timers@^8.0.1": - version "8.1.0" - resolved "https://registry.yarnpkg.com/@sinonjs/fake-timers/-/fake-timers-8.1.0.tgz#3fdc2b6cb58935b21bfb8d1625eb1300484316e7" - integrity sha512-OAPJUAtgeINhh/TAlUID4QTs53Njm7xzddaVlEs/SXwgtiD1tW22zAB/W1wdqfrpmikgaWQ9Fw6Ws+hsiRm5Vg== +"@sinonjs/fake-timers@^9.1.2": + version "9.1.2" + resolved "https://registry.yarnpkg.com/@sinonjs/fake-timers/-/fake-timers-9.1.2.tgz#4eaab737fab77332ab132d396a3c0d364bd0ea8c" + integrity sha512-BPS4ynJW/o92PUR4wgriz2Ud5gpST5vz6GQfMixEDK0Z8ZCUv2M7SkBLykH56T++Xs+8ln9zTGbOvNGIe02/jw== dependencies: "@sinonjs/commons" "^1.7.0" -"@tootallnate/once@1": - version "1.1.2" - resolved "https://registry.yarnpkg.com/@tootallnate/once/-/once-1.1.2.tgz#ccb91445360179a04e7fe6aff78c00ffc1eeaf82" - integrity sha512-RbzJvlNzmRq5c3O09UipeuXno4tA1FE6ikOjxZK0tuxVv3412l64l5t1W5pj4+rJq9vpkm/kwiR07aZXnsKPxw== - -"@types/babel__core@^7.0.0", "@types/babel__core@^7.1.14": - version "7.1.17" - resolved "https://registry.yarnpkg.com/@types/babel__core/-/babel__core-7.1.17.tgz#f50ac9d20d64153b510578d84f9643f9a3afbe64" - integrity sha512-6zzkezS9QEIL8yCBvXWxPTJPNuMeECJVxSOhxNY/jfq9LxOTHivaYTqr37n9LknWWRTIkzqH2UilS5QFvfa90A== +"@types/babel__core@^7.1.14": + version "7.1.20" + resolved "https://registry.yarnpkg.com/@types/babel__core/-/babel__core-7.1.20.tgz#e168cdd612c92a2d335029ed62ac94c95b362359" + integrity sha512-PVb6Bg2QuscZ30FvOU7z4guG6c926D9YRvOxEaelzndpMsvP+YM74Q/dAFASpg2l6+XLalxSGxcq/lrgYWZtyQ== dependencies: "@babel/parser" "^7.1.0" "@babel/types" "^7.0.0" @@ -731,9 +597,9 @@ "@types/babel__traverse" "*" "@types/babel__generator@*": - version "7.6.3" - resolved "https://registry.yarnpkg.com/@types/babel__generator/-/babel__generator-7.6.3.tgz#f456b4b2ce79137f768aa130d2423d2f0ccfaba5" - integrity sha512-/GWCmzJWqV7diQW54smJZzWbSFf4QYtF71WCKhcx6Ru/tFyQIY2eiiITcCAeuPbNSvT9YCGkVMqqvSk2Z0mXiA== + version "7.6.4" + resolved "https://registry.yarnpkg.com/@types/babel__generator/-/babel__generator-7.6.4.tgz#1f20ce4c5b1990b37900b63f050182d28c2439b7" + integrity sha512-tFkciB9j2K755yrTALxD44McOrk+gfpIpvC3sxHjRawj6PfnQxrse4Clq5y/Rq+G3mrBurMax/lG8Qn2t9mSsg== dependencies: "@babel/types" "^7.0.0" @@ -745,10 +611,10 @@ "@babel/parser" "^7.1.0" "@babel/types" "^7.0.0" -"@types/babel__traverse@*", "@types/babel__traverse@^7.0.4", "@types/babel__traverse@^7.0.6": - version "7.14.2" - resolved "https://registry.yarnpkg.com/@types/babel__traverse/-/babel__traverse-7.14.2.tgz#ffcd470bbb3f8bf30481678fb5502278ca833a43" - integrity sha512-K2waXdXBi2302XUdcHcR1jCeU0LL4TD9HRs/gk0N2Xvrht+G/BfJa4QObBQZfhMdxiCpV3COl5Nfq4uKTeTnJA== +"@types/babel__traverse@*", "@types/babel__traverse@^7.0.6": + version "7.18.2" + resolved "https://registry.yarnpkg.com/@types/babel__traverse/-/babel__traverse-7.18.2.tgz#235bf339d17185bdec25e024ca19cce257cc7309" + integrity sha512-FcFaxOr2V5KZCviw1TnutEMVUVsGt4D2hP1TAfXZAMKuHYW3xQhe3jTxNPWutgCJ3/X1c5yX8ZoGVEItxKbwBg== dependencies: "@babel/types" "^7.3.0" @@ -757,7 +623,7 @@ resolved "https://registry.yarnpkg.com/@types/css/-/css-0.0.33.tgz#d0b49c4090c09c8e5dc01364560627e5ebb770f2" integrity sha512-qjeDgh86R0LIeEM588q65yatc8Yyo/VvSIYFqq8JOIHDolhGNX0rz7k/OuxqDpnpqlefoHj8X4Ai/6hT9IWtKQ== -"@types/graceful-fs@^4.1.2": +"@types/graceful-fs@^4.1.3": version "4.1.5" resolved "https://registry.yarnpkg.com/@types/graceful-fs/-/graceful-fs-4.1.5.tgz#21ffba0d98da4350db64891f92a9e5db3cdb4e15" integrity sha512-anKkLmZZ+xm4p8JWBf4hElkM4XR+EZeA2M9BAkkTldmcyDY4mbdIJnRghDJH3Ov5ooY7/UAoENtmdMSkaAd7Cw== @@ -765,9 +631,9 @@ "@types/node" "*" "@types/istanbul-lib-coverage@*", "@types/istanbul-lib-coverage@^2.0.0", "@types/istanbul-lib-coverage@^2.0.1": - version "2.0.3" - resolved "https://registry.yarnpkg.com/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.3.tgz#4ba8ddb720221f432e443bd5f9117fd22cfd4762" - integrity sha512-sz7iLqvVUg1gIedBOvlkxPlc8/uVzyS5OwGz1cKjXzkl3FpL3al0crU8YGU1WoHkxn0Wxbw5tyi6hvzJKNzFsw== + version "2.0.4" + resolved "https://registry.yarnpkg.com/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz#8467d4b3c087805d63580480890791277ce35c44" + integrity sha512-z/QT1XN4K4KYuslS23k62yDIDLwLFkzxOuMplDtObz0+y7VqJCaO2o+SPwHCvLFZh7xazvvoor2tA/hPz9ee7g== "@types/istanbul-lib-report@*": version "3.0.0" @@ -784,14 +650,14 @@ "@types/istanbul-lib-report" "*" "@types/node@*": - version "16.11.13" - resolved "https://registry.yarnpkg.com/@types/node/-/node-16.11.13.tgz#6b71641b81a98c6a538d89892440c06f147edddc" - integrity sha512-eUXZzHLHoZqj1frtUetNkUetYoJ6X55UmrVnFD4DMhVeAmwLjniZhtBmsRiemQh4uq4G3vUra/Ws/hs9vEvL3Q== + version "18.11.9" + resolved "https://registry.yarnpkg.com/@types/node/-/node-18.11.9.tgz#02d013de7058cea16d36168ef2fc653464cfbad4" + integrity sha512-CRpX21/kGdzjOpFsZSkcrXMGIBWMGNIHXXBVFSH+ggkftxg+XYP20TESbh+zFvFj3EQOl5byk0HTRn1IL6hbqg== "@types/prettier@^2.1.5": - version "2.4.2" - resolved "https://registry.yarnpkg.com/@types/prettier/-/prettier-2.4.2.tgz#4c62fae93eb479660c3bd93f9d24d561597a8281" - integrity sha512-ekoj4qOQYp7CvjX8ZDBgN86w3MqQhLE1hczEJbEIjgFEumDy+na/4AJAbLXfgEWFNB2pKadM5rPFtuSGMWK7xA== + version "2.7.1" + resolved "https://registry.yarnpkg.com/@types/prettier/-/prettier-2.7.1.tgz#dfd20e2dc35f027cdd6c1908e80a5ddc7499670e" + integrity sha512-ri0UmynRRvZiiUJdiz38MmIblKK+oH30MztdBVR95dv/Ubw6neWSb8u1XpRb72L4qsZOhz+L+z9JD40SJmfWow== "@types/stack-utils@^2.0.0": version "2.0.1" @@ -799,56 +665,21 @@ integrity sha512-Hl219/BT5fLAaz6NDkSuhzasy49dwQS/DSdu4MdggFB8zcXv7vflBI3xp7FEmkmdDkBUI2bPUNeMttp2knYdxw== "@types/yargs-parser@*": - version "20.2.1" - resolved "https://registry.yarnpkg.com/@types/yargs-parser/-/yargs-parser-20.2.1.tgz#3b9ce2489919d9e4fea439b76916abc34b2df129" - integrity sha512-7tFImggNeNBVMsn0vLrpn1H1uPrUBdnARPTpZoitY37ZrdJREzf7I16tMrlK3hen349gr1NYh8CmZQa7CTG6Aw== + version "21.0.0" + resolved "https://registry.yarnpkg.com/@types/yargs-parser/-/yargs-parser-21.0.0.tgz#0c60e537fa790f5f9472ed2776c2b71ec117351b" + integrity sha512-iO9ZQHkZxHn4mSakYV0vFHAVDyEOIJQrV2uZ06HxEPcx+mt8swXoZHIbaaJ2crJYFfErySgktuTZ3BeLz+XmFA== -"@types/yargs@^16.0.0": - version "16.0.4" - resolved "https://registry.yarnpkg.com/@types/yargs/-/yargs-16.0.4.tgz#26aad98dd2c2a38e421086ea9ad42b9e51642977" - integrity sha512-T8Yc9wt/5LbJyCaLiHPReJa0kApcIgJ7Bn735GjItUfh08Z1pJvu8QZqb9s+mMvKV6WUQRV7K2R46YbjMXTTJw== +"@types/yargs@^17.0.8": + version "17.0.13" + resolved "https://registry.yarnpkg.com/@types/yargs/-/yargs-17.0.13.tgz#34cced675ca1b1d51fcf4d34c3c6f0fa142a5c76" + integrity sha512-9sWaruZk2JGxIQU+IhI1fhPYRcQ0UuTNuKuCW9bR5fp7qi2Llf7WDzNa17Cy7TKnh3cdxDOiyTu6gaLS0eDatg== dependencies: "@types/yargs-parser" "*" -abab@^2.0.3, abab@^2.0.5: - version "2.0.5" - resolved "https://registry.yarnpkg.com/abab/-/abab-2.0.5.tgz#c0b678fb32d60fc1219c784d6a826fe385aeb79a" - integrity sha512-9IK9EadsbHo6jLWIpxpR6pL0sazTXV6+SQv25ZB+F7Bj9mJNaOc4nCRabwd5M/JwmUa8idz6Eci6eKfJryPs6Q== - -acorn-globals@^6.0.0: - version "6.0.0" - resolved "https://registry.yarnpkg.com/acorn-globals/-/acorn-globals-6.0.0.tgz#46cdd39f0f8ff08a876619b55f5ac8a6dc770b45" - integrity sha512-ZQl7LOWaF5ePqqcX4hLuv/bLXYQNfNWw2c0/yX/TsPRKamzHcTGQnlCjHT3TsmkOUVEPS3crCxiPfdzE/Trlhg== - dependencies: - acorn "^7.1.1" - acorn-walk "^7.1.1" - -acorn-walk@^7.1.1: - version "7.2.0" - resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-7.2.0.tgz#0de889a601203909b0fbe07b8938dc21d2e967bc" - integrity sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA== - -acorn@^7.1.1: - version "7.4.1" - resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.1.tgz#feaed255973d2e77555b83dbc08851a6c63520fa" - integrity sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A== - -acorn@^8.2.4: - version "8.6.0" - resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.6.0.tgz#e3692ba0eb1a0c83eaa4f37f5fa7368dd7142895" - integrity sha512-U1riIR+lBSNi3IbxtaHOIKdH8sLFv3NYfNv8sg7ZsNhcfl4HF2++BfqqrNAxoCLQW1iiylOj76ecnaUxz+z9yw== - -agent-base@6: - version "6.0.2" - resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-6.0.2.tgz#49fff58577cfee3f37176feab4c22e00f86d7f77" - integrity sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ== - dependencies: - debug "4" - ansi-colors@^4.1.1: - version "4.1.1" - resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-4.1.1.tgz#cbb9ae256bf750af1eab344f229aa27fe94ba348" - integrity sha512-JoX0apGbHaUJBNl6yF+p6JAFYZ666/hhCGKN5t9QFjbJQKUU/g8MNbFDbvfrgKXvI1QpZplPOnwIo99lX/AAmA== + version "4.1.3" + resolved "https://registry.yarnpkg.com/ansi-colors/-/ansi-colors-4.1.3.tgz#37611340eb2243e70cc604cad35d63270d48781b" + integrity sha512-/6w/C21Pm1A7aZitlI5Ni/2J6FFQN8i1Cvz3kHABAAbw93v/NlvKdVOqz7CCWz/3iv/JplRSEEZ83XION15ovw== ansi-escapes@^4.2.1: version "4.3.2" @@ -896,26 +727,20 @@ argparse@^1.0.7: dependencies: sprintf-js "~1.0.2" -asynckit@^0.4.0: - version "0.4.0" - resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79" - integrity sha1-x57Zf380y48robyXkLzDZkdLS3k= - atob@^2.1.2: version "2.1.2" resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9" integrity sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg== -babel-jest@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/babel-jest/-/babel-jest-27.5.1.tgz#a1bf8d61928edfefd21da27eb86a695bfd691444" - integrity sha512-cdQ5dXjGRd0IBRATiQ4mZGlGlRE8kJpjPOixdNRdT+m3UcNqmYWN6rK6nvtXYfY3D76cb8s/O1Ss8ea24PIwcg== +babel-jest@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/babel-jest/-/babel-jest-29.3.1.tgz#05c83e0d128cd48c453eea851482a38782249f44" + integrity sha512-aard+xnMoxgjwV70t0L6wkW/3HQQtV+O0PEimxKgzNqCJnbYmroPojdP2tqKSOAt8QAKV/uSZU8851M7B5+fcA== dependencies: - "@jest/transform" "^27.5.1" - "@jest/types" "^27.5.1" + "@jest/transform" "^29.3.1" "@types/babel__core" "^7.1.14" babel-plugin-istanbul "^6.1.1" - babel-preset-jest "^27.5.1" + babel-preset-jest "^29.2.0" chalk "^4.0.0" graceful-fs "^4.2.9" slash "^3.0.0" @@ -931,14 +756,14 @@ babel-plugin-istanbul@^6.1.1: istanbul-lib-instrument "^5.0.4" test-exclude "^6.0.0" -babel-plugin-jest-hoist@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-27.5.1.tgz#9be98ecf28c331eb9f5df9c72d6f89deb8181c2e" - integrity sha512-50wCwD5EMNW4aRpOwtqzyZHIewTYNxLA4nhB+09d8BIssfNfzBRhkBIHiaPv1Si226TQSvp8gxAJm2iY2qs2hQ== +babel-plugin-jest-hoist@^29.2.0: + version "29.2.0" + resolved "https://registry.yarnpkg.com/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-29.2.0.tgz#23ee99c37390a98cfddf3ef4a78674180d823094" + integrity sha512-TnspP2WNiR3GLfCsUNHqeXw0RoQ2f9U5hQ5L3XFpwuO8htQmSrhh8qsB6vi5Yi8+kuynN1yjDjQsPfkebmB6ZA== dependencies: "@babel/template" "^7.3.3" "@babel/types" "^7.3.3" - "@types/babel__core" "^7.0.0" + "@types/babel__core" "^7.1.14" "@types/babel__traverse" "^7.0.6" babel-preset-current-node-syntax@^1.0.0: @@ -959,12 +784,12 @@ babel-preset-current-node-syntax@^1.0.0: "@babel/plugin-syntax-optional-chaining" "^7.8.3" "@babel/plugin-syntax-top-level-await" "^7.8.3" -babel-preset-jest@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/babel-preset-jest/-/babel-preset-jest-27.5.1.tgz#91f10f58034cb7989cb4f962b69fa6eef6a6bc81" - integrity sha512-Nptf2FzlPCWYuJg41HBqXVT8ym6bXOevuCTbhxlUpjwtysGaIWFvDEjp4y+G7fl13FgOdjs7P/DmErqH7da0Ag== +babel-preset-jest@^29.2.0: + version "29.2.0" + resolved "https://registry.yarnpkg.com/babel-preset-jest/-/babel-preset-jest-29.2.0.tgz#3048bea3a1af222e3505e4a767a974c95a7620dc" + integrity sha512-z9JmMJppMxNv8N7fNRHvhMg9cvIkMxQBXgFkane3yKVEvEOP+kB50lk8DFRvF9PGqbyXxlmebKWhuDORO8RgdA== dependencies: - babel-plugin-jest-hoist "^27.5.1" + babel-plugin-jest-hoist "^29.2.0" babel-preset-current-node-syntax "^1.0.0" balanced-match@^1.0.0: @@ -985,28 +810,22 @@ brace-expansion@^1.1.7: balanced-match "^1.0.0" concat-map "0.0.1" -braces@^3.0.1, braces@~3.0.2: +braces@^3.0.2, braces@~3.0.2: version "3.0.2" resolved "https://registry.yarnpkg.com/braces/-/braces-3.0.2.tgz#3454e1a462ee8d599e236df336cd9ea4f8afe107" integrity sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A== dependencies: fill-range "^7.0.1" -browser-process-hrtime@^1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/browser-process-hrtime/-/browser-process-hrtime-1.0.0.tgz#3c9b4b7d782c8121e56f10106d84c0d0ffc94626" - integrity sha512-9o5UecI3GhkpM6DrXr69PblIuWxPKk9Y0jHBRhdocZ2y7YECBFCsHm79Pr3OyR2AvjhDkabFJaDJMYRazHgsow== - -browserslist@^4.17.5: - version "4.19.1" - resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.19.1.tgz#4ac0435b35ab655896c31d53018b6dd5e9e4c9a3" - integrity sha512-u2tbbG5PdKRTUoctO3NBD8FQ5HdPh1ZXPHzp1rwaa5jTc+RV9/+RlWiAIKmjRPQF+xbGM9Kklj5bZQFa2s/38A== +browserslist@^4.21.3: + version "4.21.4" + resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.4.tgz#e7496bbc67b9e39dd0f98565feccdcb0d4ff6987" + integrity sha512-CBHJJdDmgjl3daYjN5Cp5kbTf1mUhZoS+beLklHIvkOWscs83YAhLlF3Wsh/lciQYAcbBJgTOD44VtG31ZM4Hw== dependencies: - caniuse-lite "^1.0.30001286" - electron-to-chromium "^1.4.17" - escalade "^3.1.1" - node-releases "^2.0.1" - picocolors "^1.0.0" + caniuse-lite "^1.0.30001400" + electron-to-chromium "^1.4.251" + node-releases "^2.0.6" + update-browserslist-db "^1.0.9" bser@2.1.1: version "2.1.1" @@ -1031,14 +850,14 @@ camelcase@^5.3.1: integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg== camelcase@^6.2.0: - version "6.2.1" - resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-6.2.1.tgz#250fd350cfd555d0d2160b1d51510eaf8326e86e" - integrity sha512-tVI4q5jjFV5CavAU8DXfza/TJcZutVKo/5Foskmsqcm0MsL91moHvwiGNnqaa2o6PF/7yT5ikDRcVcl8Rj6LCA== + version "6.3.0" + resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-6.3.0.tgz#5685b95eb209ac9c0c177467778c9c84df58ba9a" + integrity sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA== -caniuse-lite@^1.0.30001286: - version "1.0.30001286" - resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001286.tgz#3e9debad420419618cfdf52dc9b6572b28a8fff6" - integrity sha512-zaEMRH6xg8ESMi2eQ3R4eZ5qw/hJiVsO/HlLwniIwErij0JDr9P+8V4dtx1l+kLq6j3yy8l8W4fst1lBnat5wQ== +caniuse-lite@^1.0.30001400: + version "1.0.30001431" + resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001431.tgz#e7c59bd1bc518fae03a4656be442ce6c4887a795" + integrity sha512-zBUoFU0ZcxpvSt9IU66dXVT/3ctO1cy4y9cscs1szkPlcWb6pasYM144GqrUygUbT+k7cmUCW61cvskjcv0enQ== chalk@^2.0.0: version "2.4.2" @@ -1063,9 +882,9 @@ char-regex@^1.0.2: integrity sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw== "chokidar@>=3.0.0 <4.0.0": - version "3.5.2" - resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.2.tgz#dba3976fcadb016f66fd365021d91600d01c1e75" - integrity sha512-ekGhOnNVPgT77r4K/U3GDhu+FQ2S8TnK/s2KbIGXi0SZWuwkZ2QNyfWdZW+TVfn84DpEP7rLeCt2UI6bJ8GwbQ== + version "3.5.3" + resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.3.tgz#1cf37c8707b932bd1af1ae22c0432e2acd1903bd" + integrity sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw== dependencies: anymatch "~3.1.2" braces "~3.0.2" @@ -1078,9 +897,9 @@ char-regex@^1.0.2: fsevents "~2.3.2" ci-info@^3.2.0: - version "3.3.0" - resolved "https://registry.yarnpkg.com/ci-info/-/ci-info-3.3.0.tgz#b4ed1fb6818dea4803a55c623041f9165d2066b2" - integrity sha512-riT/3vI5YpVH6/qomlDnJow6TBee2PBKSEpx3O32EGPYbWGIRsIlGRms3Sm74wYE1JMo8RnO04Hb12+v1J5ICw== + version "3.6.1" + resolved "https://registry.yarnpkg.com/ci-info/-/ci-info-3.6.1.tgz#7594f1c95cb7fdfddee7af95a13af7dbc67afdcf" + integrity sha512-up5ggbaDqOqJ4UqLKZ2naVkyqSJQgJi5lwD6b6mM748ysrghDBX0bx/qJTUHzw7zu6Mq4gycviSF5hJnwceD8w== cjs-module-lexer@^1.0.0: version "1.2.2" @@ -1094,19 +913,19 @@ clap@^3.0.0: dependencies: ansi-colors "^4.1.1" -cliui@^7.0.2: - version "7.0.4" - resolved "https://registry.yarnpkg.com/cliui/-/cliui-7.0.4.tgz#a0265ee655476fc807aea9df3df8df7783808b4f" - integrity sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ== +cliui@^8.0.1: + version "8.0.1" + resolved "https://registry.yarnpkg.com/cliui/-/cliui-8.0.1.tgz#0c04b075db02cbfe60dc8e6cf2f5486b1a3608aa" + integrity sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ== dependencies: string-width "^4.2.0" - strip-ansi "^6.0.0" + strip-ansi "^6.0.1" wrap-ansi "^7.0.0" co@^4.6.0: version "4.6.0" resolved "https://registry.yarnpkg.com/co/-/co-4.6.0.tgz#6ea6bdf3d853ae54ccb8e47bfa0bf3f9031fb184" - integrity sha1-bqa989hTrlTMuOR7+gvz+QMfsYQ= + integrity sha512-QVb0dM5HvG+uaxitm8wONl7jltx8dqhfU33DcqtOZcLSVIKSDDLDi7+0LbAKiyI8hD9u42m2YxXSkMGWThaecQ== collect-v8-coverage@^1.0.0: version "1.0.1" @@ -1130,31 +949,27 @@ color-convert@^2.0.1: color-name@1.1.3: version "1.1.3" resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25" - integrity sha1-p9BVi9icQveV3UIyj3QIMcpTvCU= + integrity sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw== color-name@~1.1.4: version "1.1.4" resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2" integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA== -combined-stream@^1.0.8: - version "1.0.8" - resolved "https://registry.yarnpkg.com/combined-stream/-/combined-stream-1.0.8.tgz#c3d45a8b34fd730631a110a8a2520682b31d5a7f" - integrity sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg== - dependencies: - delayed-stream "~1.0.0" - concat-map@0.0.1: version "0.0.1" resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b" - integrity sha1-2Klr13/Wjfd5OnMDajug1UBdR3s= + integrity sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg== -convert-source-map@^1.4.0, convert-source-map@^1.6.0, convert-source-map@^1.7.0: - version "1.8.0" - resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.8.0.tgz#f3373c32d21b4d780dd8004514684fb791ca4369" - integrity sha512-+OQdjP49zViI/6i7nIJpA8rAl4sV/JdPfU9nZs3VqOwGIgizICvuN2ru6fMd+4llL0tar18UYJXfZ/TWtmhUjA== - dependencies: - safe-buffer "~5.1.1" +convert-source-map@^1.6.0, convert-source-map@^1.7.0: + version "1.9.0" + resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.9.0.tgz#7faae62353fb4213366d0ca98358d22e8368b05f" + integrity sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A== + +convert-source-map@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-2.0.0.tgz#4b560f649fc4e918dd0ab75cf4961e8bc882d82a" + integrity sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg== cross-spawn@^7.0.3: version "7.0.3" @@ -1166,11 +981,11 @@ cross-spawn@^7.0.3: which "^2.0.1" css-tree@^2.0.2: - version "2.1.0" - resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-2.1.0.tgz#170e27ccf94e7c5facb183765c25898be843d1d2" - integrity sha512-PcysZRzToBbrpoUrZ9qfblRIRf8zbEAkU0AIpQFtgkFK0vSbzOmBCvdSAx2Zg7Xx5wiYJKUKk0NMP7kxevie/A== + version "2.2.1" + resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-2.2.1.tgz#36115d382d60afd271e377f9c5f67d02bd48c032" + integrity sha512-OA0mILzGc1kCOCSJerOeqDxDQ4HOh+G8NbOJFOTgOCzpw7fCBubk0fEyxp8AgOL/jvLgYA/uV0cMbe43ElF1JA== dependencies: - mdn-data "2.0.27" + mdn-data "2.0.28" source-map-js "^1.0.1" css@^3.0.0: @@ -1182,23 +997,6 @@ css@^3.0.0: source-map "^0.6.1" source-map-resolve "^0.6.0" -cssom@^0.4.4: - version "0.4.4" - resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.4.4.tgz#5a66cf93d2d0b661d80bf6a44fb65f5c2e4e0a10" - integrity sha512-p3pvU7r1MyyqbTk+WbNJIgJjG2VmTIaB10rI93LzVPrmDJKkzKYMtxxyAvQXR/NS6otuzveI7+7BBq3SjBS2mw== - -cssom@~0.3.6: - version "0.3.8" - resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.3.8.tgz#9f1276f5b2b463f2114d3f2c75250af8c1a36f4a" - integrity sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg== - -cssstyle@^2.3.0: - version "2.3.0" - resolved "https://registry.yarnpkg.com/cssstyle/-/cssstyle-2.3.0.tgz#ff665a0ddbdc31864b09647f34163443d90b0852" - integrity sha512-AZL67abkUzIuvcHqk7c09cezpGNcxUxU4Ioi/05xHk4DQeTkWmGYftIE6ctU6AEt+Gn4n1lDStOtj7FKycP71A== - dependencies: - cssom "~0.3.6" - csstree-validator@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/csstree-validator/-/csstree-validator-3.0.0.tgz#041579bf815d88b0a72452453605b32b2a1f422f" @@ -1208,52 +1006,28 @@ csstree-validator@^3.0.0: css-tree "^2.0.2" resolve "^1.20.0" -data-urls@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/data-urls/-/data-urls-2.0.0.tgz#156485a72963a970f5d5821aaf642bef2bf2db9b" - integrity sha512-X5eWTSXO/BJmpdIKCRuKUgSCgAN0OwliVK3yPKbwIWU1Tdw5BRajxlzMidvh+gwko9AfQ9zIj52pzF91Q3YAvQ== - dependencies: - abab "^2.0.3" - whatwg-mimetype "^2.3.0" - whatwg-url "^8.0.0" - -debug@4, debug@^4.1.0, debug@^4.1.1: - version "4.3.3" - resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.3.tgz#04266e0b70a98d4462e6e288e38259213332b664" - integrity sha512-/zxw5+vh1Tfv+4Qn7a5nsbcJKPaSvCDhojn6FEl9vupwK2VCSDtEiEtqr8DFtzYFOdz63LBkxec7DYuc2jon6Q== +debug@^4.1.0, debug@^4.1.1: + version "4.3.4" + resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865" + integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ== dependencies: ms "2.1.2" -decimal.js@^10.2.1: - version "10.3.1" - resolved "https://registry.yarnpkg.com/decimal.js/-/decimal.js-10.3.1.tgz#d8c3a444a9c6774ba60ca6ad7261c3a94fd5e783" - integrity sha512-V0pfhfr8suzyPGOx3nmq4aHqabehUZn6Ch9kyFpV79TGDTWFmHqUqXdabR7QHqxzrYolF4+tVmJhUG4OURg5dQ== - decode-uri-component@^0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/decode-uri-component/-/decode-uri-component-0.2.0.tgz#eb3913333458775cb84cd1a1fae062106bb87545" - integrity sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU= + integrity sha512-hjf+xovcEn31w/EUYdTXQh/8smFL/dzYjohQGEIgjyNavaJfBY2p5F527Bo1VPATxv0VYTUC2bOcXvqFwk78Og== dedent@^0.7.0: version "0.7.0" resolved "https://registry.yarnpkg.com/dedent/-/dedent-0.7.0.tgz#2495ddbaf6eb874abb0e1be9df22d2e5a544326c" - integrity sha1-JJXduvbrh0q7Dhvp3yLS5aVEMmw= - -deep-is@~0.1.3: - version "0.1.4" - resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.4.tgz#a6f2dce612fadd2ef1f519b73551f17e85199831" - integrity sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ== + integrity sha512-Q6fKUPqnAHAyhiUgFU7BUzLiv0kd8saH9al7tnu5Q/okj6dnupxyTgFIBjVzJATdfIAm9NAsvXNzjaKa+bxVyA== deepmerge@^4.2.2: version "4.2.2" resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-4.2.2.tgz#44d2ea3679b8f4d4ffba33f03d865fc1e7bf4955" integrity sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg== -delayed-stream@~1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619" - integrity sha1-3zrhmayt+31ECqrgsp4icrJOxhk= - detect-newline@^3.0.0: version "3.1.0" resolved "https://registry.yarnpkg.com/detect-newline/-/detect-newline-3.1.0.tgz#576f5dfc63ae1a192ff192d8ad3af6308991b651" @@ -1264,22 +1038,20 @@ diff-sequences@^27.5.1: resolved "https://registry.yarnpkg.com/diff-sequences/-/diff-sequences-27.5.1.tgz#eaecc0d327fd68c8d9672a1e64ab8dccb2ef5327" integrity sha512-k1gCAXAsNgLwEL+Y8Wvl+M6oEFj5bgazfZULpS5CneoPPXRaCCW7dm+q21Ky2VEE5X+VeRDBVg1Pcvvsr4TtNQ== -domexception@^2.0.1: - version "2.0.1" - resolved "https://registry.yarnpkg.com/domexception/-/domexception-2.0.1.tgz#fb44aefba793e1574b0af6aed2801d057529f304" - integrity sha512-yxJ2mFy/sibVQlu5qHjOkf9J3K6zgmCxgJ94u2EdvDOV09H+32LtRswEcUsmUWN72pVLOEnTSRaIVVzVQgS0dg== - dependencies: - webidl-conversions "^5.0.0" +diff-sequences@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/diff-sequences/-/diff-sequences-29.3.1.tgz#104b5b95fe725932421a9c6e5b4bef84c3f2249e" + integrity sha512-hlM3QR272NXCi4pq+N4Kok4kOp6EsgOM3ZSpJI7Da3UAs+Ttsi8MRmB6trM/lhyzUxGfOgnpkHtgqm5Q/CTcfQ== -electron-to-chromium@^1.4.17: - version "1.4.18" - resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.18.tgz#2fb282213937986a20a653315963070e8321b3f3" - integrity sha512-i7nKjGGBE1+YUIbfLObA1EZPmN7J1ITEllbhusDk+KIk6V6gUxN9PFe36v+Sd+8Cg0k3cgUv9lQhQZalr8rggw== +electron-to-chromium@^1.4.251: + version "1.4.284" + resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.284.tgz#61046d1e4cab3a25238f6bf7413795270f125592" + integrity sha512-M8WEXFuKXMYMVr45fo8mq0wUrrJHheiKZf6BArTKk9ZBYCKJEOU5H8cdWgDT+qCVZf7Na4lVUaZsA+h6uA9+PA== -emittery@^0.8.1: - version "0.8.1" - resolved "https://registry.yarnpkg.com/emittery/-/emittery-0.8.1.tgz#bb23cc86d03b30aa75a7f734819dee2e1ba70860" - integrity sha512-uDfvUjVrfGJJhymx/kz6prltenw1u7WrCg1oa94zYY8xxVpLLUu045LAT0dhDZdXG58/EpPL/5kA180fQ/qudg== +emittery@^0.13.1: + version "0.13.1" + resolved "https://registry.yarnpkg.com/emittery/-/emittery-0.13.1.tgz#c04b8c3457490e0847ae51fced3af52d338e3dad" + integrity sha512-DeWwawk6r5yR9jFgnDKYt4sLS0LmHJJi3ZOnb5/JdbYwj3nW+FxQnHIjhBKz8YLC7oRNPVM9NQ47I3CVx34eqQ== emoji-regex@^8.0.0: version "8.0.0" @@ -1301,40 +1073,18 @@ escalade@^3.1.1: escape-string-regexp@^1.0.5: version "1.0.5" resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4" - integrity sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ= + integrity sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg== escape-string-regexp@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz#a30304e99daa32e23b2fd20f51babd07cffca344" integrity sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w== -escodegen@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/escodegen/-/escodegen-2.0.0.tgz#5e32b12833e8aa8fa35e1bf0befa89380484c7dd" - integrity sha512-mmHKys/C8BFUGI+MAWNcSYoORYLMdPzjrknd2Vc+bUsjN5bXcr8EhrNB+UTqfL1y3I9c4fw2ihgtMPQLBRiQxw== - dependencies: - esprima "^4.0.1" - estraverse "^5.2.0" - esutils "^2.0.2" - optionator "^0.8.1" - optionalDependencies: - source-map "~0.6.1" - -esprima@^4.0.0, esprima@^4.0.1: +esprima@^4.0.0: version "4.0.1" resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.1.tgz#13b04cdb3e6c5d19df91ab6987a8695619b0aa71" integrity sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A== -estraverse@^5.2.0: - version "5.3.0" - resolved "https://registry.yarnpkg.com/estraverse/-/estraverse-5.3.0.tgz#2eea5290702f26ab8fe5370370ff86c965d21123" - integrity sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA== - -esutils@^2.0.2: - version "2.0.3" - resolved "https://registry.yarnpkg.com/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64" - integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g== - execa@^5.0.0: version "5.1.1" resolved "https://registry.yarnpkg.com/execa/-/execa-5.1.1.tgz#f80ad9cbf4298f7bd1d4c9555c21e93741c411dd" @@ -1353,22 +1103,23 @@ execa@^5.0.0: exit@^0.1.2: version "0.1.2" resolved "https://registry.yarnpkg.com/exit/-/exit-0.1.2.tgz#0632638f8d877cc82107d30a0fff1a17cba1cd0c" - integrity sha1-BjJjj42HfMghB9MKD/8aF8uhzQw= + integrity sha512-Zk/eNKV2zbjpKzrsQ+n1G6poVbErQxJ0LBOJXaKZ1EViLzH+hrLu9cdXI4zw9dBQJslwBEpbQ2P1oS7nDxs6jQ== -expect@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/expect/-/expect-27.5.1.tgz#83ce59f1e5bdf5f9d2b94b61d2050db48f3fef74" - integrity sha512-E1q5hSUG2AmYQwQJ041nvgpkODHQvB+RKlB4IYdru6uJsyFTRyZAP463M+1lINorwbqAmUggi6+WwkD8lCS/Dw== +expect@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/expect/-/expect-29.3.1.tgz#92877aad3f7deefc2e3f6430dd195b92295554a6" + integrity sha512-gGb1yTgU30Q0O/tQq+z30KBWv24ApkMgFUpvKBkyLUBL68Wv8dHdJxTBZFl/iT8K/bqDHvUYRH6IIN3rToopPA== dependencies: - "@jest/types" "^27.5.1" - jest-get-type "^27.5.1" - jest-matcher-utils "^27.5.1" - jest-message-util "^27.5.1" + "@jest/expect-utils" "^29.3.1" + jest-get-type "^29.2.0" + jest-matcher-utils "^29.3.1" + jest-message-util "^29.3.1" + jest-util "^29.3.1" -fast-glob@^3.2.11: - version "3.2.11" - resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.2.11.tgz#a1172ad95ceb8a16e20caa5c5e56480e5129c1d9" - integrity sha512-xrO3+1bxSo3ZVHAnqzyuewYT6aMFHRAd4Kcs92MAonjwQZLsK9d0SF1IyQ3k5PoirxTW0Oe/RqFgMQ6TcNE5Ew== +fast-glob@^3.2.12: + version "3.2.12" + resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.2.12.tgz#7f39ec99c2e6ab030337142da9e0c18f37afae80" + integrity sha512-DVj4CQIYYow0BlaelwK1pHl5n5cRSJfM60UA0zK891sVInoPri2Ekj7+e1CT3/3qxXenpI+nBBmQAcJPJgaj4w== dependencies: "@nodelib/fs.stat" "^2.0.2" "@nodelib/fs.walk" "^1.2.3" @@ -1376,16 +1127,11 @@ fast-glob@^3.2.11: merge2 "^1.3.0" micromatch "^4.0.4" -fast-json-stable-stringify@^2.0.0: +fast-json-stable-stringify@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz#874bf69c6f404c2b5d99c481341399fd55892633" integrity sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw== -fast-levenshtein@~2.0.6: - version "2.0.6" - resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917" - integrity sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc= - fastq@^1.6.0: version "1.13.0" resolved "https://registry.yarnpkg.com/fastq/-/fastq-1.13.0.tgz#616760f88a7526bdfc596b7cab8c18938c36b98c" @@ -1394,9 +1140,9 @@ fastq@^1.6.0: reusify "^1.0.4" fb-watchman@^2.0.0: - version "2.0.1" - resolved "https://registry.yarnpkg.com/fb-watchman/-/fb-watchman-2.0.1.tgz#fc84fb39d2709cf3ff6d743706157bb5708a8a85" - integrity sha512-DkPJKQeY6kKwmuMretBhr7G6Vodr7bFwDYTXIkfG1gjvNpaxBTQV3PbXg6bR1c1UP4jPOX0jHUbbHANL9vRjVg== + version "2.0.2" + resolved "https://registry.yarnpkg.com/fb-watchman/-/fb-watchman-2.0.2.tgz#e9524ee6b5c77e9e5001af0f85f3adbb8623255c" + integrity sha512-p5161BqbuCaSnB8jIbzQHOlpgsPmK5rJVDfDKO91Axs5NC1uu3HRQm6wt9cd9/+GtQQIO53JdGXXoyDpTAsgYA== dependencies: bser "2.1.1" @@ -1415,19 +1161,10 @@ find-up@^4.0.0, find-up@^4.1.0: locate-path "^5.0.0" path-exists "^4.0.0" -form-data@^3.0.0: - version "3.0.1" - resolved "https://registry.yarnpkg.com/form-data/-/form-data-3.0.1.tgz#ebd53791b78356a99af9a300d4282c4d5eb9755f" - integrity sha512-RHkBKtLWUVwd7SqRIvCZMEvAMoGUp0XU+seQiZejj0COz3RI3hWP4sCv3gZWWLjJTd7rGwcsF5eKZGii0r/hbg== - dependencies: - asynckit "^0.4.0" - combined-stream "^1.0.8" - mime-types "^2.1.12" - fs.realpath@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/fs.realpath/-/fs.realpath-1.0.0.tgz#1504ad2523158caa40db4a2787cb01411994ea4f" - integrity sha1-FQStJSMVjKpA20onh8sBQRmU6k8= + integrity sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw== fsevents@^2.3.2, fsevents@~2.3.2: version "2.3.2" @@ -1466,15 +1203,15 @@ glob-parent@^5.1.2, glob-parent@~5.1.2: dependencies: is-glob "^4.0.1" -glob@^7.1.1, glob@^7.1.2, glob@^7.1.3, glob@^7.1.4: - version "7.2.0" - resolved "https://registry.yarnpkg.com/glob/-/glob-7.2.0.tgz#d15535af7732e02e948f4c41628bd910293f6023" - integrity sha512-lmLf6gtyrPq8tTjSmrO94wBeQbFR3HbLHbuyD69wuyQkImp2hWqMGB47OX65FBkPffO641IP9jWa1z4ivqG26Q== +glob@^7.1.3, glob@^7.1.4: + version "7.2.3" + resolved "https://registry.yarnpkg.com/glob/-/glob-7.2.3.tgz#b8df0fb802bbfa8e89bd1d938b4e16578ed44f2b" + integrity sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q== dependencies: fs.realpath "^1.0.0" inflight "^1.0.4" inherits "2" - minimatch "^3.0.4" + minimatch "^3.1.1" once "^1.3.0" path-is-absolute "^1.0.0" @@ -1484,14 +1221,14 @@ globals@^11.1.0: integrity sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA== graceful-fs@^4.2.9: - version "4.2.9" - resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.9.tgz#041b05df45755e587a24942279b9d113146e1c96" - integrity sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ== + version "4.2.10" + resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.10.tgz#147d3a006da4ca3ce14728c7aefc287c367d7a6c" + integrity sha512-9ByhssR2fPVsNZj478qUUbKfmL0+t5BDVyjShtyZZLiK7ZDAArFFfopyOTj0M05wE2tJPisA4iTnnXl2YoPvOA== has-flag@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd" - integrity sha1-tdRU3CGZriJWmfNGfloH87lVuv0= + integrity sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw== has-flag@^4.0.0: version "4.0.0" @@ -1505,56 +1242,25 @@ has@^1.0.3: dependencies: function-bind "^1.1.1" -html-encoding-sniffer@^2.0.1: - version "2.0.1" - resolved "https://registry.yarnpkg.com/html-encoding-sniffer/-/html-encoding-sniffer-2.0.1.tgz#42a6dc4fd33f00281176e8b23759ca4e4fa185f3" - integrity sha512-D5JbOMBIR/TVZkubHT+OyT2705QvogUW4IBn6nHd756OwieSF9aDYFj4dv6HHEVGYbHaLETa3WggZYWWMyy3ZQ== - dependencies: - whatwg-encoding "^1.0.5" - html-escaper@^2.0.0: version "2.0.2" resolved "https://registry.yarnpkg.com/html-escaper/-/html-escaper-2.0.2.tgz#dfd60027da36a36dfcbe236262c00a5822681453" integrity sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg== -http-proxy-agent@^4.0.1: - version "4.0.1" - resolved "https://registry.yarnpkg.com/http-proxy-agent/-/http-proxy-agent-4.0.1.tgz#8a8c8ef7f5932ccf953c296ca8291b95aa74aa3a" - integrity sha512-k0zdNgqWTGA6aeIRVpvfVob4fL52dTfaehylg0Y4UvSySvOq/Y+BOyPrgpUrA7HylqvU8vIZGsRuXmspskV0Tg== - dependencies: - "@tootallnate/once" "1" - agent-base "6" - debug "4" - -https-proxy-agent@^5.0.0: - version "5.0.0" - resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-5.0.0.tgz#e2a90542abb68a762e0a0850f6c9edadfd8506b2" - integrity sha512-EkYm5BcKUGiduxzSt3Eppko+PiNWNEpa4ySk9vTC6wDsQJW9rHSa+UhGNJoRYp7bz6Ht1eaRIa6QaJqO5rCFbA== - dependencies: - agent-base "6" - debug "4" - human-signals@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/human-signals/-/human-signals-2.1.0.tgz#dc91fcba42e4d06e4abaed33b3e7a3c02f514ea0" integrity sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw== -iconv-lite@0.4.24: - version "0.4.24" - resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b" - integrity sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA== - dependencies: - safer-buffer ">= 2.1.2 < 3" - immutable@^4.0.0: - version "4.0.0" - resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.0.0.tgz#b86f78de6adef3608395efb269a91462797e2c23" - integrity sha512-zIE9hX70qew5qTUjSS7wi1iwj/l7+m54KWU247nhM3v806UdGj1yDndXj+IOYxxtW9zyLI+xqFNZjTuDaLUqFw== + version "4.1.0" + resolved "https://registry.yarnpkg.com/immutable/-/immutable-4.1.0.tgz#f795787f0db780183307b9eb2091fcac1f6fafef" + integrity sha512-oNkuqVTA8jqG1Q6c+UglTOD1xhC1BtjKI7XkCXRkZHrN5m18/XsnUp8Q89GkQO/z+0WjonSvl0FLhDYftp46nQ== import-local@^3.0.2: - version "3.0.3" - resolved "https://registry.yarnpkg.com/import-local/-/import-local-3.0.3.tgz#4d51c2c495ca9393da259ec66b62e022920211e0" - integrity sha512-bE9iaUY3CXH8Cwfan/abDKAxe1KGT9kyGsBPqf6DMK/z0a2OzAsrukeYNgIH6cH5Xr452jb1TUL8rSfCLjZ9uA== + version "3.1.0" + resolved "https://registry.yarnpkg.com/import-local/-/import-local-3.1.0.tgz#b4479df8a5fd44f6cdce24070675676063c95cb4" + integrity sha512-ASB07uLtnDs1o6EHjKpX34BKYDSqnFerfTOJL2HvMqF70LnxpjkzDB8J44oT9pu4AMPkQwf8jl6szgvNd2tRIg== dependencies: pkg-dir "^4.2.0" resolve-cwd "^3.0.0" @@ -1562,12 +1268,12 @@ import-local@^3.0.2: imurmurhash@^0.1.4: version "0.1.4" resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea" - integrity sha1-khi5srkoojixPcT7a21XbyMUU+o= + integrity sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA== inflight@^1.0.4: version "1.0.6" resolved "https://registry.yarnpkg.com/inflight/-/inflight-1.0.6.tgz#49bd6331d7d02d0c09bc910a1075ba8165b56df9" - integrity sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk= + integrity sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA== dependencies: once "^1.3.0" wrappy "1" @@ -1580,7 +1286,7 @@ inherits@2, inherits@^2.0.4: is-arrayish@^0.2.1: version "0.2.1" resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d" - integrity sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0= + integrity sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg== is-binary-path@~2.1.0: version "2.1.0" @@ -1589,17 +1295,17 @@ is-binary-path@~2.1.0: dependencies: binary-extensions "^2.0.0" -is-core-module@^2.2.0: - version "2.8.0" - resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.8.0.tgz#0321336c3d0925e497fd97f5d95cb114a5ccd548" - integrity sha512-vd15qHsaqrRL7dtH6QNuy0ndJmRDrS9HAM1CAiSifNUFv4x1a0CCVsj18hJ1mShxIG6T2i1sO78MkP56r0nYRw== +is-core-module@^2.9.0: + version "2.11.0" + resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.11.0.tgz#ad4cb3e3863e814523c96f3f58d26cc570ff0144" + integrity sha512-RRjxlvLDkD1YJwDbroBHMb+cukurkDWNyHx7D3oNB5x9rb5ogcksMC5wHCadcXoo67gVr/+3GFySh3134zi6rw== dependencies: has "^1.0.3" is-extglob@^2.1.1: version "2.1.1" resolved "https://registry.yarnpkg.com/is-extglob/-/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2" - integrity sha1-qIwCU1eR8C7TfHahueqXc8gz+MI= + integrity sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ== is-fullwidth-code-point@^3.0.0: version "3.0.0" @@ -1623,25 +1329,15 @@ is-number@^7.0.0: resolved "https://registry.yarnpkg.com/is-number/-/is-number-7.0.0.tgz#7535345b896734d5f80c4d06c50955527a14f12b" integrity sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng== -is-potential-custom-element-name@^1.0.1: - version "1.0.1" - resolved "https://registry.yarnpkg.com/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz#171ed6f19e3ac554394edf78caa05784a45bebb5" - integrity sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ== - is-stream@^2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-2.0.1.tgz#fac1e3d53b97ad5a9d0ae9cef2389f5810a5c077" integrity sha512-hFoiJiTl63nn+kstHGBtewWSKnQLpyb155KHheA1l39uvtO9nWIop1p3udqPcUd/xbF1VLMO4n7OI6p7RbngDg== -is-typedarray@^1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/is-typedarray/-/is-typedarray-1.0.0.tgz#e479c80858df0c1b11ddda6940f96011fcda4a9a" - integrity sha1-5HnICFjfDBsR3dppQPlgEfzaSpo= - isexe@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/isexe/-/isexe-2.0.0.tgz#e8fbf374dc556ff8947a10dcb0572d633f2cfa10" - integrity sha1-6PvzdNxVb/iUehDcsFctYz8s+hA= + integrity sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw== istanbul-lib-coverage@^3.0.0, istanbul-lib-coverage@^3.2.0: version "3.2.0" @@ -1649,9 +1345,9 @@ istanbul-lib-coverage@^3.0.0, istanbul-lib-coverage@^3.2.0: integrity sha512-eOeJ5BHCmHYvQK7xt9GkdHuzuCGS1Y6g9Gvnx3Ym33fz/HpLRYxiS0wHNr+m/MBC8B647Xt608vCDEvhl9c6Mw== istanbul-lib-instrument@^5.0.4, istanbul-lib-instrument@^5.1.0: - version "5.1.0" - resolved "https://registry.yarnpkg.com/istanbul-lib-instrument/-/istanbul-lib-instrument-5.1.0.tgz#7b49198b657b27a730b8e9cb601f1e1bff24c59a" - integrity sha512-czwUz525rkOFDJxfKK6mYfIs9zBKILyrZQxjz3ABhjQXhbhFsSbo1HW/BFcsDnfJYJWA6thRR5/TUY2qs5W99Q== + version "5.2.1" + resolved "https://registry.yarnpkg.com/istanbul-lib-instrument/-/istanbul-lib-instrument-5.2.1.tgz#d10c8885c2125574e1c231cacadf955675e1ce3d" + integrity sha512-pzqtp31nLv/XFOzXGuvhCb8qhjmTVo5vjVk19XE4CRlSWz0KoeJ3bw9XsA7nOp9YBf4qHjwBxkDzKcME/J29Yg== dependencies: "@babel/core" "^7.12.3" "@babel/parser" "^7.14.7" @@ -1678,92 +1374,89 @@ istanbul-lib-source-maps@^4.0.0: source-map "^0.6.1" istanbul-reports@^3.1.3: - version "3.1.4" - resolved "https://registry.yarnpkg.com/istanbul-reports/-/istanbul-reports-3.1.4.tgz#1b6f068ecbc6c331040aab5741991273e609e40c" - integrity sha512-r1/DshN4KSE7xWEknZLLLLDn5CJybV3nw01VTkp6D5jzLuELlcbudfj/eSQFvrKsJuTVCGnePO7ho82Nw9zzfw== + version "3.1.5" + resolved "https://registry.yarnpkg.com/istanbul-reports/-/istanbul-reports-3.1.5.tgz#cc9a6ab25cb25659810e4785ed9d9fb742578bae" + integrity sha512-nUsEMa9pBt/NOHqbcbeJEgqIlY/K7rVWUX6Lql2orY5e9roQOthbR3vtY4zzf2orPELg80fnxxk9zUyPlgwD1w== dependencies: html-escaper "^2.0.0" istanbul-lib-report "^3.0.0" -jest-changed-files@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-changed-files/-/jest-changed-files-27.5.1.tgz#a348aed00ec9bf671cc58a66fcbe7c3dfd6a68f5" - integrity sha512-buBLMiByfWGCoMsLLzGUUSpAmIAGnbR2KJoMN10ziLhOLvP4e0SlypHnAel8iqQXTrcbmfEY9sSqae5sgUsTvw== +jest-changed-files@^29.2.0: + version "29.2.0" + resolved "https://registry.yarnpkg.com/jest-changed-files/-/jest-changed-files-29.2.0.tgz#b6598daa9803ea6a4dce7968e20ab380ddbee289" + integrity sha512-qPVmLLyBmvF5HJrY7krDisx6Voi8DmlV3GZYX0aFNbaQsZeoz1hfxcCMbqDGuQCxU1dJy9eYc2xscE8QrCCYaA== dependencies: - "@jest/types" "^27.5.1" execa "^5.0.0" - throat "^6.0.1" + p-limit "^3.1.0" -jest-circus@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-circus/-/jest-circus-27.5.1.tgz#37a5a4459b7bf4406e53d637b49d22c65d125ecc" - integrity sha512-D95R7x5UtlMA5iBYsOHFFbMD/GVA4R/Kdq15f7xYWUfWHBto9NYRsOvnSauTgdF+ogCpJ4tyKOXhUifxS65gdw== +jest-circus@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-circus/-/jest-circus-29.3.1.tgz#177d07c5c0beae8ef2937a67de68f1e17bbf1b4a" + integrity sha512-wpr26sEvwb3qQQbdlmei+gzp6yoSSoSL6GsLPxnuayZSMrSd5Ka7IjAvatpIernBvT2+Ic6RLTg+jSebScmasg== dependencies: - "@jest/environment" "^27.5.1" - "@jest/test-result" "^27.5.1" - "@jest/types" "^27.5.1" + "@jest/environment" "^29.3.1" + "@jest/expect" "^29.3.1" + "@jest/test-result" "^29.3.1" + "@jest/types" "^29.3.1" "@types/node" "*" chalk "^4.0.0" co "^4.6.0" dedent "^0.7.0" - expect "^27.5.1" is-generator-fn "^2.0.0" - jest-each "^27.5.1" - jest-matcher-utils "^27.5.1" - jest-message-util "^27.5.1" - jest-runtime "^27.5.1" - jest-snapshot "^27.5.1" - jest-util "^27.5.1" - pretty-format "^27.5.1" + jest-each "^29.3.1" + jest-matcher-utils "^29.3.1" + jest-message-util "^29.3.1" + jest-runtime "^29.3.1" + jest-snapshot "^29.3.1" + jest-util "^29.3.1" + p-limit "^3.1.0" + pretty-format "^29.3.1" slash "^3.0.0" stack-utils "^2.0.3" - throat "^6.0.1" -jest-cli@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-cli/-/jest-cli-27.5.1.tgz#278794a6e6458ea8029547e6c6cbf673bd30b145" - integrity sha512-Hc6HOOwYq4/74/c62dEE3r5elx8wjYqxY0r0G/nFrLDPMFRu6RA/u8qINOIkvhxG7mMQ5EJsOGfRpI8L6eFUVw== +jest-cli@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-cli/-/jest-cli-29.3.1.tgz#e89dff427db3b1df50cea9a393ebd8640790416d" + integrity sha512-TO/ewvwyvPOiBBuWZ0gm04z3WWP8TIK8acgPzE4IxgsLKQgb377NYGrQLc3Wl/7ndWzIH2CDNNsUjGxwLL43VQ== dependencies: - "@jest/core" "^27.5.1" - "@jest/test-result" "^27.5.1" - "@jest/types" "^27.5.1" + "@jest/core" "^29.3.1" + "@jest/test-result" "^29.3.1" + "@jest/types" "^29.3.1" chalk "^4.0.0" exit "^0.1.2" graceful-fs "^4.2.9" import-local "^3.0.2" - jest-config "^27.5.1" - jest-util "^27.5.1" - jest-validate "^27.5.1" + jest-config "^29.3.1" + jest-util "^29.3.1" + jest-validate "^29.3.1" prompts "^2.0.1" - yargs "^16.2.0" + yargs "^17.3.1" -jest-config@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-config/-/jest-config-27.5.1.tgz#5c387de33dca3f99ad6357ddeccd91bf3a0e4a41" - integrity sha512-5sAsjm6tGdsVbW9ahcChPAFCk4IlkQUknH5AvKjuLTSlcO/wCZKyFdn7Rg0EkC+OGgWODEy2hDpWB1PgzH0JNA== +jest-config@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-config/-/jest-config-29.3.1.tgz#0bc3dcb0959ff8662957f1259947aedaefb7f3c6" + integrity sha512-y0tFHdj2WnTEhxmGUK1T7fgLen7YK4RtfvpLFBXfQkh2eMJAQq24Vx9472lvn5wg0MAO6B+iPfJfzdR9hJYalg== dependencies: - "@babel/core" "^7.8.0" - "@jest/test-sequencer" "^27.5.1" - "@jest/types" "^27.5.1" - babel-jest "^27.5.1" + "@babel/core" "^7.11.6" + "@jest/test-sequencer" "^29.3.1" + "@jest/types" "^29.3.1" + babel-jest "^29.3.1" chalk "^4.0.0" ci-info "^3.2.0" deepmerge "^4.2.2" - glob "^7.1.1" + glob "^7.1.3" graceful-fs "^4.2.9" - jest-circus "^27.5.1" - jest-environment-jsdom "^27.5.1" - jest-environment-node "^27.5.1" - jest-get-type "^27.5.1" - jest-jasmine2 "^27.5.1" - jest-regex-util "^27.5.1" - jest-resolve "^27.5.1" - jest-runner "^27.5.1" - jest-util "^27.5.1" - jest-validate "^27.5.1" + jest-circus "^29.3.1" + jest-environment-node "^29.3.1" + jest-get-type "^29.2.0" + jest-regex-util "^29.2.0" + jest-resolve "^29.3.1" + jest-runner "^29.3.1" + jest-util "^29.3.1" + jest-validate "^29.3.1" micromatch "^4.0.4" parse-json "^5.2.0" - pretty-format "^27.5.1" + pretty-format "^29.3.1" slash "^3.0.0" strip-json-comments "^3.1.1" @@ -1777,318 +1470,299 @@ jest-diff@^27.5.1: jest-get-type "^27.5.1" pretty-format "^27.5.1" -jest-docblock@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-27.5.1.tgz#14092f364a42c6108d42c33c8cf30e058e25f6c0" - integrity sha512-rl7hlABeTsRYxKiUfpHrQrG4e2obOiTQWfMEH3PxPjOtdsfLQO4ReWSZaQ7DETm4xu07rl4q/h4zcKXyU0/OzQ== +jest-diff@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-diff/-/jest-diff-29.3.1.tgz#d8215b72fed8f1e647aed2cae6c752a89e757527" + integrity sha512-vU8vyiO7568tmin2lA3r2DP8oRvzhvRcD4DjpXc6uGveQodyk7CKLhQlCSiwgx3g0pFaE88/KLZ0yaTWMc4Uiw== + dependencies: + chalk "^4.0.0" + diff-sequences "^29.3.1" + jest-get-type "^29.2.0" + pretty-format "^29.3.1" + +jest-docblock@^29.2.0: + version "29.2.0" + resolved "https://registry.yarnpkg.com/jest-docblock/-/jest-docblock-29.2.0.tgz#307203e20b637d97cee04809efc1d43afc641e82" + integrity sha512-bkxUsxTgWQGbXV5IENmfiIuqZhJcyvF7tU4zJ/7ioTutdz4ToB5Yx6JOFBpgI+TphRY4lhOyCWGNH/QFQh5T6A== dependencies: detect-newline "^3.0.0" -jest-each@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-each/-/jest-each-27.5.1.tgz#5bc87016f45ed9507fed6e4702a5b468a5b2c44e" - integrity sha512-1Ff6p+FbhT/bXQnEouYy00bkNSY7OUpfIcmdl8vZ31A1UUaurOLPA8a8BbJOF2RDUElwJhmeaV7LnagI+5UwNQ== +jest-each@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-each/-/jest-each-29.3.1.tgz#bc375c8734f1bb96625d83d1ca03ef508379e132" + integrity sha512-qrZH7PmFB9rEzCSl00BWjZYuS1BSOH8lLuC0azQE9lQrAx3PWGKHTDudQiOSwIy5dGAJh7KA0ScYlCP7JxvFYA== dependencies: - "@jest/types" "^27.5.1" + "@jest/types" "^29.3.1" chalk "^4.0.0" - jest-get-type "^27.5.1" - jest-util "^27.5.1" - pretty-format "^27.5.1" + jest-get-type "^29.2.0" + jest-util "^29.3.1" + pretty-format "^29.3.1" -jest-environment-jsdom@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-environment-jsdom/-/jest-environment-jsdom-27.5.1.tgz#ea9ccd1fc610209655a77898f86b2b559516a546" - integrity sha512-TFBvkTC1Hnnnrka/fUb56atfDtJ9VMZ94JkjTbggl1PEpwrYtUBKMezB3inLmWqQsXYLcMwNoDQwoBTAvFfsfw== +jest-environment-node-single-context@^29.0.0: + version "29.0.0" + resolved "https://registry.yarnpkg.com/jest-environment-node-single-context/-/jest-environment-node-single-context-29.0.0.tgz#1959273b6b33b6ec63605863d8768488a247b91d" + integrity sha512-/XB09Hje38Kl5k9ISUpXNom3M4DQo5ifEsnELPFP5r3yrJDRyNQCEjL/9ScUN6z6UeF4FCNZUsiJIX/tGtTXNw== dependencies: - "@jest/environment" "^27.5.1" - "@jest/fake-timers" "^27.5.1" - "@jest/types" "^27.5.1" - "@types/node" "*" - jest-mock "^27.5.1" - jest-util "^27.5.1" - jsdom "^16.6.0" + jest-environment-node "^29.0.1" -jest-environment-node@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-environment-node/-/jest-environment-node-27.5.1.tgz#dedc2cfe52fab6b8f5714b4808aefa85357a365e" - integrity sha512-Jt4ZUnxdOsTGwSRAfKEnE6BcwsSPNOijjwifq5sDFSA2kesnXTvNqKHYgM0hDq3549Uf/KzdXNYn4wMZJPlFLw== +jest-environment-node@^29.0.1, jest-environment-node@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-environment-node/-/jest-environment-node-29.3.1.tgz#5023b32472b3fba91db5c799a0d5624ad4803e74" + integrity sha512-xm2THL18Xf5sIHoU7OThBPtuH6Lerd+Y1NLYiZJlkE3hbE+7N7r8uvHIl/FkZ5ymKXJe/11SQuf3fv4v6rUMag== dependencies: - "@jest/environment" "^27.5.1" - "@jest/fake-timers" "^27.5.1" - "@jest/types" "^27.5.1" + "@jest/environment" "^29.3.1" + "@jest/fake-timers" "^29.3.1" + "@jest/types" "^29.3.1" "@types/node" "*" - jest-mock "^27.5.1" - jest-util "^27.5.1" + jest-mock "^29.3.1" + jest-util "^29.3.1" jest-get-type@^27.5.1: version "27.5.1" resolved "https://registry.yarnpkg.com/jest-get-type/-/jest-get-type-27.5.1.tgz#3cd613c507b0f7ace013df407a1c1cd578bcb4f1" integrity sha512-2KY95ksYSaK7DMBWQn6dQz3kqAf3BB64y2udeG+hv4KfSOb9qwcYQstTJc1KCbsix+wLZWZYN8t7nwX3GOBLRw== -jest-haste-map@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-haste-map/-/jest-haste-map-27.5.1.tgz#9fd8bd7e7b4fa502d9c6164c5640512b4e811e7f" - integrity sha512-7GgkZ4Fw4NFbMSDSpZwXeBiIbx+t/46nJ2QitkOjvwPYyZmqttu2TDSimMHP1EkPOi4xUZAN1doE5Vd25H4Jng== +jest-get-type@^29.2.0: + version "29.2.0" + resolved "https://registry.yarnpkg.com/jest-get-type/-/jest-get-type-29.2.0.tgz#726646f927ef61d583a3b3adb1ab13f3a5036408" + integrity sha512-uXNJlg8hKFEnDgFsrCjznB+sTxdkuqiCL6zMgA75qEbAJjJYTs9XPrvDctrEig2GDow22T/LvHgO57iJhXB/UA== + +jest-haste-map@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-haste-map/-/jest-haste-map-29.3.1.tgz#af83b4347f1dae5ee8c2fb57368dc0bb3e5af843" + integrity sha512-/FFtvoG1xjbbPXQLFef+WSU4yrc0fc0Dds6aRPBojUid7qlPqZvxdUBA03HW0fnVHXVCnCdkuoghYItKNzc/0A== dependencies: - "@jest/types" "^27.5.1" - "@types/graceful-fs" "^4.1.2" + "@jest/types" "^29.3.1" + "@types/graceful-fs" "^4.1.3" "@types/node" "*" anymatch "^3.0.3" fb-watchman "^2.0.0" graceful-fs "^4.2.9" - jest-regex-util "^27.5.1" - jest-serializer "^27.5.1" - jest-util "^27.5.1" - jest-worker "^27.5.1" + jest-regex-util "^29.2.0" + jest-util "^29.3.1" + jest-worker "^29.3.1" micromatch "^4.0.4" - walker "^1.0.7" + walker "^1.0.8" optionalDependencies: fsevents "^2.3.2" -jest-jasmine2@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-jasmine2/-/jest-jasmine2-27.5.1.tgz#a037b0034ef49a9f3d71c4375a796f3b230d1ac4" - integrity sha512-jtq7VVyG8SqAorDpApwiJJImd0V2wv1xzdheGHRGyuT7gZm6gG47QEskOlzsN1PG/6WNaCo5pmwMHDf3AkG2pQ== +jest-leak-detector@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-leak-detector/-/jest-leak-detector-29.3.1.tgz#95336d020170671db0ee166b75cd8ef647265518" + integrity sha512-3DA/VVXj4zFOPagGkuqHnSQf1GZBmmlagpguxEERO6Pla2g84Q1MaVIB3YMxgUaFIaYag8ZnTyQgiZ35YEqAQA== dependencies: - "@jest/environment" "^27.5.1" - "@jest/source-map" "^27.5.1" - "@jest/test-result" "^27.5.1" - "@jest/types" "^27.5.1" - "@types/node" "*" - chalk "^4.0.0" - co "^4.6.0" - expect "^27.5.1" - is-generator-fn "^2.0.0" - jest-each "^27.5.1" - jest-matcher-utils "^27.5.1" - jest-message-util "^27.5.1" - jest-runtime "^27.5.1" - jest-snapshot "^27.5.1" - jest-util "^27.5.1" - pretty-format "^27.5.1" - throat "^6.0.1" + jest-get-type "^29.2.0" + pretty-format "^29.3.1" -jest-leak-detector@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-leak-detector/-/jest-leak-detector-27.5.1.tgz#6ec9d54c3579dd6e3e66d70e3498adf80fde3fb8" - integrity sha512-POXfWAMvfU6WMUXftV4HolnJfnPOGEu10fscNCA76KBpRRhcMN2c8d3iT2pxQS3HLbA+5X4sOUPzYO2NUyIlHQ== - dependencies: - jest-get-type "^27.5.1" - pretty-format "^27.5.1" - -jest-matcher-utils@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-matcher-utils/-/jest-matcher-utils-27.5.1.tgz#9c0cdbda8245bc22d2331729d1091308b40cf8ab" - integrity sha512-z2uTx/T6LBaCoNWNFWwChLBKYxTMcGBRjAt+2SbP929/Fflb9aa5LGma654Rz8z9HLxsrUaYzxE9T/EFIL/PAw== +jest-matcher-utils@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-matcher-utils/-/jest-matcher-utils-29.3.1.tgz#6e7f53512f80e817dfa148672bd2d5d04914a572" + integrity sha512-fkRMZUAScup3txIKfMe3AIZZmPEjWEdsPJFK3AIy5qRohWqQFg1qrmKfYXR9qEkNc7OdAu2N4KPHibEmy4HPeQ== dependencies: chalk "^4.0.0" - jest-diff "^27.5.1" - jest-get-type "^27.5.1" - pretty-format "^27.5.1" + jest-diff "^29.3.1" + jest-get-type "^29.2.0" + pretty-format "^29.3.1" -jest-message-util@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-message-util/-/jest-message-util-27.5.1.tgz#bdda72806da10d9ed6425e12afff38cd1458b6cf" - integrity sha512-rMyFe1+jnyAAf+NHwTclDz0eAaLkVDdKVHHBFWsBWHnnh5YeJMNWWsv7AbFYXfK3oTqvL7VTWkhNLu1jX24D+g== +jest-message-util@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-message-util/-/jest-message-util-29.3.1.tgz#37bc5c468dfe5120712053dd03faf0f053bd6adb" + integrity sha512-lMJTbgNcDm5z+6KDxWtqOFWlGQxD6XaYwBqHR8kmpkP+WWWG90I35kdtQHY67Ay5CSuydkTBbJG+tH9JShFCyA== dependencies: "@babel/code-frame" "^7.12.13" - "@jest/types" "^27.5.1" + "@jest/types" "^29.3.1" "@types/stack-utils" "^2.0.0" chalk "^4.0.0" graceful-fs "^4.2.9" micromatch "^4.0.4" - pretty-format "^27.5.1" + pretty-format "^29.3.1" slash "^3.0.0" stack-utils "^2.0.3" -jest-mock@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-mock/-/jest-mock-27.5.1.tgz#19948336d49ef4d9c52021d34ac7b5f36ff967d6" - integrity sha512-K4jKbY1d4ENhbrG2zuPWaQBvDly+iZ2yAW+T1fATN78hc0sInwn7wZB8XtlNnvHug5RMwV897Xm4LqmPM4e2Og== +jest-mock@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-mock/-/jest-mock-29.3.1.tgz#60287d92e5010979d01f218c6b215b688e0f313e" + integrity sha512-H8/qFDtDVMFvFP4X8NuOT3XRDzOUTz+FeACjufHzsOIBAxivLqkB1PoLCaJx9iPPQ8dZThHPp/G3WRWyMgA3JA== dependencies: - "@jest/types" "^27.5.1" + "@jest/types" "^29.3.1" "@types/node" "*" + jest-util "^29.3.1" jest-pnp-resolver@^1.2.2: - version "1.2.2" - resolved "https://registry.yarnpkg.com/jest-pnp-resolver/-/jest-pnp-resolver-1.2.2.tgz#b704ac0ae028a89108a4d040b3f919dfddc8e33c" - integrity sha512-olV41bKSMm8BdnuMsewT4jqlZ8+3TCARAXjZGT9jcoSnrfUnRCqnMoF9XEeoWjbzObpqF9dRhHQj0Xb9QdF6/w== + version "1.2.3" + resolved "https://registry.yarnpkg.com/jest-pnp-resolver/-/jest-pnp-resolver-1.2.3.tgz#930b1546164d4ad5937d5540e711d4d38d4cad2e" + integrity sha512-+3NpwQEnRoIBtx4fyhblQDPgJI0H1IEIkX7ShLUjPGA7TtUTvI1oiKi3SR4oBR0hQhQR80l4WAe5RrXBwWMA8w== -jest-regex-util@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-regex-util/-/jest-regex-util-27.5.1.tgz#4da143f7e9fd1e542d4aa69617b38e4a78365b95" - integrity sha512-4bfKq2zie+x16okqDXjXn9ql2B0dScQu+vcwe4TvFVhkVyuWLqpZrZtXxLLWoXYgn0E87I6r6GRYHF7wFZBUvg== +jest-regex-util@^29.2.0: + version "29.2.0" + resolved "https://registry.yarnpkg.com/jest-regex-util/-/jest-regex-util-29.2.0.tgz#82ef3b587e8c303357728d0322d48bbfd2971f7b" + integrity sha512-6yXn0kg2JXzH30cr2NlThF+70iuO/3irbaB4mh5WyqNIvLLP+B6sFdluO1/1RJmslyh/f9osnefECflHvTbwVA== -jest-resolve-dependencies@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-resolve-dependencies/-/jest-resolve-dependencies-27.5.1.tgz#d811ecc8305e731cc86dd79741ee98fed06f1da8" - integrity sha512-QQOOdY4PE39iawDn5rzbIePNigfe5B9Z91GDD1ae/xNDlu9kaat8QQ5EKnNmVWPV54hUdxCVwwj6YMgR2O7IOg== +jest-resolve-dependencies@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-resolve-dependencies/-/jest-resolve-dependencies-29.3.1.tgz#a6a329708a128e68d67c49f38678a4a4a914c3bf" + integrity sha512-Vk0cYq0byRw2WluNmNWGqPeRnZ3p3hHmjJMp2dyyZeYIfiBskwq4rpiuGFR6QGAdbj58WC7HN4hQHjf2mpvrLA== dependencies: - "@jest/types" "^27.5.1" - jest-regex-util "^27.5.1" - jest-snapshot "^27.5.1" + jest-regex-util "^29.2.0" + jest-snapshot "^29.3.1" -jest-resolve@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-resolve/-/jest-resolve-27.5.1.tgz#a2f1c5a0796ec18fe9eb1536ac3814c23617b384" - integrity sha512-FFDy8/9E6CV83IMbDpcjOhumAQPDyETnU2KZ1O98DwTnz8AOBsW/Xv3GySr1mOZdItLR+zDZ7I/UdTFbgSOVCw== +jest-resolve@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-resolve/-/jest-resolve-29.3.1.tgz#9a4b6b65387a3141e4a40815535c7f196f1a68a7" + integrity sha512-amXJgH/Ng712w3Uz5gqzFBBjxV8WFLSmNjoreBGMqxgCz5cH7swmBZzgBaCIOsvb0NbpJ0vgaSFdJqMdT+rADw== dependencies: - "@jest/types" "^27.5.1" chalk "^4.0.0" graceful-fs "^4.2.9" - jest-haste-map "^27.5.1" + jest-haste-map "^29.3.1" jest-pnp-resolver "^1.2.2" - jest-util "^27.5.1" - jest-validate "^27.5.1" + jest-util "^29.3.1" + jest-validate "^29.3.1" resolve "^1.20.0" resolve.exports "^1.1.0" slash "^3.0.0" -jest-runner@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-runner/-/jest-runner-27.5.1.tgz#071b27c1fa30d90540805c5645a0ec167c7b62e5" - integrity sha512-g4NPsM4mFCOwFKXO4p/H/kWGdJp9V8kURY2lX8Me2drgXqG7rrZAx5kv+5H7wtt/cdFIjhqYx1HrlqWHaOvDaQ== +jest-runner@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-runner/-/jest-runner-29.3.1.tgz#a92a879a47dd096fea46bb1517b0a99418ee9e2d" + integrity sha512-oFvcwRNrKMtE6u9+AQPMATxFcTySyKfLhvso7Sdk/rNpbhg4g2GAGCopiInk1OP4q6gz3n6MajW4+fnHWlU3bA== dependencies: - "@jest/console" "^27.5.1" - "@jest/environment" "^27.5.1" - "@jest/test-result" "^27.5.1" - "@jest/transform" "^27.5.1" - "@jest/types" "^27.5.1" + "@jest/console" "^29.3.1" + "@jest/environment" "^29.3.1" + "@jest/test-result" "^29.3.1" + "@jest/transform" "^29.3.1" + "@jest/types" "^29.3.1" "@types/node" "*" chalk "^4.0.0" - emittery "^0.8.1" + emittery "^0.13.1" graceful-fs "^4.2.9" - jest-docblock "^27.5.1" - jest-environment-jsdom "^27.5.1" - jest-environment-node "^27.5.1" - jest-haste-map "^27.5.1" - jest-leak-detector "^27.5.1" - jest-message-util "^27.5.1" - jest-resolve "^27.5.1" - jest-runtime "^27.5.1" - jest-util "^27.5.1" - jest-worker "^27.5.1" - source-map-support "^0.5.6" - throat "^6.0.1" + jest-docblock "^29.2.0" + jest-environment-node "^29.3.1" + jest-haste-map "^29.3.1" + jest-leak-detector "^29.3.1" + jest-message-util "^29.3.1" + jest-resolve "^29.3.1" + jest-runtime "^29.3.1" + jest-util "^29.3.1" + jest-watcher "^29.3.1" + jest-worker "^29.3.1" + p-limit "^3.1.0" + source-map-support "0.5.13" -jest-runtime@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-runtime/-/jest-runtime-27.5.1.tgz#4896003d7a334f7e8e4a53ba93fb9bcd3db0a1af" - integrity sha512-o7gxw3Gf+H2IGt8fv0RiyE1+r83FJBRruoA+FXrlHw6xEyBsU8ugA6IPfTdVyA0w8HClpbK+DGJxH59UrNMx8A== +jest-runtime@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-runtime/-/jest-runtime-29.3.1.tgz#21efccb1a66911d6d8591276a6182f520b86737a" + integrity sha512-jLzkIxIqXwBEOZx7wx9OO9sxoZmgT2NhmQKzHQm1xwR1kNW/dn0OjxR424VwHHf1SPN6Qwlb5pp1oGCeFTQ62A== dependencies: - "@jest/environment" "^27.5.1" - "@jest/fake-timers" "^27.5.1" - "@jest/globals" "^27.5.1" - "@jest/source-map" "^27.5.1" - "@jest/test-result" "^27.5.1" - "@jest/transform" "^27.5.1" - "@jest/types" "^27.5.1" + "@jest/environment" "^29.3.1" + "@jest/fake-timers" "^29.3.1" + "@jest/globals" "^29.3.1" + "@jest/source-map" "^29.2.0" + "@jest/test-result" "^29.3.1" + "@jest/transform" "^29.3.1" + "@jest/types" "^29.3.1" + "@types/node" "*" chalk "^4.0.0" cjs-module-lexer "^1.0.0" collect-v8-coverage "^1.0.0" - execa "^5.0.0" glob "^7.1.3" graceful-fs "^4.2.9" - jest-haste-map "^27.5.1" - jest-message-util "^27.5.1" - jest-mock "^27.5.1" - jest-regex-util "^27.5.1" - jest-resolve "^27.5.1" - jest-snapshot "^27.5.1" - jest-util "^27.5.1" + jest-haste-map "^29.3.1" + jest-message-util "^29.3.1" + jest-mock "^29.3.1" + jest-regex-util "^29.2.0" + jest-resolve "^29.3.1" + jest-snapshot "^29.3.1" + jest-util "^29.3.1" slash "^3.0.0" strip-bom "^4.0.0" -jest-serializer@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-serializer/-/jest-serializer-27.5.1.tgz#81438410a30ea66fd57ff730835123dea1fb1f64" - integrity sha512-jZCyo6iIxO1aqUxpuBlwTDMkzOAJS4a3eYz3YzgxxVQFwLeSA7Jfq5cbqCY+JLvTDrWirgusI/0KwxKMgrdf7w== +jest-snapshot@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-snapshot/-/jest-snapshot-29.3.1.tgz#17bcef71a453adc059a18a32ccbd594b8cc4e45e" + integrity sha512-+3JOc+s28upYLI2OJM4PWRGK9AgpsMs/ekNryUV0yMBClT9B1DF2u2qay8YxcQd338PPYSFNb0lsar1B49sLDA== dependencies: - "@types/node" "*" - graceful-fs "^4.2.9" - -jest-snapshot@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-snapshot/-/jest-snapshot-27.5.1.tgz#b668d50d23d38054a51b42c4039cab59ae6eb6a1" - integrity sha512-yYykXI5a0I31xX67mgeLw1DZ0bJB+gpq5IpSuCAoyDi0+BhgU/RIrL+RTzDmkNTchvDFWKP8lp+w/42Z3us5sA== - dependencies: - "@babel/core" "^7.7.2" + "@babel/core" "^7.11.6" "@babel/generator" "^7.7.2" + "@babel/plugin-syntax-jsx" "^7.7.2" "@babel/plugin-syntax-typescript" "^7.7.2" "@babel/traverse" "^7.7.2" - "@babel/types" "^7.0.0" - "@jest/transform" "^27.5.1" - "@jest/types" "^27.5.1" - "@types/babel__traverse" "^7.0.4" + "@babel/types" "^7.3.3" + "@jest/expect-utils" "^29.3.1" + "@jest/transform" "^29.3.1" + "@jest/types" "^29.3.1" + "@types/babel__traverse" "^7.0.6" "@types/prettier" "^2.1.5" babel-preset-current-node-syntax "^1.0.0" chalk "^4.0.0" - expect "^27.5.1" + expect "^29.3.1" graceful-fs "^4.2.9" - jest-diff "^27.5.1" - jest-get-type "^27.5.1" - jest-haste-map "^27.5.1" - jest-matcher-utils "^27.5.1" - jest-message-util "^27.5.1" - jest-util "^27.5.1" + jest-diff "^29.3.1" + jest-get-type "^29.2.0" + jest-haste-map "^29.3.1" + jest-matcher-utils "^29.3.1" + jest-message-util "^29.3.1" + jest-util "^29.3.1" natural-compare "^1.4.0" - pretty-format "^27.5.1" - semver "^7.3.2" + pretty-format "^29.3.1" + semver "^7.3.5" -jest-util@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-util/-/jest-util-27.5.1.tgz#3ba9771e8e31a0b85da48fe0b0891fb86c01c2f9" - integrity sha512-Kv2o/8jNvX1MQ0KGtw480E/w4fBCDOnH6+6DmeKi6LZUIlKA5kwY0YNdlzaWTiVgxqAqik11QyxDOKk543aKXw== +jest-util@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-util/-/jest-util-29.3.1.tgz#1dda51e378bbcb7e3bc9d8ab651445591ed373e1" + integrity sha512-7YOVZaiX7RJLv76ZfHt4nbNEzzTRiMW/IiOG7ZOKmTXmoGBxUDefgMAxQubu6WPVqP5zSzAdZG0FfLcC7HOIFQ== dependencies: - "@jest/types" "^27.5.1" + "@jest/types" "^29.3.1" "@types/node" "*" chalk "^4.0.0" ci-info "^3.2.0" graceful-fs "^4.2.9" picomatch "^2.2.3" -jest-validate@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-validate/-/jest-validate-27.5.1.tgz#9197d54dc0bdb52260b8db40b46ae668e04df067" - integrity sha512-thkNli0LYTmOI1tDB3FI1S1RTp/Bqyd9pTarJwL87OIBFuqEb5Apv5EaApEudYg4g86e3CT6kM0RowkhtEnCBQ== +jest-validate@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-validate/-/jest-validate-29.3.1.tgz#d56fefaa2e7d1fde3ecdc973c7f7f8f25eea704a" + integrity sha512-N9Lr3oYR2Mpzuelp1F8negJR3YE+L1ebk1rYA5qYo9TTY3f9OWdptLoNSPP9itOCBIRBqjt/S5XHlzYglLN67g== dependencies: - "@jest/types" "^27.5.1" + "@jest/types" "^29.3.1" camelcase "^6.2.0" chalk "^4.0.0" - jest-get-type "^27.5.1" + jest-get-type "^29.2.0" leven "^3.1.0" - pretty-format "^27.5.1" + pretty-format "^29.3.1" -jest-watcher@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-watcher/-/jest-watcher-27.5.1.tgz#71bd85fb9bde3a2c2ec4dc353437971c43c642a2" - integrity sha512-z676SuD6Z8o8qbmEGhoEUFOM1+jfEiL3DXHK/xgEiG2EyNYfFG60jluWcupY6dATjfEsKQuibReS1djInQnoVw== +jest-watcher@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-watcher/-/jest-watcher-29.3.1.tgz#3341547e14fe3c0f79f9c3a4c62dbc3fc977fd4a" + integrity sha512-RspXG2BQFDsZSRKGCT/NiNa8RkQ1iKAjrO0//soTMWx/QUt+OcxMqMSBxz23PYGqUuWm2+m2mNNsmj0eIoOaFg== dependencies: - "@jest/test-result" "^27.5.1" - "@jest/types" "^27.5.1" + "@jest/test-result" "^29.3.1" + "@jest/types" "^29.3.1" "@types/node" "*" ansi-escapes "^4.2.1" chalk "^4.0.0" - jest-util "^27.5.1" + emittery "^0.13.1" + jest-util "^29.3.1" string-length "^4.0.1" -jest-worker@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-27.5.1.tgz#8d146f0900e8973b106b6f73cc1e9a8cb86f8db0" - integrity sha512-7vuh85V5cdDofPyxn58nrPjBktZo0u9x1g8WtjQol+jZDaE+fhN+cIvTj11GndBnMnyfrUOG1sZQxCdjKh+DKg== +jest-worker@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest-worker/-/jest-worker-29.3.1.tgz#e9462161017a9bb176380d721cab022661da3d6b" + integrity sha512-lY4AnnmsEWeiXirAIA0c9SDPbuCBq8IYuDVL8PMm0MZ2PEs2yPvRA/J64QBXuZp7CYKrDM/rmNrc9/i3KJQncw== dependencies: "@types/node" "*" + jest-util "^29.3.1" merge-stream "^2.0.0" supports-color "^8.0.0" -jest@^27.5.1: - version "27.5.1" - resolved "https://registry.yarnpkg.com/jest/-/jest-27.5.1.tgz#dadf33ba70a779be7a6fc33015843b51494f63fc" - integrity sha512-Yn0mADZB89zTtjkPJEXwrac3LHudkQMR+Paqa8uxJHCBr9agxztUifWCyiYrjhMPBoUVBjyny0I7XH6ozDr7QQ== +jest@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/jest/-/jest-29.3.1.tgz#c130c0d551ae6b5459b8963747fed392ddbde122" + integrity sha512-6iWfL5DTT0Np6UYs/y5Niu7WIfNv/wRTtN5RSXt2DIEft3dx3zPuw/3WJQBCJfmEzvDiEKwoqMbGD9n49+qLSA== dependencies: - "@jest/core" "^27.5.1" + "@jest/core" "^29.3.1" + "@jest/types" "^29.3.1" import-local "^3.0.2" - jest-cli "^27.5.1" + jest-cli "^29.3.1" js-tokens@^4.0.0: version "4.0.0" @@ -2103,39 +1777,6 @@ js-yaml@^3.13.1: argparse "^1.0.7" esprima "^4.0.0" -jsdom@^16.6.0: - version "16.7.0" - resolved "https://registry.yarnpkg.com/jsdom/-/jsdom-16.7.0.tgz#918ae71965424b197c819f8183a754e18977b710" - integrity sha512-u9Smc2G1USStM+s/x1ru5Sxrl6mPYCbByG1U/hUmqaVsm4tbNyS7CicOSRyuGQYZhTu0h84qkZZQ/I+dzizSVw== - dependencies: - abab "^2.0.5" - acorn "^8.2.4" - acorn-globals "^6.0.0" - cssom "^0.4.4" - cssstyle "^2.3.0" - data-urls "^2.0.0" - decimal.js "^10.2.1" - domexception "^2.0.1" - escodegen "^2.0.0" - form-data "^3.0.0" - html-encoding-sniffer "^2.0.1" - http-proxy-agent "^4.0.1" - https-proxy-agent "^5.0.0" - is-potential-custom-element-name "^1.0.1" - nwsapi "^2.2.0" - parse5 "6.0.1" - saxes "^5.0.1" - symbol-tree "^3.2.4" - tough-cookie "^4.0.0" - w3c-hr-time "^1.0.2" - w3c-xmlserializer "^2.0.0" - webidl-conversions "^6.1.0" - whatwg-encoding "^1.0.5" - whatwg-mimetype "^2.3.0" - whatwg-url "^8.5.0" - ws "^7.4.6" - xml-name-validator "^3.0.0" - jsesc@^2.5.1: version "2.5.2" resolved "https://registry.yarnpkg.com/jsesc/-/jsesc-2.5.2.tgz#80564d2e483dacf6e8ef209650a67df3f0c283a4" @@ -2146,12 +1787,10 @@ json-parse-even-better-errors@^2.3.0: resolved "https://registry.yarnpkg.com/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz#7c47805a94319928e05777405dc12e1f7a4ee02d" integrity sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w== -json5@^2.1.2: - version "2.2.0" - resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.0.tgz#2dfefe720c6ba525d9ebd909950f0515316c89a3" - integrity sha512-f+8cldu7X/y7RAJurMEJmdoKXGB/X550w2Nr3tTbezL6RwEE/iMcm+tZnXeoZtKuOq6ft8+CqzEkrIgx1fPoQA== - dependencies: - minimist "^1.2.5" +json5@^2.2.1: + version "2.2.1" + resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.1.tgz#655d50ed1e6f95ad1a3caababd2b0efda10b395c" + integrity sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA== kleur@^3.0.3: version "3.0.3" @@ -2163,14 +1802,6 @@ leven@^3.1.0: resolved "https://registry.yarnpkg.com/leven/-/leven-3.1.0.tgz#77891de834064cccba82ae7842bb6b14a13ed7f2" integrity sha512-qsda+H8jTaUaN/x5vzW2rzc+8Rw4TAQ/4KjB46IwK5VH+IlVeeeje/EoZRpiXvIqjFgK84QffqPztGI3VBLG1A== -levn@~0.3.0: - version "0.3.0" - resolved "https://registry.yarnpkg.com/levn/-/levn-0.3.0.tgz#3b09924edf9f083c0490fdd4c0bc4421e04764ee" - integrity sha1-OwmSTt+fCDwEkP3UwLxEIeBHZO4= - dependencies: - prelude-ls "~1.1.2" - type-check "~0.3.2" - lines-and-columns@^1.1.6: version "1.2.4" resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632" @@ -2183,7 +1814,7 @@ locate-path@^5.0.0: dependencies: p-locate "^4.1.0" -lodash@^4.17.21, lodash@^4.7.0: +lodash@^4.17.21: version "4.17.21" resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c" integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg== @@ -2209,10 +1840,10 @@ makeerror@1.0.12: dependencies: tmpl "1.0.5" -mdn-data@2.0.27: - version "2.0.27" - resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.27.tgz#1710baa7b0db8176d3b3d565ccb7915fc69525ab" - integrity sha512-kwqO0I0jtWr25KcfLm9pia8vLZ8qoAKhWZuZMbneJq3jjBD3gl5nZs8l8Tu3ZBlBAHVQtDur9rdDGyvtfVraHQ== +mdn-data@2.0.28: + version "2.0.28" + resolved "https://registry.yarnpkg.com/mdn-data/-/mdn-data-2.0.28.tgz#5ec48e7bef120654539069e1ae4ddc81ca490eba" + integrity sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g== merge-stream@^2.0.0: version "2.0.0" @@ -2225,42 +1856,25 @@ merge2@^1.3.0: integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg== micromatch@^4.0.4: - version "4.0.4" - resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-4.0.4.tgz#896d519dfe9db25fce94ceb7a500919bf881ebf9" - integrity sha512-pRmzw/XUcwXGpD9aI9q/0XOwLNygjETJ8y0ao0wdqprrzDa4YnxLcz7fQRZr8voh8V10kGhABbNcHVk5wHgWwg== + version "4.0.5" + resolved "https://registry.yarnpkg.com/micromatch/-/micromatch-4.0.5.tgz#bc8999a7cbbf77cdc89f132f6e467051b49090c6" + integrity sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA== dependencies: - braces "^3.0.1" - picomatch "^2.2.3" - -mime-db@1.51.0: - version "1.51.0" - resolved "https://registry.yarnpkg.com/mime-db/-/mime-db-1.51.0.tgz#d9ff62451859b18342d960850dc3cfb77e63fb0c" - integrity sha512-5y8A56jg7XVQx2mbv1lu49NR4dokRnhZYTtL+KGfaa27uq4pSTXkwQkFJl4pkRMyNFz/EtYDSkiiEHx3F7UN6g== - -mime-types@^2.1.12: - version "2.1.34" - resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.34.tgz#5a712f9ec1503511a945803640fafe09d3793c24" - integrity sha512-6cP692WwGIs9XXdOO4++N+7qjqv0rqxxVvJ3VHPh/Sc9mVZcQP+ZGhkKiTvWMQRr2tbHkJP/Yn7Y0npb3ZBs4A== - dependencies: - mime-db "1.51.0" + braces "^3.0.2" + picomatch "^2.3.1" mimic-fn@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/mimic-fn/-/mimic-fn-2.1.0.tgz#7ed2c2ccccaf84d3ffcb7a69b57711fc2083401b" integrity sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg== -minimatch@^3.0.4: - version "3.0.4" - resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083" - integrity sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA== +minimatch@^3.0.4, minimatch@^3.1.1: + version "3.1.2" + resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.1.2.tgz#19cd194bfd3e428f049a70817c038d89ab4be35b" + integrity sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw== dependencies: brace-expansion "^1.1.7" -minimist@^1.2.5: - version "1.2.6" - resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.6.tgz#8637a5b759ea0d6e98702cfb3a9283323c93af44" - integrity sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q== - ms@2.1.2: version "2.1.2" resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009" @@ -2269,17 +1883,17 @@ ms@2.1.2: natural-compare@^1.4.0: version "1.4.0" resolved "https://registry.yarnpkg.com/natural-compare/-/natural-compare-1.4.0.tgz#4abebfeed7541f2c27acfb29bdbbd15c8d5ba4f7" - integrity sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc= + integrity sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw== node-int64@^0.4.0: version "0.4.0" resolved "https://registry.yarnpkg.com/node-int64/-/node-int64-0.4.0.tgz#87a9065cdb355d3182d8f94ce11188b825c68a3b" - integrity sha1-h6kGXNs1XTGC2PlM4RGIuCXGijs= + integrity sha512-O5lz91xSOeoXP6DulyHfllpq+Eg00MWitZIbtPfoSEvqIHdl5gfcY6hYzDWnj0qD5tz52PI08u9qUvSVeUBeHw== -node-releases@^2.0.1: - version "2.0.1" - resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.1.tgz#3d1d395f204f1f2f29a54358b9fb678765ad2fc5" - integrity sha512-CqyzN6z7Q6aMeF/ktcMVTzhAHCEpf8SOarwpzpf8pNBY2k5/oM34UHldUwp8VKI7uxct2HxSRdJjBaZeESzcxA== +node-releases@^2.0.6: + version "2.0.6" + resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.6.tgz#8a7088c63a55e493845683ebf3c828d8c51c5503" + integrity sha512-PiVXnNuFm5+iYkLBNeq5211hvO38y63T0i2KKh2KnUs3RpzJ+JtODFjkD8yjLwnDkTYF1eKXheUwdssR+NRZdg== normalize-path@^3.0.0, normalize-path@~3.0.0: version "3.0.0" @@ -2293,15 +1907,10 @@ npm-run-path@^4.0.1: dependencies: path-key "^3.0.0" -nwsapi@^2.2.0: - version "2.2.0" - resolved "https://registry.yarnpkg.com/nwsapi/-/nwsapi-2.2.0.tgz#204879a9e3d068ff2a55139c2c772780681a38b7" - integrity sha512-h2AatdwYH+JHiZpv7pt/gSX1XoRGb7L/qSIeuqA6GwYoF9w1vP1cw42TO0aI2pNyshRK5893hNSl+1//vHK7hQ== - once@^1.3.0: version "1.4.0" resolved "https://registry.yarnpkg.com/once/-/once-1.4.0.tgz#583b1aa775961d4b113ac17d9c50baef9dd76bd1" - integrity sha1-WDsap3WWHUsROsF9nFC6753Xa9E= + integrity sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w== dependencies: wrappy "1" @@ -2312,18 +1921,6 @@ onetime@^5.1.2: dependencies: mimic-fn "^2.1.0" -optionator@^0.8.1: - version "0.8.3" - resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.8.3.tgz#84fa1d036fe9d3c7e21d99884b601167ec8fb495" - integrity sha512-+IW9pACdk3XWmmTXG8m3upGUJst5XRGzxMRjXzAuJ1XnIFNvfhjjIuYkDvysnPQ7qzqVzLt78BCruntqRhWQbA== - dependencies: - deep-is "~0.1.3" - fast-levenshtein "~2.0.6" - levn "~0.3.0" - prelude-ls "~1.1.2" - type-check "~0.3.2" - word-wrap "~1.2.3" - p-limit@^2.2.0: version "2.3.0" resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-2.3.0.tgz#3dd33c647a214fdfffd835933eb086da0dc21db1" @@ -2331,6 +1928,13 @@ p-limit@^2.2.0: dependencies: p-try "^2.0.0" +p-limit@^3.1.0: + version "3.1.0" + resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-3.1.0.tgz#e1daccbe78d0d1388ca18c64fea38e3e57e3706b" + integrity sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ== + dependencies: + yocto-queue "^0.1.0" + p-locate@^4.1.0: version "4.1.0" resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-4.1.0.tgz#a3428bb7088b3a60292f66919278b7c297ad4f07" @@ -2353,11 +1957,6 @@ parse-json@^5.2.0: json-parse-even-better-errors "^2.3.0" lines-and-columns "^1.1.6" -parse5@6.0.1: - version "6.0.1" - resolved "https://registry.yarnpkg.com/parse5/-/parse5-6.0.1.tgz#e1a1c085c569b3dc08321184f19a39cc27f7c30b" - integrity sha512-Ofn/CTFzRGTTxwpNEs9PP93gXShHcTq255nzRYSKe8AkVpZY7e1fpmTfOyoIvjP5HG7Z2ZM7VS9PPhQGW2pOpw== - path-exists@^4.0.0: version "4.0.0" resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-4.0.0.tgz#513bdbe2d3b95d7762e8c1137efa195c6c61b5b3" @@ -2366,14 +1965,14 @@ path-exists@^4.0.0: path-is-absolute@^1.0.0: version "1.0.1" resolved "https://registry.yarnpkg.com/path-is-absolute/-/path-is-absolute-1.0.1.tgz#174b9268735534ffbc7ace6bf53a5a9e1b5c5f5f" - integrity sha1-F0uSaHNVNP+8es5r9TpanhtcX18= + integrity sha512-AVbw3UJ2e9bq64vSaS9Am0fje1Pa8pbGqTTsmXfaIiMpnr5DlDhfJOuLj9Sf95ZPVDAUerDfEk88MPmPe7UCQg== path-key@^3.0.0, path-key@^3.1.0: version "3.1.1" resolved "https://registry.yarnpkg.com/path-key/-/path-key-3.1.1.tgz#581f6ade658cbba65a0d3380de7753295054f375" integrity sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q== -path-parse@^1.0.6: +path-parse@^1.0.7: version "1.0.7" resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.7.tgz#fbc114b60ca42b30d9daf5858e4bd68bbedb6735" integrity sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw== @@ -2383,10 +1982,10 @@ picocolors@^1.0.0: resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c" integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ== -picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.2.3: - version "2.3.0" - resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.0.tgz#f1f061de8f6a4bf022892e2d128234fb98302972" - integrity sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw== +picomatch@^2.0.4, picomatch@^2.2.1, picomatch@^2.2.3, picomatch@^2.3.1: + version "2.3.1" + resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42" + integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA== pirates@^4.0.4: version "4.0.5" @@ -2400,15 +1999,10 @@ pkg-dir@^4.2.0: dependencies: find-up "^4.0.0" -prelude-ls@~1.1.2: - version "1.1.2" - resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.1.2.tgz#21932a549f5e52ffd9a827f570e04be62a97da54" - integrity sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ= - -prettier@^2.6.1: - version "2.6.1" - resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.6.1.tgz#d472797e0d7461605c1609808e27b80c0f9cfe17" - integrity sha512-8UVbTBYGwN37Bs9LERmxCPjdvPxlEowx2urIL6urHzdb3SDq4B/Z6xLFCblrSnE4iKWcS6ziJ3aOYrc1kz/E2A== +prettier@^2.7.1: + version "2.7.1" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.7.1.tgz#e235806850d057f97bb08368a4f7d899f7760c64" + integrity sha512-ujppO+MkdPqoVINuDFDRLClm7D78qbDt0/NR+wp5FqEZOoTNAjPHWj17QRhu7geIHJfcNhRk1XVQmF8Bp3ye+g== pretty-format@^27.5.1: version "27.5.1" @@ -2419,6 +2013,15 @@ pretty-format@^27.5.1: ansi-styles "^5.0.0" react-is "^17.0.1" +pretty-format@^29.3.1: + version "29.3.1" + resolved "https://registry.yarnpkg.com/pretty-format/-/pretty-format-29.3.1.tgz#1841cac822b02b4da8971dacb03e8a871b4722da" + integrity sha512-FyLnmb1cYJV8biEIiRyzRFvs2lry7PPIvOqKVe1GCUEYg4YGmlx1qG9EJNMxArYm7piII4qb8UV1Pncq5dxmcg== + dependencies: + "@jest/schemas" "^29.0.0" + ansi-styles "^5.0.0" + react-is "^18.0.0" + prompts@^2.0.1: version "2.4.2" resolved "https://registry.yarnpkg.com/prompts/-/prompts-2.4.2.tgz#7b57e73b3a48029ad10ebd44f74b01722a4cb069" @@ -2427,16 +2030,6 @@ prompts@^2.0.1: kleur "^3.0.3" sisteransi "^1.0.5" -psl@^1.1.33: - version "1.8.0" - resolved "https://registry.yarnpkg.com/psl/-/psl-1.8.0.tgz#9326f8bcfb013adcc005fdff056acce020e51c24" - integrity sha512-RIdOzyoavK+hA18OGGWDqUTsCLhtA7IcZ/6NCs4fFJaHBDab+pDDmDIByWFRQJq2Cd7r1OoQxBGKOaztq+hjIQ== - -punycode@^2.1.1: - version "2.1.1" - resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec" - integrity sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A== - queue-microtask@^1.2.2: version "1.2.3" resolved "https://registry.yarnpkg.com/queue-microtask/-/queue-microtask-1.2.3.tgz#4929228bbc724dfac43e0efb058caf7b6cfb6243" @@ -2447,6 +2040,11 @@ react-is@^17.0.1: resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0" integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w== +react-is@^18.0.0: + version "18.2.0" + resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.2.0.tgz#199431eeaaa2e09f86427efbb4f1473edb47609b" + integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w== + readdirp@~3.6.0: version "3.6.0" resolved "https://registry.yarnpkg.com/readdirp/-/readdirp-3.6.0.tgz#74a370bd857116e245b29cc97340cd431a02a6c7" @@ -2457,7 +2055,7 @@ readdirp@~3.6.0: require-directory@^2.1.1: version "2.1.1" resolved "https://registry.yarnpkg.com/require-directory/-/require-directory-2.1.1.tgz#8c64ad5fd30dab1c976e2344ffe7f792a6a6df42" - integrity sha1-jGStX9MNqxyXbiNE/+f3kqam30I= + integrity sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q== resolve-cwd@^3.0.0: version "3.0.0" @@ -2477,25 +2075,19 @@ resolve.exports@^1.1.0: integrity sha512-J1l+Zxxp4XK3LUDZ9m60LRJF/mAe4z6a4xyabPHk7pvK5t35dACV32iIjJDFeWZFfZlO29w6SZ67knR0tHzJtQ== resolve@^1.20.0: - version "1.20.0" - resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.20.0.tgz#629a013fb3f70755d6f0b7935cc1c2c5378b1975" - integrity sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A== + version "1.22.1" + resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.1.tgz#27cb2ebb53f91abb49470a928bba7558066ac177" + integrity sha512-nBpuuYuY5jFsli/JIs1oldw6fOQCBioohqWZg/2hiaOybXOft4lonv85uDOKXdf8rhyK159cxU5cDcK/NKk8zw== dependencies: - is-core-module "^2.2.0" - path-parse "^1.0.6" + is-core-module "^2.9.0" + path-parse "^1.0.7" + supports-preserve-symlinks-flag "^1.0.0" reusify@^1.0.4: version "1.0.4" resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76" integrity sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw== -rimraf@^3.0.0: - version "3.0.2" - resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-3.0.2.tgz#f1a5402ba6220ad52cc1282bac1ae3aa49fd061a" - integrity sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA== - dependencies: - glob "^7.1.3" - run-parallel@^1.1.9: version "1.2.0" resolved "https://registry.yarnpkg.com/run-parallel/-/run-parallel-1.2.0.tgz#66d1368da7bdf921eb9d95bd1a9229e7f21a43ee" @@ -2503,16 +2095,6 @@ run-parallel@^1.1.9: dependencies: queue-microtask "^1.2.2" -safe-buffer@~5.1.1: - version "5.1.2" - resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.1.2.tgz#991ec69d296e0313747d59bdfd2b745c35f8828d" - integrity sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g== - -"safer-buffer@>= 2.1.2 < 3": - version "2.1.2" - resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a" - integrity sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg== - sass-true@^6.1.0: version "6.1.0" resolved "https://registry.yarnpkg.com/sass-true/-/sass-true-6.1.0.tgz#cbcb78135071b1bae0882ea456a2b0dd9a6c8b3a" @@ -2523,31 +2105,24 @@ sass-true@^6.1.0: jest-diff "^27.5.1" lodash "^4.17.21" -sass@^1.49.0: - version "1.49.9" - resolved "https://registry.yarnpkg.com/sass/-/sass-1.49.9.tgz#b15a189ecb0ca9e24634bae5d1ebc191809712f9" - integrity sha512-YlYWkkHP9fbwaFRZQRXgDi3mXZShslVmmo+FVK3kHLUELHHEYrCmL1x6IUjC7wLS6VuJSAFXRQS/DxdsC4xL1A== +sass@^1.56.1: + version "1.56.1" + resolved "https://registry.yarnpkg.com/sass/-/sass-1.56.1.tgz#94d3910cd468fd075fa87f5bb17437a0b617d8a7" + integrity sha512-VpEyKpyBPCxE7qGDtOcdJ6fFbcpOM+Emu7uZLxVrkX8KVU/Dp5UF7WLvzqRuUhB6mqqQt1xffLoG+AndxTZrCQ== dependencies: chokidar ">=3.0.0 <4.0.0" immutable "^4.0.0" source-map-js ">=0.6.2 <2.0.0" -saxes@^5.0.1: - version "5.0.1" - resolved "https://registry.yarnpkg.com/saxes/-/saxes-5.0.1.tgz#eebab953fa3b7608dbe94e5dadb15c888fa6696d" - integrity sha512-5LBh1Tls8c9xgGjw3QrMwETmTMVk0oFgvrFSvWx62llR2hcEInrKNZ2GZCCuuy2lvWrdl5jhbpeqc5hRYKFOcw== - dependencies: - xmlchars "^2.2.0" - semver@^6.0.0, semver@^6.3.0: version "6.3.0" resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.0.tgz#ee0a64c8af5e8ceea67687b133761e1becbd1d3d" integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw== -semver@^7.3.2: - version "7.3.5" - resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.5.tgz#0b621c879348d8998e4b0e4be94b3f12e6018ef7" - integrity sha512-PoeGJYh8HK4BTO/a9Tf6ZG3veo/A7ZVsYrSA6J8ny9nb3B1VrpkuN+z9OE5wfE5p6H4LchYZsegiQgbJD94ZFQ== +semver@^7.3.5: + version "7.3.8" + resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.8.tgz#07a78feafb3f7b32347d725e33de7e2a2df67798" + integrity sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A== dependencies: lru-cache "^6.0.0" @@ -2563,10 +2138,10 @@ shebang-regex@^3.0.0: resolved "https://registry.yarnpkg.com/shebang-regex/-/shebang-regex-3.0.0.tgz#ae16f1644d873ecad843b0307b143362d4c42172" integrity sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A== -signal-exit@^3.0.2, signal-exit@^3.0.3: - version "3.0.6" - resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.6.tgz#24e630c4b0f03fea446a2bd299e62b4a6ca8d0af" - integrity sha512-sDl4qMFpijcGw22U5w63KmD3cZJfBuFlVNbVMKje2keoKML7X2UzWbc4XrmEbDwg0NXJc3yv4/ox7b+JWb57kQ== +signal-exit@^3.0.3, signal-exit@^3.0.7: + version "3.0.7" + resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.7.tgz#a9a1767f8af84155114eaabd73f99273c8f59ad9" + integrity sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ== sisteransi@^1.0.5: version "1.0.5" @@ -2578,12 +2153,7 @@ slash@^3.0.0: resolved "https://registry.yarnpkg.com/slash/-/slash-3.0.0.tgz#6539be870c165adbd5240220dbe361f1bc4d4634" integrity sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q== -"source-map-js@>=0.6.2 <2.0.0": - version "1.0.1" - resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.1.tgz#a1741c131e3c77d048252adfa24e23b908670caf" - integrity sha512-4+TN2b3tqOCd/kaGRJ/sTYA0tR0mdXx26ipdolxcwtJVqEnqNYvlCAt1q3ypy4QMlYus+Zh34RNtYLoq2oQ4IA== - -source-map-js@^1.0.1: +"source-map-js@>=0.6.2 <2.0.0", source-map-js@^1.0.1: version "1.0.2" resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c" integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw== @@ -2596,38 +2166,28 @@ source-map-resolve@^0.6.0: atob "^2.1.2" decode-uri-component "^0.2.0" -source-map-support@^0.5.6: - version "0.5.21" - resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.21.tgz#04fe7c7f9e1ed2d662233c28cb2b35b9f63f6e4f" - integrity sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w== +source-map-support@0.5.13: + version "0.5.13" + resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.13.tgz#31b24a9c2e73c2de85066c0feb7d44767ed52932" + integrity sha512-SHSKFHadjVA5oR4PPqhtAVdcBWwRYVd6g6cAXnIbRiIwc2EhPrTuKUBdSLvlEKyIP3GCf89fltvcZiP9MMFA1w== dependencies: buffer-from "^1.0.0" source-map "^0.6.0" -source-map@^0.5.0: - version "0.5.7" - resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc" - integrity sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w= - -source-map@^0.6.0, source-map@^0.6.1, source-map@~0.6.1: +source-map@^0.6.0, source-map@^0.6.1: version "0.6.1" resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263" integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g== -source-map@^0.7.3: - version "0.7.3" - resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.7.3.tgz#5302f8169031735226544092e64981f751750383" - integrity sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ== - sprintf-js@~1.0.2: version "1.0.3" resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c" - integrity sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw= + integrity sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g== stack-utils@^2.0.3: - version "2.0.5" - resolved "https://registry.yarnpkg.com/stack-utils/-/stack-utils-2.0.5.tgz#d25265fca995154659dbbfba3b49254778d2fdd5" - integrity sha512-xrQcmYhOsn/1kX+Vraq+7j4oE2j/6BFscZ0etmYg81xuM8Gq0022Pxb8+IqgOFUIaxHs0KaSb7T1+OegiNrNFA== + version "2.0.6" + resolved "https://registry.yarnpkg.com/stack-utils/-/stack-utils-2.0.6.tgz#aaf0748169c02fc33c8232abccf933f54a1cc34f" + integrity sha512-XlkWvfIm6RmsWtNJx+uqtKLS8eqFbxUg0ZzLXqY0caEy9l7hruX8IpiDnjsLavoBgqCCR71TqWO8MaXYheJ3RQ== dependencies: escape-string-regexp "^2.0.0" @@ -2639,7 +2199,7 @@ string-length@^4.0.1: char-regex "^1.0.2" strip-ansi "^6.0.0" -string-width@^4.1.0, string-width@^4.2.0: +string-width@^4.1.0, string-width@^4.2.0, string-width@^4.2.3: version "4.2.3" resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010" integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g== @@ -2677,7 +2237,7 @@ supports-color@^5.3.0: dependencies: has-flag "^3.0.0" -supports-color@^7.0.0, supports-color@^7.1.0: +supports-color@^7.1.0: version "7.2.0" resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-7.2.0.tgz#1b7dcdcb32b8138801b3e478ba6a51caa89648da" integrity sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw== @@ -2691,26 +2251,10 @@ supports-color@^8.0.0: dependencies: has-flag "^4.0.0" -supports-hyperlinks@^2.0.0: - version "2.2.0" - resolved "https://registry.yarnpkg.com/supports-hyperlinks/-/supports-hyperlinks-2.2.0.tgz#4f77b42488765891774b70c79babd87f9bd594bb" - integrity sha512-6sXEzV5+I5j8Bmq9/vUphGRM/RJNT9SCURJLjwfOg51heRtguGWDzcaBlgAzKhQa0EVNpPEKzQuBwZ8S8WaCeQ== - dependencies: - has-flag "^4.0.0" - supports-color "^7.0.0" - -symbol-tree@^3.2.4: - version "3.2.4" - resolved "https://registry.yarnpkg.com/symbol-tree/-/symbol-tree-3.2.4.tgz#430637d248ba77e078883951fb9aa0eed7c63fa2" - integrity sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw== - -terminal-link@^2.0.0: - version "2.1.1" - resolved "https://registry.yarnpkg.com/terminal-link/-/terminal-link-2.1.1.tgz#14a64a27ab3c0df933ea546fba55f2d078edc994" - integrity sha512-un0FmiRUQNr5PJqy9kP7c40F5BOfpGlYTrxonDChEZB7pzZxRNp/bt+ymiy9/npwXya9KH99nJ/GXFIiUkYGFQ== - dependencies: - ansi-escapes "^4.2.1" - supports-hyperlinks "^2.0.0" +supports-preserve-symlinks-flag@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09" + integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w== test-exclude@^6.0.0: version "6.0.0" @@ -2721,11 +2265,6 @@ test-exclude@^6.0.0: glob "^7.1.4" minimatch "^3.0.4" -throat@^6.0.1: - version "6.0.1" - resolved "https://registry.yarnpkg.com/throat/-/throat-6.0.1.tgz#d514fedad95740c12c2d7fc70ea863eb51ade375" - integrity sha512-8hmiGIJMDlwjg7dlJ4yKGLK8EsYqKgPWbG3b4wjJddKNwc7N7Dpn08Df4szr/sZdMVeOstrdYSsqzX6BYbcB+w== - tmpl@1.0.5: version "1.0.5" resolved "https://registry.yarnpkg.com/tmpl/-/tmpl-1.0.5.tgz#8683e0b902bb9c20c4f726e3c0b69f36518c07cc" @@ -2734,7 +2273,7 @@ tmpl@1.0.5: to-fast-properties@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e" - integrity sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4= + integrity sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog== to-regex-range@^5.0.1: version "5.0.1" @@ -2743,29 +2282,6 @@ to-regex-range@^5.0.1: dependencies: is-number "^7.0.0" -tough-cookie@^4.0.0: - version "4.0.0" - resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-4.0.0.tgz#d822234eeca882f991f0f908824ad2622ddbece4" - integrity sha512-tHdtEpQCMrc1YLrMaqXXcj6AxhYi/xgit6mZu1+EDWUn+qhUf8wMQoFIy9NXuq23zAwtcB0t/MjACGR18pcRbg== - dependencies: - psl "^1.1.33" - punycode "^2.1.1" - universalify "^0.1.2" - -tr46@^2.1.0: - version "2.1.0" - resolved "https://registry.yarnpkg.com/tr46/-/tr46-2.1.0.tgz#fa87aa81ca5d5941da8cbf1f9b749dc969a4e240" - integrity sha512-15Ih7phfcdP5YxqiB+iDtLoaTz4Nd35+IiAv0kQ5FNKHzXgdWqPoTIqEDDJmXceQt4JZk6lVPT8lnDlPpGDppw== - dependencies: - punycode "^2.1.1" - -type-check@~0.3.2: - version "0.3.2" - resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.3.2.tgz#5884cab512cf1d355e3fb784f30804b2b520db72" - integrity sha1-WITKtRLPHTVeP7eE8wgEsrUg23I= - dependencies: - prelude-ls "~1.1.2" - type-detect@4.0.8: version "4.0.8" resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-4.0.8.tgz#7646fb5f18871cfbb7749e69bd39a6388eb7450c" @@ -2776,79 +2292,30 @@ type-fest@^0.21.3: resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.21.3.tgz#d260a24b0198436e133fa26a524a6d65fa3b2e37" integrity sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w== -typedarray-to-buffer@^3.1.5: - version "3.1.5" - resolved "https://registry.yarnpkg.com/typedarray-to-buffer/-/typedarray-to-buffer-3.1.5.tgz#a97ee7a9ff42691b9f783ff1bc5112fe3fca9080" - integrity sha512-zdu8XMNEDepKKR+XYOXAVPtWui0ly0NtohUscw+UmaHiAWT8hrV1rr//H6V+0DvJ3OQ19S979M0laLfX8rm82Q== +update-browserslist-db@^1.0.9: + version "1.0.10" + resolved "https://registry.yarnpkg.com/update-browserslist-db/-/update-browserslist-db-1.0.10.tgz#0f54b876545726f17d00cd9a2561e6dade943ff3" + integrity sha512-OztqDenkfFkbSG+tRxBeAnCVPckDBcvibKd35yDONx6OU8N7sqgwc7rCbkJ/WcYtVRZ4ba68d6byhC21GFh7sQ== dependencies: - is-typedarray "^1.0.0" + escalade "^3.1.1" + picocolors "^1.0.0" -universalify@^0.1.2: - version "0.1.2" - resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.1.2.tgz#b646f69be3942dabcecc9d6639c80dc105efaa66" - integrity sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg== - -v8-to-istanbul@^8.1.0: - version "8.1.0" - resolved "https://registry.yarnpkg.com/v8-to-istanbul/-/v8-to-istanbul-8.1.0.tgz#0aeb763894f1a0a1676adf8a8b7612a38902446c" - integrity sha512-/PRhfd8aTNp9Ggr62HPzXg2XasNFGy5PBt0Rp04du7/8GNNSgxFL6WBTkgMKSL9bFjH+8kKEG3f37FmxiTqUUA== +v8-to-istanbul@^9.0.1: + version "9.0.1" + resolved "https://registry.yarnpkg.com/v8-to-istanbul/-/v8-to-istanbul-9.0.1.tgz#b6f994b0b5d4ef255e17a0d17dc444a9f5132fa4" + integrity sha512-74Y4LqY74kLE6IFyIjPtkSTWzUZmj8tdHT9Ii/26dvQ6K9Dl2NbEfj0XgU2sHCtKgt5VupqhlO/5aWuqS+IY1w== dependencies: + "@jridgewell/trace-mapping" "^0.3.12" "@types/istanbul-lib-coverage" "^2.0.1" convert-source-map "^1.6.0" - source-map "^0.7.3" -w3c-hr-time@^1.0.2: - version "1.0.2" - resolved "https://registry.yarnpkg.com/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz#0a89cdf5cc15822df9c360543676963e0cc308cd" - integrity sha512-z8P5DvDNjKDoFIHK7q8r8lackT6l+jo/Ye3HOle7l9nICP9lf1Ci25fy9vHd0JOWewkIFzXIEig3TdKT7JQ5fQ== - dependencies: - browser-process-hrtime "^1.0.0" - -w3c-xmlserializer@^2.0.0: - version "2.0.0" - resolved "https://registry.yarnpkg.com/w3c-xmlserializer/-/w3c-xmlserializer-2.0.0.tgz#3e7104a05b75146cc60f564380b7f683acf1020a" - integrity sha512-4tzD0mF8iSiMiNs30BiLO3EpfGLZUT2MSX/G+o7ZywDzliWQ3OPtTZ0PTC3B3ca1UAf4cJMHB+2Bf56EriJuRA== - dependencies: - xml-name-validator "^3.0.0" - -walker@^1.0.7: +walker@^1.0.8: version "1.0.8" resolved "https://registry.yarnpkg.com/walker/-/walker-1.0.8.tgz#bd498db477afe573dc04185f011d3ab8a8d7653f" integrity sha512-ts/8E8l5b7kY0vlWLewOkDXMmPdLcVV4GmOQLyxuSswIJsweeFZtAsMF7k1Nszz+TYBQrlYRmzOnr398y1JemQ== dependencies: makeerror "1.0.12" -webidl-conversions@^5.0.0: - version "5.0.0" - resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-5.0.0.tgz#ae59c8a00b121543a2acc65c0434f57b0fc11aff" - integrity sha512-VlZwKPCkYKxQgeSbH5EyngOmRp7Ww7I9rQLERETtf5ofd9pGeswWiOtogpEO850jziPRarreGxn5QIiTqpb2wA== - -webidl-conversions@^6.1.0: - version "6.1.0" - resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-6.1.0.tgz#9111b4d7ea80acd40f5270d666621afa78b69514" - integrity sha512-qBIvFLGiBpLjfwmYAaHPXsn+ho5xZnGvyGvsarywGNc8VyQJUMHJ8OBKGGrPER0okBeMDaan4mNBlgBROxuI8w== - -whatwg-encoding@^1.0.5: - version "1.0.5" - resolved "https://registry.yarnpkg.com/whatwg-encoding/-/whatwg-encoding-1.0.5.tgz#5abacf777c32166a51d085d6b4f3e7d27113ddb0" - integrity sha512-b5lim54JOPN9HtzvK9HFXvBma/rnfFeqsic0hSpjtDbVxR3dJKLc+KB4V6GgiGOvl7CY/KNh8rxSo9DKQrnUEw== - dependencies: - iconv-lite "0.4.24" - -whatwg-mimetype@^2.3.0: - version "2.3.0" - resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz#3d4b1e0312d2079879f826aff18dbeeca5960fbf" - integrity sha512-M4yMwr6mAnQz76TbJm914+gPpB/nCwvZbJU28cUD6dR004SAxDLOOSUaB1JDRqLtaOV/vi0IC5lEAGFgrjGv/g== - -whatwg-url@^8.0.0, whatwg-url@^8.5.0: - version "8.7.0" - resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-8.7.0.tgz#656a78e510ff8f3937bc0bcbe9f5c0ac35941b77" - integrity sha512-gAojqb/m9Q8a5IV96E3fHJM70AzCkgt4uXYX2O7EmuyOnLrViCQlsEBmF9UQIu3/aeAIp2U17rtbpZWNntQqdg== - dependencies: - lodash "^4.7.0" - tr46 "^2.1.0" - webidl-conversions "^6.1.0" - which@^2.0.1: version "2.0.2" resolved "https://registry.yarnpkg.com/which/-/which-2.0.2.tgz#7c6a8dd0a636a0327e10b59c9286eee93f3f51b1" @@ -2856,11 +2323,6 @@ which@^2.0.1: dependencies: isexe "^2.0.0" -word-wrap@~1.2.3: - version "1.2.3" - resolved "https://registry.yarnpkg.com/word-wrap/-/word-wrap-1.2.3.tgz#610636f6b1f703891bd34771ccb17fb93b47079c" - integrity sha512-Hz/mrNwitNRh/HUAtM/VT/5VH+ygD6DV7mYKZAtHOrbs8U7lvPS6xf7EJKMF0uW1KJCl0H701g3ZGus+muE5vQ== - wrap-ansi@^7.0.0: version "7.0.0" resolved "https://registry.yarnpkg.com/wrap-ansi/-/wrap-ansi-7.0.0.tgz#67e145cff510a6a6984bdf1152911d69d2eb9e43" @@ -2873,32 +2335,15 @@ wrap-ansi@^7.0.0: wrappy@1: version "1.0.2" resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f" - integrity sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8= + integrity sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ== -write-file-atomic@^3.0.0: - version "3.0.3" - resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-3.0.3.tgz#56bd5c5a5c70481cd19c571bd39ab965a5de56e8" - integrity sha512-AvHcyZ5JnSfq3ioSyjrBkH9yW4m7Ayk8/9My/DD9onKeu/94fwrMocemO2QAJFAlnnDN+ZDS+ZjAR5ua1/PV/Q== +write-file-atomic@^4.0.1: + version "4.0.2" + resolved "https://registry.yarnpkg.com/write-file-atomic/-/write-file-atomic-4.0.2.tgz#a9df01ae5b77858a027fd2e80768ee433555fcfd" + integrity sha512-7KxauUdBmSdWnmpaGFg+ppNjKF8uNLry8LyzjauQDOVONfFLNKrKvQOxZ/VuTIcS/gge/YNahf5RIIQWTSarlg== dependencies: imurmurhash "^0.1.4" - is-typedarray "^1.0.0" - signal-exit "^3.0.2" - typedarray-to-buffer "^3.1.5" - -ws@^7.4.6: - version "7.5.6" - resolved "https://registry.yarnpkg.com/ws/-/ws-7.5.6.tgz#e59fc509fb15ddfb65487ee9765c5a51dec5fe7b" - integrity sha512-6GLgCqo2cy2A2rjCNFlxQS6ZljG/coZfZXclldI8FB/1G3CCI36Zd8xy2HrFVACi8tfk5XrgLQEk+P0Tnz9UcA== - -xml-name-validator@^3.0.0: - version "3.0.0" - resolved "https://registry.yarnpkg.com/xml-name-validator/-/xml-name-validator-3.0.0.tgz#6ae73e06de4d8c6e47f9fb181f78d648ad457c6a" - integrity sha512-A5CUptxDsvxKJEU3yO6DuWBSJz/qizqzJKOMIfUJHETbBw/sFaDxgd6fxm1ewUaM0jZ444Fc5vC5ROYurg/4Pw== - -xmlchars@^2.2.0: - version "2.2.0" - resolved "https://registry.yarnpkg.com/xmlchars/-/xmlchars-2.2.0.tgz#060fe1bcb7f9c76fe2a17db86a9bc3ab894210cb" - integrity sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw== + signal-exit "^3.0.7" y18n@^5.0.5: version "5.0.8" @@ -2910,20 +2355,25 @@ yallist@^4.0.0: resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72" integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A== -yargs-parser@^20.2.2: - version "20.2.9" - resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-20.2.9.tgz#2eb7dc3b0289718fc295f362753845c41a0c94ee" - integrity sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w== +yargs-parser@^21.1.1: + version "21.1.1" + resolved "https://registry.yarnpkg.com/yargs-parser/-/yargs-parser-21.1.1.tgz#9096bceebf990d21bb31fa9516e0ede294a77d35" + integrity sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw== -yargs@^16.2.0: - version "16.2.0" - resolved "https://registry.yarnpkg.com/yargs/-/yargs-16.2.0.tgz#1c82bf0f6b6a66eafce7ef30e376f49a12477f66" - integrity sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw== +yargs@^17.3.1: + version "17.6.2" + resolved "https://registry.yarnpkg.com/yargs/-/yargs-17.6.2.tgz#2e23f2944e976339a1ee00f18c77fedee8332541" + integrity sha512-1/9UrdHjDZc0eOU0HxOHoS78C69UD3JRMvzlJ7S79S2nTaWRA/whGCTV8o9e/N/1Va9YIV7Q4sOxD8VV4pCWOw== dependencies: - cliui "^7.0.2" + cliui "^8.0.1" escalade "^3.1.1" get-caller-file "^2.0.5" require-directory "^2.1.1" - string-width "^4.2.0" + string-width "^4.2.3" y18n "^5.0.5" - yargs-parser "^20.2.2" + yargs-parser "^21.1.1" + +yocto-queue@^0.1.0: + version "0.1.0" + resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b" + integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==