Use borders with color-*-on-*, not outlines
Since outlines don't take up space in the layout, but borders do.
This commit is contained in:
parent
691e5d8cc1
commit
9f8e3f1521
5 changed files with 9 additions and 4 deletions
|
@ -34,8 +34,7 @@ context-notes-list {
|
||||||
> .more {
|
> .more {
|
||||||
appearance: none;
|
appearance: none;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
border: none;
|
border: 1px solid var(--color-quinary-on-sidepane);
|
||||||
outline: 1px solid var(--fill-quinary);
|
|
||||||
background: var(--material-background);
|
background: var(--material-background);
|
||||||
|
|
||||||
padding: 2px 8px;
|
padding: 2px 8px;
|
||||||
|
|
|
@ -3,7 +3,7 @@ annotation-row {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
outline: 1px solid var(--fill-quinary);
|
border: 1px solid var(--color-quinary-on-sidepane);
|
||||||
background: var(--material-background);
|
background: var(--material-background);
|
||||||
|
|
||||||
.head {
|
.head {
|
||||||
|
|
|
@ -3,7 +3,7 @@ note-row {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
outline: 1px solid var(--fill-quinary);
|
border: 1px solid var(--color-quinary-on-sidepane);
|
||||||
background: var(--material-background);
|
background: var(--material-background);
|
||||||
|
|
||||||
&:active {
|
&:active {
|
||||||
|
|
|
@ -63,6 +63,9 @@ $-colors: (
|
||||||
--color-quarternary-on-background: #{color.mix(
|
--color-quarternary-on-background: #{color.mix(
|
||||||
map.get($-colors, "color-background"), color.change(map.get($-colors, "fill-quarternary"), $alpha: 1), 100% * (1 - color.alpha(map.get($-colors, "fill-quarternary")))
|
map.get($-colors, "color-background"), color.change(map.get($-colors, "fill-quarternary"), $alpha: 1), 100% * (1 - color.alpha(map.get($-colors, "fill-quarternary")))
|
||||||
)};
|
)};
|
||||||
|
--color-quinary-on-sidepane: #{color.mix(
|
||||||
|
map.get($-colors, "color-sidepane"), color.change(map.get($-colors, "fill-quinary"), $alpha: 1), 100% * (1 - color.alpha(map.get($-colors, "fill-quinary")))
|
||||||
|
)};
|
||||||
--color-quarternary-on-sidepane: #{color.mix(
|
--color-quarternary-on-sidepane: #{color.mix(
|
||||||
map.get($-colors, "color-sidepane"), color.change(map.get($-colors, "fill-quarternary"), $alpha: 1), 100% * (1 - color.alpha(map.get($-colors, "fill-quarternary")))
|
map.get($-colors, "color-sidepane"), color.change(map.get($-colors, "fill-quarternary"), $alpha: 1), 100% * (1 - color.alpha(map.get($-colors, "fill-quarternary")))
|
||||||
)};
|
)};
|
||||||
|
|
|
@ -63,6 +63,9 @@ $-colors: (
|
||||||
--color-quarternary-on-background: #{color.mix(
|
--color-quarternary-on-background: #{color.mix(
|
||||||
map.get($-colors, "color-background"), color.change(map.get($-colors, "fill-quarternary"), $alpha: 1), 100% * (1 - color.alpha(map.get($-colors, "fill-quarternary")))
|
map.get($-colors, "color-background"), color.change(map.get($-colors, "fill-quarternary"), $alpha: 1), 100% * (1 - color.alpha(map.get($-colors, "fill-quarternary")))
|
||||||
)};
|
)};
|
||||||
|
--color-quinary-on-sidepane: #{color.mix(
|
||||||
|
map.get($-colors, "color-sidepane"), color.change(map.get($-colors, "fill-quinary"), $alpha: 1), 100% * (1 - color.alpha(map.get($-colors, "fill-quinary")))
|
||||||
|
)};
|
||||||
--color-quarternary-on-sidepane: #{color.mix(
|
--color-quarternary-on-sidepane: #{color.mix(
|
||||||
map.get($-colors, "color-sidepane"), color.change(map.get($-colors, "fill-quarternary"), $alpha: 1), 100% * (1 - color.alpha(map.get($-colors, "fill-quarternary")))
|
map.get($-colors, "color-sidepane"), color.change(map.get($-colors, "fill-quarternary"), $alpha: 1), 100% * (1 - color.alpha(map.get($-colors, "fill-quarternary")))
|
||||||
)};
|
)};
|
||||||
|
|
Loading…
Reference in a new issue