userChrome: fix convergence usage case

Only apply rules from userChrome.css if the screen width is 700px or
less.
This commit is contained in:
Oliver Smith 2020-11-22 15:59:03 +01:00
parent a863f41268
commit 94f48b2c87
No known key found for this signature in database
GPG key ID: 5AE7F5513E0885CB
4 changed files with 124 additions and 114 deletions

View file

@ -1,45 +1,48 @@
/* Copyright 2020 Oliver Smith /* Copyright 2020 Oliver Smith
SPDX-License-Identifier: GPL-3.0-or-later */ SPDX-License-Identifier: GPL-3.0-or-later */
.subviewbutton, @media (max-width: 700px) {
.toolbaritem-combined-buttons { .subviewbutton,
.toolbaritem-combined-buttons {
font-size: 8pt; font-size: 8pt;
} }
#appMenu-protection-report-button, #appMenu-protection-report-button,
#appMenuRestoreLastSession, #appMenuRestoreLastSession,
#appMenu-customize-button, #appMenu-customize-button,
#appMenu-open-file-button, #appMenu-open-file-button,
#appMenu-more-button, #appMenu-more-button,
#appMenu-developer-button, #appMenu-developer-button,
#appMenu-whatsnew-button, #appMenu-whatsnew-button,
#appMenu-help-button, #appMenu-help-button,
#appMenu-quit-button { #appMenu-quit-button {
display: none; display: none;
} }
toolbarseparator { toolbarseparator {
display: none; display: none;
} }
/* Zoom/edit: move controls to the left (so they are visible), hide label (it's obvious what they do) and spacer */ /* Zoom/edit: move controls to the left (so they are visible), hide
#appMenu-zoom-controls spacer, * label (it's obvious what they do) and spacer */
#appMenu-zoom-controls label, #appMenu-zoom-controls spacer,
#appMenu-edit-controls spacer, #appMenu-zoom-controls label,
#appMenu-edit-controls label { #appMenu-edit-controls spacer,
#appMenu-edit-controls label {
display: none; display: none;
} }
/* Zoom/edit: center the controls somewhat */ /* Zoom/edit: center the controls somewhat */
#appMenu-zoom-controls { #appMenu-zoom-controls {
padding-left: 20px; padding-left: 20px;
} }
#appMenu-edit-controls { #appMenu-edit-controls {
padding-left: 15px; padding-left: 15px;
} }
/* Zoom: hide fullscreen button (not possible to exit fullscreen without keyboard) */ /* Zoom: hide fullscreen button (not possible to exit fullscreen
#appMenu-fullscreen-button { * without keyboard) */
#appMenu-fullscreen-button {
display: none; display: none;
}
} }

View file

@ -1,25 +1,27 @@
/* Copyright 2020 Oliver Smith /* Copyright 2020 Oliver Smith
SPDX-License-Identifier: GPL-3.0-or-later */ SPDX-License-Identifier: GPL-3.0-or-later */
/* Findbar */ @media (max-width: 700px) {
[anonid="findbar-textbox-wrapper"] { /* Findbar */
[anonid="findbar-textbox-wrapper"] {
min-width: 160px; min-width: 160px;
width: 160px; width: 160px;
} }
[anonid="findbar-textbox"] { [anonid="findbar-textbox"] {
max-width: 100px; max-width: 100px;
min-width: 100px; min-width: 100px;
width: 100px; width: 100px;
} }
.findbar-button { .findbar-button {
font-size: 6pt; font-size: 6pt;
} }
/* Save space */ /* Save space */
.findbar-match-diacritics, .findbar-match-diacritics,
.findbar-entire-word, .findbar-entire-word,
.found-matches, .found-matches,
.findbar-find-status, .findbar-find-status,
.find-status-icon .find-status-icon
{ {
display: none; display: none;
}
} }

View file

