MrunankB.github.io/index.html at main · MrunankB/MrunankB.github.io · GitHub

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
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="icon" type="image/x-icon" href="adobe-fl-xxl.png">
        <link rel="stylesheet" href="assets/css/styles.css">

        <!-- =====BOX ICONS===== -->
        <link href='https://cdn.jsdelivr.net/npm/boxicons@2.0.5/css/boxicons.min.css' rel='stylesheet'>

        <title>Portfolio </title>
    </head>
    <body>
        <!--===== HEADER =====-->
        <header class="l-header">
            <nav class="nav bd-grid">
                <div>
                    <a href="#" class="nav__logo">Mrunank Bathe</a>
                </div>

                <div class="nav__menu" id="nav-menu">
                    <ul class="nav__list">
                        <li class="nav__item"><a href="#home" class="nav__link active">Home</a></li>
                        <li class="nav__item"><a href="#about" class="nav__link">About</a></li>

                        <li class="nav__item"><a href="#work" class="nav__link">Hobbies</a></li>
                        <li class="nav__item"><a href="#contact" class="nav__link">Contact</a></li>
                    </ul>
                </div>

                <div class="nav__toggle" id="nav-toggle">
                    <i class='bx bx-menu'></i>
                </div>
            </nav>
        </header>

        <main class="l-main">
            <!--===== HOME =====-->
            <section class="home bd-grid" id="home">
                <div class="home__data">
                    <h1 class="home__title">Hi,<br>I'am <span class="home__title-color">Mrunank Bathe</span><br> </h1>

                    <a href="#" class="button">Contact</a>
                </div>

                <div class="home__social">
                    <a href="https://expo.io/@bathills/snacks" class="home__social-icon"><img src="https://s3.amazonaws.com/exp-brand-assets/SnackIcon_200.png" width=50 height=50/></a>
                    <a href="mailto:mrunank.bathe@gmail.com" class="home__social-icon"><img src="https://cdn.icon-icons.com/icons2/730/PNG/512/gmail_icon-icons.com_62758.png" width=50 height=50/></a>
                    <a href="https://github.com/BATHILLS" class="home__social-icon"><img src="https://cdn.icon-icons.com/icons2/2351/PNG/512/logo_github_icon_143196.png" width=50 height=50/></a>
                </div>


            </section>

            <!--===== ABOUT =====-->
            <section class="about section " id="about">
                <h2 class="section-title">About</h2>

                <div class="about__container bd-grid">
                    <div class="about__img">
                        <img src="assets/MB.jpeg" alt="">
                    </div>

                    <div>
                        <h2 class="about__subtitle">I'am Mrunank</h2>
                        <p class="about__text">I am a 17-year-old bloke, who likes to watch anime, play video games, and PCM.
                        I am also deeply in love with RT and love to do her every day. I have spent countless nights in thoughts of RT.

                        This page is dedicated to RT, my love, I will always remember you... Always 🥰🥰</p>
                    </div>
                </div>
            </section>


            <!--===== WORK =====-->
            <section class="work section" id="work">
                <h2 class="section-title">Hobbies</h2>

                <div class="work__container bd-grid">
                    <div class="work__img2">
                        <img src="assets/RT1.png" alt="">
                    </div>
                    <div class="work__img2">
                        <img src="assets/RT2.png" alt="">
                    </div>
                    <div class="work__img2">
                        <img src="assets/RT3.png" alt="">
                    </div>

                    <div class="work__img2">
                        <img src="assets/RT4.png" alt="">
                    </div>
                    <div class="work__img2">
                        <img src="assets/RT6.png" alt="">
                    </div>
                    <div class="work__img2">
                        <img src="assets/RT7.png" alt="">
                    </div>
                </div>
            </section>

            <!--===== CONTACT =====-->
            <section class="contact section" id="contact">
                <h2 class="section-title">Contact</h2>

                <div class="contact__container bd-grid">
                    <form action="" class="contact__form">
                        <input type="text" placeholder="Name" class="contact__input">
                        <input type="mail" placeholder="Email" class="contact__input">
                        <textarea name="" id="" cols="0" rows="10" class="contact__input"></textarea>
                        <input type="button" value="Send" class="contact__button button">
                    </form>
                </div>
            </section>
        </main>

        <!--===== FOOTER =====-->
        <footer class="footer">
            <p class="footer__title">Mrunank Bathe</p>

            <p>ओ भाई!</p>
        </footer>


        <!--===== SCROLL REVEAL =====-->
        <script src="https://unpkg.com/scrollreveal"></script>

        <!--===== MAIN JS =====-->
        <script src="assets/js/main.js"></script>
    </body>
</html>