From 0e7825dec21ee3d70a6584eb210e255a2e34182d Mon Sep 17 00:00:00 2001
From: Jon Bergli Heier <snakebite@jvnv.net>
Date: Sun, 16 Dec 2012 12:33:12 +0100
Subject: Make sizes and scrolling consistent over all views.

---
 static/index.html | 94 +++++++++++++++++++++++++++++--------------------------
 static/style.css  |  6 ++--
 2 files changed, 52 insertions(+), 48 deletions(-)

(limited to 'static')

diff --git a/static/index.html b/static/index.html
index 635a0a0..6b7b4dc 100644
--- a/static/index.html
+++ b/static/index.html
@@ -33,54 +33,60 @@
 				<li><a href="#albums-tab" accesskey="a"><span class="accessor">A</span>lbums</a></li>
 			</ul>
 			<div id="playlist-tab">
-				<table class="track-table">
-				<thead>
-					<tr>
-						<th>Title</th>
-						<th>Artist</th>
-						<th>Album</th>
-						<th>&nbsp;</th>
-					</tr>
-				</thead>
-				<tbody id="playlist">
-				</tbody>
-				</table>
+				<div>
+					<table class="track-table">
+					<thead>
+						<tr>
+							<th>Title</th>
+							<th>Artist</th>
+							<th>Album</th>
+							<th>&nbsp;</th>
+						</tr>
+					</thead>
+					<tbody id="playlist">
+					</tbody>
+					</table>
+				</div>
 			</div>
 			<div id="search-tab">
-				<input type="text" id="search_box" />
-				<span>
-					<input type="button" id="search-add" value="Add selected" />
-				</span>
-				<table class="track-table">
-				<thead>
-					<tr>
-						<th>Title</th>
-						<th>Artist</th>
-						<th>Album</th>
-					</tr>
-				</thead>
-				<tbody id="search-results">
-					<tr>
-						<td colspan="3" style="font-style: italic">Use the search box above to find music.</td>
-					</tr>
-				</tbody>
-				</table>
+				<div>
+					<input type="text" id="search_box" />
+					<span>
+						<input type="button" id="search-add" value="Add selected" />
+					</span>
+					<table class="track-table">
+					<thead>
+						<tr>
+							<th>Title</th>
+							<th>Artist</th>
+							<th>Album</th>
+						</tr>
+					</thead>
+					<tbody id="search-results">
+						<tr>
+							<td colspan="3" style="font-style: italic">Use the search box above to find music.</td>
+						</tr>
+					</tbody>
+					</table>
+				</div>
 			</div>
 			<div id="directory-tab">
-				<input type="button" id="directory-add" value="Add selected" />
-				<table id="directory-table" class="track-table">
-				<thead>
-					<tr>
-						<th>Title</th>
-						<th>Artist</th>
-						<th>Album</th>
-					</tr>
-				</thead>
-				<tbody id="directory-dirs">
-				</tbody>
-				<tbody id="directory-tracks">
-				</tbody>
-				</table>
+				<div>
+					<input type="button" id="directory-add" value="Add selected" />
+					<table id="directory-table" class="track-table">
+					<thead>
+						<tr>
+							<th>Title</th>
+							<th>Artist</th>
+							<th>Album</th>
+						</tr>
+					</thead>
+					<tbody id="directory-dirs">
+					</tbody>
+					<tbody id="directory-tracks">
+					</tbody>
+					</table>
+				</div>
 			</div>
 			<div id="albums-tab">
 				<div id="albums-list">
diff --git a/static/style.css b/static/style.css
index e7c1d85..f440fd3 100644
--- a/static/style.css
+++ b/static/style.css
@@ -1,9 +1,9 @@
 * { padding: 0; margin: 0; }
 html, body, #content { height: 100%; }
-#tabs { height: 90%; }
+#tabs { height: 90%; overflow: hidden; }
+#tabs > div { overflow: auto; max-height: 85%; height: 85%; }
 
 .ui-tabs-nav li a { font-size: small; }
-#tabs #albums-tab.ui-tabs-panel { padding: 0; }
 #progress { margin: .5em 1em; width: 300px; }
 #tabs { font-size: 100%; }
 
@@ -28,8 +28,6 @@ html, body, #content { height: 100%; }
 #search_box { border: 1px solid #888; border-radius: 10px; padding: 0 .3em; }
 #search-results { margin-top: 1em; }
 
-#albums-tab { height: 95%; }
-#albums-list { overflow: auto; max-height: 100%; }
 .album-tile { width: 128px; display: inline-block; vertical-align: top; padding: 1em; }
 .album-tile a { text-decoration: none; }
 .album-tile a:hover { text-decoration: underline; }
-- 
cgit v1.2.3