Application sans titre
MyApp
Author name
1.0
Desktop
False
800
1280
False
False
False
False
WebApp
False
E:\Philippe\Documents\VisualNeoWeb\Libraries\img\default-icon.png
/* From Uiverse.io by Pradeepsaranbishnoi */
.bauble_box .bauble_label {
background: #2c2;
background-position: 62px 5px;
background-repeat: no-repeat;
background-size: auto 5px;
border: 0;
border-radius: 50px;
box-shadow: inset 0 10px 20px rgba(0,0,0,.4), 0 -1px 0px rgba(0,0,0,.2), inset 0 -1px 0px #fff;
cursor: pointer;
display: inline-block;
font-size: 0;
height: 28px;
position: relative;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
width: 65px;
}
.bauble_box .bauble_label:before {
background-color: rgba(255,255,255,.2);
background-position: 0 0;
background-repeat: repeat;
background-size: 30% auto;
border-radius: 50%;
box-shadow: inset 0 -5px 25px #050, 0 10px 20px rgba(0,0,0,.4);
content: '';
display: block;
height: 22px;
left: 5px;
position: absolute;
top: 3px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
width: 22px;
z-index: 2;
}
.bauble_box input.bauble_input {
opacity: 0;
z-index: 0;
}
/* Checked */
.bauble_box input.bauble_input:checked + .bauble_label {
background-color: #c22;
}
.bauble_box input.bauble_input:checked + .bauble_label:before {
background-position: 150% 0;
box-shadow: inset 0 -5px 25px #500, 0 10px 20px rgba(0,0,0,.4);
left: calc( 100% - 35px );
}
en
standalone
Offline page
#000000
/
[AndroidOS,iOS,WindowsPhoneOS]
normal
True
True
False
True
True
False
False
True
False
False
220px
440px
120px
60px
bauble_box
<!-- From Uiverse.io by Pradeepsaranbishnoi -->
<input ng-model="$root.checkboxvalue" class="bauble_input" id="bauble_check" name="bauble" type="checkbox">
<label class="bauble_label" for="bauble_check">Toggle</label>
60px
520px
280px
70px
[checkboxvalue]
0px
0px
800px
1280px
False
custom