My-portfolio/index.html at main · Sisi-Lademi/My-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
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css" />
    <link rel="stylesheet" href="style.css">
    <title>Korean Female Software Developer Portfolio</title>
</head>

<body class="may">
    <nav class="navbar navbar-expand-lg bg-light py-3">
        <div class="container">
            <a class="navbar-brand fw-bold" data-id="element-82" href="#">L.D</a>
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarContent">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="collapse navbar-collapse justify-content-between" id="navbarContent">
                <ul class="navbar-nav ms -auto mb-2 mb-lg-0 ">
                    <li class="nav-item">
                        <a class="nav-link" href="#About">About</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#Skills">Skills</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#Projects">Projects</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#Contact">Contact</a>
                    </li>
                </ul>
            </div>
    </nav>

    <div class="px-5">
        <div class="text-danger mt-2">
            <h5 class="">
                Seoul, Korea
            </h5>
        </div>


        <div class="text-9xl">
            <h1 class="font-serif fw-bold">Crafting digital</h1>
        </div>

        <div>
            <h1 class="fst-italic text-secondary fw-bold">experiences</h1>
        </div>

        <div>
            <h1 class="font-serif fw-bold"> with code.</h1>
        </div>
    </div>

    <div class="px-5">
        <h5 class="text-secondary mt-5" style="text-align: left;">I'm Lademi, a software developer specializing in
            <br>building accessible, pixel-perfect web</br>
            interfaces.
        </h5>

        <button type="button" class="button btn btn-danger items-center justify-content-left">View my work</button>
        <button type="button" class="batton btn btn-outline-danger items-center justify-content-left">Contact
            me</button>
    </div>

    <div class="d-flex p-5 gap-2">
        <img src="Future Lademi.png" class="rounded-2 absolute bottom-8 left-8 text-[#fef3e2]" alt="Future Lademi"
            style="width: 600px; height: 350px;" data-id="element-420">
        <div class="d-flex flex-column">
            <div class="">
                <h1 class="about fw-bold" data-id="element-20">
                    About
                    <span class="me fw-bold" data-id="element-20">Me</span>
                </h1>
                <div>

                </div>
                <h5 class="">
                    <h5>
                        Hello! I'm a software developer based in the United Kingdom, passionate
                        about bridging the gap between design and engineering. With a
                        background in creative arts before transitioning to tech, I bring a unique
                        perspective to frontend development.
                    </h5>

                    <h5>
                        My journey began with a curiosity for how things work on the web. That
                        curiosity quickly turned into a passion for clean code and user-centric
                        design. I specialize in building responsive websites using HTML, CSS,
                        JavaScript, and Bootstrap, always prioritizing performance and
                        accessibility.
                    </h5>

                    <h5>
                        When I'm not coding, you can find me exploring Tokyo,
                        visiting my boyfriend in Seoul, or experimenting with new TikToks.
                    </h5>
                </h5>
            </div>

             <div class="d-flex justify-content-around p-">
    <div class="card px-5 mt-5" style="width: 14rem;">
        <div class="card-body">
            <i class="fa-solid fa-location-dot" style="color: #ff6b6b;"></i>
            <h5 class="card-title">Location</h5>
            <h6 class="card-subtitle mb-2 text-body-secondary">Seoul, Korea</h6>
        </div>
    </div>

    <div class="card px-5 mt-5" style="width: 14rem;">
        <div class="card-body">
           <i class="fa-solid fa-apple-whole" style="color: #ff6b6b;"></i>
            <h5 class="card-title">Fuel</h5>
            <h6 class="card-subtitle mb-2 text-body-secondary">Apples</h6>
        </div>
    </div>

    <div class="card px-5 mt-5" style="width: 14rem;">
        <div class="card-body">
            <i class="fa-solid fa-shirt" style="color: #ff6b6b;"></i>
            <h5 class="card-title">Tip</h5>
            <h6 class="card-subtitle mb-2 text-body-secondary">Use good fashion advice</h6>
        </div>
    </div>

     </div>

        </div>
    </div>
</body>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"
    integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI"
    crossorigin="anonymous"></script>
<script src="script.js"></script>

</html>