modern-portfolio/index.html at master · iamfortune/modern-portfolio · 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
139
140
141
142
143
144
145
146
147
148
149
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Fortune Ikechi is a Frontend and Mobile Engineer highly skilled in development of scalable JavaScript Applications">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Fortune Ikechi: Frontend and Mobile developer</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css" integrity="sha256-46qynGAkLSFpVbEBog43gvNhfrOj+BmwXdxFgVK/Kvc=" crossorigin="anonymous" />
    <link rel="stylesheet" href="css/style.css">
    <link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:400,900|Source+Sans+Pro:300,900&display=swap" rel="stylesheet">


</head>
<body>

    <header>
        <div class="logo">
            <img src="img/devkay_.jpg" alt="a picture of fortune ikechi">
        </div>
        <button class="nav-toggle" aria-label="toggle-navigation">
            <span class="hamburger"></span>
        </button>
        <nav class="nav">
            <ul class="nav__list">
                <li class="nav__item"><a href="#home" class="nav__link">Home</a></li>
                <li class="nav__item"><a href="#services" class="nav__link">My Service</a></li>
                <li class="nav__item"><a href="#about" class="nav__link">About Me</a></li>
                <li class="nav__item"><a href="#work" class="nav__link">My Work</a></li>
            </ul>
        </nav>
    </header>

    <!-- Introduction -->
    <section class="intro" id="home">

        <h1 class="section__title section__title--intro">
            Hi, I am <strong>Fortune Ikechi</strong>
        </h1>

        <p class="section__subtitle section__subtitle--intro">Frontend and Mobile Developer</p>
        <img src="img/kay__1.jpg" alt="a picture of fortune ikechi smiling" class="intro__img">

    </section>


    <!-- My Services -->
    <section class="my-services" id="services">
        <h2 class="section__title section__title--services">What I do</h2>
        <div class="services">
            <div class="service">
                <h3>Responsive Design and Development</h3>
                <p>i'm dedicated to creating responsive webpages while creating smooth user experiences.</p>
            </div>

            <div class="service">
                <h3>Cross-platform App Development</h3>
                <p>Using React native and other tools, i build scalable JavaScript applications.I'm prepared to deliver fast solutions for scale, while maintaining performance and innovation</p>
            </div>


        </div>

        <a href="#work" class="btn">My Work</a>
    </section>


    <!-- About Me -->
    <header class="about-me" id="about">
        <h2 class="section__title section__title--about">About Me</h2>
        <p class="section__subtitle section__subtitle--about"> Frontend and Mobile Developer who loves to solve problems </p>

        <div class="about-me__body">
        <p>Hey there, i'm <strong>Fortune Ikechi.</strong> A front-end and Mobile developer who loves to solve problems and works remotely. i like to build scalable Frontend products with great user experiences.</p>
        <p>Over the years, i've gathered relevant soft skills, languages, frameworks and libraries which include - HTML, CSS, vanilla JavaScript, React.js, React Native and some collaborative tools like Git/GitHub, Slack and Trello, i also have basic skills in GatsbyJS and Sass. I use heroku and netlify to deploy apps.</p>
        <p>i'm a quick learner who's interested in learning new technologies, when i'm not coding, i am reading documentations on trends in the industry.</p>
        </div>

        <img src="img/kaycode_.jpg" alt="kay smiling on a hoodie" class="about-me__img">
    </section>

    <!-- My Work -->
    <section class="my-work" id="work">
        <h2 class="section__title section__title--work">My work</h2>
        <p class="section__subtitle section__subtitle--work">Below are a selection of some of my projects.</p>

        <div class="portfolio"
        >
            <!-- portfolio item 01 -->
            <a href="https://kays-gta.netlify.com/" class="portfolio__item">
                <img src="img/portfolio-01.jpg" alt="a picture of the sky" class="portfolio__img">
            </a>

            <!-- portfolio item 02 -->
            <a href="https://kays-bg.netlify.com" class="portfolio__item">
                <img src="img/portfolio-02.jpg" alt="a picture of the sky" class="portfolio__img">
            </a>

            <!-- portfolio item 03 -->
            <a href="https://kays-color-game.netlify.com" class="portfolio__item">
                <img src="img/portfolio-03.jpg" alt="a picture of the sky" class="portfolio__img">
            </a>

            <!-- portfolio item 04 -->
            <a href="https://kays-clock.netlify.com" class="portfolio__item">
                <img src="img/portfolio-05.jpg" alt="a picture of the sky" class="portfolio__img">
            </a>

             <!-- portfolio item 05 -->
             <a href="https://github.com/iamfortune/jscalculator" class="portfolio__item">
                <img src="img/portfolio-06.jpg" alt="a picture of the sky" class="portfolio__img">
            </a>

            <!-- portfolio item 06 -->
            <a href="https://github.com/iamfortune/vendoredesign" class="portfolio__item">
                <img src="img/portfolio-07.jpg" alt="a picture of the sky" class="portfolio__img">
            </a>

        </div>
    </section>

    <!--Footer  -->
    <footer class="footer">
        <a href="ikechifortune@gmail.com" class="footer__link">ikechifortune@gmail.com</a>
        <ul class="social-list">
            <li class="social-list__item">
                <a class="social-list__link" href="https://github.com/iamfortune">
                    <i class="fab fa-github"></i>
                </a>
            </li>
            <li class="social-list__item">
                <a class="social-list__link" href="https://facebook.com/fortune.ikechi.52">
                    <i class="fab fa-facebook-f"></i>
                </a>
            </li>
            <li class="social-list__item">
                <a class="social-list__link" href="https://twitter.com/search?q=%40codernamedkay&src=typd">
                    <i class="fab fa-twitter"></i>
                </a>
                </li>
        </ul>
    </footer>


    <script src="https://kit.fontawesome.com/e5fc47eec9.js" crossorigin="anonymous"></script>
    <script src="js/index.js"></script>
</body>
</html>