Portfolio1/index.html at master · firerum/Portfolio1 · 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
<!DOCTYPE html>
<html lang="en-us">
    <head>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, initial-scale=1.0">
        <meta charset="utf-8">
        <meta name="author" content="Ademuyiwa Adewuyi">
        <meta name="description" content="codesader portfolio website">
        <meta name="keywords" content="portfolio">
        <link href="https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,200;0,400;0,500;0,700;0,900;1,400&display=swap" rel="stylesheet">
        <link href="https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400;700&display=swap" rel="stylesheet">
        <link rel="stylesheet" href="fonts/css/all.css">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
        <link rel="stylesheet" type="text/css" href="style.css">
        <link rel="stylesheet" type="text/css" href="index.css">
        <title>codesader</title>
    </head>

    <body>
        <div class="container">
            <header id="header-canvas">
                <div class="banner">
                    <div class="banner-logo">
                        <h1><a href="index.html">CodeSader<br></a></h1>
                        <input type="checkbox" id="toggler" name="toggler">
                        <div class="hamburger"><div></div></div>
                        <nav class="main-nav">
                            <ul class="header-ul">
                                <li><a href="index.html">Home</a></li>
                                <li><a href="about.html">About Me</a></li>
                                <li><a href="service.html">Services</a></li>
                                <li><a href="projects.html">Projects</a></li>
                                <li><a href="contact.html">Contact</a></li>
                                <li><a href="#">Tribute</a></li>
                            </ul>
                        </nav>
                    </div>
                    <div class="banner-text">
                        <p><span class="greeting">Hi,</span><br>I am <span class="name">Adewuyi,</span>
                        <p class="job-title">Software Developer.</p>
                        <a href="#" class="explorer">download CV</a>
                        <ul class="contact-list">
                            <li><a href="mailto:ademuyiwaadewuyi@gmail.com"><i class="fa fa-envelope-o" aria-hidden="true"></i><span>adewuyi</span></a></li>
                            <li><a href="tel:+2348032689453"><i class="fa fa-phone" aria-hidden="true"></i><span>+2348032689453</span></a></li>
                            <li><a href="https://github.com/firerum"><i class="fa fa-github" aria-hidden="true"></i><span>firerum</span></a></li>
                            <li><a href="https://twitter.com/thesoleStar"><i class="fa fa-twitter" aria-hidden="true"></i><span>@thesoleStar</span></a></li>
                        </ul>
                    </div>
                </div>
                <div class="switch">
                    <input type="checkbox" class="input">
                    <div class="circle"></div>
                </div>
                <ul class="media-list">
                    <li><a href="mailto:ademuyiwaadewuyi@gmail.com"><i class="fa fa-envelope-o" aria-hidden="true"></i></a></li>
                    <li><a href="tel:+2348032689453"><i class="fa fa-phone" aria-hidden="true"></i></a></li>
                    <li><a href="https://mobile.facebook.com/ademuyiwa.ife"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
                    <li><a href="https://www.instagram.com/wunaty/"><i class="fab fa-instagram"></i></a></li>
                    <li><a href="https://twitter.com/thesoleStar"><i class="fab fa-twitter"></i></a></li>
                </ul>
                <canvas id="canvas"></canvas>
            </header>

            <main class="index">
                <article class="services">
                    <h1 class="title" header .media-list i>Services</h1>
                    <section class="web-dev">
                        <h3>Web Development</h3>
                        <i class="fas fa-code"></i>
                        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Soluta quam nulla autem dicta mollitia vel repudiandae optio cumque. Error, veritatis!</p>
                    </section>
                    <section class="web-design">
                        <h3>Web Design</h3>
                        <i class="fas fa-layer-group"></i>
                        <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Quaerat eum totam voluptate repudiandae, unde facilis magni doloremque at aut saepe?</p>
                    </section>
                    <section class="android-app">
                        <h3>Android App</h3>
                        <i class="fas fa-mobile-alt"></i>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Repellendus ipsa deserunt labore, pariatur earum fugiat distinctio aperiam obcaecati assumenda. Autem.</p>
                    </section>
                    <p><a href="service.html">View All Services</a></p>
                </article>

                <section class="team">
                    <h2>Team</h2>
                    <div class="team-member">
                        <figure>
                            <img src="images/johndoe.jpg" alt="bount cedars">
                            <figcaption>
                                <p>Bount Cedars</p>
                                <p>Graphics Designer</p>
                            </figcaption>
                        </figure>
                        <a href=""></a>
                        <a href=""></a>
                        <a href=""></a>
                    </div>
                </section>

                <section class="testimonial">
                    <h2>Testimonial</h2>
                    <div class="slider">
                        <div class="slide current">
                            <img src="images/justin.jpg" alt="">
                            <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Tempora atque, reprehenderit non animi dicta architecto illum blanditiis repellat porro a.</p>
                        </div>
                        <div class="slide">
                            <img src="images/johndoe.jpg" alt="">
                            <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ut nisi impedit dolorem quae nobis sunt sapiente aspernatur quasi temporibus ullam!</p>
                        </div>
                        <div class="slide">
                            <img src="images/tim.jpg" alt="">
                            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eum molestiae earum quis laboriosam qui? Laudantium placeat veniam libero numquam alias!</p>
                        </div>
                    </div>
                    <button id="next"><i class="fas fa-long-arrow-alt-right"></i></button>
                    <button id="prev"><i class="fas fa-long-arrow-alt-left"></i></button>
                </section>
            </main>

            <footer>
                <nav class="social-media">
                    <ul>
                        <li><a href="https://mobile.facebook.com/ademuyiwa.ife"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
                        <li><a href="https://twitter.com/thesoleStar"><i class="fab fa-twitter"></i></a></li>
                        <li><a href="https://www.instagram.com/wunaty/"><i class="fab fa-instagram"></i></a></li>
                        <li><a href="#"><i class="fab fa-linkedin-in"></i></a></li>
                    </ul>
                </nav>
                <p>&copy; 2020 Codesader. All rights reserved.</p>
            </footer>
        </div>
        <script src="main.js"></script>
        <script src="canvas.js"></script>
    </body>
</html>