Skip to content

Commit e581107

Browse files
committed
new project added
1 parent 681a57b commit e581107

File tree

3 files changed

+94
-11
lines changed

3 files changed

+94
-11
lines changed

public/animations/car-landing-page.json

Lines changed: 1 addition & 0 deletions
Large diffs are not rendered by default.

src/pages/extras.astro

Lines changed: 57 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -4,18 +4,64 @@ import Layout from "../layouts/Layout.astro";
44

55
<Layout>
66
<main class="container mx-auto px-4 sm:px-6 md:px-8 py-4 sm:py-6 md:py-8">
7-
<div class="flex-1 max-w-xl sm:max-w-2xl md:max-w-3xl mx-auto text-center mt-8 sm:mt-12 md:mt-20">
8-
<div class="flex justify-center mb-4 sm:mb-6">
9-
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="28" height="28" sm:width="34" sm:height="34" fill="#000000" class="w-7 h-7 sm:w-8 sm:h-8 md:w-9 md:h-9">
10-
<path d="M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7 .2 40.1S486.3 480 472 480L40 480c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8 .2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24l0 112c0 13.3 10.7 24 24 24s24-10.7 24-24l0-112c0-13.3-10.7-24-24-24zm32 224a32 32 0 1 0 -64 0 32 32 0 1 0 64 0z"/>
7+
<div class="mb-4 sm:mb-6">
8+
<a href="/home" class="inline-flex items-center px-2 py-2 bg-gray-200 hover:bg-[#00bbff40] text-white rounded-[50%] transition-colors duration-200 back-button cursor-none">
9+
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="h-5 w-5 sm:h-6 sm:w-6" fill="#000000">
10+
<path d="M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.2 288 416 288c17.7 0 32-14.3 32-32s-14.3-32-32-32l-306.7 0L214.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/>
1111
</svg>
12-
</div>
13-
<p class="text-2xl sm:text-3xl md:text-4xl text-gray-600 leading-relaxed mb-6 sm:mb-8 px-4">
14-
Under Maintainance!!!
15-
</p>
16-
<a href="/home" class="inline-block mt-4 sm:mt-6 md:mt-8 text-base sm:text-lg bg-black rounded-2xl sm:rounded-3xl px-4 sm:px-6 py-2 sm:py-3 text-white hover:bg-gray-800 transition-colors duration-200">
17-
Back to Safety!
1812
</a>
1913
</div>
14+
15+
<div class="mt-4 sm:mt-6 md:mt-8 mb-8">
16+
<h2 class="flex justify-center text-center text-2xl sm:text-3xl md:text-4xl font-bold text-gray-600 font-reenie px-4">
17+
Behind the Scenes & Random Thoughts
18+
</h2>
19+
</div>
20+
21+
<!-- Sticky Scroll Content -->
22+
<div class="relative flex h-[30rem] justify-center space-x-10 overflow-y-auto rounded-md p-10 bg-white-900">
23+
<div class="relative flex items-start px-4">
24+
<div class="max-w-2xl">
25+
<div class="my-20">
26+
<h2 class="text-2xl font-bold text-black">Design Philosophy</h2>
27+
<p class="text-lg mt-10 max-w-sm text-black-300">
28+
I believe in creating designs that tell stories. Every pixel has a purpose, every interaction should feel natural, and every user should leave with a smile.
29+
</p>
30+
</div>
31+
<div class="my-20">
32+
<h2 class="text-2xl font-bold text-slate-100">Creative Process</h2>
33+
<p class="text-lg mt-10 max-w-sm text-slate-300">
34+
From chaos comes clarity. I start with wild ideas, sketch endlessly, prototype rapidly, and refine obsessively until the design feels just right.
35+
</p>
36+
</div>
37+
<div class="my-20">
38+
<h2 class="text-2xl font-bold text-slate-100">Tools & Technology</h2>
39+
<p class="text-lg mt-10 max-w-sm text-slate-300">
40+
Figma for design, Framer for prototypes, and a healthy dose of coffee for fuel. I stay updated with the latest design trends and emerging technologies.
41+
</p>
42+
</div>
43+
<div class="h-40"></div>
44+
</div>
45+
</div>
46+
<div class="sticky top-10 hidden h-60 w-80 overflow-hidden rounded-md bg-gradient-to-br from-cyan-500 to-emerald-500 lg:block">
47+
<div class="h-full w-full flex items-center justify-center text-white">
48+
<div class="text-center">
49+
<h3 class="text-2xl font-bold mb-4">Creative Vision</h3>
50+
<p class="text-lg">Where art meets functionality</p>
51+
</div>
52+
</div>
53+
</div>
54+
</div>
2055
</main>
21-
</Layout>
56+
</Layout>
57+
58+
<style>
59+
.font-reenie {
60+
font-family: 'Reenie Beanie', cursive;
61+
}
62+
63+
.back-button {
64+
position: relative;
65+
overflow: hidden;
66+
}
67+
</style>

