joshua/joshua.seigler.net
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

better circuits

Browse source
This commit is contained in:
Joshua Seigler 2025-06-10 23:43:20 -04:00
parent ab6068a5d2
commit e2fb545d0b
3 changed files with 97 additions and 71 deletions
Download patch file Download diff file Expand all files Collapse all files

44
site/_includes/css/site.css
View file

@ -133,6 +133,11 @@ nav label:has(input:checked) {
0 0 1rem var(--c-accent);
text-decoration: none;
border-radius: 0.5rem;
& img {
box-shadow:
0 0 0.5rem var(--c-accent),
0 0 1rem var(--c-accent);
}
}
a[href]:focus-visible,
nav label:focus-visible,
@ -562,11 +567,13 @@ body .isso-input-wrapper label {
height: auto;
}
body .isso-input-wrapper input, body .isso-textarea, body .isso-preview {
body .isso-input-wrapper input,
body .isso-textarea,
body .isso-preview {
color: inherit;
font-size: 1rem;
background-color: transparent;
padding: .5rem;
padding: 0.5rem;
width: 100%;
border-radius: 0.2rem;
line-height: 1.4rem;
@ -575,7 +582,9 @@ body .isso-input-wrapper input, body .isso-textarea, body .isso-preview {
box-shadow: inset 0 0 2rem -1rem var(--c-accent);
outline: none;
&:focus {
box-shadow: inset 0 0 2rem -1rem var(--c-accent), inset 0 -1.5rem 2.5rem -1.5rem var(--c-accent);
box-shadow:
inset 0 0 2rem -1rem var(--c-accent),
inset 0 -1.5rem 2.5rem -1.5rem var(--c-accent);
border-color: var(--c-accent);
}
}
@ -583,7 +592,13 @@ body .isso-textarea {
line-height: 1.2;
}
body .isso-preview {
background: repeating-linear-gradient( -45deg, transparent, transparent 10px, var(--c-text-background-light) 10px, var(--c-text-background-light) 20px );
background: repeating-linear-gradient(
-45deg,
transparent,
transparent 10px,
var(--c-text-background-light) 10px,
var(--c-text-background-light) 20px
);
}
body .isso-post-action > input {
color: inherit;
@ -595,18 +610,19 @@ body .isso-post-action > input {
cursor: pointer;
outline: 0;
line-height: 1.4rem;
&:hover, &:focus-visible {
&:hover,
&:focus-visible {
background-color: var(--c-accent);
box-shadow:
0 0 0.5rem var(--c-accent),
0 0 1rem var(--c-accent);
}
}
body .isso-post-action {
margin: 0;
}
.isso-postbox:not(.isso-preview-mode) .isso-post-action:has(input[name="edit"]) {
.isso-postbox:not(.isso-preview-mode)
.isso-post-action:has(input[name="edit"]) {
display: none;
}
@media (max-width: 60rem) {
@ -629,19 +645,25 @@ body .isso-post-action {
@keyframes ripple {
0% {
opacity: 0;
transform: scale(0.2)
transform: scale(0.2);
}
10% {
opacity: 0.75;
}
100% {
opacity: 1;
transform: scale(1);
transform: scale(1.5);
}
}
.effect-instance {
position: absolute;
border-radius: 0.5rem;
background: radial-gradient(ellipse farthest-side at 50% 50%, var(--c-accent) 20%, color-mix(in lch, var(--c-accent), transparent) 40%, transparent);
animation: 2s ease-in normal forwards ripple;
background: radial-gradient(
ellipse farthest-side at 50% 50%,
var(--c-accent) 10%,
color-mix(in lch, var(--c-accent), transparent) 25%,
color-mix(in lch, var(--c-accent), transparent 80%) 35%,
transparent
);
animation: 1s ease normal forwards ripple;
}