small css fixes

This commit is contained in:
Gwendolyn 2024-09-17 20:48:46 +02:00
parent 2f82dd981d
commit 5c176bc7bb

View file

@ -11,7 +11,7 @@
--color-control-background: var(--color-initial); --color-control-background: var(--color-initial);
--color-control-background-hover: var(--color-tertiary); --color-control-background-hover: var(--color-tertiary);
--color-control-hover: var(--color-foreground); --color-control-hover: var(--color-foreground);
--color-control-active: var(--color-tertiary); --color-control-active: var(--color-foreground);
--color-control-divider: var(--color-quaternary); --color-control-divider: var(--color-quaternary);
--color-control-disabled: var(--color-quaternary); --color-control-disabled: var(--color-quaternary);
--color-icon: var(--color-secondary); --color-icon: var(--color-secondary);
@ -28,12 +28,12 @@
--color-pin: var(--color-foreground); --color-pin: var(--color-foreground);
--color-pin-background: transparent; --color-pin-background: transparent;
--color-pin-background-active: var(--color-quinary); --color-pin-background-active: var(--color-quaternary);
--color-pin-active: var(--color-foreground); --color-pin-active: var(--color-foreground);
--color-pin-hover: var(--color-foreground); --color-pin-hover: var(--color-foreground);
--color-pin-background-hover: var(--color-tertiary); --color-pin-background-hover: var(--color-tertiary);
--color-shadow: var(--color-quaternary); --color-shadow: var(--color-quinary);
--shadow-size: 4px; --shadow-size: 4px;
@ -1268,7 +1268,7 @@ ul.messages {
ul.messages li { ul.messages li {
padding: 1.0rem; padding: 1.0rem;
border-radius: var(--border-radius); border-radius: 0.4rem;
pointer-events: auto; pointer-events: auto;
--message-color-bg: var(--color-background); --message-color-bg: var(--color-background);
@ -1277,25 +1277,34 @@ ul.messages li {
--message-color-shadow: var(--message-color-fg); --message-color-shadow: var(--message-color-fg);
color: var(--message-color-fg); color: var(--message-color-fg);
box-shadow: var(--message-color-shadow) 0 0 calc(var(--shadow-size) * 3), inset var(--message-color-shadow) 0 0 var(--shadow-size); //box-shadow: var(--message-color-shadow) 0 0 calc(var(--shadow-size) * 3), inset var(--message-color-shadow) 0 0 var(--shadow-size);
border: 2px solid var(--message-color-border); //border: 2px solid var(--message-color-border);
border: 0.1rem solid var(--message-color-border);
background-color: var(--message-color-bg); background-color: var(--message-color-bg);
} }
ul.messages li.alert-info { ul.messages li.alert-info {
--message-color-fg: #00dbff; --message-color-fg: #006688;
--message-color-bg: #DDE4FF;
--message-color-border: #006688;
} }
ul.messages li.alert-success { ul.messages li.alert-success {
--message-color-fg: #56ff27; --message-color-fg: #338800;
--message-color-bg: #E4FFDD;
--message-color-border: #339900;
} }
ul.messages li.alert-warning { ul.messages li.alert-warning {
--message-color-fg: #ff8f3f; --message-color-fg: #CC6600;
--message-color-bg: #FFFFDD;
--message-color-border: #FF9900;
} }
ul.messages li.alert-danger { ul.messages li.alert-danger {
--message-color-fg: #ff4677; --message-color-fg: #CC0000;
--message-color-bg: #FFEEEE;
--message-color-border: #CC0000;
} }
.app-ads { .app-ads {
@ -1704,14 +1713,13 @@ blink {
cursor: pointer; cursor: pointer;
background: var(--color-pin-background); background: var(--color-pin-background);
border: 1px solid var(--color-pin-border); border: 1px solid var(--color-pin-border);
box-shadow: inset 0 0 2px black; box-shadow: inset var(--color-shadow) 0 0 var(--shadow-size);
&.active { &.active {
background: var(--color-pin-background-active); background: var(--color-pin-background-active);
color: var(--color-pin-active); color: var(--color-pin-active);
border-color: var(--color-pin-border-active); border-color: var(--color-pin-border-active);
box-shadow: inset var(--color-shadow) 0 0 var(--shadow-size);
} }
&:hover { &:hover {
@ -1741,7 +1749,7 @@ blink {
border-radius: var(--border-radius-small); border-radius: var(--border-radius-small);
width: 2rem; width: 2rem;
height: 2rem; height: 2rem;
box-shadow: var(--color-foreground) 0 0 var(var(--shadow-size) / 2), inset var(--color-foreground) 0 0 2px; box-shadow: var(--color-foreground) 0 0 calc(var(--shadow-size) / 2), inset var(--color-foreground) 0 0 2px;
} }
} }
} }