SemianiakaVY/la-rose
1
0
Fork 0
generated from wiz4apps/templates.OnlineShop
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

fix: clip the variant prompt top hairline to the rounded corners

Browse source
This commit is contained in:
semianiakavy 2026-10-06 01:34:49 +00:00
parent dcf20e2304
commit 3e93c08b38
2 changed files with 8 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
public/index.html
View file

@ -20,7 +20,7 @@
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Playfair+Display:wght@600;700&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="/styles.css?v=25" />
<link rel="stylesheet" href="/styles.css?v=26" />
</head>
<body>
<a class="skip-link" href="#app">Перейти к содержимому</a>

8
public/styles.css
View file

@ -4351,11 +4351,17 @@ ul {
);
box-shadow: 0 18px 44px rgba(31, 26, 28, 0.18), 0 0 0 1px rgba(214, 51, 108, 0.06);
backdrop-filter: blur(14px);
/* Clip the top hairline (::before) to the card's 24px corners. A 3px-tall
pseudo-element cannot carry a 24px radius itself — the browser scales the
radii down to half the box height, leaving square ends that poke out past
the rounded silhouette — so the rounded clipping has to come from here. */
overflow: hidden;
transform: translateX(-50%);
animation: variantPromptIn 0.42s var(--ease) both;
}
/* A thin gradient hairline hugging the top edge. */
/* A thin gradient hairline hugging the top edge. Its top rounding is inherited
from the parent's border-radius through the `overflow: hidden` above. */
.variantprompt::before {
content: '';
position: absolute;