diff options
| author | Holger Brunn <opensource@holgerbrunn.net> | 2013-01-24 16:13:17 -0500 |
|---|---|---|
| committer | Paul Arthur <paul.arthur@flowerysong.com> | 2013-01-28 13:26:11 -0500 |
| commit | 959aebe07fffe334bf3dc3f2bfcf9c5e77fad92a (patch) | |
| tree | e38e598eb859fdb906d8055c4d2724a62e854c0e /themes | |
| parent | 499aef74145a32db8c73aeacb9c5d2dd5da40771 (diff) | |
| download | ampache-959aebe07fffe334bf3dc3f2bfcf9c5e77fad92a.tar.gz ampache-959aebe07fffe334bf3dc3f2bfcf9c5e77fad92a.tar.bz2 ampache-959aebe07fffe334bf3dc3f2bfcf9c5e77fad92a.zip | |
Add an HTML5 player
Merge request #20. Basic, not very pretty, but works and, unlike the
Flash player, is maintainable.
Diffstat (limited to 'themes')
| -rw-r--r-- | themes/classic/templates/default.css | 66 | ||||
| -rw-r--r-- | themes/fresh/templates/default.css | 66 |
2 files changed, 131 insertions, 1 deletions
diff --git a/themes/classic/templates/default.css b/themes/classic/templates/default.css index f65e984c..c9e7592c 100644 --- a/themes/classic/templates/default.css +++ b/themes/classic/templates/default.css @@ -696,6 +696,71 @@ td.lp_current a { }
/************************************************/
+/* HTML5 Player */
+/************************************************/
+#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;
+}
+/************************************************/
/* Styles for Login template */
/************************************************/
#loginPage #maincontainer{
@@ -863,3 +928,4 @@ textarea:focus{ color: #c0c0c0;
}
+
diff --git a/themes/fresh/templates/default.css b/themes/fresh/templates/default.css index 89ef4cb5..4ab2b2b2 100644 --- a/themes/fresh/templates/default.css +++ b/themes/fresh/templates/default.css @@ -993,7 +993,71 @@ table.tabledata .cel_php_setting, table.tabledata .cel_configuration, .cel_prefe width: 200px;
}
-
+/************************************************/
+/* HTML5 Player */
+/************************************************/
+#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: 85px;
+ 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: 56px;
+ right: 5px;
+ position: absolute;
+}
+#html5_player #search input
+{
+ background: transparent;
+}
/***********************************************
Other
***********************************************/
|