Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found
Select Git revision
  • experiment/findbar
  • experiment/min-width-360
  • experiment/minimal-userchrome
  • experiment/tab-width-and-firefox-view
  • feature/better-popups-from-furios
  • feature/wider-url-bar
  • master
  • next
  • show-account-feature
  • wip
  • 0.0.1
  • 1.0.0
  • 1.0.1
  • 2.0.0
  • 2.0.1
  • 2.1.0
  • 2.2.0
  • 3.0.0
  • 3.0.0_rc1
  • 3.1.0
  • 3.2.0
  • 4.0.0
  • 4.0.1
  • 4.0.2
  • 4.0.3
  • 4.0.4
  • 4.1.0
  • 4.2.0
  • 4.3.0
  • 4.3.1
  • 4.3.2
31 results

Target

Select target project
  • dannycolin/mobile-config-firefox
  • postmarketOS/mobile-config-firefox
  • a-wai/mobile-config-firefox
  • 1peter10/mobile-config-firefox
  • hazardchem/mobile-config-firefox
  • Adrian/mobile-config-firefox
  • sertonix/mobile-config-firefox
7 results
Select Git revision
  • gnumdk/density
  • master
  • wip
  • 0.0.1
  • 1.0.0
  • 1.0.1
  • 2.0.0
  • 2.0.1
  • 2.1.0
  • 2.2.0
  • 3.0.0
  • 3.0.0_rc1
  • 3.1.0
  • 3.2.0
  • 4.0.0
  • 4.0.1
  • 4.0.2
  • 4.0.3
  • 4.0.4
  • 4.1.0
  • 4.2.0
  • 4.3.0
  • 4.3.1
  • 4.3.2
  • 4.4.0
  • 4.5.0
  • 4.6.0
