You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
31 lines
3.3 KiB
31 lines
3.3 KiB
1 year ago
|
/*\
|
||
|
|
|*| ========================================================================
|
||
|
|
|*| Bootstrap Toggle: bootstrap4-toggle.css v3.6.1
|
||
|
|
|*| https://gitbrent.github.io/bootstrap4-toggle/
|
||
|
|
|*| ========================================================================
|
||
|
|
|*| Copyright 2018-2019 Brent Ely
|
||
|
|
|*| Licensed under MIT
|
||
|
|
|*| ========================================================================
|
||
|
|
\*/
|
||
|
|
:root {
|
||
|
|
--primary:#707cd2;
|
||
|
|
--secondary:#8898aa;
|
||
|
|
--danger:#ff5050;
|
||
|
|
--success:#2cd07e;
|
||
|
|
--warning:#ffc36d;
|
||
|
|
--info:#2cabe3;
|
||
|
|
--light:#f7fafc;
|
||
|
|
--dark:#343a40;
|
||
|
|
}
|
||
|
|
.btn-group-xs>.btn,.btn-xs{padding:.35rem .4rem .25rem .4rem;font-size:.875rem;line-height:.5;border-radius:.2rem}.checkbox label .toggle,.checkbox-inline .toggle{margin-left:-1.25rem;margin-right:.35rem}.toggle{position:relative;overflow:hidden}.toggle.btn.btn-light,.toggle.btn.btn-outline-light{border-color:rgba(0,0,0,.15)}.toggle input[type=checkbox]{display:none}.toggle-group{position:absolute;width:200%;top:0;bottom:0;left:0;transition:left .35s;-webkit-transition:left .35s;-moz-user-select:none;-webkit-user-select:none}.toggle-group label,.toggle-group span{cursor:pointer}.toggle.off .toggle-group{left:-100%}.toggle-on{position:absolute;top:0;bottom:0;left:0;right:50%;margin:0;border:0;border-radius:0}.toggle-off{position:absolute;top:0;bottom:0;left:46%;right:0;margin:0;border:0;border-radius:0;box-shadow:none}.toggle-handle{position:relative;margin:0 auto;padding-top:0;padding-bottom:0;height:100%;width:0;border-width:0 1px;background-color:#fff}.toggle.btn-outline-primary .toggle-handle{background-color:var(--primary);border-color:var(--primary)}.toggle.btn-outline-secondary .toggle-handle{background-color:var(--secondary);border-color:var(--secondary)}.toggle.btn-outline-success .toggle-handle{background-color:var(--success);border-color:var(--success)}.toggle.btn-outline-danger .toggle-handle{background-color:var(--danger);border-color:var(--danger)}.toggle.btn-outline-warning .toggle-handle{background-color:var(--warning);border-color:var(--warning)}.toggle.btn-outline-info .toggle-handle{background-color:var(--info);border-color:var(--info)}.toggle.btn-outline-light .toggle-handle{background-color:var(--light);border-color:var(--light)}.toggle.btn-outline-dark .toggle-handle{background-color:var(--dark);border-color:var(--dark)}.toggle[class*=btn-outline]:hover .toggle-handle{background-color:var(--light);opacity:.5}.toggle.btn{min-width:3.7rem;min-height:2.15rem}.toggle-on.btn{padding-right:1.5rem}.toggle-off.btn{padding-left:1.7rem}.toggle.btn-lg{min-width:5rem;min-height:2.815rem}.toggle-on.btn-lg{padding-right:2rem}.toggle-off.btn-lg{padding-left:2rem}.toggle-handle.btn-lg{width:2.5rem}.toggle.btn-sm{min-width:3.125rem;min-height:1.938rem}.toggle-on.btn-sm{padding-right:1rem}.toggle-off.btn-sm{padding-left:1rem}.toggle.btn-xs{min-width:2.19rem;min-height:1.375rem}.toggle-on.btn-xs{padding-right:.8rem}.toggle-off.btn-xs{padding-left:.8rem}
|
||
|
|
|
||
|
|
|
||
|
|
.toggle.ios, .toggle-on.ios, .toggle-off.ios { border-radius: 20rem; }
|
||
|
|
.toggle.ios .toggle-handle { border-radius: 20rem; }
|
||
|
|
|
||
|
|
.toggle.android { border-radius: 0px;}
|
||
|
|
.toggle.android .toggle-handle { border-radius: 0px; }
|
||
|
|
|
||
|
|
.slow .toggle-group { transition: left 0.7s; -webkit-transition: left 0.7s; }
|
||
|
|
.fast .toggle-group { transition: left 0.1s; -webkit-transition: left 0.1s; }
|
||
|
|
.quick .toggle-group { transition: none; -webkit-transition: none; }
|