Tweak main window styles

qt/aqt/data/web/css/deckbrowser.scss

@@ -15,8 +15,13 @@ a.deck:hover {
     text-decoration: underline;
 }
 
-tr.deck td {
+th {
     border-bottom: 1px solid color(border-subtle);
+    padding-bottom: 5px;
+}
+
+tr.deck td {
+    padding: 5px 12px;
 }
 
 tr.top-level-drag-row td {
@@ -36,11 +41,22 @@ body {
     -webkit-user-select: none;
 }
 
-.current {
-    background-color: color(shadow-subtle);
+.current,
+tr:hover {
+    td {
+        background: color(canvas-inset);
+        &:first-child {
+            border-top-left-radius: prop(border-radius-large);
+            border-bottom-left-radius: prop(border-radius-large);
+        }
+        &:last-child {
+            border-top-right-radius: prop(border-radius-large);
+            border-bottom-right-radius: prop(border-radius-large);
+        }
         .gears {
             visibility: visible;
         }
+    }
 }
 
 .decktd {
@@ -78,10 +94,6 @@ body {
     visibility: hidden;
 }
 
-tr:hover .gears {
-    visibility: visible;
-}
-
 .nightMode {
     .gears {
         filter: invert(180);

qt/aqt/data/web/css/overview.scss

@@ -1,6 +1,8 @@
 /* Copyright: Ankitects Pty Ltd and contributors
  * License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html */
 
+@use "root-vars";
+@use "sass/vars" as *;
 @use "sass/card-counts";
 
 .smallLink {
@@ -13,7 +15,7 @@ h3 {
 
 .descfont {
     padding: 1em;
-    color: var(--fg-subtle);
+    color: color(fg-subtle);
 }
 
 .description {

qt/aqt/data/web/css/toolbar.scss

@@ -17,6 +17,7 @@
     border-bottom-right-radius: prop(border-radius-large);
     @include button.base($with-hover: false);
     @include elevation.elevation(2);
+    overflow: hidden;
 }
 
 body {
@@ -32,10 +33,12 @@ body {
 
 .hitem {
     font-weight: bold;
-    margin: 6px 12px;
+    padding: 6px 12px;
     text-decoration: none;
     color: color(fg);
     display: inline-block;
+    @include button.base;
+    border: none;
 }
 
 .hitem:focus {

qt/aqt/stylesheets.py

@@ -62,7 +62,7 @@ QSpinBox {{
 def menu_styles(tm: ThemeManager) -> str:
     return f"""
 QMenuBar {{
-    border-bottom: 1px solid {tm.var(colors.BORDER_FAINT)};
+    border-bottom: 1px solid {tm.var(colors.BORDER_SUBTLE)};
 }}
 QMenuBar::item {{
     background-color: transparent;

sass/_button-mixins.scss

@@ -19,13 +19,14 @@
     border-bottom-right-radius: var(--border-right-radius);
 }
 
-@mixin background($primary: false) {
+@mixin background($primary: false, $hover: true) {
     @if $primary {
         background: linear-gradient(
             180deg,
             var(--button-primary-gradient-start) 0%,
             var(--button-primary-gradient-end) 100%
         );
+        @if $hover {
             &:hover {
                 background: linear-gradient(
                     180deg,
@@ -34,12 +35,14 @@
                 );
                 border-color: var(--button-hover-border);
             }
+        }
     } @else {
         background: linear-gradient(
             180deg,
             var(--button-gradient-start) 0%,
             var(--button-gradient-end) 100%
         );
+        @if $hover {
             &:hover {
                 background: linear-gradient(
                     180deg,
@@ -49,6 +52,7 @@
                 border-color: var(--button-hover-border);
             }
         }
+    }
 }
 
 @mixin base(
@@ -66,7 +70,7 @@
     } @else {
         border: none;
     }
-    @include background($primary);
+    @include background($primary, $hover: $with-hover);
 
     @if ($primary) {
         color: white;

sass/_vars.scss

@@ -89,14 +89,11 @@ $vars: (
                 ),
             ),
             overlay: (
-                <<<<<<< HEAD "Background of floating elements (menus, tooltips)",
+                "Background of floating elements (menus, tooltips)",
                 (
-                    light: white,
-                    dark: black,
-                ),
-                ======= light: palette(lightgray, 0),
+                    light: palette(lightgray, 0),
                     dark: palette(darkgray, 5),
-                >>>>>>> main,
+                ),
             ),
             code: (
                 "Background of code editors",
@@ -108,7 +105,6 @@ $vars: (
         ),
         border: (
             default: (
-                <<<<<<< HEAD
                 "Border color with medium contrast against window background",
                 (
                     light: palette(lightgray, 6),
@@ -118,12 +114,9 @@ $vars: (
             subtle: (
                 "Border color with low contrast against window background",
                 (
-                    light: palette(lightgray, 5),
+                    light: palette(lightgray, 4),
                     dark: palette(darkgray, 6),
                 ),
-                ======= light: palette(lightgray, 6),
-                dark: palette(darkgray, 4),
-                >>>>>>> main,
             ),
             strong: (
                 "Border color with high contrast against window background",
@@ -132,14 +125,6 @@ $vars: (
                     dark: palette(darkgray, 1),
                 ),
             ),
-            subtle: (
-                light: palette(lightgray, 5),
-                dark: palette(darkgray, 7),
-            ),
-            faint: (
-                light: palette(lightgray, 4),
-                dark: palette(darkgray, 6),
-            ),
             focus: (
                 "Border color of focused input elements",
                 (

sass/buttons.scss

@@ -23,9 +23,11 @@
 }
 
 button {
+    outline: none;
     @include button.base;
     @include elevation.elevation(2);
     border-radius: var(--border-radius-large);
     padding: 6px 12px;
     font-weight: 500;
+    margin: 0 4px;
 }

ts/congrats/congrats-base.scss

@@ -1,3 +1,4 @@
+@use "sass/root-vars";
 @import "sass/base";
 
 @import "sass/bootstrap/scss/containers";