Compare commits
4 Commits
dbfe9ee415
...
3d6497dfdb
Author | SHA1 | Date |
---|---|---|
|
3d6497dfdb | |
|
4eff7aeed3 | |
|
fcc96bbf0a | |
|
f6418028de |
|
@ -0,0 +1,62 @@
|
|||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
img {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
menu:not(article menu),
|
||||
ol:not(article ol),
|
||||
ul:not(article ul) {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
menu,
|
||||
ol,
|
||||
ul {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
article ol,
|
||||
article ul {
|
||||
list-style-position: inside;
|
||||
}
|
||||
|
||||
a {
|
||||
/* Places underlines below the descenders */
|
||||
text-underline-position: under;
|
||||
|
||||
|
||||
/* Sets the thickness as a percentage of the font size */
|
||||
text-decoration-thickness: 8;
|
||||
}
|
||||
|
||||
/* <html> = the root */
|
||||
html {
|
||||
font-size: 62.5%;
|
||||
/* (62.5/100) * 16px = 10px */
|
||||
-webkit-text-size-adjust: none;
|
||||
/* for iOS Safari */
|
||||
text-size-adjust: none;
|
||||
/* for other mobile browsers */
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
}
|
||||
|
||||
label,
|
||||
button,
|
||||
select,
|
||||
summary,
|
||||
[type=radio],
|
||||
[type=submit],
|
||||
[type=checkbox] {
|
||||
cursor: pointer;
|
||||
}
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
32
index.html
32
index.html
|
@ -6,7 +6,8 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||
<title>Andrzej Stepien : Coder for Hire</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="stylesheet" href="defaults.css" />
|
||||
<link rel="stylesheet" href="styles.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
@ -15,27 +16,32 @@
|
|||
</header>
|
||||
<main>
|
||||
<h1>Hello.</h1>
|
||||
My name is Andrzej, and until the pandemic I was an English teacher. If you're reading this, you most
|
||||
likely followed a link here from my CV. I thought this page would be the best way to demonstrate what
|
||||
<p>
|
||||
My name is Andrzej, and until the pandemic I was an English teacher. If you're reading this, you
|
||||
most
|
||||
likely followed a link here from my CV. I thought this page would be the best way to demonstrate
|
||||
what
|
||||
I'm capable of.
|
||||
</p>
|
||||
<h2>The website you are currently reading...</h2>
|
||||
<ul>
|
||||
<li><b>... is hosted on bespoke hardware.</b> A mini-pc in my living room, to
|
||||
<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
|
||||
<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
|
||||
<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
|
||||
<li><b>… is styled with careful consideration for Responsive Web Design principles</b> (because
|
||||
I have no
|
||||
idea what device you're using!</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 hand-coded by myself.</b> Naturally.</li>
|
||||
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>
|
||||
|
|
|
@ -0,0 +1,73 @@
|
|||
@font-face {
|
||||
font-family: GoMono;
|
||||
src: url(fonts/GoMonoNerdFont-Regular.ttf);
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
:root {
|
||||
--text: #e0def4;
|
||||
--love: #eb6f92;
|
||||
--gold: #f6c177;
|
||||
--rose: #ebbcba;
|
||||
--pine: #31748f;
|
||||
--foam: #9ccfd8;
|
||||
--iris: #c4a7e7;
|
||||
|
||||
--base: #191724;
|
||||
--surface: #1f1d2e;
|
||||
--overlay: #26233a;
|
||||
|
||||
--hl-med: #403d52;
|
||||
--hl-high: #524f67;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--base);
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4 {
|
||||
font-family: Verdana, Geneva, Tahoma, sans-serif;
|
||||
color: var(--love);
|
||||
}
|
||||
|
||||
main {
|
||||
font-family: GoMono, serif;
|
||||
font-size: 2rem;
|
||||
width: 60%;
|
||||
margin: auto;
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
p {
|
||||
background-color: var(--surface);
|
||||
border-radius: 10rem;
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
b {
|
||||
color: var(--gold);
|
||||
}
|
||||
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: var(--foam);
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: var(--pine);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
background-color: pink;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style-type: ' ';
|
||||
margin-bottom: 2rem;
|
||||
|
||||
}
|
Loading…
Reference in New Issue