2012-02-08 18:11:08 -08:00
|
|
|
ul.segmented-control {
|
2013-01-25 11:33:40 -08:00
|
|
|
background-color: #AEB0A7;
|
2012-02-08 18:11:08 -08:00
|
|
|
list-style-type: none;
|
2013-01-31 16:50:08 -08:00
|
|
|
width: auto;
|
2012-02-08 18:11:08 -08:00
|
|
|
padding: 1px;
|
|
|
|
margin: 0 auto;
|
2013-01-31 16:50:08 -08:00
|
|
|
clear: none;
|
|
|
|
display: inline-block;
|
|
|
|
color: white;
|
|
|
|
text-align: center;
|
2012-02-08 18:11:08 -08:00
|
|
|
|
|
|
|
-webkit-border-radius: 4px;
|
|
|
|
-moz-border-radius: 4px;
|
|
|
|
border-radius: 4px;
|
|
|
|
|
|
|
|
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, .15);
|
|
|
|
-moz-box-shadow: 0 1px 0 rgba(255, 255, 255, .15);
|
|
|
|
box-shadow: 0 1px 0 rgba(255, 255, 255, .15);
|
|
|
|
}
|
|
|
|
|
|
|
|
.segmented-control li {
|
|
|
|
background: none;
|
|
|
|
float: left;
|
|
|
|
margin-left: 1px;
|
|
|
|
cursor: pointer;
|
|
|
|
margin: 0;
|
|
|
|
padding: 0;
|
2013-01-31 16:50:08 -08:00
|
|
|
clear: none;
|
2013-03-26 11:10:12 -07:00
|
|
|
text-transform: uppercase;
|
|
|
|
text-align: center;
|
2013-01-31 16:50:08 -08:00
|
|
|
border-right: 1px solid rgba(0, 0, 0, .2);
|
2013-01-25 11:33:40 -08:00
|
|
|
|
2013-03-19 12:45:50 -07:00
|
|
|
color: #61635e;
|
2013-01-25 11:33:40 -08:00
|
|
|
text-shadow: 0 1px 0 rgba(255, 255, 255, .7);
|
2012-02-08 18:11:08 -08:00
|
|
|
|
2013-03-26 11:10:12 -07:00
|
|
|
background-color: #DDDFD9;
|
|
|
|
background-image:
|
|
|
|
-webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, .05))),
|
|
|
|
url(/media/img/reader/background-control-light.png);
|
|
|
|
background-image:
|
|
|
|
-moz-linear-gradient(0% 0% -90deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, .05)),
|
|
|
|
url(/media/img/reader/background-control-light.png);
|
|
|
|
|
|
|
|
-webkit-box-shadow: inset 0 1px 3px rgba(255, 255, 255, .15),
|
|
|
|
inset 0 0 5px rgba(255, 255, 255, .1);
|
|
|
|
-moz-box-shadow: inset 0 1px 3px rgba(255, 255, 255, .15),
|
|
|
|
inset 0 0 5px rgba(255, 255, 255, .1);
|
|
|
|
box-shadow: inset 0 1px 3px rgba(255, 255, 255, .15),
|
|
|
|
inset 0 0 5px rgba(255, 255, 255, .1);
|
2012-02-08 18:11:08 -08:00
|
|
|
}
|
|
|
|
|
2013-02-01 16:01:54 -08:00
|
|
|
.segmented-control li:active:not(.NB-disabled),
|
2013-01-31 18:24:53 -08:00
|
|
|
.segmented-control-active li:active {
|
2013-03-26 11:10:12 -07:00
|
|
|
color: #303030;
|
|
|
|
text-shadow: 0 1px 0 rgba(255, 255, 255, .3);
|
|
|
|
|
2012-02-09 13:12:32 -08:00
|
|
|
background-image:
|
|
|
|
-webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, .2)), to(rgba(255, 255, 255, .25))),
|
|
|
|
url(/media/img/reader/background-control.png);
|
|
|
|
|
|
|
|
background-image:
|
|
|
|
-moz-linear-gradient(0% 0% -90deg, rgba(255, 255, 255, .2), rgba(255, 255, 255, .25)),
|
|
|
|
url(/media/img/reader/background-control.png);
|
|
|
|
|
|
|
|
-webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, .15),
|
|
|
|
inset 0 0 5px rgba(0, 0, 0, .1);
|
|
|
|
-moz-box-shadow: inset 0 1px 4px rgba(0, 0, 0, .15),
|
|
|
|
inset 0 0 5px rgba(0, 0, 0, .1);
|
|
|
|
box-shadow: inset 0 1px 4px rgba(0, 0, 0, .15),
|
|
|
|
inset 0 0 5px rgba(0, 0, 0, .1);
|
2013-01-29 16:47:44 -08:00
|
|
|
}
|
2012-02-09 13:12:32 -08:00
|
|
|
|
2013-01-29 16:47:44 -08:00
|
|
|
.segmented-control li.NB-active,
|
2013-01-31 18:24:53 -08:00
|
|
|
.segmented-control li.NB-active:active,
|
|
|
|
.segmented-control-active li {
|
2013-03-26 11:10:12 -07:00
|
|
|
color: #303030;
|
|
|
|
|
2013-01-29 16:47:44 -08:00
|
|
|
background-color: #FDFDFD;
|
2013-03-26 11:10:12 -07:00
|
|
|
background-image: linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
|
|
|
|
background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, .3)), to(rgba(255, 255, 255, 0)));
|
2013-01-29 16:47:44 -08:00
|
|
|
|
2013-03-26 11:10:12 -07:00
|
|
|
background-image: -moz-linear-gradient(0 0 -90deg, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
|
2013-01-29 16:47:44 -08:00
|
|
|
|
2013-03-26 11:10:12 -07:00
|
|
|
-webkit-box-shadow: inset 0 2px 2px rgba(0, 0, 0, .1);
|
|
|
|
-moz-box-shadow: inset 0 2px 2px rgba(0, 0, 0, .1);
|
|
|
|
box-shadow: inset 0 2px 2px rgba(0, 0, 0, .1);
|
2013-01-29 16:47:44 -08:00
|
|
|
}
|
2013-02-01 16:01:54 -08:00
|
|
|
|
|
|
|
.segmented-control li.NB-disabled {
|
|
|
|
opacity: .9;
|
|
|
|
color: rgba(0, 0, 0, .1);
|
|
|
|
text-shadow: 0 1px 0 rgba(255, 255, 255, .3);
|
|
|
|
cursor: default;
|
|
|
|
|
|
|
|
-webkit-box-shadow: inset 0 1px 1px rgba(255, 255, 255, .15),
|
|
|
|
inset 0 0 2px rgba(255, 255, 255, .1);
|
|
|
|
-moz-box-shadow: inset 0 1px 1px rgba(255, 255, 255, .15),
|
|
|
|
inset 0 0 2px rgba(255, 255, 255, .1);
|
|
|
|
box-shadow: inset 0 1px 1px rgba(255, 255, 255, .15),
|
|
|
|
inset 0 0 2px rgba(255, 255, 255, .1);
|
|
|
|
}
|
|
|
|
.segmented-control li.NB-disabled .NB-task-image {
|
|
|
|
opacity: .3;
|
|
|
|
}
|
2013-03-26 11:10:12 -07:00
|
|
|
|
|
|
|
|
|
|
|
.segmented-control li:first-child,
|
|
|
|
.segmented-control li.NB-first {
|
|
|
|
margin-left: 0;
|
|
|
|
|
|
|
|
-webkit-border-top-left-radius: 3px;
|
|
|
|
-webkit-border-bottom-left-radius: 3px;
|
|
|
|
-moz-border-radius-topleft: 3px;
|
|
|
|
-moz-border-radius-bottomleft: 3px;
|
|
|
|
border-top-left-radius: 3px;
|
|
|
|
border-bottom-left-radius: 3px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.segmented-control li:last-child,
|
|
|
|
.segmented-control li.NB-last {
|
|
|
|
-webkit-border-top-right-radius: 3px;
|
|
|
|
-webkit-border-bottom-right-radius: 3px;
|
|
|
|
-moz-border-radius-topright: 3px;
|
|
|
|
-moz-border-radius-bottomright: 3px;
|
|
|
|
border-top-right-radius: 3px;
|
|
|
|
border-bottom-right-radius: 3px;
|
|
|
|
border-right: none;
|
|
|
|
}
|