Tweak main window styles

This commit is contained in:
Matthias Metelka 2022-10-21 00:55:30 +02:00
parent 876f1670cc
commit 0645aef8c6
8 changed files with 57 additions and 48 deletions

View file

@ -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,10 +41,21 @@ body {
-webkit-user-select: none;
}
.current {
background-color: color(shadow-subtle);
.gears {
visibility: visible;
.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;
}
}
}
@ -78,10 +94,6 @@ body {
visibility: hidden;
}
tr:hover .gears {
visibility: visible;
}
.nightMode {
.gears {
filter: invert(180);

View file

@ -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 {

View file

@ -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 {

View file

@ -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;

View file

@ -19,20 +19,22 @@
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%
);
&:hover {
background: linear-gradient(
180deg,
var(--button-primary-hover-gradient-start) 0%,
var(--button-primary-hover-gradient-end) 100%
);
border-color: var(--button-hover-border);
@if $hover {
&:hover {
background: linear-gradient(
180deg,
var(--button-primary-hover-gradient-start) 0%,
var(--button-primary-hover-gradient-end) 100%
);
border-color: var(--button-hover-border);
}
}
} @else {
background: linear-gradient(
@ -40,13 +42,15 @@
var(--button-gradient-start) 0%,
var(--button-gradient-end) 100%
);
&:hover {
background: linear-gradient(
180deg,
var(--button-hover-gradient-start) 0%,
var(--button-hover-gradient-end) 100%
);
border-color: var(--button-hover-border);
@if $hover {
&:hover {
background: linear-gradient(
180deg,
var(--button-hover-gradient-start) 0%,
var(--button-hover-gradient-end) 100%
);
border-color: var(--button-hover-border);
}
}
}
}
@ -66,7 +70,7 @@
} @else {
border: none;
}
@include background($primary);
@include background($primary, $hover: $with-hover);
@if ($primary) {
color: white;

View file

@ -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),
dark: palette(darkgray, 5),
),
======= light: palette(lightgray, 0),
dark: palette(darkgray, 5),
>>>>>>> main,
),
code: (
"Background of code editors",
@ -108,8 +105,7 @@ $vars: (
),
border: (
default: (
<<<<<<< HEAD
"Border color with medium contrast against window background",
"Border color with medium contrast against window background",
(
light: palette(lightgray, 6),
dark: palette(darkgray, 7),
@ -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",
(

View file

@ -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;
}

View file

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