src/pages/work.astro

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,42 @@ import { Card } from "@/components/CardSwap"
2323
<!-- Single Column Portfolio Projects -->
2424
<div class="mt-8 sm:mt-12 md:mt-16 flex flex-col gap-6 sm:gap-8 md:gap-12 max-w-6xl mx-auto">
2525

26+
<!-- landing page car -->
27+
<div class="projectone flex flex-col lg:flex-row gap-6 sm:gap-8 lg:gap-10 rounded-2xl sm:rounded-3xl overflow-hidden group bento-item p-4 sm:p-6 bg-gray-50 shadow-sm transition-all duration-300">
28+
<div class="w-full lg:w-1/2 h-48 sm:h-64 lg:h-80 relative overflow-hidden rounded-lg flex items-center justify-center">
29+
<div class="w-full h-full flex items-center justify-center">
30+
<dotlottie-player
31+
src="/animations/car-landing-page.json"
32+
background="transparent"
33+
speed="1"
34+
style="width: 100%; height: 100%;"
35+
loop
36+
autoplay>
37+
</dotlottie-player>
38+
</div>
39+
</div>
40+
<div class="w-full lg:w-1/2 flex flex-col justify-center space-y-4">
41+
<h3 class="text-xl sm:text-2xl font-bold text-gray-800">EV charging finder platform</h3>
42+
<p class="text-sm sm:text-base text-gray-800 leading-relaxed">Built this one to shake off some boredom and procrastination turned out pretty fun to work on!
43+
Focus was on simplicity, quick search flow, and a modern layout for EV users on the go.
44+
</p>
45+
<div class="flex gap-4">
46+
<a href="https://www.figma.com/design/djyFQPDmNcYkV7LbUzJMqC/practice?node-id=116-87&t=ZGjDq4FV12gpl5RJ-1" class="inline-flex items-center px-3 sm:px-4 py-2 bg-gray-200 hover:bg-gray-400 text-black rounded-lg transition-colors duration-200 max-w-max text-sm sm:text-base cursor-none">
47+
Figma
48+
<svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3 sm:h-4 sm:w-4 ml-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
49+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 5l7 7m0 0l-7 7m7-7H3" />
50+
</svg>
51+
</a>
52+
<a href="https://jitter.video/file/?id=sMy0SFJzG2ZW3thz7Evn5lr6&nodeId=k5PaUordR4aEFtZbDiJ_n&source=share_button" class="inline-flex items-center px-3 sm:px-4 py-2 bg-gray-200 hover:bg-gray-400 text-black rounded-lg transition-colors duration-200 max-w-max text-sm sm:text-base cursor-none">
53+
Jitter
54+
<svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3 sm:h-4 sm:w-4 ml-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
55+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 5l7 7m0 0l-7 7m7-7H3" />
56+
</svg>
57+
</a>
58+
</div>
59+
</div>
60+
</div>
61+
2662
<!-- Dashboard -->
2763
<div class="projectone flex flex-col lg:flex-row gap-6 sm:gap-8 lg:gap-10 rounded-2xl sm:rounded-3xl overflow-hidden group bento-item p-4 sm:p-6 bg-gray-50 shadow-sm transition-all duration-300">
2864
<div class="w-full lg:w-1/2 h-48 sm:h-64 lg:h-80 relative overflow-hidden rounded-lg flex items-center justify-center">

0 commit comments

Comments
 (0)