-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
120 lines (117 loc) · 9.7 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
<!DOCTYPE html>
<html lang="en" class="fs-5 fw-bolder">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>Home - girl</title>
<meta property="og:image" content="https://www.daturadev.github.io/girl/assets/img/tech/gsf.png">
<meta name="description" content="girl | Developer Portfolio">
<meta property="og:type" content="website">
<link rel="icon" type="image/png" sizes="16x16" href="assets/img/favicon-16x16.png">
<link rel="icon" type="image/png" sizes="32x32" href="assets/img/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="270x270" href="assets/img/mstile-150x150.png">
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/Lato.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.6.1/css/pikaday.min.css">
</head>
<body>
<nav class="navbar navbar-dark navbar-expand-lg fixed-top bg-info bg-gradient border rounded-0 d-flex justify-content-center align-items-start order-first portfolio-navbar gradient">
<div class="container"><a class="navbar-brand logo" href="#" style="color: rgb(247,247,247);font-size: 47px;font-weight: bold;font-style: italic;padding: 0.25px 0px;height: 71px;">girl</a><button data-bs-toggle="collapse" class="navbar-toggler" data-bs-target="#navbarNav"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon" style="color: rgb(221,221,221);"></span></button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item"><a class="nav-link active" href="index.html" style="color: rgb(221,221,221);">Home</a></li>
<li class="nav-item"><a class="nav-link" href="projects-grid-cards.html" style="color: rgb(221,221,221);">Projects</a></li>
<li class="nav-item"><a class="nav-link" href="cv.html" style="color: rgb(221,221,221);">CV</a></li>
<li class="nav-item"><a class="nav-link" href="hire-me.html" style="color: rgb(221,221,221);">Hire me</a></li>
</ul>
</div>
</div>
</nav>
<main class="page landing-page">
<section class="portfolio-block block-intro">
<div class="container">
<div class="avatar" style="background: url("assets/img/IMG_1737.jpg");background-size: contain;"></div>
<div class="about-me">
<p class="text-center"><strong> Hey! </strong><span style="color: var(--bs-body-color); background-color: var(--bs-body-bg);">I'm Jae, an information security professional, developer, and programmer.</span></p><a class="btn btn-outline-info btn-lg" role="button" href="hire-me.html" target="_top" style="font-style: italic;font-weight: bold;">Meet Me!</a>
</div>
</div>
</section>
<section class="portfolio-block photography">
<section class="text-center d-lg-flex justify-content-lg-center align-items-lg-center portfolio-block call-to-action border-bottom" style="text-align: center;">
<img class="img-fluid image" src="assets/img/waffle-logo.gif" style="background: url("assets/img/waffle-logo.gif");width: 500px;height: 300px;">
<img class="rounded img-fluid d-flex d-lg-flex justify-content-lg-center align-items-lg-center image" src="assets/img/tech/Jul-26-2022%2003-26-09.gif" style="width: 500px;height: 300px;" loading="auto">
<img class="img-fluid image" src="assets/img/nature/waffle.png" style="width: 500px;height: 300px;">
</section>
</section>
<section class="text-center portfolio-block skills">
<div class="container">
<div class="heading">
<h2 style="font-style: italic;font-weight: bold;">Skills</h2>
</div>
<div class="row">
<div class="col-md-4">
<div class="card special-skill-item border-0">
<div class="card-header bg-transparent border-0"><i class="icon ion-ios-star-outline"></i></div>
<div class="card-body">
<h3 class="card-title" style="color: rgb(101,101,101);font-weight: bold;font-style: italic;">Front & Back-End Web Design</h3>
<p class="card-text">With mastery & working knowledge in markdown, javascript, PHP, SQL, CSS, cloud services, networking, information security,
and other integrative languages - I am capable of fusing these disciplines while auditing & developing code, architecting sites and databases,
and analyzing networks.
</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card special-skill-item border-0">
<div class="card-header bg-transparent border-0"><i class="icon ion-ios-lightbulb-outline"></i></div>
<div class="card-body">
<h3 class="card-title" style="font-weight: bold;font-style: italic;color: rgb(101,101,101);font-size: 27px;">Software Programming</h3>
<p class="card-text">Having developed an array of tools myself (Web-Application Firewall Detection & Bypass Suite, Credential Stuffers, Remote Access Tools/worms),
I understand the underlying mechanisms, tools, and processes that malicious hackers use in the process of pentesting a website, system, or network.
</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card special-skill-item border-0">
<div class="card-header bg-transparent border-0"><i class="icon ion-ios-gear-outline"></i></div>
<div class="card-body">
<h3 class="card-title" style="font-weight: bold;font-style: italic;color: rgb(101,101,101);">Cyber Security & Forensics</h3>
<p class="card-text">I've worked with tools such as Docker, Kubernetes, web sockets, and more - I know my way around server-side & CLI environments. I am familiar with
setting up and configuring IDS/IPS systems and firewalls, discovering and exploiting vulnerabilities, establishing, receiving, and transmitting from servers, injection methods,
and much more. I have personal experience in the world of penetration testing and know how red teams coordinate. I also have experience in the federal space.
</p>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
<section class="portfolio-block website gradient">
<div class="container">
<div class="row align-items-center">
<div class="col-md-12 col-lg-5 offset-lg-1 text">
<h3><em><span style="font-weight: normal !important;">girl the developer</span></em></h3>
</div>
<div class="col-md-12 col-lg-5">
<div class="portfolio-laptop-mockup" style="filter: blur(0px);"><div class="screen" style="background: url('assets/img/tech/Jul-26-2022%2003-26-09.gif') left / cover no-repeat;border-top-width: 2px;border-top-color: rgb(255,255,255);border-right-width: 2px;border-right-color: rgb(255,255,255,255);border-bottom-width: 2px;border-left-width: 2px;border-left-color: rgb(255,255,255);filter: blur(1px);"></div>
<div class="keyboard" style="filter: blur(1px);"></div>
</div>
</div>
</div>
</div>
</section>
<footer class="page-footer">
<div class="container-fluid font-monospace text-center" style="filter: brightness(100%) grayscale(100%) saturate(200%);">
<div class="links"><a href="index.html">Home</a><a href="cv.html">Skills & Certifications</a><a href="projects-grid-cards.html">Projects</a></div><a href="hire-me.html">Contact</a>
<div class="social-icons" style="margin: 19px 0px 16px;"><a href="#" data-bs-target="https://github.com/daturadev"><i class="icon ion-social-github"></i></a><a href="#" data-bs-target="https://www.linkedin.com/in/jaedinnotestein-williams/"><i class="icon ion-social-linkedin"></i></a></div>
</div>
</footer>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.6.1/pikaday.min.js"></script>
<script src="assets/js/theme.js"></script>
</body>
</html>