libretime/public/css/playlist_builder.css

205 lines
3.6 KiB
CSS

#side_playlist {
width: 40%;
min-height: 475px;
padding: 8px;
font-size: 16px;
}
#side_playlist,
#side_playlist ul,
#side_playlist li {
float: left;
}
#spl_sortable,
#spl_sortable > li,
#side_playlist > div,
#spl_editor,
.spl_artist,
.spl_cue_in,
.spl_fade_in,
.spl_cue_out,
.spl_fade_out {
clear: left;
}
#side_playlist button {
font-size: 12px;
}
#side_playlist input,
#side_playlist textarea {
width: 200px;
}
#side_playlist textarea {
height: 100px;
}
#spl_sortable {
list-style: none;
padding:0;
height: 300px;
overflow: auto;
width:100%;
margin-top:0;
}
#side_playlist li {
width: 99.5%;
margin-bottom:-1px;
height:56px;
position:relative;
}
#side_playlist li > div {
height: 50px;
}
#spl_name {
}
.ui-icon-closethick {
margin-top: 7px;
}
.spl_title {
font-size:14px;
}
.spl_playlength {
float:right;
font-size:14px;
padding:0 5px 0 0
}
.spl_artist {
font-size:12px;
}
#spl_editor {
height: 50px;
}
#spl_editor > div > span {
/* display: inline-block;
width: 150px;*/
}
.ui-icon-closethick,
.ui-icon-play,
.spl_fade_control,
.spl_playlength,
.spl_text_input {
cursor: pointer;
}
.spl_text_input input {
cursor: text;
}
#spl_error {
font-size: 14px;
padding: 0.3em;
/*width: 440px;*/
text-align: center;
}
#side_playlist h3 {
font-size:17px;
margin:9px 0 3px 0;
padding:0;
color:#1c1c1c;
font-weight:normal;
clear:both;
float:left;
}
#side_playlist h4 {
font-size:15px;
margin:8px 0 10px 0;
padding:0;
color:#1c1c1c;
font-weight:normal;
clear:both;
float:left;
}
#side_playlist h3 + h4 {
margin:0 0 11px 0;
}
#spl_sortable a.big_play {
display:block;
width:20px;
height:50px;
margin:2px 0 0 2px;
text-align:center;
border:1px solid #5b5b5b;
float:left;
background-color: #707070;
background: -moz-linear-gradient(top, #707070 0, #666666 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #707070), color-stop(100%, #666666));
}
#spl_sortable a.big_play:hover {
border:1px solid #282828;
background-color: #3b3b3b;
background: -moz-linear-gradient(top, #3b3b3b 0, #292929 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #3b3b3b), color-stop(100%, #292929));
}
#spl_sortable a.big_play .ui-icon-play {
margin: 17px 0 0 1px;
}
#spl_sortable a.big_play:hover .ui-icon-play {
background-image:url(redmond/images/ui-icons_ff5d1a_256x240.png);
}
#spl_sortable .ui-icon-closethick {
position:absolute;
top:3px;
right:6px;
z-index:3;
}
#spl_sortable .ui-icon-closethick:hover {
background-image:url(redmond/images/ui-icons_ff5d1a_256x240.png)
}
#spl_sortable .spl_fade_control {
position:absolute;
top:-8px;
right:35px;
z-index: 6;
height:15px;
width:33px;
font-size:9px;
background-color:transparent;
}
#spl_sortable li .container {
}
#spl_sortable .text-row {
height: 20px;
line-height: 19px;
overflow: hidden;
padding: 0 30px 0 10px;
text-indent: 2px;
margin:-1px 0 0 0;
float:none;
}
#spl_sortable .top {
margin-top:9px;
}
#spl_sortable li .spl_fade_control.ui-state-default {
background: transparent url(images/crossfade_playlist.png) no-repeat 0 0;
border:none;
}
#spl_sortable li .spl_fade_control.ui-state-active {
background: transparent url(images/crossfade_playlist.png) no-repeat 0 -30px;
border:none;
}
#spl_sortable li.crossfade {
background:#debc9e url(images/crossfade_bg.png) repeat-x 0 0;
border:1px solid #5d5d5d;
border-width: 1px 1px 0 1px;
}
#spl_sortable dl.inline-list {
margin:10px 0 0 37px;
}