fixes
This commit is contained in:
+24
-29
@@ -1,5 +1,4 @@
|
||||
import { practice } from "./data/practice.ts";
|
||||
import { projects, websites } from "./data/projects.ts";
|
||||
import { tools } from "./data/tools.ts";
|
||||
import { work } from "./data/work.ts";
|
||||
|
||||
@@ -81,13 +80,6 @@ const experience = work.flatMap((role, index) => [
|
||||
...(index < work.length - 1 ? [""] : []),
|
||||
]);
|
||||
|
||||
const projectList = [...projects, ...websites].flatMap((project, index, all) => [
|
||||
{ text: project.name.toUpperCase(), style: `${color.bold}${color.purple}` },
|
||||
{ text: `${project.type} · ${project.url}`, style: color.amber },
|
||||
{ text: project.description, style: color.text },
|
||||
...(index < all.length - 1 ? [""] : []),
|
||||
]);
|
||||
|
||||
const competencies = practice.flatMap((area, index) => [
|
||||
{ text: area.title.toUpperCase(), style: `${color.bold}${color.purple}` },
|
||||
{ text: area.body, style: color.text },
|
||||
@@ -101,28 +93,34 @@ const proficiencyOrder = [
|
||||
"Familiar",
|
||||
] as const;
|
||||
|
||||
const skills = proficiencyOrder.flatMap((level, index) => {
|
||||
const names = tools
|
||||
.filter((tool) => tool.proficiency === level)
|
||||
.map((tool) => tool.name)
|
||||
.join(" · ");
|
||||
return [
|
||||
{ text: level.toUpperCase(), style: `${color.bold}${color.purple}` },
|
||||
{ text: names, style: color.text },
|
||||
...(index < proficiencyOrder.length - 1 ? [""] : []),
|
||||
];
|
||||
});
|
||||
const baseTools = tools.filter((tool) => !tool.extra);
|
||||
|
||||
const skills = proficiencyOrder
|
||||
.map((level) => ({
|
||||
level,
|
||||
names: baseTools
|
||||
.filter((tool) => tool.proficiency === level)
|
||||
.map((tool) => tool.name)
|
||||
.join(" · "),
|
||||
}))
|
||||
.filter((group) => group.names)
|
||||
.flatMap((group, index, all) => [
|
||||
{ text: group.level.toUpperCase(), style: `${color.bold}${color.purple}` },
|
||||
{ text: group.names, style: color.text },
|
||||
...(index < all.length - 1 ? [""] : []),
|
||||
]);
|
||||
|
||||
const page = `
|
||||
${color.purple} ▄████▄ ▄▄▄▄▄▄▄▄
|
||||
▄██▀▀██▄ ███▀▀▀███ ${color.bold}${color.text}OWEN RUMMAGE${color.reset}
|
||||
${color.purple} ███ ███ ███▄▄▄██▀ ${color.amber}Systems engineer${color.reset}
|
||||
${color.purple} ███ ███ ███▄▄▄██▀ ${color.amber}IT support professional${color.reset}
|
||||
${color.purple} ▀██▄▄██▀ ███ ▀██▄ ${color.muted}Nashville, Tennessee${color.reset}
|
||||
${color.purple} ▀████▀ ███ ███
|
||||
${color.border} ──────────────────────── ${color.green}Linux · networks · cloud · automation${color.reset}
|
||||
${color.border} ──────────────────────── ${color.green}Helpdesk · networking · endpoint deployment${color.reset}
|
||||
|
||||
${color.text} Systems engineer specializing in Linux infrastructure, network engineering,
|
||||
cloud platforms, and automation. Based in Nashville, Tennessee.${color.reset}
|
||||
${color.text} Hands-on IT support professional with experience handling support calls,
|
||||
troubleshooting computers and connectivity, deploying endpoints, documenting
|
||||
work, and helping users with different levels of technical comfort.${color.reset}
|
||||
|
||||
${hyperlink("hello@rummage.cc", "mailto:hello@rummage.cc")} ${hyperlink("github.com/owenrummage", "https://github.com/owenrummage")}
|
||||
${hyperlink("linkedin.com/in/orummage", "https://linkedin.com/in/orummage")} ${hyperlink("rummage.cc", "https://rummage.cc")}
|
||||
@@ -130,19 +128,16 @@ ${color.text} Systems engineer specializing in Linux infrastructure, network en
|
||||
${section("EXPERIENCE", experience)}
|
||||
|
||||
${section("EDUCATION", [
|
||||
{ text: "ASSOCIATE OF APPLIED SCIENCE IN COMPUTER INFORMATION TECHNOLOGY", style: `${color.bold}${color.purple}` },
|
||||
{ text: "Nashville State Community College · 2023 - 2026", style: color.amber },
|
||||
{ text: "Concentration in Systems Administration and Management. Graduated May 2026.", style: color.text },
|
||||
{ text: "A.A.S, COMPUTER INFORMATION TECHNOLOGY - SYSTEMS ADMINISTRATION", style: `${color.bold}${color.purple}` },
|
||||
{ text: "Nashville State Community College", style: color.amber },
|
||||
])}
|
||||
|
||||
${section("PROJECTS", projectList)}
|
||||
|
||||
${section("CORE COMPETENCIES", competencies)}
|
||||
|
||||
${section("TECHNICAL SKILLS", skills)}
|
||||
|
||||
${section("APPROACH", [
|
||||
{ text: "I build systems that can be understood and maintained by someone other than me.", style: `${color.bold}${color.green}` },
|
||||
{ text: "Good systems should be easy to understand, maintain, and use.", style: `${color.bold}${color.green}` },
|
||||
])}
|
||||
|
||||
${color.muted} $${color.reset} ${color.text}curl rummage.cc${color.reset} ${color.muted}Get this page${color.reset}
|
||||
|
||||
+8
-12
@@ -5,23 +5,19 @@ export type Area = {
|
||||
|
||||
export const practice: Area[] = [
|
||||
{
|
||||
title: 'Network and systems administration',
|
||||
body: 'Design and maintain business networks, Linux servers, mail systems, web servers, and databases. Configure monitoring, backups, and access controls.',
|
||||
title: 'Help desk and customer support',
|
||||
body: 'Handle incoming support calls and tickets, gather clear information about symptoms, and communicate solutions to users with different levels of technical comfort.',
|
||||
},
|
||||
{
|
||||
title: 'IT support and endpoint management',
|
||||
body: 'Support Windows, macOS, and Linux endpoints. Diagnose hardware and software problems, deploy system images, and maintain device inventories.',
|
||||
title: 'Endpoint deployment and management',
|
||||
body: 'Deploy and image Windows endpoints, support Windows, macOS, and ChromeOS devices, run hardware diagnostics, and maintain device inventories.',
|
||||
},
|
||||
{
|
||||
title: 'Software development and automation',
|
||||
body: 'Write scripts and internal tools for operational workflows, CI/CD pipelines, infrastructure management, and system monitoring.',
|
||||
title: 'Network and connectivity troubleshooting',
|
||||
body: 'Diagnose Wi-Fi, routing, switching, VLAN, VPN, DNS, and DHCP issues for client and enterprise networks.',
|
||||
},
|
||||
{
|
||||
title: 'Web application development',
|
||||
body: 'Build responsive, accessible web applications and internal tools with TypeScript, Svelte, and Tailwind CSS.',
|
||||
},
|
||||
{
|
||||
title: 'Media systems and production',
|
||||
body: 'Operate live audiovisual systems and produce video and digital content for broadcast and client work.',
|
||||
title: 'Documentation and escalation',
|
||||
body: 'Document troubleshooting steps clearly and escalate issues that need additional attention, keeping work moving from intake through resolution.',
|
||||
},
|
||||
];
|
||||
|
||||
@@ -1,48 +0,0 @@
|
||||
export type Project = {
|
||||
name: string;
|
||||
url: string;
|
||||
type: string;
|
||||
description: string;
|
||||
};
|
||||
|
||||
export const projects: Project[] = [
|
||||
{
|
||||
name: "FOSSbench",
|
||||
url: "https://fossbench.net",
|
||||
type: "Platform",
|
||||
description: "An open CPU benchmarking platform for submitting, searching, and comparing results across processors, operating systems, and compilers.",
|
||||
},
|
||||
{
|
||||
name: "Wayviewer",
|
||||
url: "https://github.com/owenrummage/wayviewer",
|
||||
type: "Open source",
|
||||
description: "A lightweight VNC viewer for Wayland, written in C++ with SDL2 and libvncclient. Includes command-line options and a graphical connection launcher.",
|
||||
},
|
||||
{
|
||||
name: "ipinfo",
|
||||
url: "https://github.com/owenrummage/ipinfo",
|
||||
type: "Open source",
|
||||
description: "A Go command-line application for looking up and displaying IP address information.",
|
||||
},
|
||||
{
|
||||
name: "Wii-Linux",
|
||||
url: "https://wii-linux.org",
|
||||
type: "Infrastructure",
|
||||
description: "Provide hosted compute and infrastructure sponsorship through NixLabs for the modern Wii-Linux project, with occasional contributions to project work.",
|
||||
},
|
||||
];
|
||||
|
||||
export const websites: Project[] = [
|
||||
{
|
||||
name: "NixLabs Networks",
|
||||
url: "https://nixlabs.dev",
|
||||
type: "Website",
|
||||
description: "Designed and built the company website for NixLabs Networks, covering its managed IT, helpdesk, hosting, and infrastructure services.",
|
||||
},
|
||||
{
|
||||
name: "Simple Logic IT Solutions",
|
||||
url: "https://simplelogic.net",
|
||||
type: "Website",
|
||||
description: "Designed and built the service website for Simple Logic IT Solutions, including its managed IT, on-site support, service areas, and client portal access.",
|
||||
},
|
||||
];
|
||||
+53
-35
@@ -1,47 +1,65 @@
|
||||
export type Skill = {
|
||||
name: string;
|
||||
proficiency: "Advanced" | "Proficient" | "Working knowledge" | "Familiar";
|
||||
// Extra skills from past systems/network engineering work, hidden behind
|
||||
// the "show more" toggle instead of shown by default.
|
||||
extra?: boolean;
|
||||
};
|
||||
|
||||
export const tools: Skill[] = [
|
||||
{ name: "Linux", proficiency: "Advanced" },
|
||||
{ name: "Windows", proficiency: "Proficient" },
|
||||
{ name: "Windows 10/11", proficiency: "Advanced" },
|
||||
{ name: "macOS", proficiency: "Proficient" },
|
||||
{ name: "Bash", proficiency: "Working knowledge" },
|
||||
{ name: "Python", proficiency: "Proficient" },
|
||||
{ name: "TypeScript", proficiency: "Proficient" },
|
||||
{ name: "Svelte", proficiency: "Proficient" },
|
||||
{ name: "Tailwind CSS", proficiency: "Working knowledge" },
|
||||
{ name: "NGINX", proficiency: "Proficient" },
|
||||
{ name: "Cisco", proficiency: "Proficient" },
|
||||
{ name: "Ubiquiti", proficiency: "Proficient" },
|
||||
{ name: "Juniper", proficiency: "Working knowledge" },
|
||||
{ name: "Aruba", proficiency: "Familiar" },
|
||||
{ name: "MikroTik", proficiency: "Familiar" },
|
||||
{ name: "BGP", proficiency: "Working knowledge" },
|
||||
{ name: "OSPF", proficiency: "Working knowledge" },
|
||||
{ name: "ChromeOS", proficiency: "Working knowledge" },
|
||||
{ name: "Linux", proficiency: "Working knowledge" },
|
||||
{ name: "Google Workspace", proficiency: "Proficient" },
|
||||
{ name: "Microsoft 365", proficiency: "Proficient" },
|
||||
{ name: "Azure", proficiency: "Working knowledge" },
|
||||
{ name: "Intune", proficiency: "Working knowledge" },
|
||||
{ name: "Connectivity Troubleshooting", proficiency: "Advanced" },
|
||||
{ name: "Wi-Fi", proficiency: "Advanced" },
|
||||
{ name: "Routing", proficiency: "Proficient" },
|
||||
{ name: "Switching", proficiency: "Proficient" },
|
||||
{ name: "VLANs", proficiency: "Proficient" },
|
||||
{ name: "VPNs", proficiency: "Proficient" },
|
||||
{ name: "DNS", proficiency: "Proficient" },
|
||||
{ name: "DHCP", proficiency: "Proficient" },
|
||||
{ name: "Proxmox", proficiency: "Proficient" },
|
||||
{ name: "VMware", proficiency: "Working knowledge" },
|
||||
{ name: "Hyper-V", proficiency: "Familiar" },
|
||||
{ name: "KVM", proficiency: "Working knowledge" },
|
||||
{ name: "Docker", proficiency: "Proficient" },
|
||||
{ name: "Kubernetes", proficiency: "Working knowledge" },
|
||||
{ name: "Cloudflare", proficiency: "Proficient" },
|
||||
{ name: "Azure", proficiency: "Working knowledge" },
|
||||
{ name: "AWS", proficiency: "Working knowledge" },
|
||||
{ name: "Ansible", proficiency: "Working knowledge" },
|
||||
{ name: "Terraform", proficiency: "Working knowledge" },
|
||||
{ name: "GitHub Actions", proficiency: "Proficient" },
|
||||
{ name: "Git", proficiency: "Working knowledge" },
|
||||
{ name: "GitHub", proficiency: "Advanced" },
|
||||
{ name: "Grafana", proficiency: "Working knowledge" },
|
||||
{ name: "Prometheus", proficiency: "Working knowledge" },
|
||||
{ name: "Zabbix", proficiency: "Working knowledge" },
|
||||
{ name: "pfSense", proficiency: "Proficient" },
|
||||
{ name: "OPNsense", proficiency: "Proficient" },
|
||||
{ name: "Google Workspace", proficiency: "Proficient" },
|
||||
{ name: "IPv4/IPv6", proficiency: "Working knowledge" },
|
||||
{ name: "PC Deployment", proficiency: "Advanced" },
|
||||
{ name: "Hardware Diagnostics", proficiency: "Advanced" },
|
||||
{ name: "Printers", proficiency: "Proficient" },
|
||||
{ name: "Peripherals", proficiency: "Proficient" },
|
||||
{ name: "Account Access", proficiency: "Proficient" },
|
||||
{ name: "Remote Support", proficiency: "Advanced" },
|
||||
|
||||
{ name: "Bash", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "Python", proficiency: "Proficient", extra: true },
|
||||
{ name: "TypeScript", proficiency: "Proficient", extra: true },
|
||||
{ name: "Svelte", proficiency: "Proficient", extra: true },
|
||||
{ name: "Tailwind CSS", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "NGINX", proficiency: "Proficient", extra: true },
|
||||
{ name: "Cisco", proficiency: "Proficient", extra: true },
|
||||
{ name: "Ubiquiti", proficiency: "Proficient", extra: true },
|
||||
{ name: "Juniper", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "Aruba", proficiency: "Familiar", extra: true },
|
||||
{ name: "MikroTik", proficiency: "Familiar", extra: true },
|
||||
{ name: "BGP", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "OSPF", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "Proxmox", proficiency: "Proficient", extra: true },
|
||||
{ name: "VMware", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "Hyper-V", proficiency: "Familiar", extra: true },
|
||||
{ name: "KVM", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "Docker", proficiency: "Proficient", extra: true },
|
||||
{ name: "Kubernetes", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "Cloudflare", proficiency: "Proficient", extra: true },
|
||||
{ name: "AWS", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "Ansible", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "Terraform", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "GitHub Actions", proficiency: "Proficient", extra: true },
|
||||
{ name: "Git", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "GitHub", proficiency: "Advanced", extra: true },
|
||||
{ name: "Grafana", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "Prometheus", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "Zabbix", proficiency: "Working knowledge", extra: true },
|
||||
{ name: "pfSense", proficiency: "Proficient", extra: true },
|
||||
{ name: "OPNsense", proficiency: "Proficient", extra: true },
|
||||
];
|
||||
|
||||
+13
-25
@@ -8,39 +8,27 @@ export type Role = {
|
||||
|
||||
export const work: Role[] = [
|
||||
{
|
||||
title: "Owner & Operator",
|
||||
company: "NixLabs Networks",
|
||||
years: "2021 - 2024",
|
||||
description: "Designed and maintained client network infrastructure, hosting platforms, and Linux systems. Wrote Bash and Python automation for routine infrastructure work, and supported production servers through monitoring, troubleshooting, and system administration.",
|
||||
},
|
||||
{
|
||||
title: "Technical Specialist",
|
||||
company: "Computer House · Part-time",
|
||||
years: "Jun - Aug 2023",
|
||||
description: "Diagnosed and repaired customer computers with hardware and software problems. Configured networks and servers for contract clients, handled storefront sales, and managed daily shop operations.",
|
||||
title: "IT Support Helpdesk",
|
||||
company: "Schwartz Networks LLC",
|
||||
years: "Aug 2023 - Jul 2025",
|
||||
description: "Handled incoming support calls from ISP clients and gathered clear information about service, device, and connectivity symptoms. Checked client-side equipment, connection status, and common configuration problems, documented troubleshooting steps, and escalated as needed.",
|
||||
},
|
||||
{
|
||||
title: "IT Support Intern",
|
||||
company: "Metro Nashville Public Schools · Internship",
|
||||
company: "Metro Nashville Public Schools",
|
||||
years: "Jan - Jul 2023",
|
||||
description: "Deployed Windows computers with Windows Deployment Services (WDS). Resolved hardware and software problems for staff and students, tracked district devices, and prepared equipment for technology rollouts.",
|
||||
description: "Supported Windows 10 endpoints, including computer deployment, WDS imaging, hardware diagnostics, and user assistance. Resolved classroom and staff technology issues while working within an enterprise network and server environment.",
|
||||
},
|
||||
{
|
||||
title: "System Architect",
|
||||
company: "Fyra Labs · Part-time",
|
||||
years: "Mar - Oct 2022",
|
||||
description: "Designed and maintained infrastructure for hosted services. Configured Cloudflare for DNS, traffic routing, and application security, then implemented load balancing to distribute traffic across services.",
|
||||
title: "Independent IT Contracting",
|
||||
company: "College Experience",
|
||||
years: "During college",
|
||||
description: "Provided direct computer, account, application, and network support for local clients while completing college. Transitioning the remaining work to a trusted friend who recently entered college in order to focus on a long-term team role.",
|
||||
},
|
||||
{
|
||||
title: "Technical Specialist",
|
||||
company: "Computer House Inc · Seasonal",
|
||||
years: "Jun - Aug 2022",
|
||||
description: "Troubleshot and repaired desktops, laptops, and related hardware. Recommended systems, replacement parts, and upgrades to customers, prepared new computers for sale, and supported storefront operations.",
|
||||
},
|
||||
{
|
||||
title: "Software Engineer",
|
||||
company: "Innatical · Part-time",
|
||||
years: "Apr - Oct 2021",
|
||||
description: "Built and maintained TypeScript back-end services, APIs, and server-side application features. Diagnosed bugs, reviewed code changes, and tested releases with a remote development team.",
|
||||
company: "Computer House",
|
||||
years: "Apr - Aug 2022",
|
||||
description: "Diagnosed and repaired computers, resolved hardware and software problems, and configured replacement systems. Explained findings and recommendations clearly, answered customer questions, and kept jobs moving from intake through completion.",
|
||||
},
|
||||
];
|
||||
|
||||
+19
-45
@@ -3,10 +3,9 @@ import Layout from "../layouts/Layout.astro";
|
||||
import { work } from "../data/work";
|
||||
import { practice } from "../data/practice";
|
||||
import { tools } from "../data/tools";
|
||||
import { projects, websites } from "../data/projects";
|
||||
|
||||
const description =
|
||||
"Systems engineer specializing in Linux infrastructure, network engineering, cloud platforms, and automation.";
|
||||
"Hands-on IT support professional with experience in helpdesk support, endpoint deployment, and network troubleshooting.";
|
||||
---
|
||||
|
||||
<script>
|
||||
@@ -23,9 +22,10 @@ const description =
|
||||
</button>
|
||||
</h1>
|
||||
<p class="hero__statement">
|
||||
Systems engineer specializing in Linux infrastructure, network
|
||||
engineering, cloud platforms, and automation. Based in
|
||||
Nashville, Tennessee.
|
||||
Hands-on IT support professional with experience handling
|
||||
support calls, troubleshooting computers and connectivity,
|
||||
deploying endpoints, and helping users with different levels
|
||||
of technical comfort. Based in Nashville, Tennessee.
|
||||
</p>
|
||||
<p class="hero__contact">
|
||||
<a class="link" href="mailto:hello@rummage.cc"
|
||||
@@ -83,56 +83,22 @@ const description =
|
||||
<h2 class="section-heading" id="education-heading">Education</h2>
|
||||
<article class="role">
|
||||
<div class="role__meta">
|
||||
<span class="role__years">2023 - 2026</span>
|
||||
<span class="role__years">A.A.S.</span>
|
||||
</div>
|
||||
<div class="role__body">
|
||||
<h3 class="role__title">
|
||||
Associate of Applied Science in Computer Information
|
||||
Technology
|
||||
Computer Information Technology - Systems
|
||||
Administration
|
||||
</h3>
|
||||
<p class="role__company">
|
||||
Nashville State Community College
|
||||
</p>
|
||||
<p class="role__description">
|
||||
Concentration in Systems Administration and Management.
|
||||
Graduated May 2026.
|
||||
</p>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
<hr class="rule" />
|
||||
|
||||
<section class="projects" aria-labelledby="projects-heading">
|
||||
<h2 class="section-heading" id="projects-heading">Projects</h2>
|
||||
<div class="project-list">
|
||||
{
|
||||
[...projects, ...websites].map((project) => (
|
||||
<article class="project">
|
||||
<div class="project__meta">{project.type}</div>
|
||||
<div class="project__body">
|
||||
<h3 class="project__title">
|
||||
<a
|
||||
class="link link--ink"
|
||||
href={project.url}
|
||||
rel="noopener"
|
||||
target="_blank"
|
||||
>
|
||||
{project.name}
|
||||
</a>
|
||||
</h3>
|
||||
<p class="project__description">
|
||||
{project.description}
|
||||
</p>
|
||||
</div>
|
||||
</article>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<hr class="rule" />
|
||||
|
||||
<section class="practice" aria-labelledby="competencies-heading">
|
||||
<h2 class="section-heading" id="competencies-heading">
|
||||
Core competencies
|
||||
@@ -153,8 +119,16 @@ const description =
|
||||
<section class="skills" aria-labelledby="skills-heading">
|
||||
<h2 class="section-heading" id="skills-heading">
|
||||
Technical skills
|
||||
<button
|
||||
class="skills__toggle"
|
||||
type="button"
|
||||
aria-expanded="false"
|
||||
data-skills-toggle
|
||||
>
|
||||
Show more
|
||||
</button>
|
||||
</h2>
|
||||
<div class="toolset">
|
||||
<div class="toolset" data-toolset>
|
||||
<div class="toolset__meta" aria-hidden="true"></div>
|
||||
<ul class="toolset__list">
|
||||
{
|
||||
@@ -162,6 +136,7 @@ const description =
|
||||
<li
|
||||
data-skill={skill.name}
|
||||
data-proficiency={skill.proficiency}
|
||||
data-extra={skill.extra ? "true" : undefined}
|
||||
tabindex="0"
|
||||
aria-label={`${skill.name}: ${skill.proficiency}`}
|
||||
>
|
||||
@@ -181,8 +156,7 @@ const description =
|
||||
aria-label="Show another professional principle"
|
||||
data-motto-play
|
||||
>
|
||||
I build systems that can be understood and maintained by
|
||||
someone other than me.
|
||||
Good systems should be easy to understand, maintain, and use.
|
||||
</button>
|
||||
</aside>
|
||||
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
const mottos = [
|
||||
"I build systems that can be understood and maintained by someone other than me.",
|
||||
"Reliable infrastructure starts with clear ownership and clear documentation.",
|
||||
"Automation should reduce routine work without hiding how the system operates.",
|
||||
"Fix the cause, document the change, and leave the system easier to support.",
|
||||
"Good systems should be easy to understand, maintain, and use.",
|
||||
"I would rather do something right the first time than work around it later.",
|
||||
"Knowing how things work underneath makes it easier to solve problems when they break.",
|
||||
"If I have to do something repeatedly, I am probably going to find a way to automate it.",
|
||||
"There is always something new to learn and usually a better way to do something.",
|
||||
];
|
||||
|
||||
const glyphs = "01#@$%&*+<>/\\";
|
||||
@@ -66,6 +67,23 @@ function initMotto(): void {
|
||||
});
|
||||
}
|
||||
|
||||
function initSkillsToggle(): void {
|
||||
const button = document.querySelector<HTMLButtonElement>("[data-skills-toggle]");
|
||||
const toolset = document.querySelector<HTMLElement>("[data-toolset]");
|
||||
if (!button || !toolset) return;
|
||||
|
||||
button.addEventListener("click", () => {
|
||||
const expanded = toolset.hasAttribute("data-show-extra");
|
||||
if (expanded) {
|
||||
toolset.removeAttribute("data-show-extra");
|
||||
} else {
|
||||
toolset.setAttribute("data-show-extra", "");
|
||||
}
|
||||
button.setAttribute("aria-expanded", String(!expanded));
|
||||
button.textContent = expanded ? "Show more" : "Show less";
|
||||
});
|
||||
}
|
||||
|
||||
function celebrate(): void {
|
||||
const layer = document.createElement("div");
|
||||
layer.className = "play-layer";
|
||||
@@ -117,6 +135,7 @@ function init(): void {
|
||||
initName();
|
||||
initRoles();
|
||||
initMotto();
|
||||
initSkillsToggle();
|
||||
initSecrets();
|
||||
}
|
||||
|
||||
|
||||
@@ -556,6 +556,31 @@ button {
|
||||
.skills {
|
||||
margin-top: clamp(2.75rem, 5.5vw, 4rem);
|
||||
}
|
||||
.skills__toggle {
|
||||
font-family: var(--font-mono);
|
||||
font-size: var(--fs-meta);
|
||||
letter-spacing: var(--tracking-mono);
|
||||
color: var(--color-muted);
|
||||
background: none;
|
||||
border: 1px solid var(--color-rule);
|
||||
border-radius: 3px;
|
||||
padding: 0.2em 0.6em;
|
||||
margin-left: 0.75em;
|
||||
cursor: pointer;
|
||||
vertical-align: middle;
|
||||
transition: color 160ms ease, border-color 160ms ease;
|
||||
}
|
||||
.skills__toggle:hover,
|
||||
.skills__toggle:focus-visible {
|
||||
color: var(--color-ink);
|
||||
border-color: var(--color-ink-soft);
|
||||
}
|
||||
.toolset__list li[data-extra="true"] {
|
||||
display: none;
|
||||
}
|
||||
.toolset[data-show-extra] .toolset__list li[data-extra="true"] {
|
||||
display: inline-flex;
|
||||
}
|
||||
.toolset__meta {
|
||||
font-family: var(--font-mono);
|
||||
font-size: var(--fs-meta);
|
||||
|
||||
Reference in New Issue
Block a user