mirror of
https://github.com/remvze/moodist.git
synced 2025-12-17 00:44:14 +00:00
feat: add gradient line decoration
This commit is contained in:
parent
dc33c2cf9c
commit
5559152a84
4 changed files with 24 additions and 0 deletions
16
src/components/gradient/gradient.module.css
Normal file
16
src/components/gradient/gradient.module.css
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
.gradient {
|
||||
width: 100%;
|
||||
height: 3px;
|
||||
background: linear-gradient(
|
||||
83deg,
|
||||
rgb(186 240 112) 3%,
|
||||
rgb(121 232 101) 16%,
|
||||
rgb(101 229 178) 28%,
|
||||
rgb(98 111 234) 40%,
|
||||
rgb(200 89 228) 52%,
|
||||
rgb(245 92 157) 65%,
|
||||
rgb(246 104 78) 77%,
|
||||
rgb(254 155 70) 89%,
|
||||
rgb(255 200 71) 100%
|
||||
);
|
||||
}
|
||||
5
src/components/gradient/gradient.tsx
Normal file
5
src/components/gradient/gradient.tsx
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
import styles from './gradient.module.css';
|
||||
|
||||
export function Gradient() {
|
||||
return <div className={styles.gradient} />;
|
||||
}
|
||||
1
src/components/gradient/index.ts
Normal file
1
src/components/gradient/index.ts
Normal file
|
|
@ -0,0 +1 @@
|
|||
export { Gradient } from './gradient';
|
||||
|
|
@ -1,9 +1,11 @@
|
|||
---
|
||||
import Layout from '@/layouts/layout.astro';
|
||||
|
||||
import { Gradient } from '@/components/gradient';
|
||||
import { Hero } from '@/components/hero';
|
||||
---
|
||||
|
||||
<Layout title="Welcome to Astro.">
|
||||
<Gradient />
|
||||
<Hero />
|
||||
</Layout>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue