mirrors/Firefox-UI-Fix
1
Fork 0
mirror of https://github.com/black7375/Firefox-UI-Fix.git synced 2025-12-31 22:40:55 -08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge branch 'interactive'

Browse source
This commit is contained in:
alstjr7375 2021-05-23 17:27:13 +09:00
commit e2e717ed08
1 changed files with 90 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

94
userChrome.css
View file

@ -78,8 +78,8 @@
}
/* Tab - Max Size */
:root:not([uidensity=touch]) .tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]) {
max-width: 240px !important;
.tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]) {
max-width: 240px !important; /* Original: 225px */
}
/* neighbouring tabs should "pinch" together */
@ -121,6 +121,18 @@
height: calc(var(--tab-min-height) - var(--tabs-navbar-shadow-size) - 2px); /* Compact: 28px, Normal: 33px, Touch: 38px */
}
/* Pinned Tab - Titlechanged Indicator position fix */
:root:not([uidensity=touch]) .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
:root:not([uidensity=touch]) .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
/* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */
background-position: center bottom calc(4.5px + var(--tabs-navbar-shadow-size)) !important;
}
:root[uidensity=compact] .tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]),
:root[uidensity=compact] .tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) {
/* Original: center bottom calc(6.5px + var(--tabs-navbar-shadow-size)); */
background-position: center bottom calc(.5px + var(--tabs-navbar-shadow-size)) !important;
}
/** Tab Bar - Connect to window *********************************************/
.tab-background {
border-radius: var(--tab-border-radius) var(--tab-border-radius) 0px 0px !important;
@ -281,6 +293,22 @@
padding: 2px 0 !important;
}
/* Busy - Show */
.tab-throbber[busy], .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(-.5px) translateY(-2.5px);
}
.tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing],[crashed])[busy] {
top: -3.5px !important;
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,
@ -301,6 +329,51 @@
padding: 0 !important;
}
/** Pinned Tab - Replace Favicon to Close Button at Selected ****************/
.tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-close-button {
display: -moz-box !important;
-moz-box-ordinal-group: 0 !important;
transform: translateX(-1px);
/* Looks like hover */
width: 24px !important;
height: 24px !important;
padding: 7px !important;
}
.tabbrowser-tab[pinned][visuallyselected] .tab-icon-image {
display: none !important;
}
/* Left Padding - Assume the icon size is 17px */
.tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-content {
padding-inline: 7.5px !important; /* Original: 10px */
}
/* Right Padding - Assume the icon size is 17px */
.tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-icon-stack {
width: 8.5px !important;
}
.tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-content {
padding-inline-end: 0px !important;
}
.tabbrowser-tab[pinned][visuallyselected][busy] .tab-content {
padding-inline-end: 9.5px !important;
}
.tabbrowser-tab[pinned][busy] .tab-content {
padding-inline: 10.5px !important;
}
/* Sound Tab - Don't move overlay */
.tabbrowser-tab[pinned][busy] .tab-icon-overlay:is([soundplaying], [muted], [activemedia-blocked]) {
transform: translateX(.5px) translateY(-2px) !important;
}
.tabbrowser-tab[pinned][visuallyselected]:not([busy]) .tab-icon-overlay {
transform: translateX(-9px) translateY(-2px) !important;
left: 0 !important;
}
/** Container Tab - Color line at icon's bottom *****************************/
.tab-context-line {
display: none;
@ -313,8 +386,9 @@
border-bottom: 2px solid var(--identity-icon-color);
}
/* None exist favicon */
.tabbrowser-tab:not([image]):not([pinned], [sharing], [crashed]):not([soundplaying], [muted], [activemedia-blocked]) .tab-content::before {
/* None exist favicon & Pinned to select */
.tabbrowser-tab:not([image]):not([pinned], [sharing], [crashed]):not([soundplaying], [muted], [activemedia-blocked]) .tab-content::before,
.tabbrowser-tab[pinned][visuallyselected]:not([busy]):not(:hover) .tab-content::before {
/* Box Model */
content: '';
display: block;
@ -326,6 +400,12 @@
border-bottom: 2px solid var(--identity-icon-color);
width: 16px;
}
.tabbrowser-tab:not([image]):not([pinned], [sharing], [crashed]):not([soundplaying], [muted], [activemedia-blocked]) .tab-content::before {
transform: translateY(10px) !important; /* None exist favicon */
}
.tabbrowser-tab[pinned][visuallyselected]:not([busy]):not(:hover) .tab-content::before {
transform: translateX(2.5px) translateY(10px) !important; /* Pinned to select */
}
/* None exist favicon - With Sound */
.tabbrowser-tab:not([image]) .tab-icon-overlay:not([pinned], [sharing], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) {
@ -342,6 +422,12 @@
border-bottom: none;
}
/* Pinned Tab - Titlechanged Indicator override */
.tabbrowser-tab:is([image], [pinned]) > .tab-stack > .tab-content[attention]:not([selected="true"]) .tab-icon-image,
.tabbrowser-tab > .tab-stack > .tab-content[pinned][titlechanged]:not([selected="true"]) .tab-icon-image {
border-bottom: 4px dotted var(--identity-icon-color) !important;
}
/** URL Bar - Reduce Padding ************************************************/
:root:not([uidensity=touch]) #urlbar-container, #search-container {
padding-block: 2px; /* Original: 4px */