Cutlery/moodist
1
0
Fork 0
mirror of https://github.com/remvze/moodist.git synced 2025-09-29 15:30:49 -04:00
Code Issues Packages Projects Releases Wiki Activity

feat: better heading

Browse Source
This commit is contained in:
MAZE 2025-02-13 20:04:10 +03:30
parent e61307a302
commit 10259d013f
1 changed files with 18 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/components/hero.astro
View File

@ -21,8 +21,10 @@ const count = soundCount();
width={45} width={45}
/> />
<h2 class="title"><span>Moodist</span></h2> <h1 class="title">
<h1 class="desc">Ambient sounds for focus and calm.</h1> Ambient Sounds<span class="line">For Focus and Calm</span>
</h1>
<h2 class="desc">Free and Open-Source.</h2>
<p class="sounds"> <p class="sounds">
<span aria-hidden="true" class="icon"> <span aria-hidden="true" class="icon">
@ -72,11 +74,11 @@ const count = soundCount();
& .title { & .title {
font-family: var(--font-display); font-family: var(--font-display);
font-size: var(--font-2xlg); font-size: var(--font-xlg);
font-weight: 600; font-weight: 600;
line-height: 1; line-height: 1;
& span { /* & .gradient {
background: linear-gradient( background: linear-gradient(
135deg, 135deg,
var(--color-foreground), var(--color-foreground),
@ -84,11 +86,22 @@ const count = soundCount();
); );
background-clip: text; background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
} */
& .line {
display: block;
margin-top: 2px;
background: linear-gradient(
var(--color-foreground-subtler),
var(--color-foreground-subtle)
);
background-clip: text;
-webkit-text-fill-color: transparent;
} }
} }
& .desc { & .desc {
margin-top: 4px; margin-top: 12px;
line-height: 1.6; line-height: 1.6;
color: var(--color-foreground-subtle); color: var(--color-foreground-subtle);
} }