Halfway through resume page. Need to add modals.
This commit is contained in:
g_it
parent
118160c4b9
commit
3f38f601e9
GPG key ID:
A2B0A7C06A054627
30 changed files with 514 additions and 194 deletions
|
|
@ -85,16 +85,6 @@
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
.down-arrow {
|
||||
animation: flash 1s infinite;
|
||||
bottom: 20px;
|
||||
color: var(--tertiary-colour);
|
||||
font-size: 1rem;
|
||||
left: 50%;
|
||||
position: fixed;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.faces .slide {
|
||||
border-radius: 10px;
|
||||
left: 50%;
|
||||
|
|
@ -137,15 +127,3 @@ footer {
|
|||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@keyframes flash {
|
||||
|
||||
0%,
|
||||
100% {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,313 @@
|
|||
@import url("theme.css");
|
||||
|
||||
/*****************************
|
||||
* RESUME
|
||||
* Styling for the resume page.
|
||||
*****************************/
|
||||
|
||||
* {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
body {
|
||||
color: var(--primary-colour);
|
||||
font-family: var(--general-sans);
|
||||
}
|
||||
|
||||
.page-menu {
|
||||
align-items: center;
|
||||
background-color: var(--background-colour);
|
||||
color: var(--primary-colour);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
font-size: 0.6rem;
|
||||
font-weight: 400;
|
||||
justify-content: center;
|
||||
padding: 10px;
|
||||
position: sticky;
|
||||
text-align: center;
|
||||
top: 0;
|
||||
z-index: 100;
|
||||
|
||||
&>*:not(:last-child)::after {
|
||||
content: " | ";
|
||||
margin: 0 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.hero {
|
||||
align-items: center;
|
||||
background-image: url('../media/face-1276x1276.webp');
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 50vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
z-index: -5 !important;
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(255, 255, 255, 0.95);
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-family: var(--general-serif);
|
||||
font-size: 5rem;
|
||||
font-variation-settings: "opsz" 8;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.metadetails {
|
||||
border-bottom: 0.5px solid lightgray;
|
||||
border-top: 0.5px solid lightgray;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 5rem;
|
||||
|
||||
img {
|
||||
height: 2.5rem;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
color: var(--primary-colour);
|
||||
font-family: var(--general-sans);
|
||||
font-size: 0.8rem;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#experience {
|
||||
color: var(--primary-colour);
|
||||
min-height: 80vh;
|
||||
|
||||
|
||||
&>div {
|
||||
margin: 30px;
|
||||
padding: 1.2rem;
|
||||
|
||||
li {
|
||||
border: none;
|
||||
|
||||
&:hover {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
color: var(--primary-colour);
|
||||
font-family: var(--general-sans);
|
||||
font-size: 2.5rem;
|
||||
margin: 0 0 -18px 0;
|
||||
}
|
||||
|
||||
.company {
|
||||
font-family: var(--general-sans);
|
||||
font-weight: 400;
|
||||
font-size: 1.2rem;
|
||||
margin: 0;
|
||||
|
||||
span {
|
||||
font-size: 0.7rem;
|
||||
font-weight: 400;
|
||||
margin: 0 0 0 25px;
|
||||
}
|
||||
}
|
||||
|
||||
.job-blurb {
|
||||
font-family: var(--general-serif);
|
||||
font-size: 1.2rem;
|
||||
font-weight: 700;
|
||||
line-height: 1.5;
|
||||
margin-bottom: 30px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.job-achievements {
|
||||
font-family: var(--general-serif);
|
||||
|
||||
h5 {
|
||||
color: var(--primary-colour);
|
||||
font-size: 0.9rem;
|
||||
margin: 0;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 0 10px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mambu {
|
||||
background-image: url("../media/mambu-logo-272x263.png");
|
||||
}
|
||||
|
||||
.spread {
|
||||
background-image: url("../media/spread-ai-logo-125x144.png");
|
||||
}
|
||||
|
||||
.mambu,
|
||||
.spread {
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
filter: saturate(0);
|
||||
height: 112px;
|
||||
margin-left: 3rem;
|
||||
margin-right: 3rem;
|
||||
position: relative;
|
||||
|
||||
&::after {
|
||||
background: rgba(255, 255, 255, 0.70);
|
||||
bottom: 0;
|
||||
content: '';
|
||||
left: 0;
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
z-index: -5;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#demo {
|
||||
margin: 0 2.5rem;
|
||||
|
||||
.cards {
|
||||
|
||||
.twemoji {
|
||||
font-size: 3rem;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
ul li {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 1.8rem;
|
||||
height: 300px;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#learning {
|
||||
margin: 2.5rem;
|
||||
|
||||
.cards {
|
||||
|
||||
ul li {
|
||||
background-color: var(--tertiary-colour);
|
||||
border: none;
|
||||
|
||||
&:hover {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.prefooter {
|
||||
align-items: flex-start;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
gap: 2rem;
|
||||
justify-content: center;
|
||||
margin-top: 1.3rem;
|
||||
margin-bottom: 0.5rem;
|
||||
text-align: center;
|
||||
|
||||
div {
|
||||
img {
|
||||
height: 1.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
div:last-child {
|
||||
img {
|
||||
height: 1.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.faq-container {
|
||||
position: relative;
|
||||
|
||||
.faq {
|
||||
background: var(--background-colour);
|
||||
border: 2px solid var(--primary-colour);
|
||||
border-radius: 5px;
|
||||
bottom: 50px;
|
||||
opacity: 0;
|
||||
padding: 20px;
|
||||
position: fixed;
|
||||
right: 20px;
|
||||
transition: opacity 0.3s, visibility 0.3s;
|
||||
visibility: hidden;
|
||||
width: 300px;
|
||||
z-index: 999;
|
||||
|
||||
h3 {
|
||||
color: var(--primary-colour);
|
||||
font-family: var(--general-serif);
|
||||
}
|
||||
}
|
||||
|
||||
#faq-toggle:checked+.question-icon .icon.question {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
#faq-toggle:checked+.question-icon .icon.close {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#faq-toggle:checked~.faq {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.question-icon {
|
||||
align-items: center;
|
||||
bottom: 20px;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
position: fixed;
|
||||
right: 20px;
|
||||
width: 50px;
|
||||
z-index: 1000;
|
||||
|
||||
.icon {
|
||||
font-size: 1rem;
|
||||
position: absolute;
|
||||
transition: opacity 0.3s;
|
||||
}
|
||||
|
||||
.icon.question {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.icon.close {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.visually-hidden {
|
||||
height: 1px;
|
||||
left: -9999px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
}
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
// INDEX.js
|
||||
// Manages the animations on the home page
|
||||
// Manages the animations on the homepage
|
||||
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
// Register the GSAP plugin to use
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB |
BIN
content/assets/media/berlin-logo-1000x1000.png
Executable file
BIN
content/assets/media/berlin-logo-1000x1000.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 930 KiB |
BIN
content/assets/media/face-1276x1276.png
Executable file
BIN
content/assets/media/face-1276x1276.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 346 KiB |
BIN
content/assets/media/git-link-512x512.png
Executable file
BIN
content/assets/media/git-link-512x512.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 9.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 18 KiB |
BIN
content/assets/media/id-card-icon-512x512.png
Executable file
BIN
content/assets/media/id-card-icon-512x512.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 7.1 KiB |
BIN
content/assets/media/languages-icon-512x512.png
Executable file
BIN
content/assets/media/languages-icon-512x512.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
BIN
content/assets/media/linkedin-logo-512x512.png
Executable file
BIN
content/assets/media/linkedin-logo-512x512.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 6.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 11 KiB |
BIN
content/assets/media/mambu-logo-272x263.png
Executable file
BIN
content/assets/media/mambu-logo-272x263.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 30 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 305 KiB |
BIN
content/assets/media/site-link-512x512.png
Executable file
BIN
content/assets/media/site-link-512x512.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
BIN
content/assets/media/technical-writing-icon-512x512.png
Executable file
BIN
content/assets/media/technical-writing-icon-512x512.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 9.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 29 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 MiB |
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 23 KiB |
|
|
@ -41,7 +41,3 @@ title: Home
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="down-arrow" markdown >
|
||||
:fontawesome-solid-chevron-down:
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -2,10 +2,6 @@
|
|||
description: experience, skills, education.
|
||||
extra_css:
|
||||
- assets/css/resume.css
|
||||
extra_js:
|
||||
- assets/js/gsap/gsap.min.js
|
||||
- assets/js/gsap/ScrollTrigger.min.js
|
||||
- assets/js/resume.js
|
||||
hide:
|
||||
- toc
|
||||
- navigation
|
||||
|
|
@ -17,21 +13,138 @@ title: Resume
|
|||
|
||||
<!-- markdownlint-disable MD033 -->
|
||||
|
||||
<div class="portfolio">
|
||||
<div class="page-menu">
|
||||
<span><a href="#experience">experience</a></span>
|
||||
<span><a href="#demo">demo</a></span>
|
||||
<span><a href="#learning">learning</a></span>
|
||||
</div>
|
||||
|
||||
<div class="hero">
|
||||
<div>Gugulethu Hlekwayo</div>
|
||||
<div class="section hero">
|
||||
<div class="title">Gugulethu Hlekwayo</div>
|
||||
<div class="metadetails">
|
||||
<div>
|
||||
<figure>
|
||||
<img src="assets/media/berlin-logo-1000x1000.png" alt="City of Berlin logo" >
|
||||
<figcaption>Based in <br>Berlin, Germany</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<div>
|
||||
<figure>
|
||||
<img src="assets/media/id-card-icon-512x512.png" alt="ID card icon" >
|
||||
<figcaption>German <br>Permanent Resident</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<div>
|
||||
<figure>
|
||||
<img src="assets/media/languages-icon-512x512.png" alt="Languages icon" >
|
||||
<figcaption>Native English, B1 German,<br> isiZulu, isiXhosa, A1 Mandarin</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<div>
|
||||
<figure>
|
||||
<img src="assets/media/technical-writing-icon-512x512.png" alt="Technical Writing icon" >
|
||||
<figcaption><abbr title="8 years in content management, 2 years in copywriting, and 5 years in Technical Writing" >15 years</abbr> of <br>professional writing experience</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="experience">
|
||||
<div class="section grid cards" id="experience" >
|
||||
<div class="grid cards">
|
||||
<ul>
|
||||
<li>
|
||||
<div class="mambu">
|
||||
<h2>Senior Technical Writer</h2>
|
||||
<div class="company"><abbr title="Mambu is a Software-as-a-Service (SaaS) banking backend that provides services to banks such as N26 and Solaris.">MAMBU</abbr> <span>2021 to 2023</span></div>
|
||||
<div class="job-blurb">Promoted to team lead; managing a team of three technical writers.</div>
|
||||
<div class="job-achievements">
|
||||
<h5>Documented the Mambu ecosystem <span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M384 32c35.3 0 64 28.7 64 64v320c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V96c0-35.3 28.7-64 64-64zM272 296c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24H184c-13.3 0-24 10.7-24 24s10.7 24 24 24h54.1l-103 103c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l103-103z"></path></svg></span></h5>
|
||||
<p>Documented integrations, such as payment and compliance services, and the low-code orchestrator that clients used for their flows.</p>
|
||||
<h5>Documented a command-line interface <span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M384 32c35.3 0 64 28.7 64 64v320c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V96c0-35.3 28.7-64 64-64zM272 296c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24H184c-13.3 0-24 10.7-24 24s10.7 24 24 24h54.1l-103 103c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l103-103z"></path></svg></span></h5>
|
||||
<p>Documented the Mambu <abbr title='Command-line interfaces use text instead of UI elements.'>CLI</abbr> for external engineers to connect to the backend directly.</p>
|
||||
<h5>Assumed leadership role</h5>
|
||||
<p>Promoted to team lead, which shifted the role into more managerial responsibilities on top of working on documentation.</p>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="spread">
|
||||
<h2>Documentation Engineer</h2>
|
||||
<div class="company"><abbr title="SPREAD is a Software-as-a-Service (SaaS) platform for creating actionable and contextualised data for product engineers. The platform counts Volkswagen, Audi, BMW, and other automotive firms as users.">SPREAD</abbr> <span>2024 to 2026</span></div>
|
||||
<div class="job-blurb">Hired as the first Technical Writer to establish the documentation function.</div>
|
||||
<div class="job-achievements">
|
||||
<h5>Built a docs-as-code publishing pipeline <span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M384 32c35.3 0 64 28.7 64 64v320c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V96c0-35.3 28.7-64 64-64zM272 296c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24H184c-13.3 0-24 10.7-24 24s10.7 24 24 24h54.1l-103 103c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l103-103z"></path></svg></span></h5>
|
||||
<p>Built a pipeline that used GitHub Actions to build the documentation site, Vale to lint content, Docker to deploy the site, and shell scripting.</p>
|
||||
<h5>Established the documentation function <span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M384 32c35.3 0 64 28.7 64 64v320c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V96c0-35.3 28.7-64 64-64zM272 296c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24H184c-13.3 0-24 10.7-24 24s10.7 24 24 24h54.1l-103 103c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l103-103z"></path></svg></span></h5>
|
||||
<p>Socialized the rest of the company to documentation processes and workings; this included onboarding colleagues to edit and use docs.</p>
|
||||
<h5>Documented the full product range</h5>
|
||||
<p>Documented the full product range within two quarters. Kept the documentation up to date through two product refreshes.</p>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="skills">
|
||||
<div class="section" id="demo" >
|
||||
<div class="grid cards">
|
||||
<ul>
|
||||
<li>
|
||||
<span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M195.1 9.5c3-14.8 16.1-25.5 31.3-25.5h59.8c15.2 0 28.3 10.7 31.3 25.5l14.5 70c14.1 6 27.3 13.7 39.3 22.8l67.8-22.5c14.4-4.8 30.2 1.2 37.8 14.4l29.9 51.8c7.6 13.2 4.9 29.8-6.5 39.9L447 233.3c.9 7.4 1.3 15 1.3 22.7s-.5 15.3-1.3 22.7l53.4 47.5c11.4 10.1 14 26.8 6.5 39.9L477 417.9c-7.6 13.1-23.4 19.2-37.8 14.4l-67.8-22.5c-12.1 9.1-25.3 16.7-39.3 22.8l-14.4 69.9c-3.1 14.9-16.2 25.5-31.3 25.5h-59.8c-15.2 0-28.3-10.7-31.3-25.5l-14.4-69.9c-14.1-6-27.2-13.7-39.3-22.8l-68.1 22.5c-14.4 4.8-30.2-1.2-37.8-14.4L5.8 366.1c-7.6-13.2-4.9-29.8 6.5-39.9l53.4-47.5c-.9-7.4-1.3-15-1.3-22.7s.5-15.3 1.3-22.7l-53.4-47.5C.9 175.7-1.7 159 5.8 145.9l29.9-51.8c7.6-13.2 23.4-19.2 37.8-14.4l67.8 22.5c12.1-9.1 25.3-16.7 39.3-22.8zM256.3 336a80 80 0 1 0-.6-160 80 80 0 1 0 .6 160"></path></svg></span>
|
||||
<strong>Technical</strong>
|
||||
</li>
|
||||
<li>
|
||||
<span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentColor" d="M64 64C28.7 64 0 92.7 0 128v256c0 35.3 28.7 64 64 64h448c35.3 0 64-28.7 64-64V128c0-35.3-28.7-64-64-64zm16 64h32c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16v-32c0-8.8 7.2-16 16-16M64 240c0-8.8 7.2-16 16-16h32c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16zm112-112h32c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16h-32c-8.8 0-16-7.2-16-16v-32c0-8.8 7.2-16 16-16m-16 112c0-8.8 7.2-16 16-16h32c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16h-32c-8.8 0-16-7.2-16-16zm16 80h224c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16H176c-8.8 0-16-7.2-16-16v-32c0-8.8 7.2-16 16-16m80-176c0-8.8 7.2-16 16-16h32c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16h-32c-8.8 0-16-7.2-16-16zm16 80h32c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16h-32c-8.8 0-16-7.2-16-16v-32c0-8.8 7.2-16 16-16m80-80c0-8.8 7.2-16 16-16h32c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16h-32c-8.8 0-16-7.2-16-16zm16 80h32c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16h-32c-8.8 0-16-7.2-16-16v-32c0-8.8 7.2-16 16-16m80-80c0-8.8 7.2-16 16-16h32c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16h-32c-8.8 0-16-7.2-16-16zm16 80h32c8.8 0 16 7.2 16 16v32c0 8.8-7.2 16-16 16h-32c-8.8 0-16-7.2-16-16v-32c0-8.8 7.2-16 16-16"></path></svg></span>
|
||||
<strong>Writing</strong>
|
||||
</li>
|
||||
<li>
|
||||
<span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M18 15a3 3 0 0 1 3 3 3 3 0 0 1-3 3 2.99 2.99 0 0 1-2.83-2H14v-2h1.17c.41-1.17 1.52-2 2.83-2m0 2a1 1 0 0 0-1 1 1 1 0 0 0 1 1 1 1 0 0 0 1-1 1 1 0 0 0-1-1m0-9a1.43 1.43 0 0 0 1.43-1.43 1.43 1.43 0 1 0-2.86 0A1.43 1.43 0 0 0 18 8m0-5.43a4 4 0 0 1 4 4C22 9.56 18 14 18 14s-4-4.44-4-7.43a4 4 0 0 1 4-4M8.83 17H10v2H8.83A2.99 2.99 0 0 1 6 21a3 3 0 0 1-3-3c0-1.31.83-2.42 2-2.83V14h2v1.17c.85.3 1.53.98 1.83 1.83M6 17a1 1 0 0 0-1 1 1 1 0 0 0 1 1 1 1 0 0 0 1-1 1 1 0 0 0-1-1M6 3a3 3 0 0 1 3 3c0 1.31-.83 2.42-2 2.83V10H5V8.83A2.99 2.99 0 0 1 3 6a3 3 0 0 1 3-3m0 2a1 1 0 0 0-1 1 1 1 0 0 0 1 1 1 1 0 0 0 1-1 1 1 0 0 0-1-1m5 14v-2h2v2zm-4-6H5v-2h2z"></path></svg></span>
|
||||
<strong>Process</strong>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="education">
|
||||
<div class="section" id="learning" >
|
||||
<div class="grid cards">
|
||||
<ul>
|
||||
<li>
|
||||
<span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><!--! Font Awesome Free 7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path fill="currentColor" d="m0 32 34.9 395.8L191.5 480l157.6-52.2L384 32zm308.2 127.9H124.4l4.1 49.4h175.6l-13.6 148.4-97.9 27v.3h-1.1l-98.7-27.3-6-75.8h47.7L138 320l53.5 14.5 53.7-14.5 6-62.2H84.3L71.5 112.2h241.1z"></path></svg></span> <strong><abbr title="Hyper Text Markup Language">HTML</abbr></strong> for content and structure
|
||||
</li>
|
||||
<li>
|
||||
<span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--! Font Awesome Free 7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path fill="currentColor" d="M0 32v448h448V32zm243.8 349.4c0 43.6-25.6 63.5-62.9 63.5-33.7 0-53.2-17.4-63.2-38.5l34.3-20.7c6.6 11.7 12.6 21.6 27.1 21.6 13.8 0 22.6-5.4 22.6-26.5V237.7h42.1zm99.6 63.5c-39.1 0-64.4-18.6-76.7-43l34.3-19.8c9 14.7 20.8 25.6 41.5 25.6 17.4 0 28.6-8.7 28.6-20.8 0-14.4-11.4-19.5-30.7-28l-10.5-4.5c-30.4-12.9-50.5-29.2-50.5-63.5 0-31.6 24.1-55.6 61.6-55.6 26.8 0 46 9.3 59.8 33.7L368 290c-7.2-12.9-15-18-27.1-18-12.3 0-20.1 7.8-20.1 18 0 12.6 7.8 17.7 25.9 25.6l10.5 4.5c35.8 15.3 55.9 31 55.9 66.2 0 37.8-29.8 58.6-69.7 58.6"></path></svg></span> <strong>JavaScript</strong> for interactivity
|
||||
</li>
|
||||
<li>
|
||||
<span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Free 7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path fill="currentColor" d="m480 32-64 368-223.3 80L0 400l19.6-94.8h82l-8 40.6L210 390.2l134.1-44.4 18.8-97.1H29.5l16-82h333.7l10.5-52.7H56.3l16.3-82z"></path></svg></span> <strong>CSS</strong> for text running out of boxes
|
||||
</li>
|
||||
<li>
|
||||
<span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Free 7.1.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) Copyright 2025 Fonticons, Inc.--><path fill="currentColor" d="M483.1 159.7c10.9-24.6 21.4-60.4 21.4-87.9 0-72.7-79.6-98.4-209.7-38.6C187.2 26 83.6 106.9 57.7 219.7c30.9-34.9 78.3-82.3 122-101.2C125.4 166.8 79.1 227.9 44 291.7c-20.7 37.9-44 99.2-44 145 0 98.6 92.9 86.5 180.3 42 31.4 15.4 66.6 15.6 101.7 15.6 97.1 0 184.2-54.3 216.8-146H378c-52.5 88.6-196.8 53-196.8-47.4H510c6.4-43.6-1.7-95.7-26.9-141.2M64.6 346.9c17.7 51.1 53.7 95.8 100.2 123.3C76.1 519.1-8.4 499.3 64.6 346.9M180.5 238c2-55.2 50.3-94.9 104-94.9 53.4 0 102 39.7 104 94.9zM365.1 50.4c21.4-10.3 48.6-22 72.6-22 31.4 0 54.3 21.7 54.3 53.7 0 20-7.4 49-14.6 67.9-26.3-42.3-66-81.6-112.3-99.6"></path></svg></span> <strong>Internet Explorer</strong> ... huh?
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="faq">
|
||||
<div class="prefooter" >
|
||||
<div><a href="https://git.gugulet.hu/explore" target="_blank"><img src="assets/media/git-link-512x512.png" alt="Self-hosted ForgeJo instance with git repos"></a></div>
|
||||
<div><a href="https://linkedin.com/in/gugulet-hu" target="_blank"><img src="assets/media/linkedin-logo-512x512.png" alt="Link to LinkedIn profile"></a></div>
|
||||
<div><a href="https://gugulet.hu" target="_blank"><img src="assets/media/site-link-512x512.png" alt="Link to the home page"></a></div>
|
||||
</div>
|
||||
|
||||
<div class="faq-container">
|
||||
<input type="checkbox" id="faq-toggle" class="visually-hidden">
|
||||
<label for="faq-toggle" class="question-icon">
|
||||
<span class="icon question"><p><span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M256 512a256 256 0 1 0 0-512 256 256 0 1 0 0 512m0-336c-17.7 0-32 14.3-32 32 0 13.3-10.7 24-24 24s-24-10.7-24-24c0-44.2 35.8-80 80-80s80 35.8 80 80c0 47.2-36 67.2-56 74.5v3.8c0 13.3-10.7 24-24 24s-24-10.7-24-24v-8.1c0-20.5 14.8-35.2 30.1-40.2 6.4-2.1 13.2-5.5 18.2-10.3 4.3-4.2 7.7-10 7.7-19.6 0-17.7-14.3-32-32-32zm-32 192a32 32 0 1 1 64 0 32 32 0 1 1-64 0"></path></svg></span></p></span>
|
||||
<span class="icon close"><p><span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 20c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8m0-18C6.47 2 2 6.47 2 12s4.47 10 10 10 10-4.47 10-10S17.53 2 12 2m2.59 6L12 10.59 9.41 8 8 9.41 10.59 12 8 14.59 9.41 16 12 13.41 14.59 16 16 14.59 13.41 12 16 9.41z"></path></svg></span></p></span>
|
||||
</label>
|
||||
<div class="faq">
|
||||
<h3>Questions and Answers</h3>
|
||||
<p>Why did you resign from your last job?</p>
|
||||
<blockquote>Grey / Gray</blockquote>
|
||||
<p>Do you need visa support? Do you have the right to work in Germany?</p>
|
||||
<blockquote>Sesame seed</blockquote>
|
||||
<p>Do you need visa support? Do you have the right to work in Germany (and the EU)?</p>
|
||||
<p>Can you work remotely?</p>
|
||||
<p>Are you able to work on your own?</p>
|
||||
<p>When can you start?</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,130 +0,0 @@
|
|||
---
|
||||
title: PcVue assessment
|
||||
description: An assessment of the documentation provided by PcVue.
|
||||
hide:
|
||||
# - toc
|
||||
- navigation
|
||||
- search
|
||||
---
|
||||
|
||||
<style>
|
||||
img {
|
||||
border: 0.5px solid #ededed;
|
||||
border-radius: 5px;
|
||||
}
|
||||
</style>
|
||||
|
||||
> ### Brief<br>
|
||||
>
|
||||
> **October 2025**<br>
|
||||
> Briefly assess the quality of the [product documentation](https://www.pcvue.com/ProductHelp/PcVue/en/Content/AboutHelp/Welcome_PubWeb.php) of PcVue.
|
||||
|
||||
{ height=300px }
|
||||
|
||||
## Content clarity
|
||||
|
||||
**Acronyms and technical jargon**: The documentation generally assumes familiarity with acronyms like HMI and SCADA. It would benefit from brief explanations in these areas. For example, this is from the first paragraph of an [overview page](https://www.pcvue.com/ProductHelp/PcVue/en/Content/HMI/Overview.php):
|
||||
|
||||
---
|
||||
_The HMI (1) for your project is composed of mimics. Mimics (2) are easily and quickly developed to form menus, overviews, process diagrams, trend viewers and so on..._
|
||||
{ .annotate }
|
||||
|
||||
1. Even if the acronym has been written out elsewhere it needs to be re-introduced on every new page.
|
||||
2. Mimics are a new concept as well, and the way this is written assumes the reader already knows what they are.
|
||||
|
||||
---
|
||||
|
||||
**Assumed knowledge**: Many pages presuppose a significant amount of technical knowledge, which could confuse readers - especially those new to the industry. The first principle of technical writing is that every page is page one and the reader should find all the context they need on the page (or linked on the page).
|
||||
|
||||
This is especially jarring on the landing page of the Product Documentation: PcVue has the description HMI/SCADA, FrontVue has the description Light HMI, and EmVue has the description Energy Monitoring. Of those, only EmVue is understandable to a new user. Using full blurbs that describe what the documentation set contains would be better for understanding.
|
||||
|
||||
**Use-cases**: The absence of real-world use cases leaves a gap in understanding how the software works in practice. There are marketing use-cases on the main website, but they would do more to give product documentation clarity.
|
||||
|
||||
---
|
||||
|
||||
## User experience
|
||||
|
||||
**User experience**: Any documentation set that needs meta-documentation - like the [About this documentation](https://www.pcvue.com/ProductHelp/PcVue/en/Content/AboutHelp/HowToSearch_PubWeb.php) section - is signalling that it is not intuitive enough to use. A reader should not have to know about logical operators to use search functionality and interpret icons to understand their meaning. Good intuitive documentation sets don't need meta-documentation to understand how to use the documentation.
|
||||
|
||||
**Search functionality**: The search feature needs enhancement to accommodate natural language queries rather than expecting users to know logical operators or regular expressions. Every reader's expectation is a search experience as good as Google; especially as the main way to navigate a large documentation set is through the search box.
|
||||
|
||||
<figure>
|
||||
<img src='/assets/media/what-is-hmi.gif' alt='A simple search to find what HMI means'>
|
||||
<figcaption>The search function is slow, fragmented, and can't handle questions</figcaption>
|
||||
</figure>
|
||||
|
||||
**Getting Started section**: Preferably you need a Getting Started or QuickStart section. The installation minutiae gets in the way of someone who just wants the golden path. Notably, the main installation instructions are listed as the sixth item in the menu under the installation section.
|
||||
|
||||
---
|
||||
|
||||
## Information architecture
|
||||
|
||||
**Linking examples with theory**: Examples should be integrated with related theoretical content instead of being isolated, like in the Application Architect section, where the [Examples](https://www.pcvue.com/ProductHelp/PcVue/en/Content/AA/Example_keyword.php) section is separate. This approach reinforces learning through immediate application.
|
||||
|
||||
**Content types**: The content needs to be divided into content types more clearly: theory content, tutorial content, and reference content. There is an inconsistency in how the sections are organized. For example, the Application Architect section has a glossary, but the others do not. The [Diátaxis](https://diataxis.fr/) for technical writing explains content types and where they are applicable in more depth.
|
||||
|
||||
**Headings and page structure**: Headings are an indicator of page structure for search engines and for AI answer engines. Headings like "Example 1", "The secondary navigation tree pop-up menu", "For the LAN Manager", and similar mean nothing in isolation - which is how engines parse a website.
|
||||
|
||||
**Interlinking**: The content is light on internal links. There are **See more** boxes, but the linking between pages is relatively absent for documentation describing one product. Internal linking helps readers make sense of the product as a whole and are critical for Search Engine Optimization (SEO).
|
||||
|
||||
---
|
||||
|
||||
## Design and technical
|
||||
|
||||
**Page load times**: PHP, the language that MadCap Flare outputs content to, is slow and the documentation site has a noticeable lag when navigating pages and using search. A server-side language is good for dynamic content, but hamstrings static content - which is mainly how documentation is presented.
|
||||
|
||||
**Print layout**: The print layout when using the print button is not well-styled for PDFs or physical printing. The text is too small, the spacing and styling is a facsimile of the web view when it should be simplified for the print view. Some compliance functions need good PDF functionality to prove that content was made available at a certain time for auditing purposes.
|
||||
|
||||
<div class="grid cards" markdown>
|
||||
|
||||
- **PcVue print layout**
|
||||
|
||||
---
|
||||
|
||||
|
||||
|
||||
- **Styled print layout**
|
||||
|
||||
---
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
**Lists and tables**: When to use a table, a list, or another element should be clearer. There were instances were a table would have been better than a list and vise-versa. The formatting of both needs attention: lists are too spaced out and tables contain multiple header rows in the same table.
|
||||
|
||||
**Diagrams and images**: Diagrams are a great tool for getting information across visually, particularly to illustrate complex processes and concepts. There are no diagrams in the documentation. Tools like Mermaid allow you to create diagrams dynamically, without using image editing application. The general quality of the screenshots and images is low, and there are no captions. Captions are important for SEO and for accessibility for visually impaired readers. Having images under **Show pictures** dropdowns is a suboptimal user experience. It's an additional click for little gain.
|
||||
|
||||
**Font and presentation layer**: The font on the main site is more legible and overall styling is more visually appealing compared to the documentation site. Presentation matters, even for highly technical audiences.
|
||||
|
||||
**Admonition overuse**: Excessive use of admonitions can diminish their impact. There are multiple pages with more than five admonitions per page. If everything is important, nothing is important. It’s essential to limit their frequency to maintain emphasis.
|
||||
|
||||
---
|
||||
|
||||
## General
|
||||
|
||||
The documentation is arranged around how the company views the software and not how users use it. A compliance and audit professional would benefit from a user flow designed for their needs and understanding, same for an integration or process engineer.
|
||||
|
||||
The documentation is written like a book, with the expectation that readers will read from top to bottom. This is not how people read documentation. Documentation is primarily driven by search and read in snippets. Readers come with questions and expect answers with full context in a nutshell.
|
||||
|
||||
The language scores highly on the [Flesch-Kincaid Grade Level](https://en.wikipedia.org/wiki/Flesch%E2%80%93Kincaid_readability_tests), indicating that it can be improved for clarity and flow. This would need a full review of the content to set standards that make it more readable and understandable.
|
||||
|
||||
As a reader I get the sense the chapters have been written by different people and the documentation set does not work together.
|
||||
|
||||
**My general recommendation would be an overhaul, starting with the information architecture, a technical infrastructure review, and then a general language and style standards review.**
|
||||
|
||||
---
|
||||
|
||||
<a href="https://gugulet.hu/resume" target="_blank" ><div class="button">See my résume</div></a>
|
||||
<div class='meta-icons'>
|
||||
<a href='https://linkedin.com/in/gugulet-hu' target='_blank' >
|
||||
<div>
|
||||
<span class='twemoji'><svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M19 3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2zm-.5 15.5v-5.3a3.26 3.26 0 0 0-3.26-3.26c-.85 0-1.84.52-2.32 1.3v-1.11h-2.79v8.37h2.79v-4.93c0-.77.62-1.4 1.39-1.4a1.4 1.4 0 0 1 1.4 1.4v4.93zM6.88 8.56a1.68 1.68 0 0 0 1.68-1.68c0-.93-.75-1.69-1.68-1.69a1.69 1.69 0 0 0-1.69 1.69c0 .93.76 1.68 1.69 1.68m1.39 9.94v-8.37H5.5v8.37z'></path></svg></span> linkedin/gugulet-hu
|
||||
</div>
|
||||
</a>
|
||||
<a href='https://gugulet.hu/technical/dev/explore/repos' target='_blank' >
|
||||
<div>
|
||||
<span class='twemoji'><svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M2.6 10.59 8.38 4.8l1.69 1.7c-.24.85.15 1.78.93 2.23v5.54c-.6.34-1 .99-1 1.73a2 2 0 0 0 2 2 2 2 0 0 0 2-2c0-.74-.4-1.39-1-1.73V9.41l2.07 2.09c-.07.15-.07.32-.07.5a2 2 0 0 0 2 2 2 2 0 0 0 2-2 2 2 0 0 0-2-2c-.18 0-.35 0-.5.07L13.93 7.5a1.98 1.98 0 0 0-1.15-2.34c-.43-.16-.88-.2-1.28-.09L9.8 3.38l.79-.78c.78-.79 2.04-.79 2.82 0l7.99 7.99c.79.78.79 2.04 0 2.82l-7.99 7.99c-.78.79-2.04.79-2.82 0L2.6 13.41c-.79-.78-.79-2.04 0-2.82'></path></svg></span> gugulet.hu/dev
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
29
content/test.md
Executable file
29
content/test.md
Executable file
|
|
@ -0,0 +1,29 @@
|
|||
---
|
||||
title: test
|
||||
---
|
||||
|
||||
The HTML specification is maintained by the W3C.
|
||||
|
||||
<div class="grid cards" markdown>
|
||||
- :fontawesome-brands-html5: __HTML__ for content and structure
|
||||
- :fontawesome-brands-js: __JavaScript__ for interactivity
|
||||
- :fontawesome-brands-css3: __CSS__ for text running out of boxes
|
||||
- :fontawesome-brands-internet-explorer: __Internet Explorer__ ... huh?
|
||||
</div>
|
||||
|
||||
|
||||
*[HTML]: Hyper Text Markup Language
|
||||
*[W3C]: World Wide Web Consortium
|
||||
|
||||
|
||||
<!-- <div class="docs-stack">
|
||||
<div>
|
||||
<span class='twemoji'><svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M21.039 0a2.96 2.96 0 0 0-2.65 4.274l-6.447 6.447a2.96 2.96 0 1 0 1.335 1.336l6.447-6.447A2.959 2.959 0 1 0 21.04 0zM10.628 2.745q-.108.001-.214.004-.107.002-.215.005a11 11 0 0 0-1.335.138l-.03.005-.185.033-.105.02a8 8 0 0 0-.289.062l-.032.008a10.7 10.7 0 0 0-2.55.95l-.155.089q-.094.052-.187.105-.07.039-.14.079H5.19l-.01.005-.036.02v.002l.111.184 3.15 5.23a4 4 0 0 1 .38-.202 4.3 4.3 0 0 1 1.628-.413q.107-.007.214-.008zm.428.01v6.333q.489.05.96.209l4.66-4.66q-.259-.181-.528-.347l-.026-.015q-.084-.052-.168-.1l-.098-.056-.099-.055-.171-.092-.027-.014a11 11 0 0 0-1.425-.617c-.69-.241-1.403-.41-2.128-.505l-.089-.012-.09-.01-.17-.019-.049-.004-.204-.017a6 6 0 0 0-.255-.015q-.046-.004-.093-.004M4.782 4.498a10 10 0 0 0-1.36 1.062l4.461 4.461.018.018q.073-.06.149-.116l-.011-.018zm-1.67 1.36q-.074.076-.147.154l-.149.155q-.494.536-.902 1.118l-.039.056a11 11 0 0 0-.216.326 10.6 10.6 0 0 0-1.65 5.276l-.006.215-.003.214h6.317c0-.072.007-.143.01-.214.005-.072.006-.144.013-.215a4.3 4.3 0 0 1 .952-2.3c.045-.055.096-.106.144-.16.048-.052.093-.107.144-.158zm16.255 1.464-4.663 4.663q.158.47.21.959h6.332l-.004-.094a12 12 0 0 0-.032-.456l-.005-.052-.026-.241v-.009l-.033-.24v-.009a11 11 0 0 0-.327-1.493l-.003-.01-.07-.228-.01-.03-.069-.204-.02-.055a6 6 0 0 0-.153-.405l-.093-.227-.063-.144-.037-.081-.08-.171-.024-.052-.096-.194-.014-.027-.112-.212-.004-.008a11 11 0 0 0-.604-.98m-4.43 6.05c0 .071-.006.142-.01.214q-.003.108-.012.214a4.3 4.3 0 0 1-.952 2.301c-.045.055-.096.107-.144.16s-.093.108-.144.159l4.467 4.467q.075-.078.148-.155.076-.078.148-.155.497-.538.905-1.122l.032-.046.098-.144.085-.13.04-.063a10.6 10.6 0 0 0 1.647-5.272q.004-.107.006-.214.003-.107.004-.214zM.01 13.8l.004.093.01.179.005.076.017.206.005.046q.01.115.024.228l.003.022.033.248q.109.758.327 1.497l.002.006q.034.116.071.23l.004.014.005.014a16 16 0 0 0 .153.439l.03.08.059.148.093.228.062.14.038.084.078.169.027.054a11 11 0 0 0 .225.441l.025.043 5.408-3.258.02-.012a4.3 4.3 0 0 1-.395-1.414h-.025zm.505 2.846-.206.058.002.005zm6.425-1.052-5.415 3.262q.125.207.259.406l.008.014.004.005.008.014h.001l.022.032.001.002v.001a11 11 0 0 0 .298.417l.006.008a10 10 0 0 0 .29.368l.033.04q.064.078.13.153l.057.065.112.127.064.069.029.031.083.09.035.035q.073.077.149.153L7.58 16.42a4 4 0 0 1-.285-.321 4.4 4.4 0 0 1-.356-.505zm6.416 1.111q-.075.06-.15.116l.011.018 3.257 5.407q.227-.148.446-.307.473-.348.914-.756l-4.46-4.46zm-5.457.003-.015.015-4.46 4.46.195.176q.033.03.065.058l.152.13.215.174.023.017.191.148.008.005q.403.3.834.564l.03.018.164.097.101.057a6 6 0 0 0 .27.148q.012.007.025.013.243.127.493.24l.158-.385 2.243-5.448.009-.02a4.3 4.3 0 0 1-.701-.467m4.951.353q-.092.054-.187.104a4.32 4.32 0 0 1-3.271.336c-.069-.02-.135-.047-.203-.071-.067-.024-.136-.044-.202-.072l-2.242 5.444-.088.213-.075.183v.001l.017.007.019.007.005.003q.079.03.159.06.1.04.2.077l.102.04c.702.247 1.43.42 2.168.518l.087.012.09.01.172.019a7 7 0 0 0 .252.022q.035 0 .071.003l.184.011.112.005a7 7 0 0 0 .358.007h.05a10.7 10.7 0 0 0 1.793-.15l.185-.034.105-.02.109-.023.18-.04.032-.008a10.7 10.7 0 0 0 2.55-.95q.078-.044.156-.089.094-.052.187-.105.065-.035.13-.073h.001l.002-.002.002-.001.002-.001.007-.004.042-.025-.11-.183-.11-.184zm3.262 5.414-.042.025zm-.055.033h-.002z'></path></svg></span> <abbr title='The OpenAPI specification is a standard for documenting REST APIs.'>OpenAPI Specification</abbr>
|
||||
</div>
|
||||
<div>
|
||||
<span class='twemoji'><svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M11.754 0a4 4 0 0 0-2.049.596L3.33 4.532a4.25 4.25 0 0 0-2.017 3.615v8.03a4.13 4.13 0 0 0 2.067 3.574l6.486 3.733a3.88 3.88 0 0 0 3.835.018l7.043-3.966a3.82 3.82 0 0 0 1.943-3.323V7.752a3.57 3.57 0 0 0-1.774-3.084L13.817.541a4 4 0 0 0-2.063-.54zm.022 1.674c.413-.006.828.1 1.2.315l7.095 4.127c.584.34.941.96.94 1.635v8.462c0 .774-.414 1.484-1.089 1.864l-7.042 3.966a2.2 2.2 0 0 1-2.179-.01l-6.485-3.734a2.45 2.45 0 0 1-1.228-2.123v-8.03c0-.893.461-1.72 1.221-2.19l6.376-3.935a2.3 2.3 0 0 1 1.19-.347zm-4.7 3.844V18.37h2.69v-5.62h4.46v5.62h2.696V5.518h-2.696v4.681h-4.46V5.518Z'></path></svg></span> <abbr title='Hugo is a general purpose static site generator.'>Hugo</abbr>
|
||||
</div>
|
||||
<div>
|
||||
<span class="twemoji"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M20 19V7H4v12zm0-16a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2zm-7 14v-2h5v2zm-3.42-4L5.57 9H8.4l3.3 3.3c.39.39.39 1.03 0 1.42L8.42 17H5.59z"></path></svg></span> <abbr title='Bash or ZSH allow you to create shell scripts in the terminal to automate tasks and use packages.'>Shell</abbr>
|
||||
</div>
|
||||
</div> -->
|
||||
Loading…
Add table
Add a link
Reference in a new issue