From 6fc675d03374f86019bcbdb03f1568bd7cbbf1e1 Mon Sep 17 00:00:00 2001 From: nikkhhhil <119395854+nikkhhhil@users.noreply.github.com> Date: Mon, 28 Aug 2023 23:19:38 +0530 Subject: [PATCH] first commit --- .DS_Store | Bin 0 -> 6148 bytes Projects/.DS_Store | Bin 0 -> 6148 bytes Projects/nikhilkumarl/index.html | 302 +++++++++++++++++++ Projects/nikhilkumarl/style.css | 480 +++++++++++++++++++++++++++++++ 4 files changed, 782 insertions(+) create mode 100644 .DS_Store create mode 100644 Projects/.DS_Store create mode 100644 Projects/nikhilkumarl/index.html create mode 100644 Projects/nikhilkumarl/style.css diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..e077aec7335032560928ed24724b2c944d2dc89d GIT binary patch literal 6148 zcmeHKO>fgc5S>j^>QDhWfYb}pN?fawrXdyLVnTXA0twX!4uFCkM__QhRqPO4OTv9Ddp~vPpZ=TKFTCl* z{MyJoC^N;)M&_Wx{M^XAQ(^vSWDd*B)|*D=VVSAN{-rSXtMCYBFog^jFvm=S2Qfqt zVxCsCZww3aF+YQvuL)Qbgw^9N#;k%Y_0`SI77^R}Kyi*Sm6cx8K8jI9RVc&W&5Q?;TIx$0v#Ugk#1KxD)8O!gvNWn>8Ok zc=IGy3C#-WI&cg}==>NSBksWogk@(1-KFRhDbRoPmS$yIp9?|%jlU=^h`Z-_QSle8 zCzU_Xnl~3E@N&`FCAFvBLHF>n{{ALp97?oj4oqt5PL9$ks=zY z;3I}Ga%`8(a~X4kMh=1xAA+AO_=F<#)A9aN(?PffZEYQ}4wN0(Fqd80|Bsr_|7DTA zvJO}WE|deJJ@&>U91`!XwZYL|E3v%BLP5OTpq608+p$h)E8fAP1N$T;h%RGp5L+

cB5@L=|BG literal 0 HcmV?d00001 diff --git a/Projects/.DS_Store b/Projects/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..871a22b63add441a4e804c73cb2369171110c00d GIT binary patch literal 6148 zcmeHKzi-n(6n@tRdZr*UfK)LcOAIVkNlVoVvADq<7+|Oo41j`NM~zkIF0zwmh$49| ze+&{6Tc@ra`|rSaKO#s&Dp*j2?n(E)`|&=X?{n^5j)+)ukZuyyiHM^ptlfh9jj3@} zW^Bp!ctEC~kx@>^G@vfUGtsWYDc}@XGzHY&y-k8L?As3f&;46a{xX+`NiGw_AVIK) zz^~u6>1E92CBw33dEb&=o|XMZ`+plrs)d)0a)Wu8px zaq>264_oznFQn+lnP?Z9kfm*ee0Z0MR1TYRAktEEBQwA~?zQS`qtRAlXWid^x;tL? zN6)qzsPAl##~#1`=*jbg)^Xky@>H*Y81k03I~FJK8I`%~%a1mrL)q<3g0GA1$}qHA z@QVkJ&rV;T?_D3C{#AUh^XKn!5)~qs;t2Drb$fI``?N-9P5fYiq}xIVa!(*U|_K_h#r{xBcNq)&MELu75D-C4x?fK literal 0 HcmV?d00001 diff --git a/Projects/nikhilkumarl/index.html b/Projects/nikhilkumarl/index.html new file mode 100644 index 0000000..759b9a9 --- /dev/null +++ b/Projects/nikhilkumarl/index.html @@ -0,0 +1,302 @@ + + + + + + Nikhils Portfolio + + + + + +

+ +
+
+
+
+ +
+
+

About Me

+

I am a passionate and ambitious engineering student at IIT Gandhinagar, having successfully cleared the challenging JEE Advanced exam. With a focus on Mechanical Engineering, I have completed my first year, during which I delved into various fields, including programming with Python and intermediate web development using HTML and CSS. My journey has been enriched by engaging in projects that blend mechanical and computational aspects, offering innovative solutions. Active participation in clubs like "Mean Mechanics" and association with esteemed organizations like Career Development Services have expanded my horizons. Now, I am excited to present my personal portfolio, featuring three active links—Skills, Experience, and Education—showcasing my achievements, projects, and journey towards excellence. Thank you for exploring my endeavors!

+
+

Skills

+

Experience

+

Education

+
+
+
    +
  • Python
    Proficient in Python programming language
    • +
  • Mechanical Design and Prototyping
    Expertise in designing and prototyping mechanical solutions
    • +
  • Video Editing
    Proficient in video editing, creating captivating visual content
    • +
  • Presentation Skills
    Ability to create impactful and engaging presentations
    • +
  • Public Speaking
    Confident and effective public speaking abilities
    • +
  • Web Development
    Intermediate level in HTML and CSS, designing web app interfaces
    • +
+
+
+
    +
  • Core Team Member, Mean Mechanics - February 2023 to Present
    > Played an integral role as a core member in Mean Mechanics, contributing to the exploration of cutting-edge mechanical concepts and technologies.
    > Collaborated with a diverse team to ideate, design, and execute various projects and workshops aimed at enhancing practical skills in mechanical engineering.
    • +
  • Social Team Member, Career Development Services - February 2023 to Present
    > Actively participated as a social team member in Career Development Services, assisting in organizing and promoting various career-oriented events and workshops.
    > Engaged with fellow students and industry professionals to create valuable networking opportunities and facilitate the exchange of knowledge and ideas.
    • +
  • Volunteer, Blithchron'22
    > Volunteered for Blithchron'22, contributing to the successful organization and execution of the event.
    > Assisted in various event logistics, ensuring a seamless experience for participants and attendees.
    • +
  • Volunteer, Amalthea'22
    > Contributed as a volunteer to Amalthea, actively supporting the event's organization and smooth operation.
    > Helped in coordinating activities and engaging with participants, enriching the overall experience of the event.
    • +
  • These experiences have not only enriched my skills and knowledge but have also provided me with valuable insights into teamwork, leadership, and event management within the engineering domain.
    • +
+
+
+
    +
  • Bachelor of Technology (B.Tech) in Mechanical Engineering
    Indian Institute of Technology, Gandhinagar, Gujarat
    Expected Completion: 2026
    • +
  • Higher Secondary Certificate (HSC) - 12th Grade
    Blooming Dales International School, Sri Ganganagar, Rajasthan
    Year of Completion: 2021
    • +
  • Secondary School Certificate (SSC) - 10th Grade
    Sacred Heart Convent School, Fazilka, Punjab
    Year of Completion: 2019
    • +
+
+
+
+
+
+ +
+
+

My Work

+
+
+ +
+

SPARSH-BHASHI

+

Introducing "SPARSH-BHASHI," the Smart Braille Learning Device revolutionizing Braille education. Three interactive modes empower learners with sequential teaching, challenging tests, and step-by-step word training. With cost-effectiveness, user-friendly interface, and innovative mechanisms, our device enhances Braille learning. Complemented by a Braille keyboard, we bridge the education gap for the visually impaired, fostering independence and accessibility.

+ +
+
+
+ +
+

UrbanWings

+

Elevate bird-watching in urban areas with an adjustable height design, intelligent shade protection, and an automatic grain dispenser. Crafted using modern 3D printing and laser cutting techniques, it offers a harmonious blend of wood, acrylic, and recyclable plastic. This eco-friendly sanctuary provides an immersive nature connection, observation platforms, and educational opportunities, making bird-watching a mesmerizing and enriching experience for all.

+ +
+
+
+ +
+

Social Media-3

+

3It provides a more holistic view of who you are and what drives your curiosity and enthusiasm. Remember to share any notable experiences or achievements related to these hobbies to make them even more engaging to your website visitors.

+ +
+
+ + + +
+ See More + See Less +
+
+ +
+
+

Hobbies

+
+
+ +

Cooking

+

As an avid cook and culinary explorer, I delight in experimenting with diverse cuisines and perfecting flavors. From savory dishes to mouthwatering desserts, I find joy in creating delectable recipes that tantalize the taste buds.

+ Learn more +
+
+ +

Cycling

+

Pedaling through scenic routes and embracing the freedom of the open road, I find solace and adventure in cycling. Exploring new trails and pushing my limits not only invigorate me but also foster a deep appreciation for nature and the beauty of the outdoors.

+ Learn more +
+
+ +

Photography

+

Through the lens of my camera, I capture fleeting moments that tell compelling stories. Whether it's picturesque landscapes, candid portraits, or vibrant cityscapes, photography enables me to see the world from a unique perspective and preserve cherished memories for a lifetime.

+ Learn more +
+
+
+
+ + +
+
+
+
+

Contact Me

+

nikhilkumar.lal@iitgn.ac.in

+

8400721381

+ + Download +
+
+
+ + + + +
+ +
+
+
+
+

My Location

+ +
+
+

Copyright ©️2023 Nikhil Kumar Lal. All rights reserved.

+
+
+ + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/Projects/nikhilkumarl/style.css b/Projects/nikhilkumarl/style.css new file mode 100644 index 0000000..5a5a94a --- /dev/null +++ b/Projects/nikhilkumarl/style.css @@ -0,0 +1,480 @@ +*{ + margin: 0; + padding: 0; + font-family: "Poppins", sans-serif; + box-sizing: border-box; + } + html{ + scroll-behavior: smooth; + } + + body { + background: #fffdfd; + color: #000000 ; + } + + #header{ + width: 100%; + height: 100vh; + background-image: url(/Users/nikhilkumarlal/Desktop/portfolio/background.png); + background-size: cover; + background-position: center; + } +/* dimension_for_main_site */ +.container{ + padding: 10px 3%; +} +.container nav img{ + width: 180px; + height: 70px; + margin: 10px ; +} +nav{ + display: flex; + align-items: center; + justify-content: space-between; + flex-wrap: wrap; +} + +.logo{ + width: 140px; +} +/*alignment_of_the_links */ +nav ul li{ + display: inline-block; + list-style: none; + margin: 10px 20px; +} +/*for text in the link*/ +nav ul li a{ + color: #000000; + text-decoration: none; + font-size: 18px; + position: relative; +} +/*hover effect for the link*/ +nav ul li a::after{ + content: ""; + width: 0; + height: 3px; + background: #aac527; + position: absolute; + left: 0; + bottom: -6px ; + transition: 0.5s; +} +/*to the make the line blink only when the cursor is there*/ +nav ul li a:hover::after{ + width: 100%; +} +/**/ +.header-text{ + margin-top: 20%; + font-size: 30px; +} +.header-text h1{ + margin-top: 20px; + font-size: 60px ; +} +.header-text h1 span { + color: #aac527; +} +/*----------------About-----------------*/ +#about{ + padding: 80px 0; + color: #ababab; +} +.row{ + display: flex; + justify-content: space-between; + flex-wrap: wrap ; +} +.about-col-1{ + flex-basis: 35%; +} +.about-col-1 img{ + width: 100%; + border-radius: 15px; +} +.about-col-2{ + flex-basis: 60%; +} +.sub-title{ + font-size: 60px; + font-weight: 600; + color: #000000; +} +.about-col-2 p{ + color: #767771; +} +.tab-titles{ + display: flex; + margin: 20px 0 40px ; +} +.tab-links{ + margin-right: 50px; + font-size: 18px; + font-weight: 500; + cursor: pointer; + position: relative; +} +.tab-links::after{ + content: ''; + width: 0; + height: 3px; + background: #aac527; + position: absolute; + left: 0; + bottom: -8px; + transition: 0.5s; +} +.tab-links.active-link::after{ + width: 50%; +} +.tab-contents ul li{ + list-style: none; + margin: 10px 0; +} +.tab-contents ul li span{ + color: #aac527; + font-size: 14px; +} +.tab-contents{ + display: none; +} + .tab-contents.active-tab{ + display: block; + } + + /*-----------------hobbies-------------------*/ + #hobbies{ + padding: 30px 0; + } + .hobbies-list{ + display: grid; + grid-template-columns: repeat(auto-fit,minmax(250px,1fr)); + grid-gap: 40px; + margin-top: 50px; + } +.hobbies-list div{ + background: #aaa9a9; + padding: 40px; + font-size: 13px; + font-weight: 300; + border-radius: 15px; + transition: background 0.5s, transform 0.5s; +} +.hobbies-list div i{ + font-size: 50px; + margin-bottom: 30px; +} +.hobbies-list div h2{ + font-size: 30px; + font-weight: 500; + margin-bottom: 15px; +} +.hobbies-list div a{ + text-decoration: none; + color: #000000; + font-size: 12px; + margin-top: 20px; + display: inline-block; +} +.hobbies-list div:hover{ + background: #aac527; + transform: translateY(-10px); +} +/*-------------------My Work------------------------*/ +#works{ + padding: 50px 2%; +} +.work-list{ + display: grid; + grid-template-columns: repeat(auto-fit,minmax(250px,1fr)); + grid-gap: 40px; + margin-top: 50px; +} +.work{ + border-radius: 15px; + position: relative; + overflow: hidden; +} +.work img{ + width: 100%; + border-radius: 10px; + display: block; + transition: transform 0.5s; +} +.layer{ + width: 100%; + height: 0; + background: linear-gradient(rgba(255, 253, 253, 0.6),#aac527); + border-radius: 10px; + position: absolute; + left: 0; + bottom: 0; + overflow: hidden; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + padding: 0 40px; + text-align: center; + font-size: 14px; + transition: height 0.5s; +} +.layer h3{ + font-weight: 1500; + margin-bottom: 20px; + font-size: 30px; +} +.layer p{ + font-size: 20px; +} +.layer a { + margin-top: 20px; + color: #aac527; + text-decoration: none; + font-size: 18px; + line-height: 60px; + background: #fff; + width: 60px; + height: 60px; + border-radius: 50%; + text-align: center; +} +.work:hover img{ + transform: scale(1.1); +} +.work:hover .layer{ + height: 100%; +} +.btn{ + display: block; + margin: 50px auto; + width: fit-content; + border: 3px solid #aac527; + padding: 14px 50px; + border-radius: 6px; + text-decoration: none; + color: #000000; + transition: background 0.5s; +} +.btn:hover{ + background: #aac527; + text-decoration: solid; +} +/*-----------*/ +.hidden { + display: none; +} + +#see-more.open { + display: none; +} + +#see-less { + display: none; +} +.work-list { + grid-template-columns: repeat(3, 1fr); /* Change to 3 columns */ + grid-auto-rows: minmax(200px, auto); /* Set a minimum row height */ +} +/*----------------contact----------------*/ +.coltact-left{ + flex-basis: 35%; +} +.coltact-right{ + flex-basis: 60%; +} +.coltact-left p{ + margin-top: 30px; +} +.coltact-left p i{ + margin-right: 15px; + font-size: 25px; +} +.social-icons{ + margin-top: 30px; +} +.social-icons a{ + text-decoration: none; + font-size: 30px; + margin-right: 15px; + color:#767771; + display: inline-block; + transition: transform 0.5s; +} +.social-icons a:hover{ + color: #aac527; + transform: translateY(-5px); +} +.btn.btn2{ + display: inline-block; + background: #aac527; +} +.contact-right form{ + width: 100%; +} +form input,form textarea{ + width: 100%; + border: 0; + outline: none; + background: #d5e38f; + padding: 15px; + margin: 15px; + color: #000000; + font-size: 18px; + border-radius: 6px; +} +form .btn2{ + padding: 14px 60px; + font-size: 18px; + margin-top: 20px; + cursor: pointer; + margin-left: 15px; +} +.copyright{ + width: 100%; + text-align: center; + padding: 25px 0; + background-color: #d8f28a; + margin-top: 0px; + font-weight: 300; +} +.copyright p{ + color: #000000; +} +/* Map */ +iframe{ + width: 100%; + height: 400px; +} +.wb{ + padding: 0; +} +.wb h1{ + font-size: 60px; + font-weight: 600; + margin-left: 45px; +} +/*-------------------for mobile------------------*/ +nav .fa-solid{ + display: none; +} + +@media only screen and (max-width:700px){ + #header{ + background-image: url(/Users/nikhilkumarlal/Desktop/portfolio/pback.jpg); + } + .header-text{ + margin-top: 100%; + font-size: 16px; + } + .header-text h1{ + font-size: 30px; + } + nav .fa-solid{ + display: block; + font-size: 20px; + } + nav ul{ + background:#aac527 ; + position: fixed; + top: 0; + right: -200px; + width: 200px; + height: 100vh; + padding-top: 50px; + z-index: 2; + transition: right 0.5s; + } + nav ul li{ + display: block; + margin: 25px ; + } + nav ul .fa-solid{ + position: absolute; + top: 25px; + left: 25px; + cursor: pointer; + } + .sub-title{ + font-size: 40px; + } + .about-col-1,.about-col-2{ + flex-basis: 100%; + } + .about-col-1{ + margin-bottom: 30px; + } + .about-col-2{ + font-size: 14px; + } + .tab-links{ + font-size: 20px; + margin-right: 25px; + } + .coltact-right,.coltact-left{ + flex-basis: 100%; + } + .coltact-left{ + margin-left: 20px; + } + .copyright{ + font-size: 14px; + } + /*-----*/ + .work-list { + grid-template-columns: repeat(1, 1fr); /* Change to 1 column */ + } + + .work { + margin-bottom: 30px; /* Add some space between images in the single column */ + } + + .hidden { + display: none; + } + + #see-more { + display: block; /* Show "See More" button initially */ + } + + #see-less { + display: none; /* Hide "See Less" button initially */ + } + + #see-more.open { + display: none; /* Hide "See More" button when additional images are shown */ + } + + #see-less.open { + display: block; /* Show "See Less" button when additional images are shown */ + } +} +#msg{ + color: #aac527; + margin-top: -40px; + display: block; + margin-left: 15px; + +} + +/* Styling for the Back to Top button */ +#back-to-top-button { + position: fixed; + bottom: 20px; + right: 20px; + display: none; + padding: 10px; + background-color: #aac527; + color: white; + text-decoration: none; + border-radius: 50%; +} + +#back-to-top-button i { + margin-right: 5px; +} +