Fix layout

This commit is contained in:
AlphaX-Projects 2022-03-08 11:50:47 +01:00 committed by GitHub
parent b36608ed00
commit cab77873dd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -47,8 +47,9 @@ class QortThemeToggle extends LitElement {
height: 16px; height: 16px;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
background-color: var(--switchbackground);
border: 2px solid var(--switchborder);
border-radius: 1rem; border-radius: 1rem;
background-color: var(--graylight);
transition: all .4s ease; transition: all .4s ease;
} }
@ -58,8 +59,8 @@ class QortThemeToggle extends LitElement {
display: inline-block; display: inline-block;
position: absolute; position: absolute;
top: 50%; top: 50%;
background: var(--graylight); background: var(--switchbackground);
border: 2px solid var(--gray); border: 2px solid var(--switchborder);
border-radius: 50%; border-radius: 50%;
transition: transform 300ms ease; transition: transform 300ms ease;
} }
@ -70,7 +71,7 @@ class QortThemeToggle extends LitElement {
input:checked ~ .icon, input:checked ~ .icon,
:host([theme="dark"]) .icon { :host([theme="dark"]) .icon {
transform: translate(calc(100% - 18px), -50%); transform: translate(calc(100% - 12px), -50%);
} }
.moon { .moon {
@ -131,4 +132,4 @@ class QortThemeToggle extends LitElement {
} }
} }
window.customElements.define('qort-theme-toggle', QortThemeToggle); window.customElements.define('qort-theme-toggle', QortThemeToggle);