From a76a7dcc2d1621f498c1bc17b498bbbc8738fa36 Mon Sep 17 00:00:00 2001 From: Nirvin M Date: Apr 02 2022 09:47:23 +0000 Subject: Spacing and alignment improvements in popup * Add margin between controls * Vertically center align logo and addon title * Vertically center align page URL and refresh button --- diff --git a/common/common.css b/common/common.css index 0e55dcc..6b0c0a4 100644 --- a/common/common.css +++ b/common/common.css @@ -196,3 +196,20 @@ input:checked + .slider:before { content:"ON"; color: var(--slider-text-color); } + + +.flex { + display: flex; +} + +.flex.align-items-center { + align-items: center; +} + +.flex.justify-content-between { + justify-content: space-between; +} + +.text-large { + font-size: large; +} diff --git a/common/popup.css b/common/popup.css index 949d6d9..c57b4f7 100644 --- a/common/popup.css +++ b/common/popup.css @@ -54,6 +54,7 @@ h3 { #logo { width: 32px; + margin: 0 0.5em 0 0; display: inline; } @@ -77,16 +78,9 @@ h3 { vertical-align: 50%; } -#page-info { - display: flex; -} - #current-site { font-size: large; - text-align: center; - flex-grow: 1; - margin-right: 5px; - margin-left: 5px; + margin: 0 0.5em; } #level-select { @@ -163,7 +157,7 @@ label.js-toggle:after { align-items: center; } -.switch_wrapper > label, #page-info > label { +.switch_wrapper > label { font-size: large; white-space: nowrap; } @@ -204,3 +198,7 @@ label.js-toggle:after { color: #e8e6e3; filter: brightness(110%); } + +#level_controls, #nbs_whitelist, #fpd_whitelist { + margin: 6px 0; +} \ No newline at end of file diff --git a/common/popup.html b/common/popup.html index f4d6513..2dd9152 100644 --- a/common/popup.html +++ b/common/popup.html @@ -22,16 +22,16 @@ SPDX-License-Identifier: GPL-3.0-or-later
-
- -

JShelter

+
+
+

JShelter

-
- +
+