diff --git a/airtime_mvc/public/css/playlist_builder.css b/airtime_mvc/public/css/playlist_builder.css index 2d02f4676..2357b5c04 100644 --- a/airtime_mvc/public/css/playlist_builder.css +++ b/airtime_mvc/public/css/playlist_builder.css @@ -1,445 +1,447 @@ -#side_playlist { - width: 40%; - min-height: 475px; - padding: 8px; - padding-bottom: 0px; - 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; - padding-bottom:50px; - width:100%; - min-height: 320px; - margin-top:0; - margin-bottom:0; -} - -#side_playlist li { - width: 99.5%; - margin-bottom:-1px; - position:relative; -} - -#side_playlist li div.list-item-container, #side_playlist li div.list-item-container.ui-state-active { - height:56px; - border: none; -} - -#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; - width:100px; - text-align:right; -} - -.spl_artist { - font-size:12px; - color:#d5d5d5; -} - -.spl_offset { - float: right; - text-align: right; - padding: 0 5px 0 0; - color: #D5D5D5; -} - -/*#spl_editor { - height: 50px; -}*/ - -#spl_editor > div > span { -/* display: inline-block; - width: 150px;*/ -} - -.ui-icon-closethick, -.ui-icon-play, -.spl_fade_control, -.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:20px; - margin:9px 0 3px 0; - padding:0; - color:#444444; - font-weight:normal; - clear:both; - float:left; -} -#side_playlist h4 { - font-size:15px; - margin:8px 0 10px 0; - padding:0; - color:#4f4f4f; - 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 .ui-icon-pause { - margin: 17px 0 0 1px; -} - -#spl_sortable a.big_play:hover .ui-icon-play, #spl_sortable a.big_play:hover .ui-icon-pause { - 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; - 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 { - padding-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, #spl_sortable li .cue-edit { - background:#debc9e url(images/crossfade_bg.png) repeat-x 0 0 !important; - border:1px solid #5d5d5d; - border-width: 1px 0 0 0; - min-height:35px; -} -#spl_sortable li .cue-edit { - background:#b6d1d5 url(images/cue-editor_bg.png) repeat-x 0 0 !important; -} -#spl_sortable dl.inline-list { - margin:10px 0 0 37px; -} - - -#spl_sortable li .spl_fade_start, #spl_sortable li .spl_fade_end { - background-color: transparent; - float:right; - font-size: 9px; - height: 15px; - right: 35px; - width: 33px; - margin-top:2px; -} -#spl_sortable li .spl_fade_start.ui-state-default { - background: transparent url(images/fade_in.png) no-repeat 0 0; - border:none; -} -#spl_sortable li .spl_fade_start.ui-state-active { - background: transparent url(images/fade_in.png) no-repeat 0 -30px; - border:none; -} - -#spl_sortable li .spl_fade_end.ui-state-default { - background: transparent url(images/fade_out.png) no-repeat 0 0; - border:none; -} -#spl_sortable li .spl_fade_end.ui-state-active { - background: transparent url(images/fade_out.png) no-repeat 0 -30px; - border:none; -} -.crossfade dl.inline-list, .cue-edit dl.inline-list, .crossfade-main dl.inline-list { - padding-bottom:5px; - clear:left; - -} -.crossfade dl.inline-list dt, .cue-edit dl.inline-list dt, .crossfade-main dl.inline-list dt { - min-width: 90px; - - -} -.crossfade dl.inline-list dd, .cue-edit dl.inline-list dd, .crossfade-main dl.inline-list dd { - float: left; - font-size: 12px; - margin: 0; - -} -.edit-error { - color:#b80000; - margin:0; - padding-bottom:0; - font-size:12px; - display:none; -} - -/*.edit-error:last-child { - padding-bottom:10px; -}*/ -.spl_text_input { - color:#fff; -} -.crossfade-main { - background:#debc9e; - border:1px solid #5b5b5b; - padding:10px 10px 0 10px; - margin:0 1px 16px 0; - position:relative; -} - -.crossfade-main .edit-error { - padding-bottom:4px; - margin:0; -} - -.crossfade-main .edit-error:last-child { - padding-bottom:2px; -} -.crossfade-main .ui-icon-closethick { - position: absolute; - right: 6px; - top: 3px; - z-index: 3; -} - -#spl_sortable li .spl_cue { - background-color: transparent; - float:right; - font-size: 9px; - height: 15px; - right: 35px; - width: 33px; - margin-top:2px; - cursor:pointer; -} -#spl_sortable li .spl_cue.ui-state-default { - background: transparent url(images/cue_playlist.png) no-repeat 0 0; - border:none; -} -#spl_sortable li .spl_cue.ui-state-default:hover { - background: transparent url(images/cue_playlist.png) no-repeat 0 -15px; - border:none; -} -#spl_sortable li .spl_cue.ui-state-active, #spl_sortable li .spl_cue.ui-state-active:hover { - background: transparent url(images/cue_playlist.png) no-repeat 0 -30px; - border:none; -} - -/*--/////////////// Changes 16.05.2011 ////////////--*/ - -.playlist_title { - margin: 16px 0 10px 0; - height:26px; - clear:both; -} -#side_playlist .playlist_title h3, #side_playlist .playlist_title h4 { - margin: 0; - padding: 0; -} -#side_playlist .playlist_title h3 { - float:left; - width:84%; -} -#side_playlist .playlist_title h4 { - float:right; - clear:none; - font-size: 16px; - padding-top:4px; -} - -#side_playlist .playlist_title h3 a { - padding: 0 22px 0 2px; - background:url(images/icon_edit_l.png) no-repeat right center; - text-decoration:none; - -} -#side_playlist .playlist_title h3 a:hover { - background-color:#D8D8D8; -} -.element_hidden { - display: none; -} -#side_playlist .playlist_title h3 input[type="text"] { - background-color: #dddddd; - border: 1px solid #8F8F8F; - font-family: Arial,Helvetica,sans-serif; - font-size: 12px; - height: 23px; - margin: 0; - padding: 0; - text-indent: 3px; - -moz-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1); - -webkit-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1); - box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1); - width:95%; -} - -#side_playlist .zend_form { - margin: 0; - padding: 0; -} -#side_playlist .zend_form dt, #side_playlist .zend_form dd { - display: block; - float: none; - margin: 4px 0 0; - padding: 0; - width:100%; -} -#side_playlist .zend_form dd.buttons { - margin-top: 8px; - text-align:right; -} -#side_playlist .zend_form dd.buttons .ui-button { - margin: 0 0 0 10px; -} - -#side_playlist .zend_form dt { - color:#5B5B5B; - font-weight: bold; - margin: 9px 0 0; - padding: 0 2px; -} - -#side_playlist .zend_form dt:first-child { - margin-top: 0; -} - -#side_playlist .zend_form dd textarea { - background-color: #dddddd; - border: 1px solid #5B5B5B; - font-family: Arial,Helvetica,sans-serif; - font-size: 12px; - margin: 0; - padding: 2px 0 0 0; - -moz-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1); - -webkit-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1); - box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1); - width:99.7%; -} - -#side_playlist fieldset { - border: 1px solid #9a9a9a; - margin: 0 0 8px 0; - padding: 8px; -} -#side_playlist fieldset.closed .zend_form{ - display:none; -} -#side_playlist fieldset.closed { - border-width: 1px 0 0; - margin-bottom: -6px; - margin-left:1px; -} -fieldset > legend { - color: #4f4f4f; - font-size: 12px; - line-height: 140%; -} -.ui-widget-content fieldset legend .ui-icon { - float: left; - background-image:url(redmond/images/ui-icons_454545_256x240.png); -} -#side_playlist .zend_form input, #side_playlist .zend_form textarea { - width: auto; -} +#side_playlist { + width: 40%; + min-height: 475px; + padding: 8px; + padding-bottom: 0px; + 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; + padding-bottom:50px; + width:100%; + min-height: 320px; + margin-top:0; + margin-bottom:0; +} + +#side_playlist li { + width: 99.5%; + margin-bottom:-1px; + position:relative; +} + +#side_playlist li div.list-item-container, #side_playlist li div.list-item-container.ui-state-active { + height:56px; + border: none; +} + +#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; + width:100px; + text-align:right; +} + +.spl_artist { + font-size:12px; + color:#d5d5d5; +} + +.spl_offset { + float: right; + text-align: right; + padding: 0 5px 0 0; + color: #D5D5D5; +} +.ui-state-active .spl_artist, .ui-state-active .spl_offset { + color: #606060 !important; +} +/*#spl_editor { + height: 50px; +}*/ + +#spl_editor > div > span { +/* display: inline-block; + width: 150px;*/ +} + +.ui-icon-closethick, +.ui-icon-play, +.spl_fade_control, +.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:20px; + margin:9px 0 3px 0; + padding:0; + color:#444444; + font-weight:normal; + clear:both; + float:left; +} +#side_playlist h4 { + font-size:15px; + margin:8px 0 10px 0; + padding:0; + color:#4f4f4f; + 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 .ui-icon-pause { + margin: 17px 0 0 1px; +} + +#spl_sortable a.big_play:hover .ui-icon-play, #spl_sortable a.big_play:hover .ui-icon-pause { + 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; + 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 { + padding-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, #spl_sortable li .cue-edit { + background:#debc9e url(images/crossfade_bg.png) repeat-x 0 0 !important; + border:1px solid #5d5d5d; + border-width: 1px 0 0 0; + min-height:35px; +} +#spl_sortable li .cue-edit { + background:#b6d1d5 url(images/cue-editor_bg.png) repeat-x 0 0 !important; +} +#spl_sortable dl.inline-list { + margin:10px 0 0 37px; +} + + +#spl_sortable li .spl_fade_start, #spl_sortable li .spl_fade_end { + background-color: transparent; + float:right; + font-size: 9px; + height: 15px; + right: 35px; + width: 33px; + margin-top:2px; +} +#spl_sortable li .spl_fade_start.ui-state-default { + background: transparent url(images/fade_in.png) no-repeat 0 0; + border:none; +} +#spl_sortable li .spl_fade_start.ui-state-active { + background: transparent url(images/fade_in.png) no-repeat 0 -30px; + border:none; +} + +#spl_sortable li .spl_fade_end.ui-state-default { + background: transparent url(images/fade_out.png) no-repeat 0 0; + border:none; +} +#spl_sortable li .spl_fade_end.ui-state-active { + background: transparent url(images/fade_out.png) no-repeat 0 -30px; + border:none; +} +.crossfade dl.inline-list, .cue-edit dl.inline-list, .crossfade-main dl.inline-list { + padding-bottom:5px; + clear:left; + +} +.crossfade dl.inline-list dt, .cue-edit dl.inline-list dt, .crossfade-main dl.inline-list dt { + min-width: 90px; + + +} +.crossfade dl.inline-list dd, .cue-edit dl.inline-list dd, .crossfade-main dl.inline-list dd { + float: left; + font-size: 12px; + margin: 0; + +} +.edit-error { + color:#b80000; + margin:0; + padding-bottom:0; + font-size:12px; + display:none; +} + +/*.edit-error:last-child { + padding-bottom:10px; +}*/ +.spl_text_input { + color:#fff; +} +.crossfade-main { + background:#debc9e; + border:1px solid #5b5b5b; + padding:10px 10px 0 10px; + margin:0 1px 16px 0; + position:relative; +} + +.crossfade-main .edit-error { + padding-bottom:4px; + margin:0; +} + +.crossfade-main .edit-error:last-child { + padding-bottom:2px; +} +.crossfade-main .ui-icon-closethick { + position: absolute; + right: 6px; + top: 3px; + z-index: 3; +} + +#spl_sortable li .spl_cue { + background-color: transparent; + float:right; + font-size: 9px; + height: 15px; + right: 35px; + width: 33px; + margin-top:2px; + cursor:pointer; +} +#spl_sortable li .spl_cue.ui-state-default { + background: transparent url(images/cue_playlist.png) no-repeat 0 0; + border:none; +} +#spl_sortable li .spl_cue.ui-state-default:hover { + background: transparent url(images/cue_playlist.png) no-repeat 0 -15px; + border:none; +} +#spl_sortable li .spl_cue.ui-state-active, #spl_sortable li .spl_cue.ui-state-active:hover { + background: transparent url(images/cue_playlist.png) no-repeat 0 -30px; + border:none; +} + +/*--/////////////// Changes 16.05.2011 ////////////--*/ + +.playlist_title { + margin: 16px 0 10px 0; + height:26px; + clear:both; +} +#side_playlist .playlist_title h3, #side_playlist .playlist_title h4 { + margin: 0; + padding: 0; +} +#side_playlist .playlist_title h3 { + float:left; + width:84%; +} +#side_playlist .playlist_title h4 { + float:right; + clear:none; + font-size: 16px; + padding-top:4px; +} + +#side_playlist .playlist_title h3 a { + padding: 0 22px 0 2px; + background:url(images/icon_edit_l.png) no-repeat right center; + text-decoration:none; + +} +#side_playlist .playlist_title h3 a:hover { + background-color:#D8D8D8; +} +.element_hidden { + display: none; +} +#side_playlist .playlist_title h3 input[type="text"] { + background-color: #dddddd; + border: 1px solid #8F8F8F; + font-family: Arial,Helvetica,sans-serif; + font-size: 12px; + height: 23px; + margin: 0; + padding: 0; + text-indent: 3px; + -moz-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1); + -webkit-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1); + box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1); + width:95%; +} + +#side_playlist .zend_form { + margin: 0; + padding: 0; +} +#side_playlist .zend_form dt, #side_playlist .zend_form dd { + display: block; + float: none; + margin: 4px 0 0; + padding: 0; + width:100%; +} +#side_playlist .zend_form dd.buttons { + margin-top: 8px; + text-align:right; +} +#side_playlist .zend_form dd.buttons .ui-button { + margin: 0 0 0 10px; +} + +#side_playlist .zend_form dt { + color:#5B5B5B; + font-weight: bold; + margin: 9px 0 0; + padding: 0 2px; +} + +#side_playlist .zend_form dt:first-child { + margin-top: 0; +} + +#side_playlist .zend_form dd textarea { + background-color: #dddddd; + border: 1px solid #5B5B5B; + font-family: Arial,Helvetica,sans-serif; + font-size: 12px; + margin: 0; + padding: 2px 0 0 0; + -moz-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1); + -webkit-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1); + box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1); + width:99.7%; +} + +#side_playlist fieldset { + border: 1px solid #9a9a9a; + margin: 0 0 8px 0; + padding: 8px; +} +#side_playlist fieldset.closed .zend_form{ + display:none; +} +#side_playlist fieldset.closed { + border-width: 1px 0 0; + margin-bottom: -6px; + margin-left:1px; +} +fieldset > legend { + color: #4f4f4f; + font-size: 12px; + line-height: 140%; +} +.ui-widget-content fieldset legend .ui-icon { + float: left; + background-image:url(redmond/images/ui-icons_454545_256x240.png); +} +#side_playlist .zend_form input, #side_playlist .zend_form textarea { + width: auto; +} \ No newline at end of file