mirror of
https://github.com/woodpecker-ci/woodpecker.git
synced 2024-11-27 20:31:10 +00:00
1194 lines
22 KiB
CSS
1194 lines
22 KiB
CSS
|
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
html {
|
|||
|
|
height:100%;
|
|||
|
|
overflow:hidden;
|
|||
|
|
font-family:'Open Sans';
|
|||
|
|
width:100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
body {
|
|||
|
|
height:100%;
|
|||
|
|
font-family:'Open Sans';
|
|||
|
|
overflow:hidden;
|
|||
|
|
width:100%;
|
|||
|
|
|
|||
|
|
/*
|
|||
|
|
background: #f9f9f9;
|
|||
|
|
background: -moz-linear-gradient(left, #383C3B 50%,#f7f7f7 50%);
|
|||
|
|
background: -webkit-linear-gradient(left, #383C3B 50%,#f7f7f7 50%);
|
|||
|
|
background: -o-linear-gradient(left, #383C3B 50%,#f7f7f7 50%);
|
|||
|
|
background: -ms-linear-gradient(left, #383C3B 50%,#f7f7f7 50%);
|
|||
|
|
background: linear-gradient(to right, #383C3B 50%,#f7f7f7 50%);
|
|||
|
|
*/
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pull-right {
|
|||
|
|
float:right;
|
|||
|
|
}
|
|||
|
|
.pull-left {
|
|||
|
|
float:left;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.is-hidden,
|
|||
|
|
.hide {
|
|||
|
|
display:none !IMPORTANT;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
h1, h2, h3, h4, h5, p, a {
|
|||
|
|
font-family:'Open Sans';
|
|||
|
|
padding:0px;
|
|||
|
|
margin:0px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-form span.pure-input {
|
|||
|
|
padding: 0.5em 0.6em;
|
|||
|
|
display: inline-block;
|
|||
|
|
border: 1px solid #ccc;
|
|||
|
|
box-shadow: inset 0 1px 3px #ddd;
|
|||
|
|
border-radius: 4px;
|
|||
|
|
-webkit-box-sizing: border-box;
|
|||
|
|
-moz-box-sizing: border-box;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* Hidding the radiobuttons & checkboxes */
|
|||
|
|
input[type="radio"] {
|
|||
|
|
display:none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* Hidding the "check" status of inputs */
|
|||
|
|
input[type="radio"] + label:before {
|
|||
|
|
cursor: pointer;
|
|||
|
|
display: inline-block;
|
|||
|
|
font-family:'FontAwesome';
|
|||
|
|
content: "\f10c";
|
|||
|
|
font-size: 18px;
|
|||
|
|
color:#CCC;
|
|||
|
|
vertical-align:middle;
|
|||
|
|
padding-right:10px;
|
|||
|
|
line-height: 22px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
input[type="radio"]:checked + label:before {
|
|||
|
|
cursor: pointer;
|
|||
|
|
display: inline-block;
|
|||
|
|
font-family:'FontAwesome';
|
|||
|
|
content: "\f05d";
|
|||
|
|
font-size: 18px;
|
|||
|
|
color:#CCC;
|
|||
|
|
vertical-align:middle;
|
|||
|
|
padding-right:10px;
|
|||
|
|
line-height: 22px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* scrollbars */
|
|||
|
|
/* see https://gist.github.com/fanzeyi/3995618 */
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar{
|
|||
|
|
height:16px;
|
|||
|
|
overflow:visible;
|
|||
|
|
width:16px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-button{
|
|||
|
|
height:0;
|
|||
|
|
width:0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-track{
|
|||
|
|
background-clip:padding-box;
|
|||
|
|
border:solid transparent;
|
|||
|
|
border-width:0 0 0 4px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-track:horizontal{
|
|||
|
|
border-width:4px 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-track:hover{
|
|||
|
|
background-color:rgba(0,0,0,.05);
|
|||
|
|
box-shadow:inset 1px 0 0 rgba(0,0,0,.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-track:horizontal:hover{
|
|||
|
|
box-shadow:inset 0 1px 0 rgba(0,0,0,.1);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-track:active{
|
|||
|
|
background-color:rgba(0,0,0,.05);
|
|||
|
|
box-shadow:inset 1px 0 0 rgba(0,0,0,.14),inset -1px 0 0 rgba(0,0,0,.07);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-track:horizontal:active{
|
|||
|
|
box-shadow:inset 0 1px 0 rgba(0,0,0,.14),inset 0 -1px 0 rgba(0,0,0,.07);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-thumb{
|
|||
|
|
background-color:rgba(0,0,0,.2);
|
|||
|
|
background-clip:padding-box;
|
|||
|
|
border:solid transparent;
|
|||
|
|
border-width:1px 1px 1px 6px;
|
|||
|
|
min-height:28px;
|
|||
|
|
padding:100px 0 0;
|
|||
|
|
box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-thumb:horizontal{
|
|||
|
|
border-width:6px 1px 1px;
|
|||
|
|
padding:0 0 0 100px;
|
|||
|
|
box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset -1px 0 0 rgba(0,0,0,.07);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-thumb:hover{
|
|||
|
|
background-color:rgba(0,0,0,.4);
|
|||
|
|
box-shadow:inset 1px 1px 1px rgba(0,0,0,.25);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-thumb:active{
|
|||
|
|
background-color:rgba(0,0,0,0.5);
|
|||
|
|
box-shadow:inset 1px 1px 3px rgba(0,0,0,0.35);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-webkit-scrollbar-corner{
|
|||
|
|
background:transparent;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
body::-webkit-scrollbar-track-piece{
|
|||
|
|
background-clip:padding-box;
|
|||
|
|
background-color:#f5f5f5;
|
|||
|
|
border:solid #fff;
|
|||
|
|
border-width:0 0 0 3px;
|
|||
|
|
box-shadow:inset 1px 0 0 rgba(0,0,0,.14),inset -1px 0 0 rgba(0,0,0,.07);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
body::-webkit-scrollbar-track-piece:horizontal{
|
|||
|
|
border-width:3px 0 0;
|
|||
|
|
box-shadow:inset 0 1px 0 rgba(0,0,0,.14),inset 0 -1px 0 rgba(0,0,0,.07);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
body::-webkit-scrollbar-thumb{
|
|||
|
|
border-width:1px 1px 1px 5px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
body::-webkit-scrollbar-thumb:horizontal{
|
|||
|
|
border-width:5px 1px 1px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
body::-webkit-scrollbar-corner{
|
|||
|
|
background-clip:padding-box;
|
|||
|
|
background-color:#f5f5f5;
|
|||
|
|
border:solid #fff;
|
|||
|
|
border-width:3px 0 0 3px;
|
|||
|
|
box-shadow:inset 1px 1px 0 rgba(0,0,0,.14);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* layout */
|
|||
|
|
|
|||
|
|
#layout, #page {
|
|||
|
|
display: -webkit-box;
|
|||
|
|
display: -moz-box;
|
|||
|
|
display: -ms-flexbox;
|
|||
|
|
display: -webkit-flex;
|
|||
|
|
display: flex;
|
|||
|
|
-webkit-box-direction: normal;
|
|||
|
|
-moz-box-direction: normal;
|
|||
|
|
-webkit-box-orient: horizontal;
|
|||
|
|
-moz-box-orient: horizontal;
|
|||
|
|
-webkit-flex-direction: row;
|
|||
|
|
-ms-flex-direction: row;
|
|||
|
|
flex-direction: row;
|
|||
|
|
-webkit-flex-wrap: nowrap;
|
|||
|
|
-ms-flex-wrap: nowrap;
|
|||
|
|
flex-wrap: nowrap;
|
|||
|
|
-webkit-box-pack: flex-start;
|
|||
|
|
-moz-box-pack: flex-start;
|
|||
|
|
-webkit-justify-content: flex-start;
|
|||
|
|
-ms-flex-pack: flex-start;
|
|||
|
|
justify-content: flex-start;
|
|||
|
|
-webkit-align-content: stretch;
|
|||
|
|
-ms-flex-line-pack: stretch;
|
|||
|
|
align-content: stretch;
|
|||
|
|
-webkit-box-align: stretch;
|
|||
|
|
-moz-box-align: stretch;
|
|||
|
|
-webkit-align-items: stretch;
|
|||
|
|
-ms-flex-align: stretch;
|
|||
|
|
align-items: stretch;
|
|||
|
|
height:100%;
|
|||
|
|
background:#FFF;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#menu {
|
|||
|
|
-webkit-box-ordinal-group: 1;
|
|||
|
|
-moz-box-ordinal-group: 1;
|
|||
|
|
-webkit-order: 1;
|
|||
|
|
-ms-flex-order: 1;
|
|||
|
|
order: 1;
|
|||
|
|
-webkit-box-flex: 0;
|
|||
|
|
-moz-box-flex: 0;
|
|||
|
|
-webkit-flex: 0 0 250px;
|
|||
|
|
-ms-flex: 0 0 250px;
|
|||
|
|
flex: 0 0 250px;
|
|||
|
|
-webkit-align-self: auto;
|
|||
|
|
-ms-flex-item-align: auto;
|
|||
|
|
align-self: auto;
|
|||
|
|
width: 30px; /* To make the transition work nicely */
|
|||
|
|
-webkit-transition: flex 0.3s ease-out;
|
|||
|
|
transition: flex 0.3s ease-out;
|
|||
|
|
background:#262829;
|
|||
|
|
background:#222625;
|
|||
|
|
overflow:hidden;
|
|||
|
|
overflow-y:auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#page {
|
|||
|
|
-webkit-box-ordinal-group: 2;
|
|||
|
|
-moz-box-ordinal-group: 2;
|
|||
|
|
-webkit-order: 2;
|
|||
|
|
-ms-flex-order: 2;
|
|||
|
|
order: 2;
|
|||
|
|
-webkit-box-flex: 1;
|
|||
|
|
-moz-box-flex: 1;
|
|||
|
|
-webkit-flex: 1 1 auto;
|
|||
|
|
-ms-flex: 1 1 auto;
|
|||
|
|
flex: 1 1 auto;
|
|||
|
|
-webkit-align-self: stretch;
|
|||
|
|
-ms-flex-item-align: stretch;
|
|||
|
|
align-self: stretch;
|
|||
|
|
overflow-y:auto;
|
|||
|
|
overflow-x:hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
#meta {
|
|||
|
|
-webkit-box-ordinal-group: 1;
|
|||
|
|
-moz-box-ordinal-group: 1;
|
|||
|
|
-webkit-order: 2;
|
|||
|
|
-ms-flex-order:2;
|
|||
|
|
order: 2;
|
|||
|
|
-webkit-box-flex: 0;
|
|||
|
|
-moz-box-flex: 0;
|
|||
|
|
-webkit-flex: 0 0 250px;
|
|||
|
|
-ms-flex: 0 0 250px;
|
|||
|
|
flex: 0 0 250px;
|
|||
|
|
-webkit-align-self: auto;
|
|||
|
|
-ms-flex-item-align: auto;
|
|||
|
|
align-self: auto;
|
|||
|
|
|
|||
|
|
|
|||
|
|
width: 30px; /* To make the transition work nicely. (Transitions to/from
|
|||
|
|
"width:auto" are buggy in Gecko and Webkit, at least.
|
|||
|
|
See http://bugzil.la/731886 for more info.) */
|
|||
|
|
|
|||
|
|
-webkit-transition: flex 0.3s ease-out;
|
|||
|
|
transition: flex 0.3s ease-out;
|
|||
|
|
overflow-y:auto;
|
|||
|
|
overflow-x:hidden;
|
|||
|
|
background:#f7f7f7;
|
|||
|
|
border-left:1px solid #DDD;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#main {
|
|||
|
|
-webkit-box-ordinal-group: 2;
|
|||
|
|
-moz-box-ordinal-group: 2;
|
|||
|
|
-webkit-order: 1;
|
|||
|
|
-ms-flex-order: 1;
|
|||
|
|
order: 1;
|
|||
|
|
-webkit-box-flex: 1;
|
|||
|
|
-moz-box-flex: 1;
|
|||
|
|
-webkit-flex: 1 1 auto;
|
|||
|
|
-ms-flex: 1 1 auto;
|
|||
|
|
flex: 1 1 auto;
|
|||
|
|
-webkit-align-self: stretch;
|
|||
|
|
-ms-flex-item-align: stretch;
|
|||
|
|
align-self: stretch;
|
|||
|
|
overflow-y:auto;
|
|||
|
|
overflow-x:hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#main-inner {
|
|||
|
|
padding:30px 50px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* left navigation panel */
|
|||
|
|
|
|||
|
|
.brand {
|
|||
|
|
text-decoration:none;
|
|||
|
|
font-weight: normal;
|
|||
|
|
font-family: 'Orbitron';
|
|||
|
|
font-size: 28px;
|
|||
|
|
color: #DDDDDD;
|
|||
|
|
display: block;
|
|||
|
|
text-align: center;
|
|||
|
|
min-height: 81px;
|
|||
|
|
max-height: 81px;
|
|||
|
|
line-height: 81px;
|
|||
|
|
background: #262829;
|
|||
|
|
border-bottom: 1px solid #383C3B;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.brand:hover {
|
|||
|
|
color:#FFF;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.vcard {
|
|||
|
|
padding: 20px 0px 30px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.vcard .pure-u-1-3 {
|
|||
|
|
text-align:right;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.vcard .pure-u-2-3 {
|
|||
|
|
margin-top:7px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.vcard .vcard-gravatar {
|
|||
|
|
width:48px;
|
|||
|
|
height:48px;
|
|||
|
|
margin-right:0px;
|
|||
|
|
border-radius:50%;
|
|||
|
|
-moz-border-radius:50%;
|
|||
|
|
-webkit-border-radius:50%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.vcard .vcard-name,
|
|||
|
|
.vcard .vcard-remote {
|
|||
|
|
color:#DDD;
|
|||
|
|
font-size:16px;
|
|||
|
|
margin-left:12px;
|
|||
|
|
max-width:140px;
|
|||
|
|
overflow:hidden;
|
|||
|
|
text-overflow:ellipsis;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.vcard .vcard-remote {
|
|||
|
|
padding-top:3px;
|
|||
|
|
color:#AAA;
|
|||
|
|
font-size:14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.alert-login {
|
|||
|
|
padding: 20px;
|
|||
|
|
text-align: center;
|
|||
|
|
background: #383C3B;
|
|||
|
|
color: #aaa;
|
|||
|
|
display:block;
|
|||
|
|
margin-bottom:5px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#menu .pure-menu {
|
|||
|
|
background:none;
|
|||
|
|
border:none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
#menu .pure-menu .pure-menu-selected {
|
|||
|
|
background:#383C3B;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#menu .pure-menu a,
|
|||
|
|
#menu .pure-menu .pure-menu-selected a {
|
|||
|
|
color:#AAA;
|
|||
|
|
padding:0px;
|
|||
|
|
text-align:left;
|
|||
|
|
display:block;
|
|||
|
|
line-height:40px;
|
|||
|
|
padding-left:45px;
|
|||
|
|
text-transform:uppercase;
|
|||
|
|
font-size:15px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#menu .pure-menu .fa {
|
|||
|
|
display:inline-block;
|
|||
|
|
width:24px;
|
|||
|
|
text-align:center;
|
|||
|
|
margin-right:10px;
|
|||
|
|
color:#4E5151;
|
|||
|
|
font-size:18px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#menu .pure-menu a:hover .fa,
|
|||
|
|
#menu .pure-menu .pure-menu-selected .fa {
|
|||
|
|
display:inline-block;
|
|||
|
|
width:24px;
|
|||
|
|
text-align:center;
|
|||
|
|
margin-right:10px;
|
|||
|
|
color:#777;
|
|||
|
|
font-size:18px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#menu .pure-menu a:hover,
|
|||
|
|
#menu .pure-menu .pure-menu-selected a:hover {
|
|||
|
|
background:#4E5151;
|
|||
|
|
background:#383C3B;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#menu .pure-menu ul li.menu-item-divided {
|
|||
|
|
border-top: 1px solid #383C3B !IMPORTANT;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* right metadata section */
|
|||
|
|
|
|||
|
|
#meta .pure-menu {
|
|||
|
|
background:none;
|
|||
|
|
border:none;
|
|||
|
|
border-bottom:1px solid #DDD;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .pure-menu .pure-menu-heading {
|
|||
|
|
padding: 0px;
|
|||
|
|
margin: 0px;
|
|||
|
|
margin-left: 25px;
|
|||
|
|
margin-top: 20px;
|
|||
|
|
margin-bottom: 10px;
|
|||
|
|
font-weight: normal;
|
|||
|
|
text-transform: uppercase;
|
|||
|
|
font-size: 16px;
|
|||
|
|
color: #999;
|
|||
|
|
border:none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .pure-menu ul {
|
|||
|
|
padding:20px 10px;
|
|||
|
|
padding-top:0px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .pure-menu .pure-menu-selected {
|
|||
|
|
background:#E7E7E7;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .pure-menu li:hover {
|
|||
|
|
background:#E4E4E4;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .pure-menu li label,
|
|||
|
|
#meta .pure-menu li a {
|
|||
|
|
color:#777;
|
|||
|
|
padding: 5px 20px;
|
|||
|
|
margin:0px;
|
|||
|
|
font-size: 14px;
|
|||
|
|
line-height:22px;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
text-overflow: ellipsis;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .menu-filter li:hover label,
|
|||
|
|
#meta .menu-filter li:hover {
|
|||
|
|
background:#E4E4E4;
|
|||
|
|
cursor:pointer;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .menu-filter li label {
|
|||
|
|
display:inline-block;
|
|||
|
|
vertical-align:middle;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .menu-branch a:before {
|
|||
|
|
font-family: 'FontAwesome';
|
|||
|
|
font-size: 16px;
|
|||
|
|
padding-right:10px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .menu-branch a[data-status='Started']:before,
|
|||
|
|
#meta .menu-branch a[data-status='Pending']:before,
|
|||
|
|
#meta .menu-branch a[data-status='Success']:before {
|
|||
|
|
content: "\f00c";
|
|||
|
|
color: #40C598;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .menu-branch a[data-status='Error']:before,
|
|||
|
|
#meta .menu-branch a[data-status='Failure']:before {
|
|||
|
|
content: "\f00d";
|
|||
|
|
color: #ed5564;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .charts {
|
|||
|
|
margin-top:30px;
|
|||
|
|
text-align:center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .chart {
|
|||
|
|
position:relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .chart > span {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
display: block;
|
|||
|
|
position: absolute;
|
|||
|
|
text-align: center;
|
|||
|
|
vertical-align: middle;
|
|||
|
|
line-height: 130px;
|
|||
|
|
font-size: 26px;
|
|||
|
|
font-family: 'Open Sans', sans-serif;
|
|||
|
|
color: #aaa;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .chart > span:after {
|
|||
|
|
content:"%";
|
|||
|
|
font-size:18px;
|
|||
|
|
font-family: 'Open Sans', sans-serif;
|
|||
|
|
color:#ccc;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#meta .chart-title {
|
|||
|
|
text-align:center;
|
|||
|
|
color:#aaa;
|
|||
|
|
line-height:20px;
|
|||
|
|
margin-bottom:30px;
|
|||
|
|
margin-top:10px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* main content */
|
|||
|
|
|
|||
|
|
.header {
|
|||
|
|
display:block;
|
|||
|
|
border-bottom:1px solid #ddd;
|
|||
|
|
min-height:81px;
|
|||
|
|
max-height:81px;
|
|||
|
|
padding:0px;
|
|||
|
|
overflow:hidden;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header .pure-g {
|
|||
|
|
padding:0px 50px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header h1 {
|
|||
|
|
margin:0px;
|
|||
|
|
padding:0px;
|
|||
|
|
font-size: 26px;
|
|||
|
|
font-size: 22px;
|
|||
|
|
color:#383C3B;
|
|||
|
|
line-height:81px;
|
|||
|
|
font-weight:normal;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header h1 a,
|
|||
|
|
.header h1 span {
|
|||
|
|
color:#999;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header h1 a,
|
|||
|
|
.header h1 a:visited,
|
|||
|
|
.header h1 a:active {
|
|||
|
|
color:#999;
|
|||
|
|
text-decoration:none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header h1 a:hover {
|
|||
|
|
text-decoration:underline;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header h1 .path-divider {
|
|||
|
|
color:#999;
|
|||
|
|
font-weight:normal;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header h1 a:last-child {
|
|||
|
|
color:#383C3B;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header .pure-u-1-8 {
|
|||
|
|
text-align:right;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header .pure-button {
|
|||
|
|
line-height:81px;
|
|||
|
|
background:none;
|
|||
|
|
color:#CCC;
|
|||
|
|
font-size:26px;
|
|||
|
|
padding:0px;
|
|||
|
|
margin:0px;
|
|||
|
|
text-align:center;
|
|||
|
|
width:48px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header .pure-button:active{
|
|||
|
|
box-shadow:none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.header .pure-form input {
|
|||
|
|
margin-top:20px;
|
|||
|
|
padding:7px;
|
|||
|
|
border:0px;
|
|||
|
|
border-bottom:1px solid #ddd;
|
|||
|
|
background:#f7f7f7;
|
|||
|
|
border-radius:0px;
|
|||
|
|
box-shadow:none;
|
|||
|
|
font-size: 14px;
|
|||
|
|
line-height: 20px;
|
|||
|
|
color:#999;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
::-moz-placeholder,
|
|||
|
|
:-moz-placeholder,
|
|||
|
|
:-ms-input-placeholder,
|
|||
|
|
::-webkit-input-placeholder {
|
|||
|
|
/* figure this out */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* commit list, on repository page */
|
|||
|
|
|
|||
|
|
.list {
|
|||
|
|
padding:25px 35px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list .pure-u-1-8 {
|
|||
|
|
text-align:right;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.commit-item:first-child {
|
|||
|
|
padding-top:10px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.commit-item:nth-child(even){
|
|||
|
|
background:#F9F9F9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.commit-item {
|
|||
|
|
font-size:14px;
|
|||
|
|
color:#777;
|
|||
|
|
padding:25px 15px;
|
|||
|
|
padding-left:25px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.commit-item p {
|
|||
|
|
color:#999;
|
|||
|
|
font-size:14px;
|
|||
|
|
padding:0px;
|
|||
|
|
margin:0px;
|
|||
|
|
padding-top:2px;
|
|||
|
|
max-width:80%;
|
|||
|
|
display: block;
|
|||
|
|
overflow: hidden;
|
|||
|
|
white-space: nowrap;
|
|||
|
|
text-overflow: ellipsis;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.commit-item img {
|
|||
|
|
border-radius:50%;
|
|||
|
|
width:48px;
|
|||
|
|
height:48px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.commit-item h3 {
|
|||
|
|
display:inline-block;
|
|||
|
|
font-weight:normal;
|
|||
|
|
font-size:14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.commit-item a {
|
|||
|
|
font-size: 18px;
|
|||
|
|
color:#555;
|
|||
|
|
text-decoration:none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.commit-item h3 a:hover {
|
|||
|
|
text-decoration:underline;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.commit-item .commit-date {
|
|||
|
|
margin-left:8px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.commit-item .commit-duration:before {
|
|||
|
|
content:"\2022";
|
|||
|
|
margin:0px 8px 0px 6px;
|
|||
|
|
opacity:0.6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.commit-item a[data-status='Started']:before,
|
|||
|
|
.commit-item a[data-status='Pending']:before,
|
|||
|
|
.commit-item a[data-status='Success']:before {
|
|||
|
|
content: "\f00c";
|
|||
|
|
color: #40C598;
|
|||
|
|
font-family: 'FontAwesome';
|
|||
|
|
font-size: 36px;
|
|||
|
|
margin-right:20px;
|
|||
|
|
line-height:48px;
|
|||
|
|
min-width:48px;
|
|||
|
|
max-width:48px;
|
|||
|
|
float:left;
|
|||
|
|
opacity:0.8;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.commit-item a[data-status='Error']:before,
|
|||
|
|
.commit-item a[data-status='Failure']:before {
|
|||
|
|
content: "\f00d";
|
|||
|
|
color: #ed5564;
|
|||
|
|
font-family: 'FontAwesome';
|
|||
|
|
font-size: 36px;
|
|||
|
|
margin-right:20px;
|
|||
|
|
line-height:48px;
|
|||
|
|
min-width:48px;
|
|||
|
|
max-width:48px;
|
|||
|
|
float:left;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.repo-item {
|
|||
|
|
padding:15px 20px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.repo-item h3 {
|
|||
|
|
font-size:16px;
|
|||
|
|
color:#555;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.repo-item h3 a {
|
|||
|
|
font-size:16px;
|
|||
|
|
color:#555;
|
|||
|
|
text-decoration:none;
|
|||
|
|
font-weight:normal;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.repo-item:nth-child(odd) {
|
|||
|
|
background: #f9f9f9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.repo-item .pure-u-1-4 {
|
|||
|
|
text-align:right;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.repo-item .pure-u-1-4 a {
|
|||
|
|
width: 30px;
|
|||
|
|
text-align: center;
|
|||
|
|
background: #ddd;
|
|||
|
|
border-radius: 20px;
|
|||
|
|
line-height: 30px;
|
|||
|
|
font-size: 14px;
|
|||
|
|
color: #fff;
|
|||
|
|
margin-left: 10px;
|
|||
|
|
display:inline-block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.repo-item .pure-u-1-4 a.label-active {
|
|||
|
|
width: 80px;
|
|||
|
|
text-align: center;
|
|||
|
|
background: #40C598;
|
|||
|
|
color: #fff;
|
|||
|
|
display:inline-block;
|
|||
|
|
text-decoration:none;
|
|||
|
|
margin:0px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
.user-item {
|
|||
|
|
padding:15px 20px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.user-item img {
|
|||
|
|
border-radius:50%;
|
|||
|
|
float:left;
|
|||
|
|
margin-right:15px;
|
|||
|
|
width:32px;
|
|||
|
|
height:32px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.user-item h3 {
|
|||
|
|
font-size:18px;
|
|||
|
|
color:#555;
|
|||
|
|
font-weight:normal;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.user-item h3 small {
|
|||
|
|
color:#999;
|
|||
|
|
display:block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.user-item:nth-child(odd) {
|
|||
|
|
background: #f9f9f9;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.user-item .pure-u-1-4 {
|
|||
|
|
text-align:right;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.user-item .pure-u-1-4 a,
|
|||
|
|
.user-item .pure-u-1-4 button {
|
|||
|
|
padding:0px;
|
|||
|
|
margin:0px;
|
|||
|
|
box-shadow: none;
|
|||
|
|
width: 30px;
|
|||
|
|
text-align: center;
|
|||
|
|
background: #ddd;
|
|||
|
|
border-radius: 20px;
|
|||
|
|
line-height: 30px;
|
|||
|
|
font-size: 14px;
|
|||
|
|
color: #fff;
|
|||
|
|
margin-left: 10px;
|
|||
|
|
display:inline-block;
|
|||
|
|
background:#ed5564;
|
|||
|
|
border:none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* alerts */
|
|||
|
|
|
|||
|
|
.alert {
|
|||
|
|
font-size: 15px;
|
|||
|
|
padding: 15px 20px;
|
|||
|
|
border-radius: 3px;
|
|||
|
|
-webkit-border-radius: 3px;
|
|||
|
|
-moz-border-radius: 3px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.alert > span > span {
|
|||
|
|
text-decoration:underline;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.alert:before {
|
|||
|
|
font-family: 'FontAwesome';
|
|||
|
|
font-size: 22px;
|
|||
|
|
margin-right:20px;
|
|||
|
|
float:left;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.alert[data-status='Success'] {
|
|||
|
|
color: #339E7A;
|
|||
|
|
background-color: #D9F3EA;
|
|||
|
|
border-left: 5px solid #40C598;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.alert[data-status='Error'],
|
|||
|
|
.alert[data-status='Failure'] {
|
|||
|
|
color: #ed5564;
|
|||
|
|
background-color: rgba(189, 54, 47, 0.2);
|
|||
|
|
border-left: 5px solid #ed5564;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.alert[data-status='Pending'],
|
|||
|
|
.alert[data-status='Started'] {
|
|||
|
|
color: #f0ad4e;
|
|||
|
|
background-color: #fcf8f2;
|
|||
|
|
border-left: 5px solid #f0ad4e;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
.alert[data-status='Success']:before {
|
|||
|
|
content: "\f00c";
|
|||
|
|
color: #40C598;
|
|||
|
|
opacity:0.8;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.alert[data-status='Error']:before,
|
|||
|
|
.alert[data-status='Failure']:before {
|
|||
|
|
content: "\f00d";
|
|||
|
|
color: #ed5564;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.alert[data-status='Pending']:before,
|
|||
|
|
.alert[data-status='Started']:before {
|
|||
|
|
content: "\f021";
|
|||
|
|
color: #f0ad4e;
|
|||
|
|
-webkit-animation: spin 1.5s infinite linear;
|
|||
|
|
-moz-animation: spin 1.5s infinite linear;
|
|||
|
|
-ms-animation: spin 1.5s infinite linear;
|
|||
|
|
-o-animation: spin 1.5s infinite linear;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.alert-info {
|
|||
|
|
background:#f4f8fa;
|
|||
|
|
color: #5bc0de;
|
|||
|
|
border-left: 5px solid #5bc0de;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.alert-info:before {
|
|||
|
|
content: "\f05a";
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.alert a:visited,
|
|||
|
|
.alert a:active,
|
|||
|
|
.alert a {
|
|||
|
|
color: inherit;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* build output */
|
|||
|
|
|
|||
|
|
pre {
|
|||
|
|
white-space: pre-wrap;
|
|||
|
|
background: #4E5151;
|
|||
|
|
background: #383C3B;
|
|||
|
|
background: #383C3B;
|
|||
|
|
color: #FFF;
|
|||
|
|
padding: 20px 20px;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
font-size: 12px;
|
|||
|
|
margin-top: 0px;
|
|||
|
|
overflow: hidden;
|
|||
|
|
font-family: 'Droid Sans Mono', 'monospace';
|
|||
|
|
line-height: 20px;
|
|||
|
|
border-radius: 3px;
|
|||
|
|
margin-top: 25px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
pre:after {
|
|||
|
|
content: "\f021";
|
|||
|
|
color: #565859;
|
|||
|
|
animation: spin 1.5s infinite linear;
|
|||
|
|
-webkit-animation: spin 1.5s infinite linear;
|
|||
|
|
-moz-animation: spin 1.5s infinite linear;
|
|||
|
|
-ms-animation: spin 1.5s infinite linear;
|
|||
|
|
-o-animation: spin 1.5s infinite linear;
|
|||
|
|
font-family: 'FontAwesome';
|
|||
|
|
font-size: 18px;
|
|||
|
|
float: right;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.avatar-link {
|
|||
|
|
float: right;
|
|||
|
|
position: relative;
|
|||
|
|
background: #eee;
|
|||
|
|
padding: 5px;
|
|||
|
|
text-decoration: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.avatar-link img {
|
|||
|
|
width: 160px;
|
|||
|
|
height: 160px;
|
|||
|
|
max-width: 160px;
|
|||
|
|
max-height: 160px;
|
|||
|
|
min-width: 160px;
|
|||
|
|
min-height: 160px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.avatar-link span {
|
|||
|
|
display: block;
|
|||
|
|
text-align: center;
|
|||
|
|
color: #777;
|
|||
|
|
padding: 5px;
|
|||
|
|
font-size:14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.avatar-link:hover:before {
|
|||
|
|
color: #fff;
|
|||
|
|
text-shadow: 1px 1px rgba(0, 0, 0, 0.5);
|
|||
|
|
font-family: 'FontAwesome';
|
|||
|
|
content: "\f044";
|
|||
|
|
position: absolute;
|
|||
|
|
right: 10px;
|
|||
|
|
top: 10px;
|
|||
|
|
font-size: 16px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-button-primary {
|
|||
|
|
background:#5bc0de;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.alert-info + .pure-button-primary {
|
|||
|
|
margin-top:15px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* form control buttons */
|
|||
|
|
|
|||
|
|
.pure-form fieldset {
|
|||
|
|
padding:0px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-form textarea,
|
|||
|
|
.pure-form input[type=text],
|
|||
|
|
.pure-form input[type=email],
|
|||
|
|
.pure-form input[type=number],
|
|||
|
|
.pure-form input[type=password],
|
|||
|
|
.pure-form select {
|
|||
|
|
box-shadow:none;
|
|||
|
|
color:#838587;
|
|||
|
|
|
|||
|
|
font-size:14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-form label {
|
|||
|
|
color:#4e5154;
|
|||
|
|
margin:20px 0px 5px 0px;
|
|||
|
|
font-size:14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-form .pure-control-group:first-child label {
|
|||
|
|
margin-top:0px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-form p.help {
|
|||
|
|
font-size:14px;
|
|||
|
|
color:#A6A8AA;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-controls {
|
|||
|
|
margin-top:25px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-controls {
|
|||
|
|
margin-top:25px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-controls .pure-button-primary {
|
|||
|
|
background:#5bc0de;
|
|||
|
|
border:1px solid #5bc0de;
|
|||
|
|
color:#FFF;
|
|||
|
|
border-radius:3px;
|
|||
|
|
min-width:100px;
|
|||
|
|
font-size:14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-controls .pure-button-secondary {
|
|||
|
|
background:none;
|
|||
|
|
border:1px solid #5bc0de;
|
|||
|
|
color:#5bc0de;
|
|||
|
|
border-radius:3px;
|
|||
|
|
min-width:100px;
|
|||
|
|
font-size:14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-menu.pure-menu-horizontal {
|
|||
|
|
background: #f7f7f7;
|
|||
|
|
padding: 0px 50px;
|
|||
|
|
margin:0px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-menu.pure-menu-horizontal li {
|
|||
|
|
font-size:14px;
|
|||
|
|
margin:0px;
|
|||
|
|
border:0px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-menu.pure-menu-horizontal a {
|
|||
|
|
padding: 15px 20px;
|
|||
|
|
margin:0px;
|
|||
|
|
font-size:14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-menu.pure-menu-horizontal .pure-menu-selected,
|
|||
|
|
.pure-menu.pure-menu-horizontal .pure-menu-selected a {
|
|||
|
|
background:#eee;
|
|||
|
|
color:#777;
|
|||
|
|
font-size:14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/*
|
|||
|
|
Customized Headers
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
|
|||
|
|
details {
|
|||
|
|
margin-bottom:20px;
|
|||
|
|
}
|
|||
|
|
summary {
|
|||
|
|
display: block;
|
|||
|
|
color: #999;
|
|||
|
|
padding: 0px;
|
|||
|
|
background: #F0F0F0;
|
|||
|
|
padding: 12px 20px;
|
|||
|
|
margin:0px;
|
|||
|
|
margin-bottom:20px;
|
|||
|
|
font-weight: normal;
|
|||
|
|
font-size: 16px;
|
|||
|
|
-moz-user-select: none;
|
|||
|
|
-webkit-user-select: none;
|
|||
|
|
-ms-user-select:none;
|
|||
|
|
cursor:pointer;
|
|||
|
|
}
|
|||
|
|
summary::-webkit-details-marker {
|
|||
|
|
display:none;
|
|||
|
|
}
|
|||
|
|
summary:before {
|
|||
|
|
font-family:'FontAwesome';
|
|||
|
|
content:"\f055";
|
|||
|
|
margin-right:15px;
|
|||
|
|
}
|
|||
|
|
details[open] summary:before {
|
|||
|
|
font-family:'FontAwesome';
|
|||
|
|
content:"\f056";
|
|||
|
|
margin-right:15px;
|
|||
|
|
}
|
|||
|
|
summary:focus {
|
|||
|
|
outline-style: none;
|
|||
|
|
}
|
|||
|
|
details textarea {
|
|||
|
|
width:100%;
|
|||
|
|
height:70px;
|
|||
|
|
white-space: pre;
|
|||
|
|
font-family:'Ubuntu Mono';
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* http://proto.io/freebies/onoff/ */
|
|||
|
|
.pure-form .onoffswitch-label {
|
|||
|
|
margin:0px;
|
|||
|
|
}
|
|||
|
|
.onoffswitch + span {
|
|||
|
|
vertical-align: middle;
|
|||
|
|
display: inline-block;
|
|||
|
|
line-height: 30px;
|
|||
|
|
margin-left:15px;
|
|||
|
|
font-size:14px;
|
|||
|
|
color:#777;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.pure-form .pure-control-group {
|
|||
|
|
margin-bottom:15px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
.onoffswitch {
|
|||
|
|
float:left;
|
|||
|
|
display:inline-block;
|
|||
|
|
position: relative; width: 100px;
|
|||
|
|
-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
|
|||
|
|
}
|
|||
|
|
.onoffswitch-checkbox {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
.onoffswitch-label {
|
|||
|
|
display: block;
|
|||
|
|
overflow: hidden;
|
|||
|
|
cursor: pointer;
|
|||
|
|
border: 0px solid #999999;
|
|||
|
|
border-radius: 0px;
|
|||
|
|
}
|
|||
|
|
.onoffswitch-inner {
|
|||
|
|
width: 200%; margin-left: -100%;
|
|||
|
|
-moz-transition: margin 0.3s ease-in 0s; -webkit-transition: margin 0.3s ease-in 0s;
|
|||
|
|
-o-transition: margin 0.3s ease-in 0s; transition: margin 0.3s ease-in 0s;
|
|||
|
|
}
|
|||
|
|
.onoffswitch-inner > div {
|
|||
|
|
float: left; position: relative; width: 50%; height: 30px; padding: 0; line-height: 30px;
|
|||
|
|
font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
|
|||
|
|
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
.onoffswitch-inner .onoffswitch-active {
|
|||
|
|
padding-left: 15px;
|
|||
|
|
background-color: #E9E9E9; color: #FFFFFF;
|
|||
|
|
}
|
|||
|
|
.onoffswitch-inner .onoffswitch-inactive {
|
|||
|
|
padding-right: 15px;
|
|||
|
|
background-color: #E9E9E9; color: #FFFFFF;
|
|||
|
|
text-align: right;
|
|||
|
|
}
|
|||
|
|
.onoffswitch-switch {
|
|||
|
|
width: 40px; margin: 0px; text-align: center;
|
|||
|
|
border: 0px solid #999999;border-radius: 0px;
|
|||
|
|
position: absolute; top: 0; bottom: 0;
|
|||
|
|
}
|
|||
|
|
.onoffswitch-active .onoffswitch-switch {
|
|||
|
|
background: #5BC0DE; left: 0;
|
|||
|
|
}
|
|||
|
|
.onoffswitch-inactive .onoffswitch-switch {
|
|||
|
|
background: #BDBEBE; right: 0;
|
|||
|
|
}
|
|||
|
|
.onoffswitch-active .onoffswitch-switch:before {
|
|||
|
|
content: " "; position: absolute; top: 0; left: 40px;
|
|||
|
|
border-style: solid; border-color: #5BC0DE transparent transparent #5BC0DE; border-width: 15px 10px;
|
|||
|
|
}
|
|||
|
|
.onoffswitch-inactive .onoffswitch-switch:before {
|
|||
|
|
content: " "; position: absolute; top: 0; right: 40px;
|
|||
|
|
border-style: solid; border-color: transparent #BDBEBE #BDBEBE transparent; border-width: 15px 10px;
|
|||
|
|
}
|
|||
|
|
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
|
|||
|
|
margin-left: 0;
|
|||
|
|
}
|