Skip to content

Commit

Permalink
updated design
Browse files Browse the repository at this point in the history
  • Loading branch information
Joshua T Kalis committed Sep 21, 2024
1 parent a60df59 commit 5b2ee7d
Show file tree
Hide file tree
Showing 9 changed files with 113 additions and 164 deletions.
2 changes: 1 addition & 1 deletion content/pages/index.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ Strategic technology leader with a proven track record of driving innovation and

- __Pioneered SRE Practices__: Established the company’s first Site Reliability Engineering (SRE) team, enhancing site reliability through multi-region cloud solutions and improved incident response times.
- __Aligned Engineering with Business Growth__: Developed and scaled core services using Node.js and AWS-native services, directly supporting top-of-funnel traffic and third-party integrations.
- Improved Incident Resolution: Achieved a 10% reduction in mean time to resolution for incidents by implementing a status page for distributed service applications.
- __Improved Incident Resolution__: Achieved a 10% reduction in mean time to resolution for incidents by implementing a status page for distributed service applications.
- __Leadership in DEI__: Fostered a team culture rooted in __diversity, equity, and inclusion__, making the team a top destination for both internal and external talent.
- __Attracted and Developed Top Talent__: Led efforts to attract and hire top engineering talent by promoting a strong team culture and fostering a sense of ownership and pride within the team, resulting in a high retention rate and a preferred destination for internal and external candidates.

