mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2024-11-22 01:05:34 +03:00
Code Issues Projects Releases Packages Wiki Activity

Smoother curves

Browse source
This commit is contained in:
Lim Chee Aun 2024-10-29 13:30:33 +08:00
parent 4805262c4b
commit c1f1fb965c
1 changed files with 23 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
src/app.css
View file

@ -404,12 +404,12 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
bottom: 0; bottom: 0;
content: ''; content: '';
display: block; display: block;
width: calc(var(--line-start) + var(--line-width) - 10px); --curves-width: calc(var(--line-start) + var(--line-width) - 10px);
/* background-color: var(--bg-color); width: var(--curves-width);
border-bottom: var(--line-width) dotted var(--comment-line-color); */
height: calc(var(--line-diameter) - var(--line-width));
background-color: var(--bg-color); background-color: var(--bg-color);
background-repeat: no-repeat; background-repeat: no-repeat;
/* border-bottom: var(--line-width) dotted var(--comment-line-color); */
/* height: calc(var(--line-diameter) - var(--line-width));
background-image: linear-gradient( background-image: linear-gradient(
transparent calc(var(--line-radius) - var(--line-width)), transparent calc(var(--line-radius) - var(--line-width)),
var(--comment-line-color) calc(var(--line-radius) - var(--line-width)) var(--comment-line-color) calc(var(--line-radius) - var(--line-width))
@ -433,7 +433,25 @@ a[href^='http'][rel*='nofollow']:visited:not(:has(div)) {
background-position: var(--line-radius) 0, bottom var(--backward), background-position: var(--line-radius) 0, bottom var(--backward),
top var(--forward); top var(--forward);
background-size: calc(100% - var(--line-radius) * 2) auto, background-size: calc(100% - var(--line-radius) * 2) auto,
var(--line-radius), var(--line-radius); var(--line-radius), var(--line-radius); */
--curves-radius: calc(var(--curves-width) / 2);
height: calc(var(--curves-width) - var(--line-width));
background-image: radial-gradient(
circle at bottom var(--forward),
transparent calc(var(--curves-radius) - var(--line-width)),
var(--comment-line-color) calc(var(--curves-radius) - var(--line-width))
var(--curves-radius),
transparent var(--curves-radius)
),
radial-gradient(
circle at top var(--backward),
transparent calc(var(--curves-radius) - var(--line-width)),
var(--comment-line-color) calc(var(--curves-radius) - var(--line-width))
var(--curves-radius),
transparent var(--curves-radius)
);
background-size: var(--curves-radius);
background-position: top var(--backward), bottom var(--forward);
} }
> li.hero:has(+ .descendant:not(.thread)), > li.hero:has(+ .descendant:not(.thread)),