1
0
Fork 0

More CSS and selectors cleanup

master
Matthieu Lalonde 12 years ago
parent 652ed3ebc1
commit 73890f39b9

@ -433,23 +433,12 @@ div.overlay > div {
z-index: 1001; z-index: 1001;
} }
div#screen,
div#screen canvas#processcanvas {
width : 512px;
height : 512px;
top: 0;
margin: 0 auto;
position : absolute;
z-index : 2000;
}
.icon-loading { .icon-loading {
display: inline-block; display: inline-block;
width: 14px; width: 14px;
height: 14px; height: 14px;
margin-top: 1px; margin-top: 1px;
*margin-right: .3em; margin-right: .3em;
line-height: 14px; line-height: 14px;
vertical-align: text-top; vertical-align: text-top;
background-repeat: no-repeat; background-repeat: no-repeat;
@ -493,6 +482,8 @@ div#screen canvas#processcanvas {
.btn-primary { .btn-primary {
-webkit-animation: pulse-btn 2s infinite alternate; -webkit-animation: pulse-btn 2s infinite alternate;
-moz-animation: pulse-btn 2s infinite alternate; -moz-animation: pulse-btn 2s infinite alternate;
-ms-animation: pulse-btn 2s infinite alternate;
animation: pulse-btn 2s infinite alternate;
} }
.btn-primary:hover, .btn-primary:hover,
@ -500,7 +491,9 @@ div#screen canvas#processcanvas {
.btn-primary:active, .btn-primary:active,
.btn-primary.active { .btn-primary.active {
-webkit-animation: none; -webkit-animation: none;
-ms-animation: none;
-moz-animation: none; -moz-animation: none;
animation: none;
opacity: 1; opacity: 1;
} }
@ -512,6 +505,8 @@ div.drag-table-item table tr.selected td {
.droppable-hover { .droppable-hover {
-webkit-animation: pulse 1s infinite alternate; -webkit-animation: pulse 1s infinite alternate;
-moz-animation: pulse 1s infinite alternate; -moz-animation: pulse 1s infinite alternate;
-ms-animation: pulse 1s infinite alternate;
animation: pulse 1s infinite alternate;
opacity: 0; opacity: 0;
color: #FFF; color: #FFF;
background-color: #4966B1;/* Old browsers */ background-color: #4966B1;/* Old browsers */
@ -522,4 +517,8 @@ div.drag-table-item table tr.selected td {
background: -ms-linear-gradient(top, #6086e5 0%,#6086e5 39%,#4966b1 100%); /* IE10+ */ background: -ms-linear-gradient(top, #6086e5 0%,#6086e5 39%,#4966b1 100%); /* IE10+ */
background: linear-gradient(to bottom, #6086e5 0%,#6086e5 39%,#4966b1 100%); /* W3C */ background: linear-gradient(to bottom, #6086e5 0%,#6086e5 39%,#4966b1 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6086e5', endColorstr='#4966b1',GradientType=0 ); /* IE6-9 */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6086e5', endColorstr='#4966b1',GradientType=0 ); /* IE6-9 */
} }
table tbody tr.itemplaying.itempaused td:first-child span {
background-image: url('../img/playicon.png');
}

@ -1,7 +1,7 @@
body > div.ui-layout-north > div:last-child { body > div.ui-layout-north > div:last-child {
margin: 6px auto 0 auto; margin: 6px auto 0 auto;
background: transparent url('../img/player_background.png') repeat-x; background: url('../img/player_background.png') repeat-x left bottom;
height: 40px; height: 40px;
width: 450px; width: 450px;
border: 1px solid #6B6D5E; border: 1px solid #6B6D5E;
@ -86,7 +86,7 @@ body > .ui-layout-north > div:first-child {
margin-left: 25px; margin-left: 25px;
} }
body > .ui-layout-north > div:first-child #buttonPlay { body > .ui-layout-north > div:first-child .buttonPlay {
float: left; float: left;
clear: none; clear: none;
display: block; display: block;
@ -96,17 +96,17 @@ body > .ui-layout-north > div:first-child #buttonPlay {
margin-right: 4px; margin-right: 4px;
background: transparent url('../img/button_play.png') no-repeat left top; background: transparent url('../img/button_play.png') no-repeat left top;
} }
body > .ui-layout-north > div:first-child #buttonPlay.playing { body > .ui-layout-north > div:first-child .buttonPlay.playing {
background-image: url('../img/button_pause.png'); background-image: url('../img/button_pause.png');
} }
body > .ui-layout-north > div:first-child #buttonPlay.stopped { body > .ui-layout-north > div:first-child .buttonPlay.stopped {
background-image: url('../img/button_stop.png'); background-image: url('../img/button_stop.png');
} }
body > .ui-layout-north > div:first-child #buttonVolume, body > .ui-layout-north > div:first-child > .playerVolumeWrapper input,
body > .ui-layout-north > div:first-child #buttonPrev, body > .ui-layout-north > div:first-child .buttonPrev,
body > .ui-layout-north > div:first-child #buttonNext { body > .ui-layout-north > div:first-child .buttonNext {
float: left; float: left;
clear: none; clear: none;
display: block; display: block;
@ -115,20 +115,18 @@ body > .ui-layout-north > div:first-child #buttonNext {
margin-top: 3px; margin-top: 3px;
} }
body > .ui-layout-north > div:first-child #buttonPrev { body > .ui-layout-north > div:first-child .buttonPrev {
background: url('../img/button_prev.png') no-repeat left top; background: url('../img/button_prev.png') no-repeat left top;
} }
body > .ui-layout-north > div:first-child #buttonNext { body > .ui-layout-north > div:first-child .buttonNext {
background: url('../img/button_next.png') no-repeat left top; background: url('../img/button_next.png') no-repeat left top;
} }
body > .ui-layout-north > div:first-child #buttonNext:active, body > .ui-layout-north > div:first-child .buttonNext:active,
body > .ui-layout-north > div:first-child #buttonPrev:active, body > .ui-layout-north > div:first-child .buttonPrev:active,
body > .ui-layout-north > div:first-child #buttonPlay:active, body > .ui-layout-north > div:first-child .buttonPlay:active,
body > .ui-layout-north > div:first-child #buttonNext.disabled:active, body > .ui-layout-north > div:first-child .disabled:active {
body > .ui-layout-north > div:first-child #buttonPrev.disabled:active,
body > .ui-layout-north > div:first-child #buttonPlay.disabled:active {
background-position: left bottom; background-position: left bottom;
} }
@ -164,19 +162,19 @@ progress#daaprPlayerProgress span {
padding: 0; padding: 0;
} }
*/ */
#volumeWrapper { body > .ui-layout-north > div:first-child > .playerVolumeWrapper {
float: left; float: left;
clear: none; clear: none;
margin-left: 25px; margin-left: 25px;
margin-top: 16px; margin-top: 16px;
} }
#volumeWrapper input#buttonVolume { body > .ui-layout-north > div:first-child > .playerVolumeWrapper input {
float: left; float: left;
clear: none; clear: none;
vertical-align: bottom;
-moz-border-radius: 6px; -moz-border-radius: 6px;
-webkit-border-radius: 6px; -webkit-border-radius: 6px;
border-radius: 6px;
/*background: url('../img/volume_bg.png') repeat-x;*/ /*background: url('../img/volume_bg.png') repeat-x;*/
display: block; display: block;
height: 6px; height: 6px;
@ -190,13 +188,14 @@ progress#daaprPlayerProgress span {
margin-top: 2px; margin-top: 2px;
} }
#volumeWrapper input#buttonVolume, body > .ui-layout-north > div:first-child > .playerVolumeWrapper input/*,
#volumeWrapper input#buttonVolume span { body > .ui-layout-north > div:first-child > .playerVolumeWrapper input span*/ {
-moz-border-radius: 6px; -moz-border-radius: 6px;
-webkit-border-radius: 6px; -webkit-border-radius: 6px;
border-radius: 6px;
} }
/* /*
#volumeWrapper progress#buttonVolume span { body > .ui-layout-north > div:first-child > .playerVolumeWrapper input span {
background: url('../img/volume_fg.png') repeat-x; background: url('../img/volume_fg.png') repeat-x;
display: block; display: block;
height: 6px; height: 6px;
@ -205,13 +204,12 @@ progress#daaprPlayerProgress span {
padding: 0; padding: 0;
} }
#volumeWrapper progress#buttonVolume span a { body > .ui-layout-north > div:first-child > .playerVolumeWrapper input span a {
display: none; display: none;
} }
*/ */
#volumeWrapper a#buttonVolDown { body > .ui-layout-north > div:first-child > .playerVolumeWrapper a:first-child {
vertical-align: top;
display:block; display:block;
float: left; float: left;
clear: left; clear: left;
@ -221,8 +219,7 @@ progress#daaprPlayerProgress span {
} }
#volumeWrapper a#buttonVolUp { body > .ui-layout-north > div:first-child > .playerVolumeWrapper a:last-child {
vertical-align: top;
display:block; display:block;
float: left; float: left;
clear: right; clear: right;
@ -241,7 +238,3 @@ table tbody tr.itemplaying td:first-child span {
height: 12px; height: 12px;
line-height: 14px; line-height: 14px;
} }
table tbody tr.itemplaying.itempaused td:first-child span {
background-image: url('../img/playicon.png');
}

@ -1,11 +1,11 @@
<div> <div>
<a id="buttonPrev" class="disabled"></a> <a class="buttonPrev disabled"></a>
<a id="buttonPlay" class="disabled"></a> <a class="buttonPlay disabled"></a>
<a id="buttonNext" class="disabled"></a> <a class="buttonNext disabled"></a>
<div id="volumeWrapper"> <div class="playerVolumeWrapper">
<a id="buttonVolDown" class="disabled"></a> <a class="disabled"></a>
<input type="range" id="buttonVolume" minx="0" max="1" step="0.05" value="0" disabled /> <input type="range" minx="0" max="1" step="0.05" value="0" disabled />
<a id="buttonVolUp" class="disabled"></a> <a class="disabled"></a>
</div> </div>
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>

Loading…
Cancel
Save