mirror of
https://github.com/Patiun/com.gregkilmer.www.git
synced 2026-11-08 04:08:24 +00:00
Fix stars on frames
This commit is contained in:
@@ -36,7 +36,7 @@ const innerPx = Math.max(0, outerPx - bw);
|
|||||||
|
|
||||||
<figure
|
<figure
|
||||||
class:list={["relative", className]}
|
class:list={["relative", className]}
|
||||||
style={`border-radius: ${outerPx}px; border: ${bw}px solid color-mix(in srgb, var(--color-accent) 75%, transparent); overflow: hidden;`}
|
style={`border-radius: ${outerPx}px; border: ${bw}px solid color-mix(in srgb, var(--color-accent) 100%, transparent); `}
|
||||||
>
|
>
|
||||||
{/* Faint sacred-geometry tint behind the image (fills the full figure). */}
|
{/* Faint sacred-geometry tint behind the image (fills the full figure). */}
|
||||||
<div
|
<div
|
||||||
@@ -46,14 +46,13 @@ const innerPx = Math.max(0, outerPx - bw);
|
|||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* The media itself, in normal flow (defines the figure's height via the slot's
|
{
|
||||||
|
/* The media itself, in normal flow (defines the figure's height via the slot's
|
||||||
aspect-ratio div). Its radius = outer radius - border width, so the image's
|
aspect-ratio div). Its radius = outer radius - border width, so the image's
|
||||||
rounded corner nests PERFECTLY inside the border's rounded corner. The
|
rounded corner nests PERFECTLY inside the border's rounded corner. The
|
||||||
figure's `overflow: hidden` clips the tint layer to the outer radius. */}
|
figure's `overflow: hidden` clips the tint layer to the outer radius. */
|
||||||
<div
|
}
|
||||||
class="relative overflow-hidden"
|
<div class="relative overflow-hidden" style={`border-radius: ${innerPx}px;`}>
|
||||||
style={`border-radius: ${innerPx}px;`}
|
|
||||||
>
|
|
||||||
<slot />
|
<slot />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -77,5 +76,3 @@ const innerPx = Math.max(0, outerPx - bw);
|
|||||||
style="color: var(--color-accent); opacity:.7;"
|
style="color: var(--color-accent); opacity:.7;"
|
||||||
/>
|
/>
|
||||||
</figure>
|
</figure>
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user