Resume
/
resume
2
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add subman, tweak wording and styles
Gitea/resume/pipeline/head This commit looks good Details

This commit is contained in:
andrzej 2024-10-11 18:07:53 +02:00
parent f3ccd026fb
commit 21a566909c
2 changed files with 92 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
css/styles.css
View File

@ -64,21 +64,32 @@ h4 {
font-family: League, Verdana, Geneva, Tahoma, sans-serif;
color: var(--gold);
margin: 0px;
background: var(--hl-med);
padding: 3rem;
border-radius: 3rem 3rem 3rem 3rem;
}
h1 {
font-size: 5em;
text-shadow: var(--text-shadow);
background: var(--hl-med);
padding: 3rem;
border-radius: 0 0 3rem 3rem;
}
h2 {
font-size: 3em;
text-shadow: var(--text-shadow);
}
h2 {
font-size: 2em;
text-shadow: var(--text-shadow);
h3 {
font-size: 3em;
color: var(--iris);
margin: 1rem;
}
h3 {
font-size: 2em;
color: var(--iris);
#this-website {
background: none;
}
main {
@ -135,10 +146,26 @@ section {
background-color: var(--surface);
background-image: radial-gradient(circle at top left, var(--overlay), var(--surface));
border-radius: 6em;
border: solid 1px var(--hl-med);
padding: 3em;
box-shadow: 1em 1em var(--shadow-color);
}
figure {
margin: 0px;
}
.ghost-container {
@media screen and (min-width:601px) {
max-width: 60%;
}
@media screen and (max-width:600px) {
flex-direction: column;
}
}
figcaption {
margin-bottom: 0;
font-size: 2em;
@ -160,6 +187,7 @@ a {
text-decoration-color: var(--pine);
color: var(--foam);
font-weight: bold;
display: inline;
}
a:visited {
@ -194,6 +222,29 @@ li::marker {
color: var(--foam);
}
#project-list {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 0px;
}
#project-list>li {
list-style-type: none;
@media screen and (min-width:601px) {
width: 60%;
}
@media screen and (max-width:600px) {
width: 90%;
}
}
.links-container {
display: flex;
justify-content: center;
gap: 3rem;
width: full;
}

75
index.html
View File

@ -18,17 +18,11 @@
<section>
<div class="container">
<h3>Hello.</h3>
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.
<h3>Allow me to introduce myself.</h3>
My name is Andrzej. Since arriving in Spain from my native England in 2010, I have worked teaching English as a foreign language, but now it's time for a change. This is why I have spent the last two years dedicated to re-skilling as a web developer. <p>If you are 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>
</div>
<div class="container">
<h2>The website you are currently reading...</h2>
<h1 id="this-website">This website...</h1>
<ul>
<li><b>… is hosted on bespoke hardware.</b> A mini-pc in my living room, to
be precise!</li>
@ -38,26 +32,17 @@
<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>
Accessibility Guidelines</a></b> </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, Groovy, and Bash.</li>
<li><b>… is deployed via a self-hosted CI/CD system.</b></li>
</li>
<li><b>… follows system light/dark theming.</b></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, Groovy, and Bash.</li>
<li><b>… is deployed via a self-hosted Jenkins CI/CD system.</b></li>
<li><b>… is fully source-available</b> on <a
href="https://projects.ajstepien.xyz/Resume">my self-hosted git
server.</a></li>
<li><b>… was lovingly hand-coded by myself.</b> Naturally.</li>
<li><b>… was lovingly hand-coded by myself.</b></li>
</ul>
</div>
</section>
@ -107,48 +92,58 @@
</figure>
</div>
</section>
<h1>Projects</h1>
<h1>Selected projects</h1>
<section>
<figure>
<ul id="project-list">
<li class="ghost-container">
</li>
<li class="container">
<h3>Subman</h3>
<p>A self-hosted literary submission management system comprising a
Nodejs back-end server and React front end.
Nextjs web-app with Sqlite back-end. Styled with Tailwind.
</p>
<a>demo</a>
<a>source</a>
</li>
<li class="container">
<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>
<div class="links-container">
<a href="https://subman.ajstepien.xyz">demo</a>
<a href="https://projects.ajstepien.xyz/Resume/subman-nextjs">source</a>
</div>
</li>
<!-- <li class="container"> -->
<!---->
<!-- <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 class="container">
<h3>Movie-Explorer</h3>
<p>
An app for when you don't know what movie to watch, written in
Typescript/React.
Typescript/React and vanilla CSS.
</p>
<div class="links-container">
<a href="https://demos.ajstepien.xyz/movie-explorer">demo</a>
<a
href="https://projects.ajstepien.xyz/Resume/movie-explorer">source</a>
</div>
</li>
<li class="container">
<h3>Calculator</h3>
<p>
A simple calculator app written in React.
A simple calculator app written in React and vanilla CSS.
</p>
<div class="links-container">
<a href="https://demos.ajstepien.xyz/calculator/">demo</a>
<a href="https://projects.ajstepien.xyz/Resume/calculator">source</a>
</div>
</li>
</ul>
</figure>