From 29a09925553aec0e24709c2b409e67728b4f036f Mon Sep 17 00:00:00 2001 From: jcorporation Date: Sun, 27 May 2018 16:30:36 +0100 Subject: [PATCH] Fixed search and optimized table views for small devices --- htdocs/css/mpd.css | 38 +++---------- htdocs/index.html | 129 +++++++++++++++++++++++---------------------- htdocs/js/mpd.js | 7 ++- 3 files changed, 77 insertions(+), 97 deletions(-) diff --git a/htdocs/css/mpd.css b/htdocs/css/mpd.css index f4cc273..4d87f35 100644 --- a/htdocs/css/mpd.css +++ b/htdocs/css/mpd.css @@ -53,38 +53,14 @@ h1 { text-overflow: ellipsis; } -td:nth-child(4), th:nth-child(4) { - /* This *has* to be placed before - any t[dh]:nth-last-child(2) for - the override to work. */ - min-width: 50%; -} - -td:nth-last-child(2), th:nth-last-child(2) { - text-align: right; - width: 4em; -} - -td:nth-child(2), td:nth-child(3) { - min-width: 25%; - max-width: 10em; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; -} - -@media only screen and (max-width: 600px) { - td:nth-child(2), td:nth-child(3) { - min-width: 0; - max-width: 0; - } - td:nth-child(4), th:nth-child(4) { - min-width: 10%; - white-space: normal; - } - .tbllength, .tblnum { +@media only screen and (max-width: 576px) { +/* .tbllength, .tblnum, .tblalbum { visibility:collapse; } + .tbltitle, .tblartist { + min-width:calc(50% - 15px); + } +*/ .header-logo { display:none !important; } @@ -94,7 +70,7 @@ tbody { cursor: pointer; } -td:last-child, td:first-child { +.tblnum, .tblaction { width: 30px; } diff --git a/htdocs/index.html b/htdocs/index.html index bef254f..aa615b4 100644 --- a/htdocs/index.html +++ b/htdocs/index.html @@ -144,27 +144,28 @@ - - - - - - - - - - - - - - - - - - - -
#ArtistAlbumTitleLength
- +
+ + + + + + + + + + + + + + + + + + + +
#TitleArtistAlbumDuration
+