From b7f8ba0224d1904174d2170721e7eb92427d365f Mon Sep 17 00:00:00 2001 From: 1280px <71165491+1280px@users.noreply.github.com> Date: Fri, 7 May 2021 14:23:42 +0700 Subject: [PATCH] v0.4.1 update --- userChrome.css | 6 +++++- userChromeIcons.css | 4 +++- userChromeParanoia.css | 18 ++++++++++++++++++ userChromeTabs.css | 18 ++++++++++++++---- 4 files changed, 40 insertions(+), 6 deletions(-) create mode 100644 userChromeParanoia.css diff --git a/userChrome.css b/userChrome.css index 30df302..f4e5100 100644 --- a/userChrome.css +++ b/userChrome.css @@ -50,7 +50,7 @@ To disable/enable some part of the style, add/remove "/* " before its @import. E /* ### Hourglass Tabs Loading Animation ### */ -@import "userChromeHourglassTabLoad.css"; +/* @import "userChromeHourglassTabLoad.css"; /* ### ### Menubar Animation & Shadow ### ### */ @@ -65,6 +65,10 @@ To disable/enable some part of the style, add/remove "/* " before its @import. E @import "userChromePageCustomize.css"; +/* ### Hourglass Tabs Loading Animation ### */ +/* @import "userChromeParanoia.css"; + + /* ### ### Photon-like Rounded Tabs ### ### */ @import "userChromeTabs.css"; diff --git a/userChromeIcons.css b/userChromeIcons.css index dfa72d0..d2f44d7 100644 --- a/userChromeIcons.css +++ b/userChromeIcons.css @@ -149,8 +149,10 @@ menuitem[checked="true"] > .menu-iconic-left { list-style-image: url(".icon/menu.svg") !important; } #PanelUI-menu-button[badge-status="update-available"], #PanelUI-menu-button[badge-status="update-downloading"], #PanelUI-menu-button[badge-status="update-manual"], #PanelUI-menu-button[badge-status="update-other-instance"], #PanelUI-menu-button[badge-status="update-restart"] { list-style-image: url(".icon/menu-badged.svg") !important; } -#PanelUI-menu-button[badge-status="update-available"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-downloading"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-manual"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-other-instance"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-restart"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, .panel-banner-item[notificationid="update-available"] > .toolbarbutton-icon, .panel-banner-item[notificationid="update-downloading"] > .toolbarbutton-icon, .panel-banner-item[notificationid="update-manual"] > .toolbarbutton-icon, .panel-banner-item[notificationid="update-other-instance"] > .toolbarbutton-icon, .panel-banner-item[notificationid="update-restart"] > .toolbarbutton-icon { +#PanelUI-menu-button[badge-status="update-available"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-downloading"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-manual"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-other-instance"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-restart"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, .panel-banner-item[notificationid="update-available"] > .toolbarbutton-icon, .panel-banner-item[notificationid="update-downloading"] > .toolbarbutton-icon, .panel-banner-item[notificationid="update-manual"] > .toolbarbutton-icon, .panel-banner-item[notificationid="update-other-instance"] > .toolbarbutton-icon, .panel-banner-item[notificationid="update-restart"] > .toolbarbutton-icon, .popup-notification-icon[popupid="update-available"], .popup-notification-icon[popupid="update-downloading"], .popup-notification-icon[popupid="update-manual"], .popup-notification-icon[popupid="update-other-instance"], .popup-notification-icon[popupid="update-restart"] { background: #74BF43 url(".icon/menu-update-badge.svg") no-repeat center !important; background-size: 10px !important; border-radius: 1000px !important; } +#PanelUI-menu-button[badge-status="update-available"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-downloading"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-manual"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-other-instance"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-restart"] > .toolbarbutton-badge-stack > .toolbarbutton-badge, #PanelUI-menu-button[badge-status="update-unsupported"] > .toolbarbutton-badge-stack > .toolbarbutton-badge { + margin: -7px 0 0 !important; margin-inline-end: -4px !important; } /* downloads button (currently doesn't replace Photon UI animation, and I have no idea how to implement Proton UI's one back) */ #downloads-indicator-anchor { diff --git a/userChromeParanoia.css b/userChromeParanoia.css new file mode 100644 index 0000000..f2ab292 --- /dev/null +++ b/userChromeParanoia.css @@ -0,0 +1,18 @@ +/* 　/ //　/　/　　RainFox v0.4 　//　/ /　　// ☔ Based on MaterialFox and QuietFox | 2019-2021 */ + +/* yep, this code is simple as heck :p */ +.tab-content { + transition: var(--userChrome-animation-speed) !important; +} + +/* option 1: hide tab-content underneath the tabs */ +tab:not([multiselected]) .tab-content:not(:hover):not([selected]) { + margin-bottom: -64px !important; }/**/ + +/* option 2: fade out tab-content +tab:not([multiselected]) .tab-content:not(:hover):not([selected]) { + opacity: 0% !important; }/**/ + +/* option 3: blur tab-content +tab:not([multiselected]) .tab-content:not(:hover):not([selected]) { + filter: blur(8px) !important; }/**/ \ No newline at end of file diff --git a/userChromeTabs.css b/userChromeTabs.css index 5de0f6c..be84eb5 100644 --- a/userChromeTabs.css +++ b/userChromeTabs.css @@ -40,6 +40,11 @@ tab[beforehovered]::after, tab:hover::after { margin-top: 20px !important; } +/* gap between pinned and regular tabs */ +#tabbrowser-tabs[haspinnedtabs]:not([positionpinnedtabs]) > #tabbrowser-arrowscrollbox > .tabbrowser-tab[first-visible-unpinned-tab] { + margin-inline-start: 6px !important; +} + /* tabbar zone improvements */ #navigator-toolbox { --tabs-border-color: #4442 !important; @@ -57,7 +62,7 @@ tab[beforehovered]::after, tab:hover::after { #TabsToolbar .toolbarbutton-1 { margin: 0 0 !important; } -#TabsToolbar .toolbarbutton-1 > .toolbarbutton-icon { +#TabsToolbar .toolbarbutton-1 > .toolbarbutton-icon, #alltabs-button .toolbarbutton-badge-stack { width: calc(2 * var(--toolbarbutton-inner-padding) + 12px) !important; height: calc(2 * var(--toolbarbutton-inner-padding) + 12px) !important; padding: calc((var(--tab-min-height) - 20px) / 2) !important; @@ -68,6 +73,11 @@ tab[beforehovered]::after, tab:hover::after { --tabs-border-color: var(--urlbar-box-bgcolor) !important; } +/* overflow buttons */ +#scrollbutton-up, #scrollbutton-down { + padding: calc(var(--toolbarbutton-inner-padding) - 4px) calc(var(--toolbarbutton-inner-padding) - 8px) !important; +} + /* old-styled control buttons */ .tab-secondary-label { display: none !important; @@ -88,10 +98,10 @@ tab[beforehovered]::after, tab:hover::after { /* ctrl buttons (currently located at left, try to change to classic look indafuture) */ .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) { - background-color: var(--toolbarbutton-hover-background); + background-color: #9995; border-radius: 1000px !important; - margin-top: -2px !important; margin-inline-end: 4.5px !important; - padding: 2px !important; padding-top: 4px !important; + margin-top: -1px !important; margin-bottom: -1px !important; margin-inline-end: 4.5px !important; + padding: 3px !important; } .tab-icon-overlay:not([pinned]) { width: 19px !important; height: 19px !important;