app: Update style for toggle button

Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
This commit is contained in:
Sunil Mohan Adapa 2020-02-17 21:20:55 -08:00 committed by James Valleroy
parent 6c426c1f20
commit 58640f6dfb
No known key found for this signature in database
GPG Key ID: 77C0C75E7B650808

View File

@ -493,11 +493,13 @@ a.menu_link_active {
justify-content: flex-end; justify-content: flex-end;
} }
/*
* Toggle button
*/
.toggle-button { .toggle-button {
border-radius: 25px; border-radius: 13px;
border: none; width: 50px;
width: 55px; height: 26px;
height: 25px;
background: #ccc; background: #ccc;
position: relative; position: relative;
} }
@ -505,26 +507,23 @@ a.menu_link_active {
.toggle-button::before { .toggle-button::before {
content: ''; content: '';
display: block; display: block;
height: 18px; height: 24px;
width: 18px; width: 24px;
border-radius: 100%; border-radius: 100%;
background: #fff; background: #fff;
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 6%; left: 0%;
transform: translateY(-50%); transform: translateY(-50%);
} }
.toggle-button--toggled { .toggle-button--toggled {
background: #337ab7; background: #4989D4;
} }
.toggle-button--toggled::before { .toggle-button--toggled::before {
content: '';
position: absolute;
top: 50%;
left: 100%; left: 100%;
transform: translateY(-50%) translateX(-116%) transform: translateY(-50%) translateX(-100%)
} }
.header-bar { .header-bar {