-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
230 lines (193 loc) · 12.3 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
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
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
<!DOCTYPE html>
<html lang="en" data-theme="dark">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Aplikacje dostosowane do twoich potrzeb">
<meta property="og:image" content="media/sop_dark.png">
<meta property="og:site_name" content="soplicaindustries.github.io">
<meta property="og:url" content="https://soplicaindustries.github.io">
<meta property="og:title" content="Soplica Industries">
<meta property="og:description" content="Aplikacje dostosowane do twoich potrzeb">
<link rel="icon" href="media/sop_dark.png">
<link rel="stylesheet" href="style.css">
<title>Soplica Industries</title>
</head>
<body onload="menuHandler()" data-theme="dark">
<div id="dimm"></div>
<nav class="container-fluid" id="nav">
<ul>
<li><img src="media/sop_clear.png" id="nav-logo"></li>
</ul>
<ul id="open-button-container">
<li>
<div class="hamburger-menu" onclick="menuHandler()">
<div id="bar-top"></div>
<div id="bar-middle"></div>
<div id="bar-bottom"></div>
</div>
</li>
</ul>
<ul id="nav-button-container">
<li><button role="button" class="outline" onclick="show('about')">About</button></li>
<li><button role="button" class="outline" onclick="show('back')">Backend</button></li>
<li><button role="button" class="outline" onclick="show('front')">Frontend</button></li>
<li><button role="button" class="outline" onclick="show('experience')">Experience</button></li>
<li><button role="button" class="outline" onclick="show('work')">Work</button></li>
<li><button role="button" class="outline" onclick="show('contact')">Contact</button></li>
</ul>
</nav>
<main class="container">
<hgroup id="welcome-screen">
<h5>Hi, my name is</h5>
<h1>Kacper Rogóż</h1>
<h1>Im a Fullstack developer</h1>
<h5>Currently I'm studying in a technical school, and working as a freelancer.<br> My main goal is to become a software engineer in the near future</h5>
</hgroup>
<div class="container card" id="about">
<article class="grid">
<div class="grid-img about-img">
</div>
<div id="grid-text">
<hgroup>
<h2>About me</h1>
<h4>Let me tell you a story</h2>
<p>My name is Kacper, I'm a programmer from a small town in Poland.
I code since I was 14, and it became one of my hobbies. Currently I'm in technical school, with programming specialization, and last year I was awarded a <strong>scholarship</strong> for being one of the top five programmers in my school.
In free time i like riding mountain bikes, hiking, and sailing. Because of my bike obsession, I had to learn how to service it, so I also know a little bit of mechanic stuff.
I think of myself as a stubborn person, but in a good way. I won't stop untill I achieve my goal.
</p>
</hgroup>
</div>
</article>
</div>
<div class="container skill-card card" id="back">
<article class="grid" >
<table role="grid" id="skill-table">
<tr><td><img class="skill-img" src="media/csharp.png" alt="C#"></td><td id="prg-container"><progress class="skill-prog" value="75" max="100"></progress></td></tr>
<tr><td><img class="skill-img" src="media/cpp.png" alt="C++"></td><td id="prg-container"><progress class="skill-prog" value="50" max="100"></progress></td></tr>
<tr><td><img class="skill-img" src="media/dotnet.png" alt=".NET"></td id="prg-container"><td><progress class="skill-prog" value="60" max="100"></progress></td></tr>
<tr><td><img class="skill-img" src="media/php.png" alt="PHP"></td><td id="prg-container"><progress class="skill-prog" value="65" max="100"></progress></td></tr>
<tr><td><img class="skill-img" src="media/sql.png" alt="SQL"></td><td id="prg-container"><progress class="skill-prog" value="70" max="100"></progress></td></tr>
</table>
<div id="grid-text">
<hgroup>
<h2>Backend skills</h1>
<h4>Because looks are not everything</h2>
<p>
I have a good knowledge of <strong>C# and ASP.NET</strong>, which is my current go-to when it comes to backend. I also have completed a <strong>ASP.NET web application development</strong> course from a EU project.
But my knowledge does not end there. I also know <strong>C++</strong> an <strong>PHP</strong> on a moderate level, and when it comes to databases I know how to work with <strong>MySQL</strong>, <strong>MSSQL</strong>, and <strong>SQLite</strong>. Also I'm currently learning MongoDB.
</p>
</hgroup>
</div>
</article>
</div>
<div class="container skill-card card" id="front">
<article class="grid" >
<table role="grid" id="skill-table">
<tr><td><img class="skill-img" src="media/js.png" alt="JavaScript"></td><td id="prg-container"><progress class="skill-prog" value="40" max="100"></progress></td></tr>
<tr><td><img class="skill-img" src="media/css.png" alt="CSS"></td><td id="prg-container"><progress class="skill-prog" value="60" max="100"></progress></td></tr>
<tr><td><img class="skill-img" src="media/pico.jpg" alt="Pico CSS"></td><td id="prg-container"><progress class="skill-prog" value="60" max="100"></progress></td></tr>
<tr><td><img class="skill-img" src="media/bootstrap.png" alt="BootStrap"></td><td id="prg-container"><progress class="skill-prog" value="50" max="100"></progress></td></tr>
<tr><td><img class="skill-img" src="media/bulma.png" alt="BulmaCSS"></td><td id="prg-container"><progress class="skill-prog" value="60" max="100"></progress></td></tr>
</table>
<div id="grid-text">
<hgroup>
<h2>Frontend skills</h1>
<h4>But every book needs a good cover</h2>
<p>
When it comes to frontend I like to use frameworks, like <strong>PicoCss</strong>, <strong>Bootstrap</strong> and <strong>Bulma</strong>, which I know on a moderate level.
I also have a solid understanding of <strong>CSS</strong>, and I know basic <strong>JavaScript</strong>. I know how to design, create and modify a modern UI.
</p>
</hgroup>
</div>
</article>
</div>
<div class="container card" id="experience">
<article class="grid">
<div class="grid-img" id="Experience">
</div>
<div id="grid-text">
<hgroup>
<h2>My Experience</h1>
<h4>Every experience makes you grow</h2>
<p>
While serving time in my school I've done many small projects, like a <strong>Snake game clone</strong> done in winforms, <strong>client for a dummy botnet</strong> (for research purposes), <strong>Auth API</strong> and a lot more. Currently I work as a freelancer, mainly on <a href="https://useme.com/pl/roles/contractor/soplica-software-solutions,257025">Useme</a>. I've started in January 2023, and so far it was a great experience.
During summer of 2022 I've been on an internship in a local tech company called <a href="https://bloomdev.pl/">Bloom</a> where I developed web applications, databases and rest API's.
</p>
</hgroup>
</div>
</article>
</div>
<div class="container card" id="work">
<article class="grid">
<div class="grid-img blk-img" id="photo">
</div>
<div id="grid-text" class="szczaw">
<div class="flx">
<div id="wrapper">
<hgroup name="api">
<h2>Identity API</h2>
<h4>C# and ASP.NET</h4>
<p>This is a web REST API written in C# language using ASP.NET with Entity Framework and MySQL database. It's role is to act as a standalone user creation, authentication and authorization service. It has built in role system, and it uses Json Web Token technology.</p>
<a href="https://github.com/SoplicaIndustries/WOMBAT" role="button" class="primary" style="color:white;">Checkout the code!</a>
</hgroup>
<hgroup name="moa" class="hidden">
<h2>Speech to text</h2>
<h4>Node JS</h4>
<p>This is a Node JS web application that communicates with my friends C# G-RPC API. It's main goal is to allow U-ARM robot arm to type on a physical keyboard using speech to text conversion. We developad it as a project for our local astronomical observatory robotics classes, mainly to show young kids what can be done with a robot.</p>
<a href="#" role="button" class="primary" style="color:white;">Checkout the code!</a>
</hgroup>
<hgroup name="billing" class="hidden">
<h2>Billing Service</h2>
<h4>C# and ASP.NET</h4>
<p>This is a ASP.NET web application written with C#. Whole project was developed for my summer internship at <a href="https://bloomdev.pl/">Bloom</a>. Billing Service is a transaction management panel with PDF invoice generation and API that allows other programs to make transactions. It also utilises DevExpress controls.</p>
<a href="https://github.com/SoplicaIndustries/Bloom-internship-project" role="button" class="primary" style="color:white;">Checkout the code!</a>
</hgroup>
</div>
<div class="content-changer">
<div class="ctnc-btn" id="up" onclick="ctncSwitch('up')"></div>
<div class="ctnc-btn" id="down" onclick="ctncSwitch('down')"></div>
</div>
</div>
</div>
</article>
</div>
<div class="container card" id="contact">
<article class="grid">
<div id="grid-text">
<hgroup>
<h2>Reach me</h1>
<h4>Write directly to me</h2>
</hgroup>
<form id="contact-form"action="https://formspree.io/f/mbjelwnd"
method="POST">
<input type="text" id="email" name="email" placeholder="Your email" required>
<textarea id="message" name="message" required placeholder="Your message"></textarea>
<button type="submit" class="primary"">Submit</button>
</form>
</div>
<div id="grid-icon">
<hgroup>
<h2>Find me on social media</h2>
<h3>Check out my profiles</h3>
</hgroup>
<div class="icon-container">
<a href="https://www.instagram.com/soplica_mtb" class="icon" id="insta" data-tooltip="Photos and contact"><p>Instagram</p></a>
<a href="https://github.com/SoplicaIndustries" class="icon" id="github" data-tooltip="Projects and current work"><p>Github</p></a>
<a href="https://m.me/100009471920442" class="icon" id="mess" data-tooltip="Contact"><p>Messenger</p></a>
<a href="https://discord.com/users/Soplica#6815" class="icon" id="disc" data-tooltip="Contact" data-tooltip="Contact"><p>Discord</p></a>
<a href="https://www.linkedin.com/in/kacper-rog%C3%B3%C5%BC-ab8073264/" class="icon" id="linkedin" data-tooltip="Work profile"><p>Linkedin</p></a>
<a href="https://useme.com/pl/roles/contractor/soplica-software-solutions,257025/" class="icon" id="useme" data-tooltip="Freelancer profile"><p>Useme</p></a>
</div>
</div>
</article>
</div>
<footer>
Built by Kacper Rogóż 2023.
</footer>
</main>
<script src="script.js" defer></script>
</body>
</html>