summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rwxr-xr-xcss/desktop/account-dropdown.css (renamed from css/desktop/dropdown.css)12
-rwxr-xr-xcss/desktop/checkbox.css26
-rwxr-xr-xcss/desktop/login.css4
-rwxr-xr-xhtml/account.html2
-rwxr-xr-xhtml/stylesheets.html2
5 files changed, 35 insertions, 11 deletions
diff --git a/css/desktop/dropdown.css b/css/desktop/account-dropdown.css
index 4b9f526..f4d827f 100755
--- a/css/desktop/dropdown.css
+++ b/css/desktop/account-dropdown.css
@@ -16,20 +16,20 @@
* along with this program. If not, see <https://www.gnu.org/licenses/>.
*/
-.account .toggle {
+.account-dropdown .toggle {
display: none;
}
-.account .username {
+.account-dropdown .username {
margin: 3px;
cursor: pointer;
}
-.account .username:hover {
+.account-dropdown .username:hover {
text-decoration: underline;
}
-.account .menu {
+.account-dropdown .menu {
display: none;
position: absolute;
top: 100%;
@@ -40,11 +40,11 @@
border-radius: 0 0 3px 3px;
}
-.account .toggle:checked ~ .menu {
+.account-dropdown .toggle:checked ~ .menu {
display: block;
}
-.account .menu a {
+.account-dropdown .menu a {
display: block;
margin: 0;
padding: 1px 3px 1px 3px;
diff --git a/css/desktop/checkbox.css b/css/desktop/checkbox.css
index 5de1d8c..5ad0cbb 100755
--- a/css/desktop/checkbox.css
+++ b/css/desktop/checkbox.css
@@ -17,6 +17,30 @@
*/
.checkbox {
+ appearance: none;
+ -webkit-appearance: none;
margin: 0;
- accent-color: #12A3EB;
+ padding: 0;
+ width: 14px;
+ height: 14px;
+ font-size: 12px;
+ line-height: 12px;
+ text-align: center;
+ color: white;
+ background-color: white;
+ border: 1px solid #98A5B0;
+ border-radius: 3px;
+}
+
+.checkbox:focus {
+ outline: none;
+ border: 1px solid #98A5B0;
+}
+
+.checkbox:checked {
+ background-color: #12A3EB;
+}
+
+.checkbox:checked::before {
+ content: "\2713";
}
diff --git a/css/desktop/login.css b/css/desktop/login.css
index 46eda9e..0d63aa4 100755
--- a/css/desktop/login.css
+++ b/css/desktop/login.css
@@ -33,7 +33,7 @@
text-align: right;
}
-.login .group input {
+.login .group .input {
grid-column: 2;
width: 100%;
}
@@ -44,6 +44,6 @@
}
.login .group .checkbox {
- width: auto;
+ grid-column: 2;
justify-self: start;
}
diff --git a/html/account.html b/html/account.html
index 251d33e..0a4da65 100755
--- a/html/account.html
+++ b/html/account.html
@@ -16,7 +16,7 @@
along with this program. If not, see <https://www.gnu.org/licenses/>.
-->
-<div class="account">
+<div class="account-dropdown">
<input class="toggle" type="checkbox" id="account">
<label class="username" for="account">{{username}}</label>
<div class="menu">
diff --git a/html/stylesheets.html b/html/stylesheets.html
index 8c97095..4727f0f 100755
--- a/html/stylesheets.html
+++ b/html/stylesheets.html
@@ -26,4 +26,4 @@
<link rel="stylesheet" href="/css/{{device}}/input.css">
<link rel="stylesheet" href="/css/{{device}}/login.css">
<link rel="stylesheet" href="/css/{{device}}/navbar.css">
-<link rel="stylesheet" href="/css/{{device}}/dropdown.css">
+<link rel="stylesheet" href="/css/{{device}}/account-dropdown.css">