GitHub/Anki
1
0
Fork 0
mirror of https://github.com/ankitects/anki.git synced 2025-09-24 16:56:36 -04:00
Code Issues Projects Releases Packages 1 Wiki Activity Actions

Fix focus box shadow transition and remove default shadow for a cleaner look

Browse source 
I couldn't quite get the inset look the way I wanted, because inset box-shadows do not respect the border radius, therefore causing aliasing.
This commit is contained in:
Matthias Metelka 2022-08-30 17:41:36 +02:00
parent 644ff49966
commit 1b8e32e363
1 changed files with 4 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
ts/editor/EditingArea.svelte
View file

@ -191,10 +191,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
background: var(--canvas-outset);
border-radius: 5px;
transition: box-shadow 80ms cubic-bezier(0.33, 1, 0.68, 1);
/* This pseudo-element is required to display
the inset box-shadow above field contents */
/* Pseudo-element required to display
inset focus box-shadow above field contents */
&::after {
content: "";
position: absolute;
@ -204,8 +202,8 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
left: 0;
pointer-events: none;
border-radius: 5px;
border: 1px solid var(--border-subtle);
box-shadow: inset 0 0 1px 1px var(--shadow-inset);
border: 1px solid var(--border-default);
transition: box-shadow 80ms cubic-bezier(0.33, 1, 0.68, 1);
}
&:focus-within {