diff --git a/airtime_mvc/public/css/images/icon_alert_cal.png b/airtime_mvc/public/css/images/icon_alert_cal.png new file mode 100644 index 000000000..9b64d6251 Binary files /dev/null and b/airtime_mvc/public/css/images/icon_alert_cal.png differ diff --git a/airtime_mvc/public/css/images/icon_alert_cal_alt.png b/airtime_mvc/public/css/images/icon_alert_cal_alt.png new file mode 100644 index 000000000..6634fd312 Binary files /dev/null and b/airtime_mvc/public/css/images/icon_alert_cal_alt.png differ diff --git a/airtime_mvc/public/css/images/icon_play_cal.png b/airtime_mvc/public/css/images/icon_play_cal.png new file mode 100644 index 000000000..48069afff Binary files /dev/null and b/airtime_mvc/public/css/images/icon_play_cal.png differ diff --git a/airtime_mvc/public/css/jquery.contextMenu.css b/airtime_mvc/public/css/jquery.contextMenu.css index dd6ad991f..1119feb8f 100644 --- a/airtime_mvc/public/css/jquery.contextMenu.css +++ b/airtime_mvc/public/css/jquery.contextMenu.css @@ -1,149 +1,154 @@ -/* - * jQuery contextMenu - Plugin for simple contextMenu handling - * - * Version: 1.5.2 - * - * Authors: Rodney Rehm, Addy Osmani (patches for FF) - * Web: http://medialize.github.com/jQuery-contextMenu/ - * - * Licensed under - * MIT License http://www.opensource.org/licenses/mit-license - * GPL v3 http://opensource.org/licenses/GPL-3.0 - * - */ - -.context-menu-list { - margin:0; - padding:0; - - min-width: 120px; - max-width: 250px; - display: inline-block; - position: absolute; - list-style-type: none; - - border: 1px solid #333333; - background: #f0f0f0; - - -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); - -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); - -ms-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); - -o-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); - box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); - - font-family: Arial, Helvetica, sans-serif; - font-size: 11px; -} - -.context-menu-item { - padding: 2px 5px; - background-color: #f0f0f0; - position: relative; - min-height: 18px; - -moz-user-select: -moz-none; -} - -.context-menu-item.icon { - padding: 2px 2px 2px 28px; -} - -.context-menu-separator { - padding-bottom:0; - border-bottom: 1px solid #DDD; - min-height: 2px; -} - -.context-menu-item > label { - -moz-user-select: text; -} - -.context-menu-item.hover { - cursor: pointer; - background-color: #ff5d1a; -} - -.context-menu-item.disabled { - color: #666; -} - -.context-menu-input.hover, -.context-menu-item.disabled.hover { - cursor: default; - background-color: #EEE; -} - -.context-menu-submenu:after { - content: ">"; - color: #666; - position: absolute; - top: 0; - right: 3px; - z-index: 1; -} - -/* icons - #protip: - In case you want to use sprites for icons (which I would suggest you do) have a look at - http://css-tricks.com/13224-pseudo-spriting/ to get an idea of how to implement - .context-menu-item.icon:before {} - */ -.context-menu-item.icon { min-height: 18px; background-repeat: no-repeat; background-position: 4px 2px; } -.context-menu-item.icon-edit { background-image: url(images/icon_edit_cm.png); } -.context-menu-item.icon-cut { background-image: url(images/icon_cut_cm.png); } -.context-menu-item.icon-copy { background-image: url(images/icon_copy_cm.png); } -.context-menu-item.icon-paste { background-image: url(images/icon_paste_cm.png); } -.context-menu-item.icon-delete { background-image: url(images/icon_delete_cm.png); } -.context-menu-item.icon-quit { background-image: url(images/icon_door_cm.png); } -.context-menu-item.icon-soundcloud { background-image: url(images/icon_soundcloud_cm.png); } - -.context-menu-item.icon-download { background-image: url(images/icon_download_cm.png); } -.context-menu-item.icon-overview { background-image: url(images/icon_overview_cm.png); } -.context-menu-item.icon-play { background-image: url(images/icon_play_cm.png); } -.context-menu-item.icon-select-cursor { background-image: url(images/icon_select-cursor_cm.png); } -.context-menu-item.icon-add-playlist { background-image: url(images/icon_add_playlist_cm.png); } -.context-menu-item.icon-add-remove-content { background-image: url(images/icon_add_content_cm.png); } -.context-menu-item.icon-remove-all-content { background-image: url(images/icon_remove_all_content_cm.png); } - -/* vertically align inside labels */ -.context-menu-input > label > * { vertical-align: top; } - -/* position checkboxes and radios as icons */ -.context-menu-input > label > input[type="checkbox"], -.context-menu-input > label > input[type="radio"] { - margin-left: -17px; -} -.context-menu-input > label > span { - margin-left: 5px; -} - -.context-menu-input > label, -.context-menu-input > label > input[type="text"], -.context-menu-input > label > textarea, -.context-menu-input > label > select { - display: block; - width: 100%; - - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - -ms-box-sizing: border-box; - -o-box-sizing: border-box; - box-sizing: border-box; -} - -.context-menu-input > label > textarea { - height: 100px; -} -.context-menu-item > .context-menu-list { - display: none; - /* re-positioned by js */ - right: -5px; - top: 5px; -} - -.context-menu-item.hover > .context-menu-list { - display: block; -} - -.context-menu-accesskey { - text-decoration: underline; -} +/* + * jQuery contextMenu - Plugin for simple contextMenu handling + * + * Version: 1.5.2 + * + * Authors: Rodney Rehm, Addy Osmani (patches for FF) + * Web: http://medialize.github.com/jQuery-contextMenu/ + * + * Licensed under + * MIT License http://www.opensource.org/licenses/mit-license + * GPL v3 http://opensource.org/licenses/GPL-3.0 + * + */ + +.context-menu-list { + margin:0; + padding:0; + + min-width: 120px; + max-width: 250px; + display: inline-block; + position: absolute; + list-style-type: none; + + border: 1px solid #333333; + background: #f0f0f0; + + -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); + -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); + -ms-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); + -o-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); + + font-family: Arial, Helvetica, sans-serif; + font-size: 11px; +} + +.context-menu-item { + padding: 2px 5px; + background-color: #f0f0f0; + position: relative; + min-height: 18px; + -moz-user-select: -moz-none; + display: block; + width: 100%; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; +} + +.context-menu-item.icon { + padding: 2px 2px 2px 28px; +} + +.context-menu-separator { + padding-bottom:0; + border-bottom: 1px solid #DDD; + min-height: 2px; +} + +.context-menu-item > label { + -moz-user-select: text; +} + +.context-menu-item.hover { + cursor: pointer; + background-color: #ff5d1a; +} + +.context-menu-item.disabled { + color: #666; +} + +.context-menu-input.hover, +.context-menu-item.disabled.hover { + cursor: default; + background-color: #EEE; +} + +.context-menu-submenu:after { + content: ">"; + color: #666; + position: absolute; + top: 0; + right: 3px; + z-index: 1; +} + +/* icons + #protip: + In case you want to use sprites for icons (which I would suggest you do) have a look at + http://css-tricks.com/13224-pseudo-spriting/ to get an idea of how to implement + .context-menu-item.icon:before {} + */ +.context-menu-item.icon { min-height: 18px; background-repeat: no-repeat; background-position: 4px 2px; } +.context-menu-item.icon-edit { background-image: url(images/icon_edit_cm.png); } +.context-menu-item.icon-cut { background-image: url(images/icon_cut_cm.png); } +.context-menu-item.icon-copy { background-image: url(images/icon_copy_cm.png); } +.context-menu-item.icon-paste { background-image: url(images/icon_paste_cm.png); } +.context-menu-item.icon-delete { background-image: url(images/icon_delete_cm.png); } +.context-menu-item.icon-quit { background-image: url(images/icon_door_cm.png); } +.context-menu-item.icon-soundcloud { background-image: url(images/icon_soundcloud_cm.png); } + +.context-menu-item.icon-download { background-image: url(images/icon_download_cm.png); } +.context-menu-item.icon-overview { background-image: url(images/icon_overview_cm.png); } +.context-menu-item.icon-play { background-image: url(images/icon_play_cm.png); } +.context-menu-item.icon-select-cursor { background-image: url(images/icon_select-cursor_cm.png); } +.context-menu-item.icon-add-playlist { background-image: url(images/icon_add_playlist_cm.png); } +.context-menu-item.icon-add-remove-content { background-image: url(images/icon_add_content_cm.png); } +.context-menu-item.icon-remove-all-content { background-image: url(images/icon_remove_all_content_cm.png); } + +/* vertically align inside labels */ +.context-menu-input > label > * { vertical-align: top; } + +/* position checkboxes and radios as icons */ +.context-menu-input > label > input[type="checkbox"], +.context-menu-input > label > input[type="radio"] { + margin-left: -17px; +} +.context-menu-input > label > span { + margin-left: 5px; +} + +.context-menu-input > label, +.context-menu-input > label > input[type="text"], +.context-menu-input > label > textarea, +.context-menu-input > label > select { + display: block; + width: 100%; + + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + -ms-box-sizing: border-box; + -o-box-sizing: border-box; + box-sizing: border-box; +} + +.context-menu-input > label > textarea { + height: 100px; +} +.context-menu-item > .context-menu-list { + display: none; + /* re-positioned by js */ + right: -5px; + top: 5px; +} + +.context-menu-item.hover > .context-menu-list { + display: block; +} + +.context-menu-accesskey { + text-decoration: underline; +} diff --git a/airtime_mvc/public/css/playlist_builder.css b/airtime_mvc/public/css/playlist_builder.css index 4da8dab42..e67e58384 100644 --- a/airtime_mvc/public/css/playlist_builder.css +++ b/airtime_mvc/public/css/playlist_builder.css @@ -21,7 +21,14 @@ .spl_fade_out { clear: left; } - +#spl_sortable > li { + width: 100%; + margin-bottom:-1px; + position:relative; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; +} /*#side_playlist button { float: left; font-size: 12px; @@ -48,12 +55,6 @@ 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; diff --git a/airtime_mvc/public/css/styles.css b/airtime_mvc/public/css/styles.css index ab5156c89..f5aa20d25 100644 --- a/airtime_mvc/public/css/styles.css +++ b/airtime_mvc/public/css/styles.css @@ -1373,7 +1373,11 @@ h2#scheduled_playlist_name span { } .simple-formblock .liquidsoap_status{ - width: 95%; + width: 100%; + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; + padding: 4px 0 8px; } .simple-formblock dd.block-display { @@ -1936,8 +1940,8 @@ span.errors.sp-errors{ margin-top: 0px !important; } .small-icon.now-playing { - background:url(images/icon_nowplaying_n.png) no-repeat 0 0; - height:8px; + background:url(images/icon_play_cal.png) no-repeat 0 0; + height:10px; } .small-icon.progress { background:url(images/upload-icon.gif) no-repeat; @@ -1956,9 +1960,7 @@ span.errors.sp-errors{ margin-left:1px; } .small-icon.show-empty { - background:url(redmond/images/ui-icons_ff5d1a_256x240.png) no-repeat 0 -144px; - width: 16px; - margin-top: 0px !important; + background:url(images/icon_alert_cal_alt.png) no-repeat 0 0; } .medium-icon { display:block;