-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
121 lines (121 loc) · 8.66 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ayush Tiwari Portfolio</title>
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<script src="script.js" ></script>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap" rel="stylesheet">
<style>
/* Additional styles can be added inline if needed */
</style>
</head>
<body>
<header>
<nav>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#skills">Skills</a></li>
<li><a href="#projects">Projects</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
<button id="theme-toggle" class="theme-toggle theme-button" onclick="toggleTheme()"><i id="theme-icon" class="fas fa-cog"></i> </button>
</nav>
</header>
<div class="hero" id="home">
<div class="hero-content">
<h1>👋 Hi, I'm Ayush Tiwari.</h1>
<p>"Hard work beats talent when talent doesn't work hard." - Tim Notke</p>
<p>A recent graduate with a passion for data analysis and web development. With strong skills in SQL, HTML, CSS, and Python, I enjoy creating elegant and efficient solutions to complex problems. My experience includes developing AI chatbots, conducting comprehensive data analysis, and building responsive web applications. I thrive in both collaborative and independent work environments and am always eager to learn and take on new challenges.</p>
<a href="#projects" class="btn">View My Work</a>
</div>
<div class="flip-card">
<div class="flip-card-inner">
<div class="flip-card-front">
<img class="hero-picture" src="profile_pic.avif" alt="Profile-Picture" >
</div>
<div class="flip-card-back">
<h1>Ayush Tiwari</h1>
<p>Data Analyst</p>
<p>Web Developer</p>
<p>Python</p>
<p>Tech Enthusiast</p>
</div>
</div>
</div>
</div>
<main>
<section id="skills" class="container">
<h2>Skills</h2>
<div class="skills-buttons">
<button>SQL</button>
<button>HTML & CSS</button>
<button>Python</button>
<button>Power BI</button>
<button>Data Analysis</button>
<button>Web Development</button>
<button>Technical Support</button>
</div>
</section>
<section id="projects" class="container">
<h2>Projects</h2>
<div class="project">
<h3>Portfolio Page</h3>
<p>Designed and built a personal portfolio website to showcase my projects and skills using HTML and CSS. The project highlights my web development skills and attention to detail in creating a modern, user-friendly interface.</p>
</div>
<div class="project">
<h3>AI Chat-bot on Telegram</h3>
<p>Developed an AI chatbot on Telegram using Python, integrated with the Telegram API. The chatbot is capable of handling user queries, providing automated responses, and demonstrating my ability to work with APIs and machine learning algorithms.</p>
</div>
<div class="project">
<h3>Sales Data Analysis</h3>
<p>Conducted a comprehensive analysis of sales data using Power BI to create interactive dashboards and reports. This project showcases my data analysis skills and proficiency in using BI tools to derive actionable insights from complex data sets.</p>
</div>
<div class="project">
<h3>Library Management System</h3>
<p>Created a library management system using SQL and Python to manage book inventories, member registrations, and borrowing activities. This project demonstrates my database management skills and ability to develop functional applications for real-world scenarios.</p>
</div>
<div class="project">
<h3>Online Store</h3>
<p>Developed an e-commerce website using HTML, CSS, and JavaScript, featuring product listings, shopping cart functionality, and a checkout process. This project highlights my web development skills and understanding of e-commerce workflows.</p>
</div>
</section>
<section id="contact" class="container">
<h2>Contact</h2>
<p>Email: <a href="mailto:[email protected]">[email protected]</a></p>
<p><a href="http://www.linkedin.com/in/ayush-tiwari02" target="_blank">LinkedIn Profile</a></p>
</section>
</main>
<footer>
<section class="contact-us">
<h3>For further information, please contact me via the contact listed.</h3>
<div class="sosmed">
<!-- Facebook -->
<a href="#" class="facebook-icon">
<svg role="img" fill="aqua" width="32" height="32" class="facebook-svg" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<title>Facebook</title>
<path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/>
</svg>
</a>
<a href="#" class="twitter-icon">
<svg role="img" fill="aqua" width="32" height="32" class="twitter-svg" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<title>Twitter</title>
<path d="M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085 4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z"/>
</svg>
</a>
<a href="#" class="instagram-icon">
<svg role="img" fill="aqua" width="32" height="32" class="instagram-svg" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<title>Instagram</title>
<path d="M12 0C8.74 0 8.333.015 7.053.072 5.775.132 4.905.333 4.14.63c-.789.306-1.459.717-2.126 1.384S.935 3.35.63 4.14C.333 4.905.131 5.775.072 7.053.012 8.333 0 8.74 0 12s.015 3.667.072 4.947c.06 1.277.261 2.148.558 2.913.306.788.717 1.459 1.384 2.126.667.666 1.336 1.079 2.126 1.384.766.296 1.636.499 2.913.558C8.333 23.988 8.74 24 12 24s3.667-.015 4.947-.072c1.277-.06 2.148-.262 2.913-.558.788-.306 1.459-.718 2.126-1.384.666-.667 1.079-1.335 1.384-2.126.296-.765.499-1.636.558-2.913.06-1.28.072-1.687.072-4.947s-.015-3.667-.072-4.947c-.06-1.277-.262-2.149-.558-2.913-.306-.789-.718-1.459-1.384-2.126C21.319 1.347 20.651.935 19.86.63c-.765-.297-1.636-.499-2.913-.558C15.667.012 15.26 0 12 0zm0 2.16c3.203 0 3.585.016 4.85.071 1.17.055 1.805.249 2.227.415.562.217.96.477 1.382.896.419.42.679.819.896 1.381.164.422.36 1.057.413 2.227.057 1.266.07 1.646.07 4.85s-.015 3.585-.074 4.85c-.061 1.17-.256 1.805-.421 2.227-.224.562-.479.96-.899 1.382-.419.419-.824.679-1.38.896-.42.164-1.065.36-2.235.413-1.274.057-1.649.07-4.859.07-3.211 0-3.586-.015-4.859-.074-1.171-.061-1.816-.256-2.236-.421-.569-.224-.96-.479-1.379-.899-.421-.419-.69-.824-.9-1.38-.165-.42-.359-1.065-.42-2.235-.045-1.26-.061-1.649-.061-4.844 0-3.196.016-3.586.061-4.861.061-1.17.255-1.814.42-2.234.21-.57.479-.96.9-1.381.419-.419.81-.689 1.379-.898.42-.166 1.051-.361 2.221-.421 1.275-.045 1.65-.06 4.859-.06l.045.03zm0 3.678c-3.405 0-6.162 2.76-6.162 6.162 0 3.405 2.76 6.162 6.162 6.162 3.405 0 6.162-2.76 6.162-6.162 0-3.405-2.76-6.162-6.162-6.162zM12 16c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4zm7.846-10.405c0 .795-.646 1.44-1.44 1.44-.795 0-1.44-.646-1.44-1.44 0-.794.646-1.439 1.44-1.439.793-.001 1.44.645 1.44 1.439z"/>
</svg>
</a>
</div>
</section>
<div class="container">
<p>© 2024 Ayush Tiwari</p>
</div>
</footer>
</body>
</html>