Expand Down
12 changes: 8 additions & 4 deletions content/projects.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,14 +16,19 @@
My solutions to some fun coding challenges. [Advent of Code](https://adventofcode.com/).

- [Recipes Worksheet](https://github.com/kalisjoshua/factorio-recipes-worksheet) -
A generic calculator application for some video games I play.
A generic calculator application for some video games I play; [live codesandbox](https://pjn9l2667.csb.app/).

- [Lux](https://github.com/kalisjoshua/lux-core) -
Frontend application framework to build ReactJS components from API responses leveraging hypermedia.

- [KoanJS](https://github.com/kalisjoshua/koans-js) -
JavaScript koans to progressively learn JavaScript through TDD in the browser.

- [Conversation Topics](https://github.com/kalisjoshua/AlexaSkill-ConversationTopics) -
An Alexa skill that provides topics for conversation.

<!--
- [BrowserSlides](https://github.com/kalisjoshua/BrowserSlides) -
Markdown-based slides library to generate presentation slide that display in a browser.
Expand All @@ -33,8 +38,7 @@
- [Hyaloid](https://github.com/kalisjoshua/hyaloid) -
A very simple, zero-dependency, text editor html component.
- [Conversation Topics](https://github.com/kalisjoshua/AlexaSkill-ConversationTopics) -
An Alexa skill that provides topics for conversation.

- [Jawa](https://github.com/kalisjoshua/jawa) -
Working with some legacy code I decided to wrap an API around a library file to provide advanced functionality to it.
-->
67 changes: 7 additions & 60 deletions content/template.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,21 +19,21 @@

<div class="layout">
<main id="main" role="main">
<header role="banner">
<header role="banner" style="position: relative">
<h1><a href="${rel}index.html">${header}</a></h1>

<p>I build great teams and excellent software.</p>

{{?isResume}}
<div style="float: right; font-size: 90%; text-align: right">
<div style="font-size: 90%; position: absolute; top: 0; right: 0">
<a
href="https://docs.google.com/document/d/16GFGZeztNEwdKGehjKxG0H2y9EbETrOUOW5qHBXa42c/edit?usp=sharing"
target="_blank"
title="This page also has a print style sheet so ctrl+p will also be printable to PDF"
title="This page also has a print style sheet; ctrl+p will also be printable to PDF"
>Google Document</a
>
</div>
{{?/}}

<h1><a href="${rel}index.html">${header}</a></h1>

<p>I build great teams and excellent software.</p>
</header>

${main} {{?isArticle}}
Expand Down Expand Up @@ -72,57 +72,6 @@ <h1><a href="${rel}index.html">${header}</a></h1>
<figcaption>Proud to be a Pride Ally</figcaption>
</figure>

<figure class="dev-icons" title="Common web technologies I use.">
<img
alt="CSS3 logo"
height="30px"
src="${rel}images/css3.svg"
width="26px"
/>
<img
alt="HTML5 logo"
height="30px"
src="${rel}images/html5.svg"
width="26px"
/>
<img
alt="JavaScript logo"
height="30px"
src="${rel}images/javascript.svg"
width="30px"
/>
<img
alt="Markdown logo"
height="30px"
src="${rel}images/markdown.svg"
width="49px"
/>

<br />

<img
alt="nodeJS logo"
height="30px"
src="${rel}images/nodejs.svg"
width="105px"
/>
<img
alt="npm logo"
height="30px"
src="${rel}images/npm.svg"
width="77px"
/>

<br />

<img
alt="Git logo"
height="30px"
src="${rel}images/git.svg"
width="30px"
/>
</figure>

<a href="${rel}index.html" id="jk-logo">
<figure>
<img height="138px" src="${rel}images/jk-logo-square.svg"
Expand All @@ -132,8 +81,6 @@ <h1><a href="${rel}index.html">${header}</a></h1>
</aside>
</div>

<div class="cicada"></div>

<script defer src="${rel}js/highlighter.js"></script>
<script defer src="${rel}js/slides.js"></script>

Expand Down
48 changes: 23 additions & 25 deletions public/styles/kalisjoshua.css
View file
Original file line number Diff line number Diff line change
@@ -1,19 +1,14 @@
@import "./lib/normalize.css";
@import "./lib/h5bp.css";

@import "./cicada.css";
@import "./slides.css";

:root {
--bg: rgb(224, 223, 209);
--bg-dark: #2a363b;
--bg-dark: #18453b;
--gold: rgba(200, 200, 50, 0.5);
--green: rgba(0, 170, 70, 0.5);
--magenta: rgba(140, 35, 70, 0.5);
--pink: rgba(163, 44, 120, 0.5);
--purple: rgba(119, 64, 152, 0.5);
--teal: rgba(50, 100, 100, 0.5);
--blue: #0b3142;
--green: #2b3736;
--pink: #d75b93;
--purple: #452136;
--white: #f5f5f5;
}

*,
Expand All @@ -24,19 +19,19 @@

html {
font-family: sans-serif;
background: var(--bg);
padding-top: 2em;
background: var(--green);
color: var(--white);

& a {
color: var(--bg-dark);
color: var(--purple);
}

& a.anchor[aria-hidden="true"] {
display: none;
}

& h1 {
color: var(--bg-dark);
color: var(--purple);
font-weight: 100;
margin: 1ex 0 0;

Expand Down Expand Up @@ -64,8 +59,6 @@ html {
}

aside {
background: #18453b;
color: #e5e5e5;
overflow: hidden;
padding: 2ex;

Expand Down Expand Up @@ -110,6 +103,8 @@ aside {
}

main {
background: #f5f5f5;
color: black;
padding: 1px 1em 0;

& h2 {
Expand Down Expand Up @@ -146,19 +141,22 @@ nav {
}

& ul li {
border: 1px solid transparent;
border-right: 0;
border-radius: 9px 0 0 9px;
list-style-type: none;
margin: 0 -2ex 3px;
overflow: hidden;
padding: 0 2ex;
transition: background 300ms;

&:hover {
background: rgba(0, 0, 0, 0.4);
border-color: var(--pink);
}

&.active {
background: white;
background: rgba(255, 255, 255, 0.2);
background: var(--pink);
color: var(--white);
}

& a {
Expand All @@ -176,6 +174,7 @@ nav {
height: 0;
right: -2ex;
margin-top: -3ex;
opacity: 0.6;
position: absolute;
top: 50%;
transition: border 300ms;
Expand All @@ -186,18 +185,17 @@ nav {

&:hover a:after,
&.active a:after {
border-right-color: white;
border-right-color: var(--white);
}
}
}

.layout {
background: white;
&.active a:after {
opacity: 1;
}
}
}

@media screen and (min-width: 900px) {
.layout {
box-shadow: 2rem 6rem 3rem 2rem rgba(0, 0, 0, 0.2);
display: grid;
grid-template-areas:
"aside header"
Expand Down
128 changes: 63 additions & 65 deletions sanguine/__snapshots__/renderPages.test.ts.snap
View file
Original file line number Diff line number Diff line change
@@ -1,69 +1,67 @@
export const snapshot = {};

snapshot[`renderPages 1`] = `
'about.html
<ul>
<li><a class="" href="./index.html">Resume</a></li>
<li><a class="isActive" href="./about.html">About</a></li>
<li><a class="" href="./articles/index.html">Articles</a></li>
</ul>
<main>
<h1 id="hello">Hello</h1>
<p>About me.</p>
</main>
---
index.html
<ul>
<li><a class="isActive" href="./index.html">Resume</a></li>
<li><a class="" href="./about.html">About</a></li>
<li><a class="" href="./articles/index.html">Articles</a></li>
</ul>
<main>
<h1 id="resume">Resume</h1>
</main>
---
articles/index.html
<ul>
<li><a class="" href="../index.html">Resume</a></li>
<li><a class="" href="../about.html">About</a></li>
<li><a class="isActive" href="../articles/index.html">Articles</a></li>
</ul>
<main>
<h1 id="articles-index">Articles Index</h1>
</main>
---
articles/something.html
<ul>
<li><a class="" href="../index.html">Resume</a></li>
<li><a class="" href="../about.html">About</a></li>
<li><a class="isActive" href="../articles/index.html">Articles</a></li>
</ul>
<main>
<h1 id="somthing">Somthing</h1>
</main>
---
articles/another.html
<ul>
<li><a class="" href="../index.html">Resume</a></li>
<li><a class="" href="../about.html">About</a></li>
<li><a class="isActive" href="../articles/index.html">Articles</a></li>
</ul>
<main>
<h1 id="another">Another</h1>
</main>
'
[
"about.html",
"",
"<ul>",
'<li><a class="" href="./index.html">Resume</a></li>',
'<li><a class="isActive" href="./about.html">About</a></li>',
'<li><a class="" href="./articles/index.html">Articles</a></li>',
"</ul>",
"<main>",
'<h1 id="hello">Hello</h1>',
"<p>About me.</p>",
"",
"</main>",
"",
"index.html",
"",
"<ul>",
'<li><a class="isActive" href="./index.html">Resume</a></li>',
'<li><a class="" href="./about.html">About</a></li>',
'<li><a class="" href="./articles/index.html">Articles</a></li>',
"</ul>",
"<main>",
'<h1 id="resume">Resume</h1>',
"",
"</main>",
"",
"articles/index.html",
"",
"<ul>",
'<li><a class="" href="../index.html">Resume</a></li>',
'<li><a class="" href="../about.html">About</a></li>',
'<li><a class="isActive" href="../articles/index.html">Articles</a></li>',
"</ul>",
"<main>",
'<h1 id="articles-index">Articles Index</h1>',
"",
"</main>",
"",
"articles/something.html",
"",
"<ul>",
'<li><a class="" href="../index.html">Resume</a></li>',
'<li><a class="" href="../about.html">About</a></li>',
'<li><a class="isActive" href="../articles/index.html">Articles</a></li>',
"</ul>",
"<main>",
'<h1 id="somthing">Somthing</h1>',
"",
"</main>",
"",
"articles/another.html",
"",
"<ul>",
'<li><a class="" href="../index.html">Resume</a></li>',
'<li><a class="" href="../about.html">About</a></li>',
'<li><a class="isActive" href="../articles/index.html">Articles</a></li>',
"</ul>",
"<main>",
'<h1 id="another">Another</h1>',
"",
"</main>",
"",
]
`;
Loading

0 comments on commit 5b2ee7d

Please sign in to comment.