27 results
Show changes
Commits on Source (11)
Hide whitespace changes
Inline Side-by-side
src/userChrome/appMenu.css
View file @ c8f4aa45
/* Copyright 2022 Oliver Smith
/* Copyright 2025 Oliver Smith, Jesús Higueras
* SPDX-License-Identifier: MPL-2.0 */
@media (max-width: 700px) {
@media not (-moz-bool-pref: "mcf.addressbarontop"),
not (-moz-pref("mcf.addressbarontop")) {
/* Spawn the menu above the navigation bar (now that we've moved it to the
* bottom). Without this, it still spawns above, but only with a small
* height. This is due to the position="bottomcenter topright" attribute in
* the HTML, which we can't override via CSS. */
#appMenu-popup {
margin-top: -410px !important;
}
/* See also popups.css, which also influences how the appMenu looks
* and behaves */
#appMenu-protonMainView vbox.panel-subview-body, #appMenu-mainView vbox.panel-subview-body {
height: 330px !important;
max-height: 330px !important;
}
/* Hide unwantend appMenu buttons */
#appMenu-extensions-themes-button,
#appMenu-print-button2,
#appMenu-save-file-button2,
#appMenu-passwords-button,
#appMenu-help-button2,
#appMenu-quit-button2,
#appMenu-help-button2 + toolbarseparator,
#appMenu-zoom-controls + toolbarseparator,
#appmenu-moreTools-button,
#appmenu-moreTools-button + toolbarseparator,
.subviewbutton[shortcut]::after {
display: none !important;
}
@media (((orientation: landscape) and (max-height: 650px)) or ((-moz-bool-pref: "mcf.appmenudualportrait"),
-moz-pref("mcf.appmenudualportrait"))) {
#appMenu-mainView > .panel-subview-body {
display: grid !important;
grid-auto-flow: dense;
}
#appMenu-proton-addon-banners, /* this ID is obsolete as of FF 127. keeping it for a bit for compatibility */
#appMenu-addon-banners,
#appMenu-fxa-status2,
#appMenu-profiles-button,
#appMenu-popup toolbarseparator,
#appMenu-zoom-controls {
grid-column: span 2 !important;
}
#appMenu-popup {
height: 330px;
max-height: 330px;
#appMenu-new-private-window-button2,
#appMenu-downloads-button {
grid-column: 1 !important;
}
#appMenu-multiView box.panel-viewstack:first-child {
/* Use the whole space in the menu, instead of slowly increasing the
* height via animation. This animation is broken anyway due to the
* above menu size hack */
height: calc(100vh - 100px) !important;
max-height: calc(100vh - 100px) !important;
#appMenu-new-tab-button2,
#appMenu-bookmarks-button,
#appMenu-history-button,
#appMenu-find-button2,
#appMenu-translate-button {
grid-column: 2 !important;
}
/* Menu content
* - configure it to have most important functions for mobile
* on one page, without scrolling. (Scrolling was only possible with the
* scrollbar on the right anyway, which is awkward when expecting to be
* able to scroll with fingers.)
* - submenus are hidden, because attempting to scroll inside them with the
* finger causes firefox to segfault. This is likely due to the menu
* positioning hack above, looks like FF can't determine the height
* properly. Help with fixing this is appreciated, the bookmarks and
* history submenus would be useful. However even without the submenus,
* the history and saved bookmarks can at least be accessed conveniently
* through the navigation search.
* - fullscreen is hidden: not available in FF for android either, the
* screen is almost used completely already, causes problems with UIs
* that don't expect apps to go fullscreen (i.e. in Phosh, as soon as
* the on screen keyboard is triggered, the top and bottom bars of Phosh
* are over the FF in fullscreen) */
#appMenu-fxa-status2, /* FF login */
#appMenu-fxa-separator, /* FF login */
#appMenu-new-window-button2,
#appMenu-protonMainView toolbarseparator, /* all separators, FF <= 126 */
#appMenu-mainView toolbarseparator, /* all separators, FF 127++ */
#appMenu-save-file-button2, /* Save file can be done from Print too */
#appMenu-fullscreen-button2,
#appMenu-passwords-button, /* accessible from settings */
#appMenu-extensions-themes-button, /* accessible from settings */
#appMenu-bookmarks-button, /* submenu */
#appMenu-history-button, /* submenu */
#appMenu-more-button2, /* submenu */
#appMenu-help-button2, /* submenu */
.subviewbutton[shortcut]::after { /* menu shortcuts ("Ctrl+T" etc.) */
#appMenu-new-private-window-button2 + toolbarseparator {
display: none !important;
}
}
src/userChrome/editBookmarkPanel.css deleted 100644 → 0
View file @ 1c09ac88
/* Copyright 2024 Oliver Smith, Peter Mack
* SPDX-License-Identifier: MPL-2.0 */
@media (max-width: 700px) {
/* The only way I (ollieparanoid) found to make this not glitchy, was to
* reduce the bookmark panel to the minimum amount of useful controls and
* hardcode width and height. Patches to improve this welcome, but make
* sure that you don't introduce new UI glitches by doing extensive
* testing. */
#editBookmarkPanel {
margin-top: -390px !important;
height: 200px;
max-height: 200px;
max-width: calc(100vw - 100px);
}
#editBookmarkPanel box.panel-header,
#editBookmarkHeaderSeparator {
display: none !important;
}
#editBookmarkPanelContent {
max-width: 250px !important;
width: 250px !important;
padding-right: 20px;
}
/* Hide the screenshot and the line below it. The page is right there when
* you bring up the menu, no need for a screenshot. Also it has a glitch
* when taking the screenshot in mobile portrait view, half the screenshot
* is just black. Let's rather use the space to edit the bookmark
* information.
* Note: There's no more screenshot in FF 124, so likely part of
* this can be dropped with ESR 128 */
#editBookmarkPanelInfoArea,
#editBookmarkSeparator {
display: none;
}
#editBMPanel_folderRow,
.editBMPanel_folderRow,
#editBMPanel_tagsRow,
.editBMPanel_tagsRow {
display: none;
}
/* Fix remove/save buttons for Firefox 124 */
#editBookmarkPanel * .panel-footer {
justify-content: flex-start !important;
}
/* Fix buttons for FF 115, likely obsolete with FF ESR 128 */
#editBookmarkPanelBottomButtons {
width: 250px !important;
min-width: 250px !important;
padding: 0px !important;
justify-content: flex-start !important;
margin: 0px 0px 20px 0px !important;
}
}
src/userChrome/popups.css
View file @ c8f4aa45
/* Copyright 2024 Oliver Smith, user0, Peter Mack *
/* Copyright 2024 Oliver Smith, Jesús Higueras, user0, Peter Mack *
* SPDX-License-Identifier: MPL-2.0 */
@media ((orientation: portrait) and (max-width: 720px)) {
@media (max-width: 700px) {
@media not (-moz-bool-pref: "mcf.addressbarontop"),
not (-moz-pref("mcf.addressbarontop")) {
/* If the navbar is at the bottom, we need to set an offset to have
* the notifications (like the one for installing addons) displayed
* on-screen. */
/* fixes for installing extensions */
.popup-notification-panel {
margin-top: -280px !important;
max-width: 98vw;
}
/* Additional fix for "Add $extension" menu */
#notification-popup {
margin-top: -330px !important;
padding-left: 30px;
}
/* Menu that appears when long-pressing the back-button */
#backForwardMenu {
margin-top: -250px;
height: 200px;
min-height: 200px;
max-width: 100vw !important;
}
panel {
contain: strict !important;
margin: 0 !important;
}
#downloadsPanel-mainView {
max-width: calc(100vw - 10px);
panel, panel > box.panel-viewcontainer {
min-width: 100vw !important;
width: 100vw !important;
max-width: 100vw !important;
max-height: calc(100vh - 88px) !important;
min-height: calc(100vh - 88px) !important;
}
/* Fix unified-extensions and protections menu */
.panel-viewstack {
height: 100vh !important;
max-height: calc(100vh - 100px) !important;
max-width: calc(100vw - 10px);
panelview {
max-height: 100% !important;
}
/* Allow extensions to use full popup */
.webextension-popup-browser {
height: 100% !important;
min-height: 100% !important;
width: 100vw !important;
min-width: 100vw !important;
panelview.PanelUI-subView {
justify-content: flex-end;
}
/* Hide some context menu items,
* hide 'Customize Toolbar' in overflow menu */
#context-inspect,
#context-inspect-a11y,
#context-savelinktopocket,
#context-searchselect,
#context-sendlinktodevice,
#context-viewpartialsource-selection,
#inspect-separator,
#overflowMenu-customize-button {
display: none !important
panelview > .panel-subview-body {
flex: 0 !important;
flex-basis: min-content !important;
}
/* fix flickering of the protections, permissions,
* widget overflow and identity popups, make seventh
* column of date picker visible */
#protections-popup,
#permission-popup,
#widget-overflow,
#identity-popup,
#date-picker {
max-width: 100vw !important;
panel, box.panel-viewcontainer > box.panel-viewstack {
align-content: flex-end;
}
/* fix the protections popup gettting
* too wide, making controls unaccessible */
#protections-popup-mainView {
min-width: 100vw !important;
max-width: 100vw !important;
panelmultiview, box.panel-viewcontainer, box.panel-viewstack, panelview {
min-width: 100% !important;
max-width: 100% !important;
min-height: 0 !important;
outline: 0px transparent !important;
contain: layout !important;
}
/* fix flicker on extension menus.
* The compromise is that the overflow menu always use
* all available height.
* The -80px is here to prevent covering the main bars */
#widget-overflow,
#widget-overflow-mainView {
height: calc(100vh - 80px) !important;
vbox#protections-popup-content {
width: 100% !important;
margin: 0 var(--arrowpanel-menuitem-padding);
}
#protections-popup-category-list > * {
padding: 0 !important;
}
.whatsNew-message-body {
padding: 0 6px;
}
/* Adjust dialogues like "Confirm before closing multiple
......@@ -91,4 +59,82 @@
max-width: 100%;
}
body:has(#urlbar[breakout][breakout-extend],
#urlbar[breakout][breakout-extend-disabled][open]) #mainPopupSet panel {
visibility: hidden !important;
pointer-events: none !important;
}
}
@media (((orientation: landscape) and (max-height: 650px))
or ((-moz-bool-pref: "mcf.addressbarontop"), -moz-pref("mcf.addressbarontop"))) {
panel, box.panel-viewcontainer > box.panel-viewstack {
align-content: flex-start;
}
panelview.PanelUI-subView {
justify-content: flex-start;
}
panel {
margin-top: 88px !important;
}
}
/* CAREFUL: Do not gate these (or anything that runs inside a popup/panel)
* behind a media query! If you do, there will be a size calculation
* conflict between the DOM in the main window and the popup/panel, and
* the popup/panel will be sized incorrectly. This is extremely hard to
* debug, and I encourage you to increase this counter at your own
* leisure: Hours lost to this bug: 17
* */
/* Hide some context menu items,
* hide 'Customize Toolbar' in overflow menu */
#context-inspect,
#context-inspect-a11y,
#context-savelinktopocket,
#context-searchselect,
#context-sendlinktodevice,
#context-viewpartialsource-selection,
#inspect-separator,
#context-sep-selectall,
#frame-sep,
#overflowMenu-customize-button {
display: none !important
}
/* Fix menu sizes being wrong more often than not */
menupopup {
display: inline-block !important;
width: max-content !important;
min-width: max-content !important;
max-width: max-content !important;
block-size: max-content !important;
max-block-size: max-content !important;
min-block-size: max-content !important;
}
.menupopup-arrowscrollbox {
width: max-content !important;
max-width: calc(100vw - 16px) !important;
height: max-content !important;
max-height: calc(100vh - 16px) !important;
display: block !important;
overflow: clip !important;
}
/* Fix webextension popups */
browser.webextension-popup-browser {
background: transparent !important;
min-height: 40vh !important;
max-height: 70vh !important;
}
.webextension-popup-browser, .webextension-popup-stack {
max-width: 100% !important;
width: 100% !important;
min-width: 100% !important;
height: 100% !important;
}
src/userChrome/tabmenu.css
View file @ c8f4aa45
......@@ -90,17 +90,6 @@
transform: rotate(180deg) !important;
}
}
/* Similar hack to what's in appMenu.css to properly spawn the "all tabs"
* popup above the navigation menu */
#customizationui-widget-panel {
/* Further up than appmenu, because the "all tabs" button that spawns
* this menu is above the hamburger button that spawns the regular
* menu. */
margin-top: -360px !important;
height: 320px;
max-height: 320px;
}
}
/* All tabs menu: hide scroll buttons */
......@@ -113,28 +102,4 @@
#allTabsMenu-tabsSeparator {
display: none;
}
#allTabsMenu-allTabsView vbox.panel-subview-body {
/* Use the whole height */
height: 300px !important;
max-height: 300px !important;
}
#allTabsMenu-allTabsView vbox.panel-subview-body:first-child {
/* the allTabsMenu has a vbox.panel-subview-body inside another one.
* With -moz-box-flex: initial, it will show a scroll bar in each, but
* we only want one scrollbar. */
overflow-y: hidden !important;
}
#customizationui-widget-multiview box.panel-viewstack { /* since FF 113 */
/* Use the whole height */
height: 300px !important;
max-height: 300px !important;
}
#allTabsMenu-allTabsView-tabs { /* since FF 106 */
/* Make sure tabs with long titles don't exceed the all tabs menu */
max-width: calc(100vw - 20px);
}
}
src/userChrome/true-mobile-landscape.css 0 → 100644
View file @ c8f4aa45
/* Copyright 2024 user0, Peter Mack
* SPDX-License-Identifier: MPL-2.0 */
/* Apply this customization only on smaller screens in landscape mode */
@media (orientation: landscape) and (max-height: 650px) {
/* Density variables */
:root:not([uidensity="touch"]) {
--alltabs-button-height: 32px;
--alltabs-button-width: 32px;
--alltabs-button-position: 3.5px;
--urlbar-width: calc(100vw - 205.5px);
}
:root[uidensity="touch"] {
--alltabs-button-height: 34px;
--alltabs-button-width: 34px;
--alltabs-button-position: 4.5px;
--urlbar-width: calc(100vw - 209.5px);
}
/* Hide Tab Bar and Private Browsing indicator */
#tabbrowser-tabs,
#private-browsing-indicator-with-label {
visibility: collapse !important;
}
/* Move Nav Bar to bottom */
:root:not([uidensity="touch"], [inFullscreen]) {
--uc-bottom-toolbar-height: calc(
39px + var(--toolbarbutton-outer-padding)
);
}
:root[uidensity="touch"]:not([inFullscreen]) {
--uc-bottom-toolbar-height: calc(
43px + var(--toolbarbutton-outer-padding)
);
}
#browser,
#customization-container {
margin-bottom: var(--uc-bottom-toolbar-height, 0px);
}
#nav-bar {
position: fixed !important;
background-color: var(--panel-background);
bottom: 0px;
width: 100%;
z-index: 1;
}
#nav-bar[inFullscreen],
#TabsToolbar[inFullscreen],
.titlebar-buttonbox-container {
display: none;
}
.panel-viewstack {
max-height: unset !important;
}
/* Show Tab Manager Menu button */
#alltabs-button {
display: -moz-box !important;
}
/* Fix flickering of Tab Manager Menu and extension popups */
#customizationui-widget-panel,
#customizationui-widget-multiview box.panel-viewstack {
height: calc(100vh - 35px) !important;
max-height: calc(100vh - 35px) !important;
width: 100vw !important;
max-width: 100vw !important;
}
/* Expand Tab Manager Menu */
#customizationui-widget-multiview panelview {
max-width: 100% !important;
width: 100% !important;
}
/* Move Tab Manager Menu button to right of URL Bar */
:root {
--tab-border-radius: var(--toolbarbutton-border-radius) !important;
}
#alltabs-button > .toolbarbutton-badge-stack {
height: var(--alltabs-button-height) !important;
width: var(--alltabs-button-width) !important;
}
#alltabs-button {
position: absolute;
bottom: var(--alltabs-button-position) !important;
right: 0px;
z-index: 2 !important;
}
#alltabs-button > .toolbarbutton-badge-stack::before {
bottom: calc(var(--toolbarbutton-inner-padding) * 0.7) !important;
}
/* Allow room for Tab Manager Menu button */
#nav-bar {
width: calc(100vw - 34px) !important;
}
/* Make background not transparent */
body {
background-color: var(--toolbar-bgcolor);
}
/* Hide firefox-view tab, as none of the options in about:config hides it on FF 123+ */
#firefox-view-button {
display: none;
}
}
src/userChrome/urlbar.css
View file @ c8f4aa45
......@@ -66,26 +66,32 @@
display: none;
}
/* Fixing invisible URL bar on FF 133+ */
#urlbar[breakout][breakout-extend] {
width: --urlbar-width !important;
bottom: 0 !important;
z-index: 5 !important;
}
@media not (-moz-bool-pref: "mcf.addressbarontop"),
not (-moz-pref("mcf.addressbarontop")) {
/* Making sure we are not applying the following changes to ESR 128 */
#navigator-toolbox:not(:has(> #titlebar)) {
/* Fixing invisible URL bar on FF 133+
* Making the active URL bar wider for better text input and
* a wider popout */
#urlbar[breakout][breakout-extend] {
top: 0 !important;
align-content: flex-end !important;
left: 11vw !important; /* should be 10, but 10 looks off-center */
width: 80vw !important;
bottom: 0 !important;
z-index: 5 !important;
}
}
@media (-moz-bool-pref: "mcf.addressbarontop"),
-moz-pref("mcf.addressbarontop") {
#urlbar[breakout][breakout-extend] {
@media not (-moz-bool-pref: "mcf.addressbarontop"),
not (-moz-pref("mcf.addressbarontop")) {
#urlbar[breakout][breakout-extend] {
top: 0 !important;
align-content: flex-end !important;
}
}
@media (-moz-bool-pref: "mcf.addressbarontop"),
-moz-pref("mcf.addressbarontop") {
#urlbar[breakout][breakout-extend] {
top: calc(1.1 * --urlbar-container-height) !important;
align-content: flex-start !important;
}
}
}
......