mirrors/Firefox-UI-Fix
1
Fork 0
mirror of https://github.com/black7375/Firefox-UI-Fix.git synced 2025-12-05 18:20:44 -08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge branch 'dev'

Browse source
This commit is contained in:
alstjr7375 2022-09-01 09:15:09 +09:00
commit 5663d22e04
7 changed files with 799 additions and 600 deletions
Download patch file Download diff file Expand all files Collapse all files

1114
css/leptonChrome.css
View file

File diff suppressed because it is too large Load diff

1
src/leptonChrome.scss
View file

@ -5,6 +5,7 @@
@use "utils/accent_color" as *;
@use "utils/native_menu" as *;
@use "utils/one_liner" as *;
@use "utils/window_control" as *;
@use "utils/proton_elements" as Proton;
@use "sass:selector";

18
src/padding/_tabbar_width.scss
View file

@ -3,11 +3,21 @@
--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;
@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 */

67
src/tabbar/layout/_navbar_padding.scss
View file

@ -2,39 +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-window-control-space: 0px;
}
@mixin _remove_spacer_oneLiner() {
@include Option("userChrome.tabbar.one_liner.tabbar_first") {
@include OS($win, $linux) {
@include _remove_spacer_pre;
}
@include OS($mac) {
@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 OS($win, $linux) {
@include _remove_spacer_post;
}
}
}
}
@mixin _oneLiner_navBar_borderPadding() {
@include NotOption("userChrome.tabbar.one_liner") {
@content;
@ -68,30 +35,11 @@
//------------------------------------------------------------------------------
@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 OS($win, $linux) {
@include WindowControl_Right {
@include _oneLiner_navBar_borderPadding {
border-inline-start-width: var(--uc-window-drag-space-pre);
border-inline-end-width: var(--uc-window-control-space);
@ -110,15 +58,12 @@
}
}
/* 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_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") {
@ -130,7 +75,8 @@
}
}
}
:root[tabsintitlebar="true"]:not([inFullscreen]) #TabsToolbar {
#TabsToolbar {
@include Option("userChrome.tabbar.one_liner") {
@include _oneLiner_navBar_marginGap {
@include NotOption("userChrome.tabbar.one_liner.tabbar_first") {
@ -144,6 +90,9 @@
}
}
}
}
@include OS($mac) {
:root[sizemode="fullscreen"] #TabsToolbar > .titlebar-buttonbox-container:last-child,
:root[sizemode="fullscreen"] #window-controls {
right: unset;

99
src/tabbar/layout/_window_control.scss
View file

@ -1,10 +1,51 @@
/*= 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: calc(var(--uc-menubar-height, 0px) + 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));
}
@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;
}
}
@include OS($win) {
:root[sizemode="maximized"][tabsintitlebar] {
--uc-titlebar-padding: 8px;
@ -22,50 +63,13 @@ See the above repository for updates as well as full license text. */
}
}
#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));
}
@include OS($win10) {
&[inactive="true"] > > .titlebar-buttonbox-container .titlebar-button {
stroke: var(--toolbar-color, currentColor) !important;
}
}
}
/* where window controls are on left */
@include OS($mac) {
: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;
}
#toolbar-menubar[inactive] > .titlebar-buttonbox-container {
@include NotOption("userChrome.hidden.tabbar") {
opacity: 0;
@ -81,6 +85,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") {
@ -89,6 +94,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),
@ -99,25 +105,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;

77
src/tabbar/layout/_window_control_size.scss
View file

@ -6,8 +6,41 @@
--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,16 +50,54 @@
@include OS($win10) {
--uc-window-control-width: 138px;
}
@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"] {
--uc-window-control-space: 0;
@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;
}
}
}
}

23
src/utils/_window_control.scss Normal file
View file

@ -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;
}
}
}