Skip to content

Instantly share code, notes, and snippets.

<!DOCTYPE html>
<html>
<head>
<title>Customized range slider, pure CSS</title>
<style>
body {
background: #f8f8f8;
}
.slider {
width: 302px;
<!DOCTYPE html>
<html>
<head>
<title>Toggle Switch</title>
<style>
.switch {
position: relative;
}
.switch label {
width: 55px;
<!DOCTYPE html>
<html>
<head>
<title>CSS3 Checkbox</title>
<style type="text/css">
.checkbox {
width: 30px;
height: 30px;
background-color: #ddd;
position: relative;
<!DOCTYPE html>
<html>
<head>
<title>Notification Bar</title>
<link rel="stylesheet" type="text/css" href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
<style type="text/css">
.container {
padding: 20px;
}
.notificationBar {
<html>
<head>
<title>Step progress bar</title>
<style type="text/css">
.container {
width: 100%;
}
.progressbar {
counter-reset: step;
}
<script type="text/javascript" src="/js/lib/less.js"></script>
<div ng-show="isLoading" class="dashboardLoading" style="display: none;">Loading...</div>
<customtheme value=""></customtheme>
<div ng-show="!isLoading" class="dashboardContainers" style="">
<!-- ngRepeat: row in rows --><div ng-repeat="row in rows" class="row-fluid ng-scope">
<!-- ngRepeat: container in row.containers --><div ng-repeat="container in row.containers" ng-class="'span'+(container.width || 12)" class="dashboardContainer ng-scope span12">
<div id="1" ng-class="'containerHeight'+container.height" class="containerInner containerHeight1" dashboardid="123" containerindex="0">
<div class="widgets">
<!-- ngRepeat: row in rows --><div ng-repeat="row in rows" class="row-fluid widgetRow ng-scope">
<!-- ngRepeat: widget in row.widgets track by widget.id --><div ng-repeat="widget in row.widgets track by widget.id" ng-class="'span'+widget.width" dashboardid="123" containerindex="0" class="widgetConta