public-offering
/
pad.pub0.org
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

some timeslider styling but this wont be completed by me

pull/2321/head
John McLear 2014-11-18 22:21:36 +00:00
parent 0bea3a3af6
commit a06f01c04a
1 changed files with 62 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

107
src/static/css/timeslider.css
View File

@ -14,14 +14,14 @@
top: 0; top: 0;
} }
#timeslider-left { #timeslider-left {
background-image: url(../../static/img/timeslider_left.png); background-color:#fff;
height: 63px; height: 63px;
left: 0; left: 0;
position: absolute; position: absolute;
width: 134px; width: 134px;
} }
#timeslider-right { #timeslider-right {
background-image: url(../../static/img/timeslider_right.png); background-color:#fff;
height: 63px; height: 63px;
position: absolute; position: absolute;
right: 0; right: 0;
@ -29,7 +29,6 @@
width: 155px; width: 155px;
} }
#timeslider { #timeslider {
background-image: url(../../static/img/timeslider_background.png);
height: 63px; height: 63px;
margin: 0 9px; margin: 0 9px;
-webkit-touch-callout: none; -webkit-touch-callout: none;
@ -50,7 +49,7 @@
-webkit-user-select: none; -webkit-user-select: none;
-moz-user-select: none; -moz-user-select: none;
user-select: none; user-select: none;
background-image: url(../../static/img/crushed_current_location.png); background-color: #666;
cursor: pointer; cursor: pointer;
height: 61px; height: 61px;
left: 0; left: 0;
@ -63,66 +62,95 @@
-moz-user-select: none; -moz-user-select: none;
user-select: none; user-select: none;
cursor: pointer; cursor: pointer;
height: 35px; height: 60px;
margin-left: 5px; margin-left: 5px;
margin-right: 150px; margin-right: 150px;
position: relative; position: relative;
top: 20px; top: 0px;
} }
#playpause_button, #playpause_button,
#playpause_button_icon { #playpause_button_icon {
height: 47px; height: 44px;
position: absolute; position: absolute;
width: 47px; width: 44px;
text-align:center;
vertical-align:middle;
} }
#playpause_button { #playpause_button {
background-image: url(../../static/img/crushed_button_undepressed.png);
right: 77px; right: 77px;
top: 9px; top: 9px;
height:50px;
height:50px;
background: background-linear-gradient( #F7F7F7, #F1F1F1 80%) repeat scroll 0 0 transparent;
border-radius:24px;
} }
#playpause_button_icon:before {
line-height:44px;
padding-left:2px;
font-family: fontawesome-etherpad;
content: "\e810";
font-size:24px;
color:#666;
}
#playpause_button_icon { #playpause_button_icon {
background-image: url(../../static/img/play.png);
left: 0; left: 0;
top: 0; top: 0;
border-radius:48px;
border: solid 1px #666;
} }
.pause#playpause_button_icon { .pause:before {
background-image: url(../../static/img/pause.png) line-height:48px;
padding-left:4px;
font-family: fontawesome-etherpad;
content: "\e811";
font-size:24px;
color:#666;
} }
#leftstar, #leftstar,
#rightstar, #rightstar,
#leftstep, #leftstep,
#rightstep { #rightstep {
background: url(../../static/img/stepper_buttons.png) 0 0 no-repeat; background-color: white;
height: 21px;
overflow: hidden; overflow: hidden;
position: absolute; position: absolute;
} }
#leftstar {
background-position: 0 -44px; .stepper{
right: 34px; font-family: fontawesome-etherpad;
top: 8px; border-radius:2px;
width: 30px; border: #666 solid 1px;
line-height:18px;
text-align:center;
height:22px;
color:#666;
} }
#rightstar {
background-position: -29px -44px; stepper:active{
right: 5px; color:#000;
top: 8px;
width: 29px;
} }
#leftstep { #leftstep {
background-position: 0 -22px; right: 36px;
right: 34px;
top: 20px; top: 20px;
width: 30px; width: 25px;
} }
#leftstep:before{
content: '\e811';
vertical-align:middle;
}
#rightstep:before{
content: "\e812";
vertical-align:middle;
}
#rightstep { #rightstep {
background-position: -29px -22px; right: 10px;
right: 5px;
top: 20px; top: 20px;
width: 30px; width: 25px;
} }
#timeslider .star { #timeslider .star {
background-image: url(../../static/img/star.png);
cursor: pointer; cursor: pointer;
height: 16px; height: 16px;
position: absolute; position: absolute;
@ -130,7 +158,9 @@
width: 15px; width: 15px;
} }
#timeslider #timer { #timeslider #timer {
color: #fff; background: linear-gradient(#F7F7F7, #F1F1F1 80%) repeat scroll 0% 0% transparent;
padding:2px;
border-radius:2px;
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
font-size: 11px; font-size: 11px;
left: 7px; left: 7px;
@ -291,16 +321,3 @@ OL {
.list-number6 { .list-number6 {
list-style-type: lower-roman list-style-type: lower-roman
} }
/* IE 6/7 fixes */
* HTML #ui-slider-handle {
background-image: url(../../static/img/current_location.gif)
}
* HTML #timeslider .star {
background-image: url(../../static/img/star.gif)
}
* HTML #playpause_button_icon {
background-image: url(../../static/img/play.gif)
}
* HTML .pause#playpause_button_icon {
background-image: url(../../static/img/pause.gif)
}