parsa/parsaaghayi-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

website homePage design updated

Browse Source
This commit is contained in:
parsa aghaei 2024-10-20 19:02:03 +03:30
parent b7f2113fed
commit 9ed56c1e30
5 changed files with 14 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/(routes)/(website)/components/aboutMe/aboutMe.tsx
View File

@ -14,13 +14,13 @@ export default async function AboutMe() {
id="about-me"
>
<div className="flex w-full flex-col items-center md:w-[50%]">
<h2 className="mb-10 text-[55px] font-[800] text-black">
<h2 className="text-start w-full text-[55px] font-[800] text-black">
{aboutMeData?.title || <Skeleton width={300} height={100} />}
</h2>
<p className="my-5 text-center text-[21px] font-[400] text-black">
<p className="my-5 text-start text-[21px] font-[400] text-black">
{aboutMeData?.description || <Skeleton width={350} height={30} />}
</p>
<ul className="mt-10 flex w-full flex-col gap-10">
<ul className="mt-20 flex w-full flex-col gap-10">
{aboutMeData.skills.map((skill, index) => (
<li key={index}>
<h3 className="mb-2 text-[18px] font-[700]">{skill.title}</h3>

2
src/app/(routes)/(website)/components/header/header.tsx
View File

@ -71,7 +71,7 @@ export default async function Header() {
/>
</ul>
<div className="flex gap-1">
<button className="flex items-center justify-center whitespace-nowrap rounded-md bg-[#FD6F00] px-4 py-2 text-[15px] font-[600] text-[#fff] xl:text-[20px]">
<button className="flex items-center justify-center whitespace-nowrap rounded-lg bg-[#FD6F00] px-4 py-2 text-[15px] font-[600] text-[#fff] xl:text-[20px]">
{dict.header.Button}
</button>
<BurgerButton dict={dict} />

8
src/app/(routes)/(website)/components/projects/projects.tsx
View File

@ -89,7 +89,7 @@ export default function Projects({ dict }: MyProjectsProps) {
return (
<div className="flex w-full max-w-[90%] flex-wrap items-center justify-center pt-[50px]" id="projects">
<h2 className="my-10 text-[55px] font-[800] capitalize text-black">{dict.homePage.projects.title}</h2>
<h2 className="my-10 mt-20 text-[55px] font-[800] capitalize text-black">{dict.homePage.projects.title}</h2>
<p className="text-center text-[21px] font-[400] text-black">{dict.homePage.projects.description}</p>
<ul className="mb-10 mt-20 flex w-full flex-wrap items-center justify-center gap-2">
{categories.length > 0 ? (
@ -97,7 +97,7 @@ export default function Projects({ dict }: MyProjectsProps) {
<li
key={index}
onClick={() => setSelectedCategory(category.label)}
className={`select-none whitespace-nowrap rounded-md border border-[#545454] bg-[#F8F8F8] p-2 text-[14px] font-[600] capitalize hover:cursor-pointer hover:border-[#FD6F00] md:text-[18px] ${
className={`select-none whitespace-nowrap rounded-md bg-[#F8F8F8] p-2 text-[14px] font-[600] capitalize hover:cursor-pointer hover:border-[#FD6F00] md:text-[18px] ${
selectedCategory === category.label ? "bg-[#FD6F00] text-[#FFFFFF]" : "text-[#000]"
}`}
>
@ -108,10 +108,10 @@ export default function Projects({ dict }: MyProjectsProps) {
renderSkeletons(4) // Adjust the count as needed
)}
</ul>
<div className="flex w-full flex-wrap items-start justify-center gap-8">
<div className="flex w-full flex-wrap items-start justify-center gap-20">
{filteredProjects.length > 0 ? (
filteredProjects.map((project, index) => (
<div key={index} className="project flex w-[45%] flex-wrap md:w-[30%]">
<div key={index} className="project flex w-[45%] flex-wrap">
<div className="relative my-5 h-[200px] w-full overflow-hidden bg-[#FFEBDB] md:h-[250px] lg:h-[300px]">
{project.images.map((image, idx) => (
<img

8
src/app/(routes)/(website)/components/services/services.tsx
View File

@ -49,23 +49,23 @@ export default function Services({ dict }: ServicesProps) {
const renderServiceCard = (service?: Service, index?: number) => (
<div
key={service?.id || index}
className="flex w-[45%] flex-wrap items-center rounded-lg bg-[#F8F8F8] p-[22px] lg:w-[22%]"
className="flex mb-20 w-[45%] flex-wrap items-center rounded-lg bg-[#F8F8F8] p-[22px] lg:w-[22%]"
>
<div className="my-5 flex w-full justify-center">
<div className="my-5 flex w-full justify-start">
{loading ? (
<Skeleton containerClassName="w-[100px]" height={120} />
) : (
<img src={service!.imageSrc} alt={service!.altText} />
)}
</div>
<h3 className="w-full text-[18px] font-[700] text-black xl:text-[32px]">
<h3 className="w-full text-[18px] mb-5 font-[700] text-black xl:text-[23px]">
{loading ? (
<Skeleton containerClassName="w-full" height={32} />
) : (
service!.title
)}
</h3>
<p className="w-full text-justify text-[14px] font-[400] text-black xl:text-[20px]">
<p className="w-full text-start text-[14px] font-[400] text-black xl:text-[20px]">
{loading ? (
<Skeleton containerClassName="w-full" height={60} />
) : (

4
src/app/(routes)/(website)/layout.tsx
View File

@ -35,10 +35,10 @@ export default function RootLayout({
<div className="absolute start-0 top-0 opacity-0" id="here-is-top"></div>
<a
href="/#here-is-top"
className="scroll-to-top fixed end-5 flex h-[50px] w-[50px] items-center justify-center rounded-full border-2 bg-[#fd6f00] p-5 pt-10 text-center text-[25px] font-[800] text-white hover:border-[#f3a66b] sm:bottom-[100px] sm:end-10"
className="rotate-90 scroll-to-top fixed end-5 flex h-[50px] w-[50px] items-center justify-center rounded-full border-2 p-5 pt-10 text-center text-[25px] font-bold text-gray hover:border-[#f3a66b] sm:bottom-[100px] sm:end-10"
id="back-to-top"
>
^
{"<"}
</a>
<Header />