Make about: pages more adaptive (MR 10)

Adds stylesheets for some "about:" pages, the pages were chosen depending
on importance for user.

preferences.css was moved to sidebar.css since changes in this file could
be applied for more pages and were related only to sidebar.

Adds copyrights
This commit is contained in:
Anri Dellal 2021-05-20 12:41:54 +03:00 committed by Oliver Smith
parent add285e514
commit 4f2204fdd7
No known key found for this signature in database
GPG key ID: 5AE7F5513E0885CB
8 changed files with 163 additions and 2 deletions

View file

@ -0,0 +1,8 @@
/* Copyright 2021 Anri Dellal
SPDX-License-Identifier: GPL-3.0-or-later */
@-moz-document url("about:addons"), url-prefix("about:addons") {
:root {
--section-width: min(664px, 100%) !important;
}
}

View file

@ -0,0 +1,37 @@
/* Copyright 2021 Anri Dellal
SPDX-License-Identifier: GPL-3.0-or-later */
@-moz-document url("about:config") {
#search-container,
#toolbar, #prefs {
min-width: 300px !important;
}
@media (max-width: 644px) {
#toolbar {
flex-direction: column;
}
#about-config-search {
max-width: 100%;
}
#prefs {
word-wrap: anywhere;
}
.checkbox-container {
margin-top: 5px;
}
}
@media (max-width: 500px) {
tr {
font-size: 12px;
}
th {
padding-left: 8px !important;
}
}
}

View file

@ -0,0 +1,11 @@
/* Copyright 2021 Anri Dellal
SPDX-License-Identifier: GPL-3.0-or-later */
@-moz-document url("about:license") {
@media (max-width: 500px) {
.license-header {
background-image: none !important;
padding-inline-end: unset !important;
}
}
}

View file

@ -0,0 +1,24 @@
/* Copyright 2021 Anri Dellal
SPDX-License-Identifier: GPL-3.0-or-later */
@-moz-document url("about:logins") {
.container {
min-width: 300px !important;
}
@media (max-width: 700px) {
body {
--sidebar-width: 200px !important;
grid-template-columns: var(--sidebar-width) 1fr !important;
}
.edit-button, .delete-button {
font-size: 0 !important;
background-position: center;
}
#branding-logo {
display: none;
}
}
}

View file

@ -0,0 +1,11 @@
/* Copyright 2021 Anri Dellal
SPDX-License-Identifier: GPL-3.0-or-later */
@-moz-document url("about:policies"), url-prefix("about:policies") {
@media (max-width: 830px) {
tbody.collapsible td,
.active-policies td {
word-wrap: anywhere;
}
}
}

View file

@ -0,0 +1,49 @@
/* Copyright 2021 Anri Dellal
SPDX-License-Identifier: GPL-3.0-or-later */
@-moz-document url("about:protections") {
#report-content {
width: calc(100% - 16px) !important;
max-width: 800px !important;
}
/* hide element with Firefox for Android and iOS ad */
.lockwise-card .card-body,
#mobile-hanger {
display: none !important;
}
@media (max-width: 800px) {
#report-content {
margin: 16px 8px !important;
}
.icon {
width: 32px !important;
height: 32px !important;
}
.body-wrapper {
/* make trackers report to fill the entire card width */
grid-column-start: 1 !important;
grid-column-end: -1 !important;
}
#manage-protections,
#sign-up-for-monitor-link,
#save-passwords-button,
#get-proxy-extension-link {
/* move button on a separate row */
grid-area: 2 / 1 / 2 / 6 !important;
}
.card-header .wrapper {
grid-row-gap: 8px !important;
}
.card:not(.has-logins) .wrapper div:nth-child(1) {
/* make card title to use more width */
grid-column-end: -1 !important;
}
}
}

View file

@ -0,0 +1,11 @@
/* Copyright 2021 Anri Dellal
SPDX-License-Identifier: GPL-3.0-or-later */
@-moz-document url("about:rights") {
@media (max-width: 500px) {
.rights-header {
background-image: none !important;
padding-inline-end: unset !important;
}
}
}

View file

@ -1,10 +1,19 @@
@-moz-document url("about:preferences"), url-prefix("about:preferences") { /* Copyright 2021 plata, Anri Dellal
SPDX-License-Identifier: GPL-3.0-or-later */
@-moz-document regexp("about:(preferences|addons|policies).*") {
.category-icon {
user-select: none !important;
}
@media (max-width: 700px) { @media (max-width: 700px) {
/* avoid that sidebar is too wide */ /* avoid that sidebar is too wide */
:root { :root {
--in-content-sidebar-width: 50px !important; --in-content-sidebar-width: 50px !important;
--sidebar-width: 50px !important;
} }
/* reduce space around category icons */
#categories > .category { #categories > .category {
margin-inline-start: auto !important; margin-inline-start: auto !important;
padding-inline: auto !important; padding-inline: auto !important;
@ -14,6 +23,7 @@
display: none !important; display: none !important;
} }
/* reduce space around footer icons (addons, help) */
.sidebar-footer-list { .sidebar-footer-list {
margin-inline: auto !important; margin-inline: auto !important;
padding-inline: auto !important; padding-inline: auto !important;