better button style

5 files changed, 13 insertions, 4 deletions

diff --git a/web/share/css/main.css b/web/share/css/main.css
index 7102420e..945d6453 100644
--- a/web/share/css/main.css
+++ b/web/share/css/main.css
@@ -61,10 +61,11 @@ img.svg-gray {
 
 button, select {
 	box-shadow: none;
-	border: none;
+	border: var(--border-key-thin);
 	border-radius: 4px;
 	color: var(--cs-control-default-fg);
 	background-color: var(--cs-control-default-bg);
+	box-shadow: var(--shadow-micro);
 	display: block;
 	width: 100%;
 	height: 30px;
@@ -76,10 +77,12 @@ button, select {
 	/* If we have a mouse cursor */
 	button:enabled:hover, select:enabled:hover {
 		color: var(--cs-control-hovered-fg);
-		background-color: var(--cs-control-hovered-bg) !important;
+		background-color: var(--cs-control-hovered-bg);
 	}
 	button:active, select:active {
 		color: var(--cs-control-pressed-fg) !important;
+		background-color: var(--cs-control-pressed-bg) !important;
+		box-shadow: none;
 	}
 	select:enabled:hover {
 		background-image: url("../svg/select-arrow-intensive.svg") !important;
@@ -154,7 +157,7 @@ div.buttons-row {
 .row50:not(:first-child), .row25:not(:first-child), .row16:not(:first-child) {
 	border-top-left-radius: 0;
 	border-bottom-left-radius: 0;
-	border-left: var(--border-control-thin);
+	border-left: var(--border-control-thin) !important;
 }
 .row50:not(:last-child), .row25:not(:last-child), .row16:not(:last-child) {
 	border-top-right-radius: 0;
diff --git a/web/share/css/menu.css b/web/share/css/menu.css
index 151b82b1..76c272bf 100644
--- a/web/share/css/menu.css
+++ b/web/share/css/menu.css
@@ -98,6 +98,8 @@ ul#menu li div.menu-item-content-text {
 }
 
 ul#menu li div.menu-item-content button, select {
+	box-shadow: none;
+	border: none;
 	border-radius: 0;
 	text-align: left;
 	padding: 0 16px;
diff --git a/web/share/css/modals.css b/web/share/css/modals.css
index ed9837c7..c5d0d78a 100644
--- a/web/share/css/modals.css
+++ b/web/share/css/modals.css
@@ -47,6 +47,8 @@ div.modal div.modal-window div.modal-buttons {
 }
 
 div.modal div.modal-window div.modal-buttons button {
+	box-shadow: none;
+	border: none;
 	border-radius: 0;
 	height: 40px;
 }
diff --git a/web/share/css/vars.css b/web/share/css/vars.css
index 57e71c0f..cd36b0b3 100644
--- a/web/share/css/vars.css
+++ b/web/share/css/vars.css
@@ -6,8 +6,9 @@
 	--cs-control-default-bg: #36393f;
 	--cs-control-default-fg: #c3c3c3;
 	--cs-control-intensive-fg: white;
-	--cs-control-hovered-bg: #17191d;
+	--cs-control-hovered-bg: #202225;
 	--cs-control-hovered-fg: white;
+	--cs-control-pressed-bg: #17191d;
 	--cs-control-pressed-fg: #6c7481;
 	--cs-control-disabled-fg: #6c7481;
 
diff --git a/web/share/css/windows.css b/web/share/css/windows.css
index 32628e55..767d39ed 100644
--- a/web/share/css/windows.css
+++ b/web/share/css/windows.css
@@ -47,6 +47,7 @@ div.window div.window-header-grabbed {
 }
 
 div.window div.window-header button.window-button-close {
+	border: none;
 	position: absolute;
 	top: -2px;
 	right: -6px;