Compare commits
No commits in common. "c8027f250f304431b6fc49a501f3fd61124f48c6" and "3d6497dfdb75d60aa5df88bd461b9b756e50c561" have entirely different histories.
c8027f250f
...
3d6497dfdb
Binary file not shown.
Binary file not shown.
155
index.html
155
index.html
|
|
@ -15,7 +15,7 @@
|
||||||
<h1>Andrzej Stepien : Coder for Hire</h1>
|
<h1>Andrzej Stepien : Coder for Hire</h1>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
<h2>Hello.</h2>
|
<h1>Hello.</h1>
|
||||||
<p>
|
<p>
|
||||||
My name is Andrzej, and until the pandemic I was an English teacher. If you're reading this, you
|
My name is Andrzej, and until the pandemic I was an English teacher. If you're reading this, you
|
||||||
most
|
most
|
||||||
|
|
@ -23,113 +23,58 @@
|
||||||
what
|
what
|
||||||
I'm capable of.
|
I'm capable of.
|
||||||
</p>
|
</p>
|
||||||
<section>
|
<h2>The website you are currently reading...</h2>
|
||||||
<h1>The website you are currently reading...</h1>
|
<ul>
|
||||||
|
<li><b>… is hosted on bespoke hardware.</b> A mini-pc in my living room, to
|
||||||
|
be precise!</li>
|
||||||
|
<li><b>… has correctly managed security certificates, scoring an 'A' grade on <a
|
||||||
|
href="https://www.ssllabs.com/ssltest/analyze.html?d=sonarrr.ajstepien.xyz">sslabs.com</a>.</b>
|
||||||
|
</li>
|
||||||
|
<li><b>… is fully compliant with <a href="https://www.w3.org/WAI/standards-guidelines/wcag/">Web
|
||||||
|
Content
|
||||||
|
Accessibility Guidelines</a></b> because accessibility isn't an optional
|
||||||
|
extra!</li>
|
||||||
|
<li><b>… is styled with careful consideration for Responsive Web Design principles</b> (because
|
||||||
|
I have no
|
||||||
|
idea what device you're reading this on!)</li>
|
||||||
|
<li><b>… hosts a collection of projects demonstrating my proficiency in both frontend and
|
||||||
|
backend development</b> including projects written in CSS, Html,
|
||||||
|
Javascript,
|
||||||
|
React, Nodejs, Sql, Jq, Lua and Bash.</li>
|
||||||
|
<li><b>… was lovingly hand-coded by myself.</b> Naturally.</li>
|
||||||
|
</ul>
|
||||||
|
<h2>Certifications</h2>
|
||||||
|
<ul>
|
||||||
|
<h3>Freecodecamp certificates</h3>
|
||||||
<ul>
|
<ul>
|
||||||
<li><b>… is hosted on bespoke hardware.</b> A mini-pc in my living room, to
|
<li>
|
||||||
be precise!</li>
|
<a
|
||||||
<li><b>… has correctly managed security certificates, scoring an 'A' grade on <a
|
href="https://www.freecodecamp.org/certification/fcc60e22726-0a94-4738-8702-3e216d14fdb2/front-end-development-libraries">Front
|
||||||
href="https://www.ssllabs.com/ssltest/analyze.html?d=sonarrr.ajstepien.xyz">sslabs.com</a>.</b>
|
End Development Libraries</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
href="https://www.freecodecamp.org/certification/fcc60e22726-0a94-4738-8702-3e216d14fdb2/responsive-web-design">Responsive
|
||||||
|
Web Design</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a
|
||||||
|
href="https://www.freecodecamp.org/certification/fcc60e22726-0a94-4738-8702-3e216d14fdb2/javascript-algorithms-and-data-structures">Javascript
|
||||||
|
Algorithms and Data Structures</a>
|
||||||
</li>
|
</li>
|
||||||
<li><b>… is fully compliant with <a
|
|
||||||
href="https://www.w3.org/WAI/standards-guidelines/wcag/">Web
|
|
||||||
Content
|
|
||||||
Accessibility Guidelines</a></b> because accessibility isn't an
|
|
||||||
optional
|
|
||||||
extra!</li>
|
|
||||||
<li><b>… is styled with careful consideration for Responsive Web Design principles</b>
|
|
||||||
(because
|
|
||||||
I have no
|
|
||||||
idea what device you're reading this on!)</li>
|
|
||||||
<li><b>… hosts a collection of projects demonstrating my proficiency in both frontend
|
|
||||||
and
|
|
||||||
backend development</b> including projects written in CSS, Html,
|
|
||||||
Javascript,
|
|
||||||
React, Nodejs, Sql, Jq, Lua and Bash.</li>
|
|
||||||
<li><b>… was lovingly hand-coded by myself.</b> Naturally.</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
</section>
|
<h3>IBM certificates</h3>
|
||||||
<section>
|
<ul>
|
||||||
<h2>Certifications</h2>
|
<li>
|
||||||
<figure>
|
<a href="https://courses.edx.org/certificates/0ac958dec5424747b59860843844bd22">Introduction
|
||||||
<figcaption>
|
to Cloud Computing</a>
|
||||||
Freecodecamp certificates
|
</li>
|
||||||
</figcaption>
|
<li>
|
||||||
<ul class="link-list">
|
<a href="https://courses.edx.org/certificates/f7a2d211241a432785f298df38336098">Introduction
|
||||||
<li>
|
to Cloud Development with HTML, CSS, and JavaScript</a>
|
||||||
<a
|
</li>
|
||||||
href="https://www.freecodecamp.org/certification/fcc60e22726-0a94-4738-8702-3e216d14fdb2/front-end-development-libraries">Front
|
</ul>
|
||||||
End Development Libraries</a>
|
</ul>
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a
|
|
||||||
href="https://www.freecodecamp.org/certification/fcc60e22726-0a94-4738-8702-3e216d14fdb2/responsive-web-design">Responsive
|
|
||||||
Web Design</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a
|
|
||||||
href="https://www.freecodecamp.org/certification/fcc60e22726-0a94-4738-8702-3e216d14fdb2/javascript-algorithms-and-data-structures">Javascript
|
|
||||||
Algorithms and Data Structures</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</figure>
|
|
||||||
<figure>
|
|
||||||
<figcaption>
|
|
||||||
IBM certificates
|
|
||||||
</figcaption>
|
|
||||||
<ul class="link-list">
|
|
||||||
<li>
|
|
||||||
<a
|
|
||||||
href="https://courses.edx.org/certificates/0ac958dec5424747b59860843844bd22">Introduction
|
|
||||||
to Cloud Computing</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
<a
|
|
||||||
href="https://courses.edx.org/certificates/f7a2d211241a432785f298df38336098">Introduction
|
|
||||||
to Cloud Development with HTML, CSS, and JavaScript</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</figure>
|
|
||||||
</section>
|
|
||||||
<section>
|
|
||||||
|
|
||||||
<figure>
|
|
||||||
<figcaption>
|
|
||||||
<h2>Projects</h2>
|
|
||||||
</figcaption>
|
|
||||||
<ul class="link-list">
|
|
||||||
<li>
|
|
||||||
<h3>Subman</h3>
|
|
||||||
<p>A self-hosted literary submission management system comprising a
|
|
||||||
Nodejs
|
|
||||||
backend server and React front end.
|
|
||||||
</p>
|
|
||||||
<a>demo</a>
|
|
||||||
<a>source</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
|
|
||||||
<h3>Micro365</h3>
|
|
||||||
<p>
|
|
||||||
A bot written in nodejs that delivers single-word writing
|
|
||||||
prompts from a database.
|
|
||||||
</p>
|
|
||||||
<a>demo</a>
|
|
||||||
<a>source</a>
|
|
||||||
</li>
|
|
||||||
<li>
|
|
||||||
|
|
||||||
<h3>PromptBot</h3>
|
|
||||||
<p>
|
|
||||||
A bot written in nodejs that delivers single-word writing
|
|
||||||
prompts from a database.
|
|
||||||
</p>
|
|
||||||
<a>demo</a>
|
|
||||||
<a>source</a>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</figure>
|
|
||||||
</section>
|
|
||||||
</main>
|
</main>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
|
|
|
||||||
79
styles.css
79
styles.css
|
|
@ -1,15 +1,10 @@
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: Jura;
|
font-family: GoMono;
|
||||||
src: url(fonts/Jura-VariableFont_wght.ttf) format(tr);
|
src: url(fonts/GoMonoNerdFont-Regular.ttf);
|
||||||
|
font-weight: 400;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: League;
|
|
||||||
src: url(fonts/LeagueGothic-Regular-VariableFont_wdth.ttf);
|
|
||||||
font-style: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--text: #e0def4;
|
--text: #e0def4;
|
||||||
--love: #eb6f92;
|
--love: #eb6f92;
|
||||||
|
|
@ -23,106 +18,56 @@
|
||||||
--surface: #1f1d2e;
|
--surface: #1f1d2e;
|
||||||
--overlay: #26233a;
|
--overlay: #26233a;
|
||||||
|
|
||||||
--hl-low: #21202e;
|
|
||||||
--hl-med: #403d52;
|
--hl-med: #403d52;
|
||||||
--hl-high: #524f67;
|
--hl-high: #524f67;
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
background-image: linear-gradient(to bottom right, var(--overlay), var(--base));
|
background-color: var(--base);
|
||||||
}
|
}
|
||||||
|
|
||||||
h1,
|
h1,
|
||||||
h2,
|
h2,
|
||||||
h3,
|
h3,
|
||||||
h4 {
|
h4 {
|
||||||
font-family: League, Verdana, Geneva, Tahoma, sans-serif;
|
font-family: Verdana, Geneva, Tahoma, sans-serif;
|
||||||
color: var(--gold);
|
|
||||||
text-shadow: 0.8rem 0.8rem var(--base);
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
font-size: 8rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
font-size: 6rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
h3 {
|
|
||||||
font-size: 4rem;
|
|
||||||
color: var(--love);
|
color: var(--love);
|
||||||
}
|
}
|
||||||
|
|
||||||
main {
|
main {
|
||||||
font-family: Jura, serif;
|
font-family: GoMono, serif;
|
||||||
font-size: 2rem;
|
font-size: 2rem;
|
||||||
width: 60%;
|
width: 60%;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
color: var(--text);
|
color: var(--text);
|
||||||
}
|
}
|
||||||
|
|
||||||
p,
|
p {
|
||||||
ul {
|
|
||||||
|
|
||||||
background-color: var(--surface);
|
background-color: var(--surface);
|
||||||
border-radius: 10rem;
|
border-radius: 10rem;
|
||||||
padding: 5rem;
|
padding: 2rem;
|
||||||
box-shadow: 1rem 1rem var(--base);
|
|
||||||
}
|
|
||||||
|
|
||||||
figcaption {
|
|
||||||
margin-bottom: 0;
|
|
||||||
font-size: 2em;
|
|
||||||
font-weight: 1000;
|
|
||||||
color: var(--iris);
|
|
||||||
text-shadow: 0.08em 0.08em var(--base);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
b {
|
b {
|
||||||
/* color: var(--foam); */
|
color: var(--gold);
|
||||||
font-weight: 1000;
|
|
||||||
font-size: 1.1em
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
a {
|
a {
|
||||||
text-decoration-line: underline;
|
text-decoration: none;
|
||||||
text-decoration-style: dotted;
|
|
||||||
text-decoration-color: var(--pine);
|
|
||||||
color: var(--foam);
|
color: var(--foam);
|
||||||
font-weight: bold;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
a:visited {
|
a:visited {
|
||||||
text-decoration: none;
|
|
||||||
color: var(--pine);
|
color: var(--pine);
|
||||||
}
|
}
|
||||||
|
|
||||||
a:hover {
|
a:hover {
|
||||||
background-color: var(--hl-med);
|
background-color: pink;
|
||||||
}
|
}
|
||||||
|
|
||||||
ul {
|
|
||||||
list-style-position: inside;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
li {
|
li {
|
||||||
list-style-type: '✓ ';
|
list-style-type: ' ';
|
||||||
margin-bottom: 2rem;
|
margin-bottom: 2rem;
|
||||||
padding: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
li::marker {
|
|
||||||
color: var(--pine);
|
|
||||||
}
|
|
||||||
|
|
||||||
.link-list>li {
|
|
||||||
list-style-type: '> ';
|
|
||||||
}
|
|
||||||
|
|
||||||
.link-list>li:hover::marker {
|
|
||||||
color: var(--foam);
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue