mirror of
https://github.com/snapotter-hq/SnapOtter.git
synced 2026-08-03 07:46:42 +02:00
fix(videos): improve ToolPill depth, visibility, and polish
- ToolPill: add box-shadow (0 2px 8px), gradient overlay for glossy depth, subtle white border for definition - ToolGalaxy: fix tagline so counter number appears before "tools. Zero cloud dependency." text instead of being separated
This commit is contained in:
@@ -19,6 +19,9 @@ export const ToolPill: React.FC<{
|
|||||||
color: "white",
|
color: "white",
|
||||||
...TEXT.toolPill,
|
...TEXT.toolPill,
|
||||||
whiteSpace: "nowrap",
|
whiteSpace: "nowrap",
|
||||||
|
boxShadow: "0 2px 8px rgba(0,0,0,0.3)",
|
||||||
|
border: "1px solid rgba(255,255,255,0.1)",
|
||||||
|
backgroundImage: "linear-gradient(to bottom, rgba(255,255,255,0.15) 0%, transparent 100%)",
|
||||||
...style,
|
...style,
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -475,7 +475,16 @@ export const ToolGalaxy: React.FC = () => {
|
|||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<ClipReveal startFrame={580}>
|
<ClipReveal startFrame={580}>
|
||||||
<span style={{ ...TEXT.sectionTitle }}>tools. Zero cloud dependency.</span>
|
<span style={{ ...TEXT.sectionTitle }}>
|
||||||
|
<Counter
|
||||||
|
from={0}
|
||||||
|
to={TOOLS.length}
|
||||||
|
startFrame={580}
|
||||||
|
duration={30}
|
||||||
|
style={{ ...TEXT.sectionTitle, color: COLOR.accent, display: "inline" }}
|
||||||
|
/>{" "}
|
||||||
|
tools. Zero cloud dependency.
|
||||||
|
</span>
|
||||||
</ClipReveal>
|
</ClipReveal>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|||||||
Reference in New Issue
Block a user