fix(firefox): fix menu
This commit is contained in:
parent
c05cf09427
commit
5b22b027cf
3 changed files with 110 additions and 203 deletions
|
|
@ -44,3 +44,99 @@
|
||||||
margin-top: -1px !important;
|
margin-top: -1px !important;
|
||||||
margin-inline: -200px !important;
|
margin-inline: -200px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* -------------------------------------------------------------- */
|
||||||
|
/* Fix menu */
|
||||||
|
:root:not([chromehidden~="toolbar"], [sizemode="fullscreen"]) #PanelUI-menu-button, :root[sizemode="maximized"] #appMenu-popup,
|
||||||
|
:root[sizemode="maximized"] #appMenu-popup {
|
||||||
|
--tab-height-personal: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root:not([chromehidden~="toolbar"])[sizemode="maximized"] #appMenu-popup > panelmultiview > box > box > panelview {
|
||||||
|
padding-top: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hamburger menu width */
|
||||||
|
:root:not([chromehidden~="toolbar"], [sizemode="fullscreen"]):is([sizemode="maximized"]) #PanelUI-menu-button[open] > stack,
|
||||||
|
:root:not([chromehidden~="toolbar"]) #PanelUI-menu-button .toolbarbutton-badge-stack {
|
||||||
|
min-width: 46px !important;
|
||||||
|
}
|
||||||
|
toolbar .toolbarbutton-1 > .toolbarbutton-badge-stack {
|
||||||
|
padding: 10px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root:not([chromehidden~="toolbar"]) #PanelUI-menu-button[open] > .toolbarbutton-badge-stack {
|
||||||
|
width: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root[sizemode="maximized"]:not([chromehidden~="toolbar"]) #appMenu-popup panelview {
|
||||||
|
width: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--margin-left-icons-personal: 3px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root:not([chromehidden~="toolbar"]) #PanelUI-menu-button > stack{
|
||||||
|
display: unset;
|
||||||
|
align-items: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root:not([chromehidden~="toolbar"]) #PanelUI-menu-button>stack::after {
|
||||||
|
width: unset !important;
|
||||||
|
content: unset;
|
||||||
|
color: unset !important;
|
||||||
|
padding-inline-start: unset !important;
|
||||||
|
padding-block: unset !important;
|
||||||
|
text-shadow: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root:not([chromehidden~="toolbar"])[sizemode="maximized"] #appMenu-popup {
|
||||||
|
appearance: unset !important;
|
||||||
|
margin-top: -1px !important;
|
||||||
|
clip-path: unset;
|
||||||
|
--arrowpanel-menuitem-padding: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root:is([sizemode="maximized"]):not([tabsintitlebar], [chromehidden~="toolbar"]) #appMenu-popup {
|
||||||
|
margin-top: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.subviewbutton:is(#appMenu-popup toolbarbutton):not(.subviewbutton-back) {
|
||||||
|
padding-inline-start: unset !important;
|
||||||
|
}
|
||||||
|
.subviewbutton:not(.subviewbutton-iconic, .toolbarbutton-text, [checked="true"])>.toolbarbutton-icon, .syncNowBtn {
|
||||||
|
width: unset;
|
||||||
|
height: unset;
|
||||||
|
margin-inline-end: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#appMenu-zoom-controls{
|
||||||
|
padding-inline-start: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#appMenu-fxa-status2:not([fxastatus])>#appMenu-fxa-label2 {
|
||||||
|
margin-inline-end: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root:not([chromehidden~="toolbar"])[sizemode="maximized"] #appMenu-fxa-status2 {
|
||||||
|
padding-top: unset !important;
|
||||||
|
border-image: unset !important;
|
||||||
|
border-top: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root:is([sizemode="normal"], [sizemode="fullscreen"]) #appMenu-fxa-label2 {
|
||||||
|
margin-inline-start: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
#appMenu-fxa-status2:not([fxastatus="signedin"]) {
|
||||||
|
margin-inline-end: unset !important;
|
||||||
|
margin-inline-start: unset !important;
|
||||||
|
}
|
||||||
|
#appMenu-fxa-status2:not([fxastatus="signedin"]):hover toolbarbutton {
|
||||||
|
background-color: unset !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root:not([chromehidden~="toolbar"])[sizemode="maximized"] #appMenu-popup {
|
||||||
|
--arrowpanel-menuitem-padding: unset !important;
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -2,12 +2,9 @@
|
||||||
lib,
|
lib,
|
||||||
stdenvNoCC,
|
stdenvNoCC,
|
||||||
fetchFromGitHub,
|
fetchFromGitHub,
|
||||||
writeText,
|
|
||||||
}: let
|
}: let
|
||||||
pname = "firefox-gx";
|
pname = "firefox-gx";
|
||||||
version = "8.6";
|
version = "8.6";
|
||||||
|
|
||||||
custom-menu = writeText "menu" "${builtins.readFile ./ogx_menu.css}";
|
|
||||||
in
|
in
|
||||||
stdenvNoCC.mkDerivation {
|
stdenvNoCC.mkDerivation {
|
||||||
inherit pname version;
|
inherit pname version;
|
||||||
|
|
@ -27,10 +24,6 @@ in
|
||||||
substituteInPlace ./chrome/components/ogx_root-personal.css \
|
substituteInPlace ./chrome/components/ogx_root-personal.css \
|
||||||
--replace '../images/newtab/wallpaper-dark.png' "$out/chrome/images/newtab/private-dark.png"
|
--replace '../images/newtab/wallpaper-dark.png' "$out/chrome/images/newtab/private-dark.png"
|
||||||
|
|
||||||
# TODO: make patch instead
|
|
||||||
# FIXME: menu is bugged again
|
|
||||||
cp -a ${custom-menu} ./chrome/components/ogx_menu.css
|
|
||||||
|
|
||||||
mkdir -p $out
|
mkdir -p $out
|
||||||
cp -r ./* $out
|
cp -r ./* $out
|
||||||
'';
|
'';
|
||||||
|
|
|
||||||
|
|
@ -1,182 +0,0 @@
|
||||||
/* Source file made available under Mozilla Public License v. 2.0 See the main repository for updates as well as full license text.
|
|
||||||
https://github.com/Godiesc/firefox-gx */
|
|
||||||
|
|
||||||
@media (-moz-platform: windows), (-moz-platform: linux) {
|
|
||||||
:root {
|
|
||||||
--label-color: color-mix(in srgb, var(--arrowpanel-color, var(--lwt-tab-text))80%, var(--Button-background-personal));
|
|
||||||
--margin-left-icons-personal: 3px !important;
|
|
||||||
--margin-right-icons-personal: 6px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ------------Menú hamburguesa-> top-left ------------- */
|
|
||||||
|
|
||||||
/*Posición*/
|
|
||||||
|
|
||||||
:root:not([chromehidden~="toolbar"]) #PanelUI-button {
|
|
||||||
position: fixed;
|
|
||||||
display: flex;
|
|
||||||
top: var(--windowed-top-padding, 0px);
|
|
||||||
left: 0px !important;
|
|
||||||
z-index: 2 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Tamaño menu [Open] - ventana maximizada y no maximizada*/
|
|
||||||
|
|
||||||
|
|
||||||
#appMenu-popup panelview {
|
|
||||||
width: 25.5em !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Ocultar botón menú en modo "pantalla completa" */
|
|
||||||
|
|
||||||
:root:is([chromehidden~="toolbar"], [sizemode="fullscreen"])>body>#browser, :root:is([chromehidden~="toolbar"], [sizemode="fullscreen"])>body>#browser-bottombox,
|
|
||||||
:root:is([chromehidden~="toolbar"], [sizemode="fullscreen"])>body>#customization-container {
|
|
||||||
z-index: 3 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* margen izquierda pestañas*/
|
|
||||||
|
|
||||||
:root:not([chromehidden~="toolbar"]) #toolbar-menubar, :root:not([chromehidden~="toolbar"]) #toolbar-menubar[autohide="true"]+#TabsToolbar {
|
|
||||||
padding-inline-start: var(--padding-left-tab) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* tamaño botón Menú */
|
|
||||||
|
|
||||||
:root:not([chromehidden~="toolbar"]) #PanelUI-menu-button {
|
|
||||||
padding: var(--margin-top-personal) 0 0 0 !important;
|
|
||||||
max-height: calc(var(--tab-height-personal)) !important;
|
|
||||||
min-height: calc(var(--tab-height-personal)) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* menu :hover y open */
|
|
||||||
|
|
||||||
:root:not([chromehidden~="toolbar"]) #PanelUI-menu-button>.toolbarbutton-badge-stack {
|
|
||||||
max-height: calc(var(--tab-height-personal)) !important;
|
|
||||||
min-height: calc(var(--tab-height-personal)) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
:root:not([chromehidden~="toolbar"]) #PanelUI-menu-button:not([open]):hover>.toolbarbutton-badge-stack {
|
|
||||||
background-color: var(--toolbarbutton-hover-personal) !important;
|
|
||||||
border-radius: 0px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
:root:not([chromehidden~="toolbar"]) #PanelUI-menu-button[open]>.toolbarbutton-badge-stack {
|
|
||||||
background-image: var(--noise-urlbar-personal, var(--noise-urlbar-personal, none)),
|
|
||||||
linear-gradient(var(--arrowpanel-background), var(--arrowpanel-background)),
|
|
||||||
linear-gradient(var(--arrowpanel-background), var(--arrowpanel-background)) !important;
|
|
||||||
border-radius: 0px !important;
|
|
||||||
border-image: var(--panel-separator-zap-gradient5) 1 !important;
|
|
||||||
width: 28.5em !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Logo */
|
|
||||||
|
|
||||||
:root:not([chromehidden~="toolbar"]) #PanelUI-menu-button .toolbarbutton-badge-stack {
|
|
||||||
list-style-image: url("../images/foxmenu.svg") !important;
|
|
||||||
display: -moz-box !important;
|
|
||||||
max-height: var(--tab-height-personal) !important;
|
|
||||||
min-width: var(--padding-left-tab) !important;
|
|
||||||
max-width: var(--padding-left-tab) !important;
|
|
||||||
-moz-box-pack: center !important;
|
|
||||||
fill: var(--general-color) !important;
|
|
||||||
border: 1px solid transparent !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
:root:not([chromehidden~="toolbar"]) #PanelUI-menu-button image {
|
|
||||||
margin-top: -1px !important;
|
|
||||||
min-height: 18px !important;
|
|
||||||
min-width: 18px !important;
|
|
||||||
margin-inline-start: 2px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* Padding top para hacer espacio para la fila del Label menú */
|
|
||||||
|
|
||||||
|
|
||||||
/* Margin top para subir el menú [open] */
|
|
||||||
|
|
||||||
|
|
||||||
/* Separadores */
|
|
||||||
|
|
||||||
:root:not([chromehidden~="toolbar"]) #appMenu-popup.cui-widget-panel toolbarseparator {
|
|
||||||
margin-inline-start: 30px !important;
|
|
||||||
--panel-separator-margin-vertical: 2px !important;
|
|
||||||
--panel-separator-margin: var(--panel-separator-margin-vertical) var(--panel-separator-margin-horizontal) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* zoom icons */
|
|
||||||
|
|
||||||
#appMenu-zoomReduce-button2 > .toolbarbutton-icon, #appMenu-zoomEnlarge-button2 > .toolbarbutton-icon{
|
|
||||||
margin-inline: -4px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Separadores */
|
|
||||||
|
|
||||||
:root:not([chromehidden~="toolbar"]) #appMenu-popup.cui-widget-panel toolbarseparator {
|
|
||||||
margin-inline-start: 30px !important;
|
|
||||||
--panel-separator-margin-vertical: 2px !important;
|
|
||||||
--panel-separator-margin: var(--panel-separator-margin-vertical) var(--panel-separator-margin-horizontal) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Color de íconos y label */
|
|
||||||
|
|
||||||
.subviewbutton:not([disabled]), #appMenu-popup toolbarbutton:not([disabled]) .toolbarbutton-text label {
|
|
||||||
-moz-context-properties: fill;
|
|
||||||
fill: var(--label-color) !important;
|
|
||||||
color: var(--label-color) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* baner de -actualización disponible- */
|
|
||||||
|
|
||||||
#appMenu-popup .panel-banner-item:not([disabled]), #appMenu-popup .addon-banner-item:not([disabled]) {
|
|
||||||
background: var(--button-bgcolor) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#appMenu-popup .panel-banner-item:not([disabled]):hover, #appMenu-popup .addon-banner-item:not([disabled]):hover {
|
|
||||||
background: var(--button-active-bgcolor) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* circulo de notificación de actualización */
|
|
||||||
|
|
||||||
#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 {
|
|
||||||
box-shadow: none;
|
|
||||||
margin: -7px -3px 0px !important;
|
|
||||||
margin-inline-end: -7px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.panel-banner-item::before {
|
|
||||||
background: url("../images/foxFill.svg") no-repeat center/16px;
|
|
||||||
content: "";
|
|
||||||
display: block;
|
|
||||||
width: 16px;
|
|
||||||
height: 16px;
|
|
||||||
margin-inline-end: 7px;
|
|
||||||
-moz-context-properties: fill;
|
|
||||||
fill: #3ad3a2 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#appMenu-popup .panel-banner-item {
|
|
||||||
margin: 0 0px 2px !important;
|
|
||||||
padding-inline-start: 8px !important;
|
|
||||||
border-radius: 0px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ---------------------------------------- Config para alinear íconos en el menú de hamburguesa ------------------------------------------- */
|
|
||||||
|
|
||||||
/* Sobreescribir nuevo Tamaño y margen de los íconos - Trick para aplicar margen nuevo solo al menu hamburguesa maximizado */
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* Menú más pequeño en linux*/
|
|
||||||
|
|
||||||
@media (-moz-platform: linux) {
|
|
||||||
:root {
|
|
||||||
--margin-left-icons-personal: 9px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
Loading…
Reference in a new issue