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 764a400454
2 changed files with 83 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
css/styles.css
View File

@ -64,21 +64,28 @@ 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: 1rem;
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: 2em;
font-size: 3em;
color: var(--iris);
margin: 1rem;
}
main {
@ -139,6 +146,17 @@ section {
box-shadow: 1em 1em var(--shadow-color);
}
.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 +178,7 @@ a {
text-decoration-color: var(--pine);
color: var(--foam);
font-weight: bold;
display: inline;
}
a:visited {
@ -194,6 +213,28 @@ li::marker {
color: var(--foam);
}
#project-list {
display: flex;
flex-direction: column;
align-items: center;
}
#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;
}

66
index.html
View File

@ -18,14 +18,8 @@
<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. Until the pandemic I was an English teacher, but I have spent the last two years dedicated to learning web development to as high a level as possible. 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.
</div>
<div class="container">
<h2>The website you are currently reading...</h2>
@ -47,13 +41,9 @@
(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><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>
@ -108,47 +98,63 @@
</div>
</section>
<h1>Projects</h1>
<section>
<figure>
<ul id="project-list">
<li class="ghost-container">
<p>
I host these projects on <a href="https://projects.ajstepien.xyz">my own git server</a>, because I wanted to learn how to do that myself. There are more projects than those listed here, and even more hidden from public view, but this selection gives a good overall impression.
</p>
<p>
If you inspect the source code, you will find Jenkinsfiles: these projects are all deployed via a self-hosted, end-to-end CI/CD pipeline.
</p>
</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>