web/parch-cast
8
0
Fork 0
Code Issues 6 Pull requests Projects Releases Packages Wiki Activity Actions

refactor: the components

Browse source
This commit is contained in:
Saeed 2025-03-30 15:06:56 +03:30
parent 021e2ce025
commit 4a6196bff9
3 changed files with 21 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

9
app/globals.css
View file

@ -177,6 +177,8 @@ body {
&:hover { &:hover {
transition: 0.5s; transition: 0.5s;
&::before { &::before {
transition: 0.5s;
opacity: 1;
animation-play-state: running; animation-play-state: running;
} }
} }
@ -197,12 +199,13 @@ body {
} }
.border-parch::before { .border-parch::before {
opacity : 0;
content: ""; content: "";
display: block; display: block;
background: linear-gradient(to right, #21c796, #0385ce, #0d40bf) border-box; background: linear-gradient(to right, #21c796, #0385ce, #0d40bf) border-box;
animation: rotate 6s linear infinite paused; animation: rotate 4s linear infinite paused;
height: 35rem; height: 30rem;
width: 35rem; width: 30rem;
position: absolute; position: absolute;
z-index: 0; z-index: 0;
} }

16
components/footer-section.tsx
View file

@ -51,27 +51,35 @@ export default function FooterSection() {
<div className="flex gap-4"> <div className="flex gap-4">
<Link <Link
href={"/"} href={"/"}
className="flex justify-center items-center w-8 h-8 rounded-full bg-gray-700 border-parch transition" className="flex justify-center items-center rounded-full bg-gray-700 border-parch transition [&::before]:!size-[3rem]"
> >
<div className="border-parch-inner flex justify-center items-center rounded-full size-[2rem]">
<Github size={16} /> <Github size={16} />
</div>
</Link> </Link>
<Link <Link
href={"/"} href={"/"}
className="flex justify-center items-center w-8 h-8 rounded-full bg-gray-700 border-parch transition" className="flex justify-center items-center !rounded-full bg-gray-700 border-parch transition [&::before]:!size-[3rem]"
> >
<div className="border-parch-inner flex justify-center items-center !rounded-full size-[2rem]">
<Twitter size={16} /> <Twitter size={16} />
</div>
</Link> </Link>
<Link <Link
href={"/"} href={"/"}
className="flex justify-center items-center w-8 h-8 rounded-full bg-gray-700 border-parch transition" className="flex justify-center items-center rounded-full bg-gray-700 border-parch transition [&::before]:!size-[3rem]"
> >
<div className="border-parch-inner flex justify-center items-center !rounded-full size-[2rem]">
<Instagram size={16} /> <Instagram size={16} />
</div>
</Link> </Link>
<Link <Link
href={"/"} href={"/"}
className="flex justify-center items-center w-8 h-8 rounded-full bg-gray-700 border-parch transition" className="flex justify-center items-center rounded-full bg-gray-700 border-parch transition [&::before]:!size-[3rem]"
> >
<div className="border-parch-inner flex justify-center items-center !rounded-full size-[2rem]">
<Youtube size={16} /> <Youtube size={16} />
</div>
</Link> </Link>
</div> </div>
</FooterColumn> </FooterColumn>

4
components/podcast-hero.tsx
View file

@ -35,10 +35,12 @@ export function PodcastHero() {
<div className="flex flex-col gap-2 min-[400px]:flex-row"> <div className="flex flex-col gap-2 min-[400px]:flex-row">
<Button <Button
size="lg" size="lg"
className="gap-2 border-parch text-blue-parch bg-white" className="border-parch [&::before]:!size-[12rem] cursor-pointer"
> >
<div className="border-parch-inner !bg-white text-blue-parch flex items-center p-2 !text-black ![background:white]">
<span>اکنون گوش کن</span> <span>اکنون گوش کن</span>
<Play className="h-4 w-4" /> <Play className="h-4 w-4" />
</div>
</Button> </Button>
</div> </div>
</div> </div>