Merge pull request #7 from Andrew-McGee/design

Design
Andrew-McGee · Nov 6, 2021 · ecba715 · ecba715
2 parents 0c9b5c0 + 9c9d369
commit ecba715
Show file tree

Hide file tree

Showing 181 changed files with 85 additions and 188,143 deletions.
diff --git a/README.md b/README.md
@@ -108,22 +108,22 @@ Code optimisation, clean up, minimisation, speed, etc.
 
 #### _Known Issues_
 - Need a timeout if Ampache host unreachable in order to sign in again
-- Long album/playlists get tracks truncated
 - Sometimes the track timer glitches after seeking with the slider
 
 ## Contributions
 Once I have a working release then contributions and suggestions always welcome.
 
 ## Testing
 Testing on Chrome (Windows and Linux) during initial development.
-- Ampache: dev (testing 5.0)
+- All lossless FLAC playback
+- Ampache: dev (testing 5.2)
 - Apache: 2.4.41
 - PHP: 7.4.3
 
 ## Acknowledgements & Dependencies
 - Inspired by the subsonic player [subplayer](https://github.com/peguerosdc/subplayer) - a really nice looking web player for subsonic.
-- Using [Fomantic UI](https://github.com/fomantic/Fomantic-UI) components (v2.8.7 included).
-- Using [howler.js](https://github.com/goldfire/howler.js) audio library for media playback (In HTML mode for better FLAC playback).
+- Using [Fomantic UI](https://github.com/fomantic/Fomantic-UI) components (v2.8.8).
+- Using [howler.js](https://github.com/goldfire/howler.js) (v2.2.3) audio library for media playback (In HTML mode for better FLAC playback).
 - Fomantic (Semantic) UI is still dependent on jquery (pulled from CDN - no need to include it).
 - Of course you need a backend [Ampache](https://github.com/ampache/ampache) server.
 - And a PHP enabled webserver (PHP version 7.4+ recommended).

diff --git a/album_view.php b/album_view.php
@@ -28,7 +28,7 @@
 parent.list = []; // Clean out the old list before we build a new one
 
 </script>
-<body style="overflow:hidden">
+<body>
 			  <div class="ui inverted space segment">
 					<?php
 						echo '<div class="ui two column grid">' . "\r\n"; //Two columns for album view - art on left, tracks on right.

diff --git a/albums_view.php b/albums_view.php
@@ -38,7 +38,7 @@
 ?>
 <script>parent.activeMenu(4);</script> <!-- Call js function in parent to highlight the correct active menu item -->
 
-<body style="overflow:hidden">
+<body>
 			  <div class="ui inverted space segment">
 					<div class='ui middle aligned grid'>
 						<div class="left floated four wide column">

diff --git a/artist_albums.php b/artist_albums.php
@@ -34,7 +34,7 @@
 ?>
 <script>parent.activeMenu(0);</script> <!-- Call js function in parent to highlight the correct active menu item -->
 
-<body style="overflow:hidden">
+<body>
 			  <div class="ui inverted space segment">
 					<div class='ui grid'>
 						<div class="left floated four wide column">

diff --git a/artist_tracks.php b/artist_tracks.php
@@ -25,7 +25,7 @@
 parent.list = []; // Clean out the old list before we build a new one
 
 </script>
-<body style="overflow:hidden">
+<body>
 			  <div class="ui inverted space segment">
 					<?php
 						echo '<div class="ui one column grid">' . "\r\n"; //Two columns - first column just for spacing.

diff --git a/artists_view.php b/artists_view.php
@@ -39,7 +39,7 @@
 <script>
 parent.activeMenu(3); // Call js function in parent to highlight the correct active menu item -->
 </script>
-<body style="overflow:hidden">
+<body>
 			  <div class="ui inverted space segment">
 					<?php
 						echo '<div class="ui one column grid">'; //Two columns - first column just for spacing.

diff --git a/css/main.css b/css/main.css
@@ -153,6 +153,19 @@
 			 margin: 1em 2em 0em 3em !important;
 		 }
 
+
+/** Main top menu styling **/
+     .ui.inverted.top.menu {
+       background-color: var(--colrfgd1) !important;
+       color: var(--colrfnt1);
+     }
+
+		 .slider.item {
+			 display: inline-block;
+			 width: 10%;
+			 padding-top: 1.4em;
+		 }
+
 /** Main side menu styling **/
 		.sidemenu.column {
 		 background-color: var(--colrfgd1);
@@ -162,7 +175,7 @@
      .ui.inverted.side.menu {
        background-color: var(--colrfgd1) !important;
 			 color: var(--colrfnt1) !important;
-			 margin: 2em 0em 0em 2em;
+			 margin: 8em 0em 0em 2em;
      }
 
 		 .ui.menu .active.item {
@@ -231,12 +244,6 @@
 		 }
 
 /** Page segments styling **/
-     .ui.inverted.top.segment {
-       background-color: var(--colrfgd1) !important;
-       color: var(--colrfnt1);
-			 padding: 1em 2em;
-     }
-
      .ui.inverted.spacecadet.segment {
        background-color: var(--colrfgd1) !important;
        color: var(--colrfnt1) !important;
@@ -248,6 +255,7 @@
      .ui.inverted.manatee.segment {
        background-color: var(--colrbgd1) !important;
        color: var(--colrfnt2) !important;
+			 margin-top: 6em !important;
      }
 
      .ui.inverted.space.segment {

diff --git a/dist/components/accordion.css b/dist/components/accordion.css