NewsBlur/media/css/controls.css

128 lines
4.2 KiB
CSS
Raw Normal View History

ul.segmented-control {
2013-01-25 11:33:40 -08:00
background-color: #AEB0A7;
list-style-type: none;
2013-01-31 16:50:08 -08:00
width: auto;
padding: 1px;
margin: 0 auto;
2013-01-31 16:50:08 -08:00
clear: none;
display: inline-block;
color: white;
text-align: center;
-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;
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);
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);
}
2013-02-01 16:01:54 -08:00
.segmented-control li:active:not(.NB-disabled),
.segmented-control-active li:active {
color: #303030;
text-shadow: 0 1px 0 rgba(255, 255, 255, .3);
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);
}
.segmented-control li.NB-active,
.segmented-control li.NB-active:active,
.segmented-control-active li {
color: #303030;
background-color: #FDFDFD;
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)));
background-image: -moz-linear-gradient(0 0 -90deg, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
-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-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;
}
.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;
}