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
parent
a863f41268
commit
94f48b2c87
4 changed files with 124 additions and 114 deletions
|
|
@ -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,
|
||||||
font-size: 8pt;
|
.toolbaritem-combined-buttons {
|
||||||
}
|
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,
|
||||||
display: none;
|
#appMenu-edit-controls label {
|
||||||
}
|
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) */
|
||||||
display: none;
|
#appMenu-fullscreen-button {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -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 */
|
||||||
min-width: 160px;
|
[anonid="findbar-textbox-wrapper"] {
|
||||||
width: 160px;
|
min-width: 160px;
|
||||||
}
|
width: 160px;
|
||||||
[anonid="findbar-textbox"] {
|
}
|
||||||
max-width: 100px;
|
[anonid="findbar-textbox"] {
|
||||||
min-width: 100px;
|
max-width: 100px;
|
||||||
width: 100px;
|
min-width: 100px;
|
||||||
}
|
width: 100px;
|
||||||
.findbar-button {
|
}
|
||||||
font-size: 6pt;
|
.findbar-button {
|
||||||
}
|
font-size: 6pt;
|
||||||
/* Save space */
|
}
|
||||||
.findbar-match-diacritics,
|
/* Save space */
|
||||||
.findbar-entire-word,
|
.findbar-match-diacritics,
|
||||||
.found-matches,
|
.findbar-entire-word,
|
||||||
.findbar-find-status,
|
.found-matches,
|
||||||
.find-status-icon
|
.findbar-find-status,
|
||||||
{
|
.find-status-icon
|
||||||
display: none;
|
{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -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) {
|
||||||
* make font smaller so it fits the box */
|
/* Popup notifications (install add-on etc.): set max-width, remove icon and
|
||||||
.popup-notification-body-container {
|
* make font smaller so it fits the box */
|
||||||
max-width: 170px;
|
.popup-notification-body-container {
|
||||||
}
|
max-width: 170px;
|
||||||
.popup-notification-icon {
|
}
|
||||||
display: none;
|
.popup-notification-icon {
|
||||||
}
|
display: none;
|
||||||
.popup-notification-body {
|
}
|
||||||
font-size: 8pt;
|
.popup-notification-body {
|
||||||
}
|
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;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -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) {
|
||||||
- forward-button: also reachable via longpress of back button
|
/* Remove various buttons left and right of the URL bar:
|
||||||
- home-button: not important enough
|
- forward-button: also reachable via longpress of back button
|
||||||
- customizableui-special-spring: empty space
|
- home-button: not important enough
|
||||||
- library-button: also reachable via PanelUI-menu-button
|
- customizableui-special-spring: empty space
|
||||||
- sidebar-button: not useful on mobile (we try to gain horizontal space)
|
- library-button: also reachable via PanelUI-menu-button
|
||||||
- fxa-toolbar-menu-button: firefox cloud stuff, also reachable via #PanelUI-menu-button
|
- sidebar-button: not useful on mobile (we try to gain horizontal space)
|
||||||
*/
|
- fxa-toolbar-menu-button: firefox cloud stuff, also reachable via
|
||||||
/* #back-button */
|
#PanelUI-menu-button
|
||||||
#forward-button,
|
*/
|
||||||
/* #reload-button */
|
/* #back-button */
|
||||||
#home-button,
|
#forward-button,
|
||||||
#customizableui-special-spring1,
|
/* #reload-button */
|
||||||
/* (urlbar) */
|
#home-button,
|
||||||
#customizableui-special-spring2,
|
#customizableui-special-spring1,
|
||||||
#library-button,
|
/* (urlbar) */
|
||||||
#sidebar-button,
|
#customizableui-special-spring2,
|
||||||
#fxa-toolbar-menu-button
|
#library-button,
|
||||||
/* #PanelUI-menu-button */ {
|
#sidebar-button,
|
||||||
display: none !important;
|
#fxa-toolbar-menu-button
|
||||||
}
|
/* #PanelUI-menu-button */ {
|
||||||
|
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;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue