Skip to content

Commit

Permalink
gfsdg
Browse files Browse the repository at this point in the history
  • Loading branch information
@neerajrekwar
neerajrekwar committed Jul 29, 2024
1 parent ee39997 commit fa5739f
Show file tree
Hide file tree
Showing 5 changed files with 59 additions and 48 deletions.
4 changes: 2 additions & 2 deletions app/components/DeviceAddress.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,10 +38,10 @@ const DeviceAddress: React.FC = () => {
<p>Error: {error}</p>
</div>
) : address ? (
<div className="flex gap-1 text-five font-semibold justify-center items-center">
<div className="flex gap-1 text-secondary justify-center items-center">
{/* <h2 className="text-2xl font-bold mb-4 text-center">Device Address</h2> */}
{/* <p className="text-lg"><strong>IP:</strong> {address.ip}</p> */}
<svg xmlns="http://www.w3.org/2000/svg" width={18} height={18} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round" className="icon icon-tabler icons-tabler-outline icon-tabler-current-location">
<svg xmlns="http://www.w3.org/2000/svg" width={14} height={14} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round" className="icon icon-tabler icons-tabler-outline icon-tabler-current-location">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0 -6 0" />
<path d="M12 12m-8 0a8 8 0 1 0 16 0a8 8 0 1 0 -16 0" />
Expand Down
25 changes: 17 additions & 8 deletions app/components/VisionSection.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,9 @@ export const VisionSection: React.FC = () => {
<div className="text-4xl text-third sm:text-5xl sm:mx-2">&#8226;</div>
Vision to the Future
</div>
<div className="justify-center items-center flex my-10">
<span className="text-five rounded-full bg-seven h-10 w-10 justify-center items-center flex p-4">1</span>
</div>
<div className="text-four min-h-screen md:bg-gradient-to-r md:rounded-ss-2xl">
<div className="md:h-80 md:flex-row md:flex gap-4 border-four">
<div className="text-five basis-1/2 font-bold flex justify-center items-center bg-seven rounded-2xl m-2 p-4 h-60 md:h-auto">
Expand Down Expand Up @@ -142,6 +145,9 @@ export const VisionSection: React.FC = () => {
</div>
</div>
<div className="text-four min-h-screen md:bg-gradient-to-l pt-2 from-seven md:rounded-se-2xl">
<div className="justify-center items-center flex my-10">
<span className="text-five rounded-full bg-seven h-10 w-10 justify-center items-center flex p-4">2</span>
</div>
<div
style={{}}
className=" md:flex-row-reverse md:flex gap-4 border-four"
Expand All @@ -152,7 +158,7 @@ export const VisionSection: React.FC = () => {
backgroundSize: "cover",
backgroundPosition: "center",
}}
className="text-4xl basis-1/2 font-bold rounded-2xl mx-2 p-4 h-60 md:h-auto">
className="text-4xl basis-1/2 font-bold rounded-2xl mx-2 p-4 h-60 md:h-auto">
</div>
<div className="basis-1/2 text-base md:text-xl p-4">
<h2 className="text-4xl md:text-6xl font-bold pb-2 text-five ">
Expand Down Expand Up @@ -183,7 +189,7 @@ export const VisionSection: React.FC = () => {
</div>
<ul className="flex flex-wrap md:grid md:grid-flow-row-dense md:grid-cols-3 md:grid-rows-3 text-five h-auto">

<li className="col-span-2 flex items-center justify-center h-28 md:h-auto w-full md:w-auto p-1 m-2 rounded-2xl hover:scale-95 duration-500 transition-all bg-five text-[#E5D352]">
<li className="col-span-2 flex items-center justify-center h-28 md:h-auto w-full md:w-auto p-1 m-2 rounded-2xl hover:scale-95 duration-500 transition-all bg-secondary text-[#E5D352]">
<p className="basis-2/2 md:basis-1/2 md:text-6xl p-2">online activity on smartphones 3hrs and 50min avg. </p>
<svg xmlns="http://www.w3.org/2000/svg"

Expand All @@ -194,15 +200,15 @@ export const VisionSection: React.FC = () => {
<path d="M16 9h2" />
</svg>
</li>
<li className="flex flex-row-reverse items-center h-28 md:h-auto w-full md:w-auto p-1 m-2 rounded-2xl rounded-2xl hover:scale-95 duration-500 bg-five text-[#FF6B6B]">
<li className="flex flex-row-reverse items-center h-28 md:h-auto w-full md:w-auto p-1 m-2 rounded-2xl rounded-2xl hover:scale-95 duration-500 bg-secondary text-[#FF6B6B]">
<p className="basis-2/2 md:basis-1/2 md:text-3xl p-2">Earthweb reports that 67% of the global</p>
<svg xmlns="http://www.w3.org/2000/svg" width={64} height={64} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round" className="basis-1/2 icon icon-tabler icons-tabler-outline icon-tabler-device-laptop">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M3 19l18 0" />
<path d="M5 6m0 1a1 1 0 0 1 1 -1h12a1 1 0 0 1 1 1v8a1 1 0 0 1 -1 1h-12a1 1 0 0 1 -1 -1z" />
</svg>
</li>
<li className="flex items-center h-28 md:h-auto w-full md:w-auto p-1 m-2 rounded-2xl bg-five rounded-2xl hover:scale-95 duration-500 text-[#759FBC]">
<li className="flex items-center h-28 md:h-auto w-full md:w-auto p-1 m-2 rounded-2xl bg-secondary rounded-2xl hover:scale-95 duration-500 text-[#759FBC]">
<p className="basis-2/2 md:basis-1/2 md:text-4xl p-2"> smart streaming devices will be $9.2 billion by 2024. </p>
<svg xmlns="http://www.w3.org/2000/svg" width={64} height={64} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round" className=" basis-1/2 icon icon-tabler icons-tabler-outline icon-tabler-devices-2">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
Expand All @@ -214,15 +220,15 @@ export const VisionSection: React.FC = () => {
<path d="M9 15l0 4" />
</svg>
</li>
<li className="flex col-span-2 flex-row-reverse items-center rounded-2xl hover:scale-95 duration-500 h-28 md:h-auto w-full md:w-auto p-1 m-2 rounded-2xl bg-five text-[#B9B8D3]">
<li className="flex col-span-2 flex-row-reverse items-center rounded-2xl hover:scale-95 duration-500 h-28 md:h-auto w-full md:w-auto p-1 m-2 rounded-2xl bg-secondary text-[#B9B8D3]">
<p className="basis-2/2 md:basis-1/2 md:text-4xl p-2">2.16% tablet user in worldwide & digital landscape changing in web3 after </p>
<svg xmlns="http://www.w3.org/2000/svg" width={64} height={64} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round" className="basis-1/2 icon icon-tabler icons-tabler-outline icon-tabler-device-tablet">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M5 4a1 1 0 0 1 1 -1h12a1 1 0 0 1 1 1v16a1 1 0 0 1 -1 1h-12a1 1 0 0 1 -1 -1v-16z" />
<path d="M11 17a1 1 0 1 0 2 0a1 1 0 0 0 -2 0" />
</svg>
</li>
<li className="flex col-span-2 items-center justify-center h-28 md:h-auto w-full md:w-auto p-1 m-2 rounded-2xl hover:scale-95 duration-500 bg-five rounded-2xl text-[#FF6F59]">
<li className="flex col-span-2 items-center justify-center h-28 md:h-auto w-full md:w-auto p-1 m-2 rounded-2xl hover:scale-95 duration-500 bg-secondary rounded-2xl text-[#FF6F59]">
<p className="basis-2/2 md:basis-1/2 md:text-4xl p-2 ">mobiles that users in use 37.23%</p>
<svg xmlns="http://www.w3.org/2000/svg" width={64} height={64} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round" className="basis-1/2 icon icon-tabler icons-tabler-outline icon-tabler-device-mobile">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
Expand All @@ -231,7 +237,7 @@ export const VisionSection: React.FC = () => {
<path d="M12 17v.01" />
</svg>
</li>
<li className="flex flex-row-reverse items-center p-1 m-2 h-28 md:h-auto w-full md:w-auto rounded-2xl hover:scale-95 duration-500 rounded-2xl bg-five text-[#F6F4F3]">
<li className="flex flex-row-reverse items-center p-1 m-2 h-28 md:h-auto w-full md:w-auto rounded-2xl hover:scale-95 duration-500 rounded-2xl bg-secondary text-[#F6F4F3]">
<p className="basis-2/2 md:basis-1/2 p-1">Desktops that users in use 60.61% </p>
<svg xmlns="http://www.w3.org/2000/svg" width={64} height={64} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round" className="basis-1/2 icon icon-tabler icons-tabler-outline icon-tabler-device-desktop">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
Expand All @@ -246,7 +252,10 @@ export const VisionSection: React.FC = () => {
</div>
</div>
</div>
<div className="text-four min-h-screen md:bg-gradient-to-r from-seven md:rounded-ss-2xl">
<div className="text-four min-h-screen md:bg-gradient-to-r from-seven md:rounded-ss-2xl">
<div className="justify-center items-center flex my-10">
<span className="text-five rounded-full bg-seven h-10 w-10 justify-center items-center flex p-4">3</span>
</div>
<div className=" md:flex-row md:flex gap-4 border-four">
<div
style={{
Expand Down
43 changes: 23 additions & 20 deletions app/components/footer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,7 @@ export default function Footer() {

return (
<>
<section className='three'>
<footer className="bg-seven ">
<div className="p-4 text-five py-10 max-w-6xl m-auto">
<ul className="flex gap-2 mb-8 items-start flex-col">
Expand Down Expand Up @@ -134,9 +135,9 @@ export default function Footer() {
<div className=" py-10 border-lime-400 max-w-6xl m-auto mx-auto grid grid-cols-[repeat(auto-fit,minmax(280px,1fr))] gap-1.25 justify-center items-start h-auto">
<div className="p-4 mb-10 text-five">
<div className="flex gap-2 mb-8 items-center">
<span className="border-2 hover:bg-seven transition-all duration-10000 border-four rounded-full p-1">
<span className="bg-seven transition-all duration-10000 border-four rounded-full p-1">
<svg
className="md:h-18 md:w-18 p-1"
className="md:h-18 md:w-18 "
xmlns="http://www.w3.org/2000/svg"
height="28px"
viewBox="0 -960 960 960"
Expand All @@ -161,7 +162,7 @@ export default function Footer() {
<path d="M480-480q33 0 56.5-23.5T560-560q0-33-23.5-56.5T480-640q-33 0-56.5 23.5T400-560q0 33 23.5 56.5T480-480Zm0 400Q319-217 239.5-334.5T160-552q0-150 96.5-239T480-880q127 0 223.5 89T800-552q0 100-79.5 217.5T480-80Z" />
</svg>
</span>
<span className="px-4 text-five ">
<span className="px-4 text-five text-sm font-semibold sm:font-normal ">
Dwarka sec 7 New Delhi Delhi India 110075
</span>
</li>
Expand All @@ -177,7 +178,7 @@ export default function Footer() {
<path d="M798-120q-125 0-247-54.5T329-329Q229-429 174.5-551T120-798q0-18 12-30t30-12h162q14 0 25 9.5t13 22.5l26 140q2 16-1 27t-11 19l-97 98q20 37 47.5 71.5T387-386q31 31 65 57.5t72 48.5l94-94q9-9 23.5-13.5T670-390l138 28q14 4 23 14.5t9 23.5v162q0 18-12 30t-30 12Z" />
</svg>
</span>
<span className="px-4 text-four text-sm">
<span className="px-4 text-four text-sm font-semibold sm:font-normal ">
{" "}
+91 704 214 9836
</span>
Expand All @@ -194,7 +195,7 @@ export default function Footer() {
<path d="M516-120 402-402 120-516v-56l720-268-268 720h-56Z" />
</svg>
</span>
<span className="px-4 text-four text-sm">
<span className="px-4 text-four text-sm font-semibold sm:font-normal ">
<a href="mailto:[email protected]">
[email protected]
</a>
Expand All @@ -204,9 +205,9 @@ export default function Footer() {
</div>
<div className="p-4 mb-10 text-five">
<div className="flex gap-2 mb-8 items-center">
<span className="border-2 hover:bg-seven transition-all duration-10000 border-four rounded-full p-1">
<span className="bg-seven transition-all duration-10000 border-four rounded-full p-1">
<svg
className="md:h-18 md:w-18 p-1"
className="md:h-18 md:w-18 "
xmlns="http://www.w3.org/2000/svg"
height="28px"
viewBox="0 -960 960 960"
Expand All @@ -220,18 +221,18 @@ export default function Footer() {
</div>
<ul className="">
<a href="/" className="">
<li className="grid grid-flow-col gap-2 hover:bg-seven transition-all duration-1000 p-2 rounded-md justify-center border-black">
<div className="aspact-square overflow-hidden bg-cover bg-center">
<li className="grid grid-flow-col gap-2 hover:bg-seven transition-all duration-1000 p-2 rounded-md justify-center border-black">
<div className=" min-h-20 min-w-20 overflow-hidden bg-cover bg-center">
<Image
className="aspact-square rounded-md"
className="h-5f0 w-50 rounded-md"
src="https://images.unsplash.com/photo-1719937051058-63705ed35502?q=80&w=1472&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDF8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"
alt="Picture of the author"
width={100}
height={100}
/>
</div>
<div className="flex-col flex justify-items-end justify-end p-1">
<span className="md:text-1xl flex-wrap">
<span className="md:text-1xl font-semibold flex-wrap">
enormous photography in nature
</span>
<span className="text-four text-xs ">
Expand All @@ -241,33 +242,34 @@ export default function Footer() {
</li>
</a>
<a href="/" className="">
<li className="grid grid-flow-col gap-2 hover:bg-seven transition-all duration-1000 p-2 rounded-md justify-center border-black">
<div className="aspact-square overflow-hidden bg-cover bg-center">
<li className="grid grid-flow-col gap-2 hover:bg-seven transition-all duration-1000 p-2 rounded-md justify-center border-black">
<div className=" min-h-20 min-w-20 overflow-hidden bg-cover bg-center">
<Image
className="aspact-square rounded-md"
className="h-5f0 w-50 rounded-md"
src="https://images.unsplash.com/photo-1719937051058-63705ed35502?q=80&w=1472&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDF8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"
alt="Picture of the author"
width={100}
height={100}
/>
</div>
<div className="flex-col flex justify-items-end justify-end p-1">
<span className="md:text-1xl flex-wrap">
enormous photography in nature
<span className="md:text-1xl font-semibold flex-wrap">
enormous photography in nature
</span>
<span className="text-four text-xs ">
07 jan, 2022 &#9679; Admin
</span>
</div>
</li>
</a>

</ul>
</div>
<div className="p-4 mb-10 text-five">
<div className="flex gap-2 mb-8 items-center">
<span className="border-2 hover:bg-seven transition-all duration-10000 border-four rounded-full p-1">
<span className="bg-seven transition-all duration-10000 border-four rounded-full p-1">
<svg
className="md:h-18 md:w-18 p-1"
className="md:h-18 md:w-18 "
xmlns="http://www.w3.org/2000/svg"
height="28px"
viewBox="0 -960 960 960"
Expand Down Expand Up @@ -329,7 +331,7 @@ export default function Footer() {
</div>
<div className="p-4 mb-10 text-five">
<div className="flex gap-2 mb-8 items-center">
<span className="border-2 hover:bg-seven transition-all duration-10000 border-four rounded-full p-1">
<span className="bg-seven transition-all duration-10000 border-four rounded-full p-1">
<svg
xmlns="http://www.w3.org/2000/svg"
width={24}
Expand Down Expand Up @@ -362,11 +364,12 @@ export default function Footer() {
</ul>
</div>
</div>
<div className="opacity-50 border-t-[.2px] border-four mx-8 text-center flex flex-col text-xs p-4">
<div className="opacity-50 mx-4 text-center flex justify-between text-xs p-2">
<span >Copyright ©2023 Neeraj Rekwar</span>
<span >build by me</span>
</div>
</footer>
</section>
</>
);
}
33 changes: 16 additions & 17 deletions app/globals.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,23 +77,26 @@
transition: 0.5s;
}

.cbtn:hover::after, .cbtn:hover::before {
.cbtn:hover::after,
.cbtn:hover::before {
width: 100%;
}

.button-three {
@apply border-none bg-transparent;
--button-color: #000;
}

section.one {

background-image: linear-gradient(-45deg, transparent 75%, hsla(145, 95%, 24%, 0.082) 75%),
linear-gradient(45deg, transparent 75%, hsla(145, 95%, 24%, 0.082) 75%),
linear-gradient(-135deg, transparent 75%, hsla(145, 95%, 24%, 0.082) 75%),
linear-gradient(135deg, transparent 75%, hsla(145, 95%, 24%, 0.082) 75%);
background-size: 4rem 4rem;
background-position: 19rem 0, 19rem 0, 0 0, 0 0;
}

section.two {
background-color: hsl(177, 27%, 69%);
background-image: linear-gradient(-45deg, transparent 50%, hsl(49, 71%, 63%) 50%),
Expand All @@ -102,26 +105,23 @@ section.two {
linear-gradient(-45deg, transparent 50%, hsl(49, 71%, 63%) 50%);
background-size: 2rem 2rem, 2rem 2rem;
}

section.three {
/* background-color: #f9ffe0; */
/* background-color: #353535; */
background-image: radial-gradient(
circle at 100% 50%,
background-image: radial-gradient(circle at 100% 50%,
transparent 1rem,
#a1b1c12c 1rem,
#a1b1c12c 1.5rem,
transparent 1.5rem
),
radial-gradient(
circle at 0% 50%,
transparent 1.5rem),
radial-gradient(circle at 0% 50%,
transparent 1rem,
#a1b1c12c 1rem,
#a1b1c12c 1.5rem,
transparent 1.5rem
);
transparent 1.5rem);

background-size: 20rem 5rem;
background-position: 0 0, 0 2.5rem;
}

section.four {
background-image: url(), url(),
linear-gradient(to right, rgb(0, 0, 0), rgb(255 255 255 / 0%));
Expand All @@ -132,12 +132,13 @@ section.four {
right;

}

.textCllip {
background-image: linear-gradient(black , var(--color-third) 82%);
background-image: linear-gradient(black, var(--color-third) 82%);
background-clip: text;

-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;

}

Expand All @@ -152,9 +153,7 @@ section.four {
display: inline-block;
position: relative;
width: 200px;
/* Adjust width as needed */
height: 40px;
/* Adjust height as needed */
}

.step {
Expand Down
Loading

0 comments on commit fa5739f

Please sign in to comment.