@ -1,31 +1,33 @@
/* Copyright 2020 Oliver Smith /* Copyright 2020 Oliver Smith
SPDX-License-Identifier: GPL-3.0-or-later */ SPDX-License-Identifier: GPL-3.0-or-later */
/* Popup notifications (install add-on etc.): set max-width, remove icon and @media (max-width: 700px) {
/* Popup notifications (install add-on etc.): set max-width, remove icon and
* make font smaller so it fits the box */ * make font smaller so it fits the box */
.popup-notification-body-container { .popup-notification-body-container {
max-width: 170px; max-width: 170px;
} }
.popup-notification-icon { .popup-notification-icon {
display: none; display: none;
} }
.popup-notification-body { .popup-notification-body {
font-size: 8pt; font-size: 8pt;
} }
/* "Site information" (displayed when clicking the lock icon) /* "Site information" (displayed when clicking the lock icon)
* Making everything so small doesn't look terribly nice, but least it fits the * Making everything so small doesn't look terribly nice, but least it fits the
* popup and everything is clickable. */ * popup and everything is clickable. */
#identity-popup-multiView .panel-viewcontainer { #identity-popup-multiView .panel-viewcontainer {
font-size: 4pt; font-size: 4pt;
} }
#identity-popup-clear-sitedata-footer, #identity-popup-clear-sitedata-footer,
#identity-popup-more-info-footer { #identity-popup-more-info-footer {
font-size: 7pt; font-size: 7pt;
} }
/* "Protections" (displayed when clicking the shield icon) /* "Protections" (displayed when clicking the shield icon)
* Same reasoning for small font, as for identity-popup above. */ * Same reasoning for small font, as for identity-popup above. */
#protections-popup-mainView { #protections-popup-mainView {
font-size: 4pt; font-size: 4pt;
}
} }

View file

@ -6,38 +6,41 @@
min-width: 150px !important; min-width: 150px !important;
} }
/* Remove various buttons left and right of the URL bar: @media (max-width: 700px) {
/* Remove various buttons left and right of the URL bar:
- forward-button: also reachable via longpress of back button - forward-button: also reachable via longpress of back button
- home-button: not important enough - home-button: not important enough
- customizableui-special-spring: empty space - customizableui-special-spring: empty space
- library-button: also reachable via PanelUI-menu-button - library-button: also reachable via PanelUI-menu-button
- sidebar-button: not useful on mobile (we try to gain horizontal space) - sidebar-button: not useful on mobile (we try to gain horizontal space)
- fxa-toolbar-menu-button: firefox cloud stuff, also reachable via #PanelUI-menu-button - fxa-toolbar-menu-button: firefox cloud stuff, also reachable via
*/ #PanelUI-menu-button
/* #back-button */ */
#forward-button, /* #back-button */
/* #reload-button */ #forward-button,
#home-button, /* #reload-button */
#customizableui-special-spring1, #home-button,
/* (urlbar) */ #customizableui-special-spring1,
#customizableui-special-spring2, /* (urlbar) */
#library-button, #customizableui-special-spring2,
#sidebar-button, #library-button,
#fxa-toolbar-menu-button #sidebar-button,
/* #PanelUI-menu-button */ { #fxa-toolbar-menu-button
/* #PanelUI-menu-button */ {
display: none !important; display: none !important;
} }
/* Smaller font: show more of the URL */ /* Smaller font: show more of the URL */
#urlbar-input { #urlbar-input {
font-size: 9pt !important; font-size: 9pt !important;
} }
/* Focused urlbar: hide all icons around it, so we have more space to edit the URL */ /* Focused urlbar: hide all icons around it, so we have more space to edit the URL */
#urlbar[focused] #identity-box, #urlbar[focused] #identity-box,
#urlbar[focused] #tracking-protection-icon-container, #urlbar[focused] #tracking-protection-icon-container,
/* #urlbar-input */ /* #urlbar-input */
#urlbar[focused] #reader-mode-button, #urlbar[focused] #reader-mode-button,
#urlbar[focused] #pageActionButton { #urlbar[focused] #pageActionButton {
display: none; display: none;
}
} }