Improved file structure and CSS coding style; also ran CSSLint on it;
To be done: sprite and compress images
This commit is contained in:
drdla
parent
546aaae379
commit
f93fba2511
|
|
@ -1,258 +1,106 @@
|
|||
#editorcontainerbox {
|
||||
overflow: auto;
|
||||
#editorcontainerbox {overflow:auto; top:40px;}
|
||||
|
||||
#padcontent {font-size:12px; padding:10px;}
|
||||
|
||||
#timeslider-wrapper {left:0; position:relative; right:0; top:0;}
|
||||
#timeslider-left {background-image:url(../../static/img/timeslider_left.png); height:63px; left:0; position:absolute; width:134px;}
|
||||
#timeslider-right {background-image:url(../../static/img/timeslider_right.png); height:63px; position:absolute; right:0; top:0; width:155px;}
|
||||
#timeslider {background-image:url(../../static/img/timeslider_background.png); height:63px; margin:0 9px;}
|
||||
#timeslider #timeslider-slider {height:61px; left:0; position:absolute; top:1px; width:100%;}
|
||||
#ui-slider-handle {
|
||||
-khtml-user-select:none;
|
||||
-moz-user-select:none;
|
||||
-ms-user-select:none;
|
||||
-webkit-user-select:none;
|
||||
background-image:url(../../static/img/crushed_current_location.png);
|
||||
cursor:pointer;
|
||||
height:61px;
|
||||
left:0;
|
||||
position:absolute;
|
||||
top:0;
|
||||
user-select:none;
|
||||
width:13px;
|
||||
}
|
||||
#ui-slider-bar {
|
||||
-khtml-user-select:none;
|
||||
-moz-user-select:none;
|
||||
-ms-user-select:none;
|
||||
-webkit-user-select:none;
|
||||
cursor:pointer;
|
||||
height:35px;
|
||||
margin-left:5px;
|
||||
margin-right:148px;
|
||||
position:relative;
|
||||
top:20px;
|
||||
user-select:none;
|
||||
}
|
||||
|
||||
#playpause_button, #playpause_button_icon {height:47px; position:absolute; width:47px;}
|
||||
#playpause_button {background-image:url(../../static/img/crushed_button_undepressed.png); right:77px; top:9px;}
|
||||
#playpause_button_icon {background-image:url(../../static/img/play.png); left:0; top:0;}
|
||||
.pause#playpause_button_icon {background-image:url(../../static/img/pause.png);}
|
||||
|
||||
#leftstar, #rightstar, #leftstep, #rightstep
|
||||
{background:url(../../static/img/stepper_buttons.png) 0 0 no-repeat; height:21px; overflow:hidden; position:absolute;}
|
||||
#leftstar {background-position:0 44px; right:34px; top:8px; width:30px;}
|
||||
#rightstar {background-position:29px 44px; right:5px; top:8px; width:29px;}
|
||||
#leftstep {background-position:0 22px; right:34px; top:20px; width:30px;}
|
||||
#rightstep {background-position:29px 22px; right:5px; top:20px; width:29px;}
|
||||
|
||||
#timeslider .star {
|
||||
background-image:url(../../static/img/star.png);
|
||||
cursor:pointer;
|
||||
height:16px;
|
||||
position:absolute;
|
||||
top:40px;
|
||||
width:15px;
|
||||
}
|
||||
|
||||
#padcontent {
|
||||
padding: 10px;
|
||||
font-size: 12px;
|
||||
#timeslider #timer {
|
||||
color:#fff;
|
||||
font-family:Arial, sans-serif;
|
||||
font-size:11px;
|
||||
left:7px;
|
||||
position:absolute;
|
||||
text-align:center;
|
||||
top:9px;
|
||||
width:122px;
|
||||
}
|
||||
|
||||
#timeslider-wrapper {
|
||||
position: relative;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
}
|
||||
.topbarcenter, #docbar {display:none;}
|
||||
#padmain {top:30px;}
|
||||
#editbarright {float:right;}
|
||||
#returnbutton {color:#222; font-size:16px; line-height:29px; margin-top:0; padding-right:6px;}
|
||||
#importexport {top:118px;}
|
||||
#importexport .popup {width:185px;}
|
||||
|
||||
#timeslider-left {
|
||||
position: absolute;
|
||||
left:0px;
|
||||
background-image: url(../../static/img/timeslider_left.png);
|
||||
width: 134px;
|
||||
height: 63px;
|
||||
}
|
||||
/* lists */
|
||||
.list-bullet2, .list-indent2, .list-number2 {margin-left:3em;}
|
||||
.list-bullet3, .list-indent3, .list-number3 {margin-left:4.5em;}
|
||||
.list-bullet4, .list-indent4, .list-number4 {margin-left:6em;}
|
||||
.list-bullet5, .list-indent5, .list-number5 {margin-left:7.5em;}
|
||||
.list-bullet6, .list-indent6, .list-number6 {margin-left:9em;}
|
||||
.list-bullet7, .list-indent7, .list-number7 {margin-left:10.5em;}
|
||||
.list-bullet8, .list-indent8, .list-number8 {margin-left:12em;}
|
||||
|
||||
#timeslider-right {
|
||||
position: absolute;
|
||||
top:0px;
|
||||
right:0px;
|
||||
background-image: url(../../static/img/timeslider_right.png);
|
||||
width: 155px;
|
||||
height: 63px;
|
||||
}
|
||||
/* unordered lists */
|
||||
UL {list-style-type:disc; margin-left:1.5em;}
|
||||
UL UL {margin-left:0 !important;}
|
||||
|
||||
.list-bullet2, .list-bullet5, .list-bullet8 {list-style-type:circle;}
|
||||
.list-bullet3, .list-bullet6 {list-style-type:square;}
|
||||
|
||||
.list-indent1, .list-indent2, .list-indent3, .list-indent5, .list-indent5, .list-indent6, .list-indent7, .list-indent8 {list-style-type:none;}
|
||||
|
||||
/* ordered lists */
|
||||
OL {list-style-type:decimal; margin-left:1.5em;}
|
||||
.list-number2, .list-number5, .list-number8 {list-style-type:lower-latin;}
|
||||
.list-number3, .list-number6 {list-style-type:lower-roman;}
|
||||
|
||||
|
||||
#timeslider {
|
||||
/* margin:7px;*/
|
||||
margin-bottom: 0px;
|
||||
height: 63px;
|
||||
margin-left: 9px;
|
||||
margin-right: 9px;
|
||||
background-image: url(../../static/img/timeslider_background.png);
|
||||
}
|
||||
|
||||
div#timeslider #timeslider-slider {
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
top: 1px;
|
||||
height: 61px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
div#ui-slider-handle {
|
||||
width: 13px;
|
||||
height: 61px;
|
||||
background-image: url(../../static/img/crushed_current_location.png);
|
||||
cursor: pointer;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
user-select: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
* html div#ui-slider-handle { /* IE 6/7 */
|
||||
background-image: url(../../static/img/current_location.gif);
|
||||
}
|
||||
|
||||
div#ui-slider-bar {
|
||||
position: relative;
|
||||
margin-right: 148px;
|
||||
height: 35px;
|
||||
margin-left: 5px;
|
||||
top: 20px;
|
||||
cursor: pointer;
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
user-select: none;
|
||||
|
||||
}
|
||||
|
||||
div#timeslider div#playpause_button {
|
||||
background-image: url(../../static/img/crushed_button_undepressed.png);
|
||||
width: 47px;
|
||||
height: 47px;
|
||||
position: absolute;
|
||||
right: 77px;
|
||||
top: 9px;
|
||||
}
|
||||
|
||||
div#timeslider div#playpause_button div#playpause_button_icon {
|
||||
background-image: url(../../static/img/play.png);
|
||||
width: 47px;
|
||||
height: 47px;
|
||||
position: absolute;
|
||||
top :0px;
|
||||
left:0px;
|
||||
}
|
||||
* html div#timeslider div#playpause_button div#playpause_button_icon {
|
||||
background-image: url(../../static/img/play.gif); /* IE 6/7 */
|
||||
}
|
||||
|
||||
div#timeslider div#playpause_button div.pause#playpause_button_icon {
|
||||
background-image: url(../../static/img/pause.png);
|
||||
}
|
||||
* html div#timeslider div#playpause_button div.pause#playpause_button_icon {
|
||||
background-image: url(../../static/img/pause.gif); /* IE 6/7 */
|
||||
}
|
||||
|
||||
div #timeslider div#steppers div#leftstar {
|
||||
position: absolute;
|
||||
right: 34px;
|
||||
top: 8px;
|
||||
width:30px;
|
||||
height:21px;
|
||||
background: url(../../static/img/stepper_buttons.png) 0px 44px;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
div #timeslider div#steppers div#rightstar {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 8px;
|
||||
width:29px;
|
||||
height:21px;
|
||||
background: url(../../static/img/stepper_buttons.png) 29px 44px;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
div #timeslider div#steppers div#leftstep {
|
||||
position: absolute;
|
||||
right: 34px;
|
||||
top: 20px;
|
||||
width:30px;
|
||||
height:21px;
|
||||
background: url(../../static/img/stepper_buttons.png) 0px 22px;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
div #timeslider div#steppers div#rightstep {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 20px;
|
||||
width:29px;
|
||||
height:21px;
|
||||
background: url(../../static/img/stepper_buttons.png) 29px 22px;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
#timeslider div.star {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
background-image: url(../../static/img/star.png);
|
||||
width: 15px;
|
||||
height: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
* html #timeslider div.star {
|
||||
background-image: url(../../static/img/star.gif); /* IE 6/7 */
|
||||
}
|
||||
|
||||
#timeslider div#timer {
|
||||
position: absolute;
|
||||
font-family: Arial, sans-serif;
|
||||
left: 7px;
|
||||
top: 9px;
|
||||
width: 122px;
|
||||
text-align: center;
|
||||
color: white;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
.topbarcenter{
|
||||
display:none;
|
||||
}
|
||||
|
||||
#docbar{
|
||||
display:none;
|
||||
}
|
||||
|
||||
#padmain{
|
||||
top:30px;
|
||||
}
|
||||
|
||||
#editbarright{
|
||||
float:right;
|
||||
}
|
||||
|
||||
#returnbutton
|
||||
{
|
||||
font-size: 16px;
|
||||
line-height: 29px;
|
||||
margin-top: 0;
|
||||
padding-right: 6pt;
|
||||
color: #222;
|
||||
}
|
||||
|
||||
#importexport { top: 118px; }
|
||||
#importexport .popup { width: 185px; }
|
||||
|
||||
ul { margin-left: 1.5em; }
|
||||
ul ul { margin-left: 0 !important; }
|
||||
ul.list-bullet1 { margin-left: 1.5em; }
|
||||
ul.list-bullet2 { margin-left: 3em; }
|
||||
ul.list-bullet3 { margin-left: 4.5em; }
|
||||
ul.list-bullet4 { margin-left: 6em; }
|
||||
ul.list-bullet5 { margin-left: 7.5em; }
|
||||
ul.list-bullet6 { margin-left: 9em; }
|
||||
ul.list-bullet7 { margin-left: 10.5em; }
|
||||
ul.list-bullet8 { margin-left: 12em; }
|
||||
|
||||
ul { list-style-type: disc; }
|
||||
ul.list-bullet1 { list-style-type: disc; }
|
||||
ul.list-bullet2 { list-style-type: circle; }
|
||||
ul.list-bullet3 { list-style-type: square; }
|
||||
ul.list-bullet4 { list-style-type: disc; }
|
||||
ul.list-bullet5 { list-style-type: circle; }
|
||||
ul.list-bullet6 { list-style-type: square; }
|
||||
ul.list-bullet7 { list-style-type: disc; }
|
||||
ul.list-bullet8 { list-style-type: circle; }
|
||||
|
||||
ol.list-number1 { margin-left: 1.5em; }
|
||||
ol.list-number2 { margin-left: 3em; }
|
||||
ol.list-number3 { margin-left: 4.5em; }
|
||||
ol.list-number4 { margin-left: 6em; }
|
||||
ol.list-number5 { margin-left: 7.5em; }
|
||||
ol.list-number6 { margin-left: 9em; }
|
||||
ol.list-number7 { margin-left: 10.5em; }
|
||||
ol.list-number8 { margin-left: 12em; }
|
||||
|
||||
ol { list-style-type: decimal; }
|
||||
ol.list-number1 { list-style-type: decimal; }
|
||||
ol.list-number2 { list-style-type: lower-latin; }
|
||||
ol.list-number3 { list-style-type: lower-roman; }
|
||||
ol.list-number4 { list-style-type: decimal; }
|
||||
ol.list-number5 { list-style-type: lower-latin; }
|
||||
ol.list-number6 { list-style-type: lower-roman; }
|
||||
ol.list-number7 { list-style-type: decimal; }
|
||||
ol.list-number8 { list-style-type: lower-latin; }
|
||||
|
||||
ul.list-indent1 { margin-left: 1.5em; }
|
||||
ul.list-indent2 { margin-left: 3em; }
|
||||
ul.list-indent3 { margin-left: 4.5em; }
|
||||
ul.list-indent4 { margin-left: 6em; }
|
||||
ul.list-indent5 { margin-left: 7.5em; }
|
||||
ul.list-indent6 { margin-left: 9em; }
|
||||
ul.list-indent7 { margin-left: 10.5em; }
|
||||
ul.list-indent8 { margin-left: 12em; }
|
||||
|
||||
ul.list-indent1 { list-style-type: none; }
|
||||
ul.list-indent2 { list-style-type: none; }
|
||||
ul.list-indent3 { list-style-type: none; }
|
||||
ul.list-indent4 { list-style-type: none; }
|
||||
ul.list-indent5 { list-style-type: none; }
|
||||
ul.list-indent6 { list-style-type: none; }
|
||||
ul.list-indent7 { list-style-type: none; }
|
||||
ul.list-indent8 { list-style-type: none; }
|
||||
|
||||
/* 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);}
|
||||
Loading…
Reference in New Issue