diff --git a/buildoz.css b/buildoz.css index 25585b8..d544e74 100644 --- a/buildoz.css +++ b/buildoz.css @@ -1,6 +1,6 @@ bz-select { display: block; - margin: .5rem 0 .5rem 0; + margin: .5em 0 .5em 0; position:relative; } bz-select[disabled] > button{ @@ -13,31 +13,32 @@ bz-select > button{ width:100%; text-align: left; font-family: sans; - font-size: .9rem; - border-radius: 1rem; + font-size: .9em; + border-radius: 1em; border: none; - padding: 0.2rem .2rem .3rem .5rem; + padding: 0.2em .2em .3em .5em; background: linear-gradient( to bottom, #555, #aaa 15%, #ccc 50%, #aaa 85%, #555 ); } bz-select > button::after { content: "\00BB"; - transform: rotate(90deg) translateX(-0.4rem); + transform: rotate(90deg); position: absolute; - right: 0.5rem; + right: 0.5em; + top: 0; pointer-events: none; - font-size: 1.5rem; + font-size: 1.5em; color: #444; } bz-select option{ background-color: #DDD; color: #000; - padding: 0.2rem .2rem .3rem .5rem; - margin: -1rem 0 0 0; - border-radius: 1rem; - height: 1rem; + padding: 0.2em .2em .3em .5em; + margin: -1em 0 0 0; + border-radius: 1em; + height: 1em; font-family: sans; - font-size: .9rem; + font-size: .9em; opacity: 0; pointer-events: none; transition: @@ -59,31 +60,31 @@ bz-select option:hover{ bz-toggler{ outline: none; - min-height: 1.5rem; - padding: 0.75rem !important; + min-height: 1.5em; + padding: 0.75em; display: inline-table; max-width: fit-content; transition: all 0.5s; } bz-toggler div.toggle-label-left{ - padding-right: 0.3rem; - display: table-cell; + padding-right: 0.3em; + display: inline; vertical-align: middle; text-align: right; - font-size:.8rem; + font-size:.8em; } bz-toggler div.toggle-label-right{ - padding-left: 0.3rem; - display: table-cell; + padding-left: 0.3em; + display: inline; vertical-align: middle; text-align: left; - font-size:.8rem; + font-size:.8em; } bz-toggler div.toggle-switch{ user-select: none; height: inherit; cursor: pointer; - display: table-cell; + display: inline; vertical-align: middle; text-align: center; } @@ -109,17 +110,18 @@ bz-toggler div.toggle-switch span.toggle-thumb.turned-on { transition: all 0.4s; } bz-toggler div.toggle-switch span.toggle-bar { - width: 2rem; - height: 0.75rem; - border-radius: .75rem; + width: 2em; + height: 0.75em; + border-radius: .75em; } bz-toggler div.toggle-switch span.toggle-thumb { - height: 1rem; - width: 1rem; - top: -0.1rem; + height: 1em; + width: 1em; + top: 50%; + transform: translateY(-50%); } bz-toggler div.toggle-switch span.toggle-thumb.turned-on { - left : 1rem; + left : 1em; } \ No newline at end of file