-

gui/styles.css

@@ -0,0 +1,156 @@
+body {
+	font-family: Arial;
+	font-size: 11pt;
+}
+
+.pane {
+	height: calc(100vh - 40px - 2em - 10px);
+	width: calc(100% - 10px);
+	display: flex;
+    flex-direction: column;
+}
+
+.buttons {
+	height: 40px;
+	width: 100%;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	border: 1px solid black;
+    margin-bottom: 5px;
+}
+
+button {
+	background: #e0e0e0;
+	border: none;
+	border-left: 1px solid black;
+	border-right: 1px solid black;
+}
+
+button:hover {
+	background: #909090;
+}
+
+
+button.command {
+	margin: 0;
+	padding: 0;
+	width: 40px;
+	height: 40px;
+}
+
+button.command img {
+	height: 32px;
+	width: 32px;
+	margin: 0;
+	padding: 2px;
+}
+
+input.h-slider {
+	flex-grow: 1;
+}
+
+.buttons .text-block {
+	height: 100%;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	width: 4em;
+	border-left: 1px solid black;
+}
+
+.buttons span.time {
+	font-weight: bold;
+	text-align: center;
+}
+
+.hpane {
+    height: 100%;
+    width: 100%;
+    display: flex;
+}
+
+.music-info {
+    border: 1px solid black;
+    width: 30%;
+    height: 100%;
+}
+
+.music-library {
+    border-bottom: 1px solid black;
+    width: 100%;
+    height: 50%;
+}
+
+.album-art {
+    width: 100%;
+    height: 50%;
+    padding: 5px;
+}
+
+.music-playing {
+    border: 1px solid black;
+    border-left: none;
+    width: 70%;
+    height: 100%;
+}
+
+.content {
+    width: 100%;
+    height: 100%;
+    overflow: hidden;
+}
+
+.scrolly {
+    overflow-y: auto;
+}
+
+table.music-library {
+    padding: 5px;
+}
+
+table.music-library tr td {
+    border-bottom: 1px solid #f0f0f0;
+    cursor: default;
+    height: 1.1em;
+    width: 100%;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    user-select: none;
+}
+
+table.music-library tr:hover td {
+   background: #e0e0e0;
+}
+
+.popup-menu, .popup-submenu {
+	display: flex;
+	flex-direction: column;
+	margin: 5px;
+	padding: 5px;
+	position: absolute;
+	z-index: 9999;
+	border: 1px solid black;
+	background: #e0e0e0;
+}
+
+.popup-submenu {
+	display: none;
+}
+
+.menubar .menu-item span.menu-icon, .popup-menu .menu-item span.menu-icon {
+	min-width: unset;
+	width: unset;
+}
+
+.menubar .menu-item {
+	min-width: unset;
+	width: unset;
+}
+
+.menu-item span.menu-name {
+	text-wrap: nowrap;
+}
+
+