From cd54a287fa5860ac10bc7b4cfd6b015b0d8de4c8 Mon Sep 17 00:00:00 2001 From: Paul Arthur Date: Mon, 28 Jan 2013 11:32:16 -0500 Subject: Add some CSS defaults for the HTML5 player Requires less boilerplate in the individual themes. --- templates/base.css | 2 +- templates/html5_player.css | 83 ++++++++++++++++++++++++++++++++++++ templates/show_html5_player.inc.php | 1 + themes/classic/templates/default.css | 67 +++++------------------------ themes/fresh/templates/default.css | 66 +++++----------------------- 5 files changed, 106 insertions(+), 113 deletions(-) create mode 100644 templates/html5_player.css diff --git a/templates/base.css b/templates/base.css index cecf6c9f..d4a88bd1 100644 --- a/templates/base.css +++ b/templates/base.css @@ -52,4 +52,4 @@ a.tag_size1, a.tag_size2, a.tag_size3, a.tag_size4 { text-decoration: none; } } .item_off { color: #FF0000; -} +} diff --git a/templates/html5_player.css b/templates/html5_player.css new file mode 100644 index 00000000..ea23d5c1 --- /dev/null +++ b/templates/html5_player.css @@ -0,0 +1,83 @@ +/* vim:set softtabstop=4 shiftwidth=4 expandtab: */ +/** + * + * LICENSE: GNU General Public License, version 2 (GPLv2) + * Copyright 2001 - 2013 Ampache.org + * + * This program is free software; you can redistribute it and/or + * modify it under the terms of the GNU General Public License v2 + * as published by the Free Software Foundation. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program; if not, write to the Free Software + * Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA. + * + */ + +#html5_player #albumart img +{ + width: 200px; + float: left; + margin: 5px; +} +#html5_player #title +{ + padding-top: 5px; +} +#html5_player #artist, #html5_player #album +{ + display: inline; +} +#html5_player #artist:before +{ + content: ' by '; +} +#html5_player #progress_text +{ + margin: 10px 0px 10px 0px; +} +#html5_player #stop, #html5_player #play,#html5_player #pause,#html5_player #next,#html5_player #previous,#html5_player #clear_search +{ + display: inline; + border: thin solid black; + cursor: pointer; + padding: 2px; + margin-right: 5px; +} +#html5_player #playlist +{ + overflow-x: hidden; + overflow-y: scroll; + position: absolute; + top: 105px; + left: 210px; + right: 5px; + bottom: 5px; +} +#html5_player #playlist li +{ + cursor: pointer; +} +#html5_player #playlist li.playing +{ + font-weight: bold; +} +#html5_player #stop.inactive, #html5_player #pause.inactive, #html5_player #play.inactive +{ + display: none; +} +#html5_player #search +{ + top: 54px; + right: 5px; + position: absolute; +} +#html5_player #search input +{ + background: transparent; +} diff --git a/templates/show_html5_player.inc.php b/templates/show_html5_player.inc.php index 505909b2..04a25652 100644 --- a/templates/show_html5_player.inc.php +++ b/templates/show_html5_player.inc.php @@ -28,6 +28,7 @@ header('Expires: ' . gmdate(DATE_RFC1123, time()-1)); <?php echo Config::get('site_title'); ?> +