diff --git a/.cspell.json b/.cspell.json index 37f33ab..df81fe6 100644 --- a/.cspell.json +++ b/.cspell.json @@ -14,5 +14,29 @@ "/^```[\\s\\S]*?^```/gm", "/\\w*\\_\\w*/g" ], - "words": ["withinfocus"] + "words": [ + "withinfocus", + "dasharray", + "exfiltration", + "favicons", + "gatech", + "imobile", + "Inkscape", + "linecap", + "linejoin", + "Logomark", + "msapplication", + "mstile", + "noopener", + "OHMER", + "rarr", + "SDLC", + "Statiq", + "stylesheet", + "throughline", + "TSYS", + "nums", + "schooler", + "XNYTNNK" + ] } diff --git a/.stylelintrc.json b/.stylelintrc.json index 2e47a20..1ebcc22 100644 --- a/.stylelintrc.json +++ b/.stylelintrc.json @@ -1,5 +1,6 @@ { - "rules": { - "at-rule-no-unknown": null - } + "customSyntax": "postcss-scss", + "rules": { + "at-rule-no-unknown": null + } } diff --git a/README.md b/README.md index d7b3b61..b2f27b5 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,11 @@ # withinfocus.com -Website for withinfocus.com. +Personal site for Matt Bishop. Statiq.Web deployed to GitHub Pages. + +## Local development + +```bash +dotnet run # build the site into ./output +dotnet run -- preview # build and preview locally (if enabled) +dotnet run -- deploy # build and deploy (used by CI) +``` diff --git a/input/404.cshtml b/input/404.cshtml index e6bcaf0..3bbb3be 100644 --- a/input/404.cshtml +++ b/input/404.cshtml @@ -1,13 +1,15 @@ Title: "error" +NavKey: "404" IncludeInSitemap: false +Description: "The page you were looking for isn't here." --- -
-
-
-

Oh No!

-

- Seems you came to this page in error. -

-
+
+
+ 404 +

This page doesn't exist.

+

+ Either you followed a stale link or I moved a page while you weren't + looking. Try the homepage. +

-
+ diff --git a/input/Career.cshtml b/input/Career.cshtml new file mode 100644 index 0000000..8767f8e --- /dev/null +++ b/input/Career.cshtml @@ -0,0 +1,100 @@ +Title: "career" +NavKey: "career" +Description: "Matt Bishop's career -- Georgia Tech, iMobile3, Olo, and the cybersecurity practice he runs today through withinfocus, Inc." +--- +
+
+ Career +

Twenty years of building.

+

+ From co-founding a payments company to scaling engineering through an IPO, + and now running a cybersecurity practice. One throughline: build systems that + people can trust, and the teams that keep them that way. +

+

+ Full history on LinkedIn + Get in touch +

+
+
+ +
+
+

Georgia Tech

+

+ I graduated from Georgia Tech in 2006 + with a BS in Computer Engineering (with high honor). I serve on the Georgia + Tech Alumni Association Board of Trustees (2024 - 2027). +

+
+ +
+ +
+
+

iMobile3

+

+ I co-founded iMobile3, a mobile payments and loyalty company, + in 2008 and served as CTO through acquisition by TSYS in 2018. We built a + white-label POS and loyalty platform running across thousands of merchants, + which meant PCI DSS, tokenization, hardware terminals, and a level of paranoia + about failure modes that I still carry into every engagement. After the + acquisition I stayed on through the Global Payments merger as Director of + Platform Services, scaling the Vital POS platform across tens of thousands of + concurrent devices. +

+
+ +
+ +
+
+ Startups teach you how to build something from nothing. + Public companies teach you not to break it. Both lessons matter. +
+
+ +
+
+

Olo

+

+ I joined Olo as an engineering manager in + 2019 and led the Guest Engagement group -- loyalty, SSO, and the platforms + that sat under millions of daily orders for 500+ restaurant brands. We took + the company public on the NYSE in March 2021, which is its own kind of + education: compliance, incident response, performance engineering, hiring, + and roadmap tension all change when the answer sheet is public. +

+
+ +
+ +
+
+ Going public doesn't change the code. It changes everyone watching it. +
+
+ +
+
+

Now: withinfocus, Inc.

+

+ I run withinfocus, Inc., a software consulting, + cybersecurity, and AI adoption practice. The work spans security architecture, + engineering leadership, and practical AI integration -- which in modern + engineering organizations is the same conversation three different ways. + Alongside that, I spend time inside large security and financial organizations + on architecture, platform modernization, and the engineering practices that + have to hold up at scale. +

+
+ +
diff --git a/input/Index.cshtml b/input/Index.cshtml index 6328820..ef624c3 100644 --- a/input/Index.cshtml +++ b/input/Index.cshtml @@ -1,72 +1,67 @@ Title: "home" +NavKey: "home" +Description: "Matt Bishop -- technology leader. Software consulting, cybersecurity, and AI adoption practice, based in Jacksonville." --- -
-
-
-

Hi, I'm Matt.

-

- I'm a technology advisor and architect providing strategic guidance to enterprise organizations on - platform modernization, security architecture, and engineering leadership. Besides work I have a - pretty serious Jeep hobby, practice yoga, play a lot of ultimate, - and snap a few photos from time to time. -

-
-
- Me -
-
-
-
-
-

Career

-

- Growing up in New Jersey and Florida I graduated with an IB diploma from Stanton College Preparatory - School in 2003. I headed off to the Georgia Institute of Technology - and got out with a BS in Computer - Engineering in 2006, magna cum laude. +

+
+ Technology Leader +

Hi, I'm Matt.

+

+ I spend my time working with engineering organizations, classic cars and Jeeps, + yoga students, and robotics teams.

- I co-founded and was a partner / owner at iMobile3, a mobile payments company. We were acquired by TSYS, now - Global - Payments, in June 2018. + Professionally, I lead withinfocus, Inc., a software + consulting, cybersecurity, and AI adoption practice. Earlier I co-founded a + payments company called iMobile3, led it through + acquisition, then helped scale engineering at Olo + through its 2021 IPO. Along the way I've done architecture and leadership + work inside large security and financial organizations.

-

After a successful transition I left Global and worked as an engineering manager at Olo using my knowledge of customer loyalty and payments processing. Olo - successfully went public in March 2021.

-

My resumé is available on LinkedIn.

-
-
-

Hobbies

-

I have always enjoyed photography (mostly portraits and landscapes) and maintain a small portfolio. I have helped manage the image archives of - major publications and sports teams and spent a number of years on fields and courts for club and college - sports organizations.

-

My Jeep, a custom rock crawler based on a 2004 Wrangler, has been a long-term - project.

-

I live in a home built in the 1890s with my family in historic Springfield along with some backyard - chickens and a French bulldog.

- I own and operate a small classic auto restoration and service shop called Bishop Classic Motors, also in Springfield. My wife - Amanda and I, both certified teachers and practitioners for over a decade own, - manage, and teach at - Phoenix Power Yoga in Neptune Beach, FL. + I studied Computer Engineering at + Georgia Tech and serve on the + Georgia Tech Alumni Association Board of Trustees. Outside of work I run + Bishop Classic Motors, + mentor FRC Team 86 Resistance, and co-own + Phoenix Power Yoga with my wife. +

+

+ Read the full story + Get in touch

-
+ +
+ -
+ diff --git a/input/Life.cshtml b/input/Life.cshtml new file mode 100644 index 0000000..af3fd20 --- /dev/null +++ b/input/Life.cshtml @@ -0,0 +1,149 @@ +Title: "life" +NavKey: "life" +Description: "Outside of withinfocus -- Project Yellow Jacket, Bishop Classic Motors, FRC Team 86 Resistance, Phoenix Power Yoga, and life in Jacksonville." +--- +
+
+ Life +

Everything I build that isn't code.

+

+ A Jeep built over decades, a classic-car shop, a robotics team, a yoga + studio, a house from the 1890s, two French bulldogs, and a Jacksonville + neighborhood worth showing up for. +

+
+
+ +
+
+

Phoenix Power Yoga

+

+ My wife and I co-own and manage + Phoenix Power Yoga. + We are both RYT-200 certified and have been practicing and teaching for over + a decade. Running a studio is a different species of work from software, + which is part of why I like it -- it keeps me honest about what running a + small business actually demands. +

+
+ +
+ +
+
+ The mental strength and calmness I find through yoga carry into everything + else -- the work, the shop, the mentoring, all of it. +
+
+ +
+
+

Project Yellow Jacket

+

+ My Jeep -- a custom rock crawler built on a 2004 Wrangler -- is a long-term + project I've been chipping away at for years. Suspension, axles, drivetrain, + body, electronics: almost nothing on it is stock anymore. The build lives on + Pirate 4x4, + where I post updates when I remember to. +

+

+ I love the Jeep because it never lets me forget what a tolerance is. Code + gives you a little latitude. Mechanical systems do not. A quarter-inch off + is a new problem. +

+
+
+ Project Yellow Jacket +
+
+ +
+
+ Code gives you latitude. Metal does not. A quarter-inch off is a new problem. +
+
+ +
+
+

Bishop Classic Motors

+

+ I own and operate Bishop Classic Motors, + a small classic auto restoration and service shop in Jacksonville. We work on + the kinds of cars that deserve to stay on the road, for the kinds of owners + who want the work done properly. The shop is a practical extension of + everything I like about the Jeep: old metal, good tolerances, patience. +

+
+ +
+ +
+
+

FRC Team 86 Resistance

+

+ I mentor Team 86 Resistance, an + FRC (FIRST Robotics Competition) + team in Jacksonville. That means a lot of evenings and weekends in a shop + with students, whiteboards, 3D printers, and the cheerful panic of a six-week + build season. +

+

+ FIRST is as close to real engineering as a high schooler can get. A new game + drops in January; teams have roughly six weeks to design, build, program, and + iterate a competition-class robot, then show up to a regional with dozens of + other teams doing the same thing. It's constrained, adversarial, + deadline-driven, and collaborative all at once -- which is to say, it teaches + the exact skills a good engineer spends a career refining. +

+
+
+ Team 86 Resistance robot OHMER26 +
+
+ +
+
+ A robotics season is every engineering lesson compressed into six weeks. +
+
+ +
+
+

Jacksonville

+

+ My family lives in a historic neighborhood in Jacksonville, Florida -- + the kind of place that is now really thriving, full of turn-of-the-century + architecture and neighbors who care about it. I also sit on IT or other + advisory boards for a couple of local schools, which is its own kind of + long game. +

+
+
+ Historic neighborhood in Jacksonville +
+
+ +
+
+

Sports & event photography

+

+ Before any of this I spent years as a sports and event photographer -- + on fields and courts shooting club and college athletics, covering live + events, and helping manage image archives for major publications and + sports organizations. The work taught me how to read a scene quickly, + anticipate what's about to happen, and deliver under a deadline -- skills + that turned out to transfer surprisingly well to engineering. +

+

+ I still shoot when I get the chance. A small selection lives at my + portfolio site. +

+
+
+ Sports photography +
+
diff --git a/input/Work.cshtml b/input/Work.cshtml index f915d22..23adce3 100644 --- a/input/Work.cshtml +++ b/input/Work.cshtml @@ -1,198 +1,137 @@ Title: "work" +NavKey: "work" Entity: "withinfocus, Inc" +Description: "withinfocus, Inc. -- a software consulting, cybersecurity, and AI adoption practice covering security architecture, engineering leadership, and practical AI integration." --- -
-
-
-

withinfocus, Inc.

-

- We provide executive-level technology consulting and strategic guidance to enterprise organizations, - specializing in cybersecurity solutions, cloud infrastructure strategy, and engineering - leadership. Partnering with companies to assess technical capabilities, optimize development processes, - and architect scalable systems for growth, we deliver comprehensive advisory services focused on - security, reliability, and organizational transformation. Drawing on experience spanning startup - co-founding, successful acquisitions, and scaling engineering teams through IPO, we help organizations - modernize their technology practices and build high-performing teams. -

-
-
-
- -
-
-

Core Services

+
+
+ withinfocus, Inc. +

Software consulting, cybersecurity, and AI adoption.

+

+ One practice, three intertwined disciplines. In modern engineering + organizations these are the same conversation from three angles. +

+

+ Start a conversation + See the background +

-
+ -
-
-

Engineering Leadership & Management

+
+
+

Engineering leadership

- Drawing from experience managing large development teams through acquisitions and IPOs, we provide - strategic engineering leadership for organizations at any stage. We help establish effective engineering - management practices, build scalable team structures, and create cultures of technical excellence. + Engineering organizations have predictable failure modes as they grow: + unclear ownership, on-call that punishes the people who care most, and a + gap between what leadership thinks the engineers are doing and what they + actually are. The work is operational clarity -- who decides, who is + accountable, and what "good" looks like when no one is watching.

-
    -
  • Interim CTO and VP Engineering services
  • -
  • Engineering organization design and scaling
  • -
  • Performance management and team development
  • -
  • Technical hiring and interview process design
  • -
  • Engineering metrics and operational excellence
  • -
-
-

Technical Architecture & Strategy

-

- We guide organizations through complex architectural decisions and technology modernization initiatives. - Our expertise spans payment systems, mobile platforms, SaaS applications, and cloud-native architectures, - ensuring your technology choices align with business objectives. -

+
+
Where I've done this
    -
  • System architecture design and review
  • -
  • Technology stack evaluation and selection
  • -
  • Legacy system modernization strategies
  • -
  • Cloud migration planning and execution
  • -
  • Security and compliance architecture
  • +
  • Co-founder & CTO -- iMobile3, zero to acquisition
  • +
  • Engineering manager -- Olo, through IPO
  • +
  • Director, Platform Services -- Global Payments
  • +
  • Embedded leadership -- large security and financial orgs
-
+
-
-
-

AI Integration & Engineering Optimization

+
+
+

Security

- We help engineering organizations harness AI and modern tooling to enhance productivity, improve code - quality, and accelerate delivery. From implementing AI-assisted development workflows to building custom - AI solutions, we guide teams through practical adoption that delivers measurable results. + My security foundation comes from payments -- PCI DSS wasn't an + afterthought at iMobile3, it was the shape of the system. That framing + (trust boundary, data flow, compensating control) still drives how I + design and review systems. I build security into the work, not around it:

    -
  • AI-assisted development workflow implementation
  • -
  • GitHub Copilot and AI coding tool adoption strategies
  • -
  • Custom AI agent development and integration
  • -
  • Code review automation and quality enhancement
  • -
  • Documentation generation and maintenance with AI
  • -
  • Developer productivity measurement and optimization
  • -
  • LLM integration for internal tools and platforms
  • +
  • Threat model where it matters. Auth, money, PII, and third-party trust -- not everything.
  • +
  • Secure SDLC engineers respect. Short feedback loops that earn their place.
  • +
  • Compliance as a side effect. Get the baseline right and SOC 2 / ISO 27001 document what is already true.
  • +
  • Incident preparedness. Runbooks rehearsed before they are needed.
-
-

Cybersecurity & Compliance

-

- Security is foundational to everything we build. With deep experience in payment systems and PCI - compliance, we help organizations establish robust security practices, meet regulatory requirements, - and build security-first engineering cultures that protect both the business and its customers. -

+
+
Frameworks & standards
    -
  • Security architecture review and threat modeling
  • -
  • PCI DSS compliance and payment security
  • -
  • Secure software development lifecycle (SDLC) implementation
  • -
  • Vulnerability management and remediation programs
  • -
  • Security training and awareness for development teams
  • -
  • Incident response planning and preparation
  • -
  • Third-party security assessment and vendor evaluation
  • +
  • PCI DSS -- scope design, compensating controls
  • +
  • SOC 2 / ISO 27001 -- posture, evidence, audit prep
  • +
  • Threat modeling -- STRIDE, data-flow driven
  • +
  • Secure SDLC -- pre-commit through production
  • +
  • Microsoft MVP -- Developer Security & Enterprise Security
-
+
+ +
+
+ A security program the engineering team doesn't believe in won't survive + contact with a deadline. +
+
-
-
-

Team Training & Development

+
+
+

AI adoption

- We build software development teams from the ground up and transform existing teams into high-performing - units. Our training programs cover modern development practices, workflows, and tools that enable teams - to deliver quality software with velocity and confidence. + I treat AI adoption as a security discipline, because it is one. Every + LLM, agent, or RAG pipeline introduces new trust boundaries and new + adversaries. The mature approach is to extend existing security practice + over those surfaces, not start a parallel program:

    -
  • Modern development workflow implementation
  • -
  • Git, code review, and CI/CD best practices
  • -
  • Agile and lean software development coaching
  • -
  • Test-driven development and quality practices
  • -
  • DevOps culture and toolchain adoption
  • -
  • Technical documentation and knowledge sharing
  • +
  • Model and agent threat modeling. Prompt injection, tool-use abuse, data exfiltration, supply-chain risk.
  • +
  • Data governance. What the model can see, return, and log -- and how that holds when agents are chained.
  • +
  • Guardrails teams adopt. Standard patterns and allow-listed tools so engineers don't improvise into a breach.
  • +
  • AI to accelerate security. Code review, threat modeling assistance, scanner triage -- humans in the loop.
-
-

Process Optimization & Advisorship

-

- Engineering management comes with unique challenges that evolve as organizations grow. We consult with - leadership teams to assess current processes, identify bottlenecks and inefficiencies, and implement - sustainable solutions that improve both delivery speed and team satisfaction. -

+
+
AI surfaces I work on
    -
  • Engineering process audits and recommendations
  • -
  • Sprint and release management optimization
  • -
  • On-call and incident management processes
  • -
  • Cross-functional collaboration improvement
  • -
  • Technical debt management strategies
  • -
  • Ongoing advisory and mentorship services
  • +
  • Agent workflows -- tool-use chains, MCP servers
  • +
  • RAG pipelines -- retrieval, grounding, eval
  • +
  • Policy & guardrails -- allow-lists, data boundaries
  • +
  • Executive strategy -- where AI helps, where it doesn't
-
+
-
-
-

Speaking & Workshops

-

- From intimate team sessions to large conference keynotes, we share practical insights on engineering - modernization, team building, and technology leadership. Our talks are grounded in real-world experience - from building, scaling, and transitioning engineering organizations. -

+
+
+

Where this shows up

    -
  • Conference keynotes and technical talks
  • -
  • Multi-day team workshops and training sessions
  • -
  • Executive briefings on engineering strategy
  • -
  • Custom content tailored to your organization
  • -
  • Panel participation and fireside chats
  • +
  • Security architecture reviews and threat modeling, including AI-touching features.
  • +
  • PCI DSS scope design, SOC 2 / ISO 27001 posture, and payment-security architecture.
  • +
  • Secure SDLC across distributed engineering organizations.
  • +
  • Engineering organization design, on-call, incident response, and SRE practices.
  • +
  • AI integration: agent workflows, MCP servers, RAG pipelines, eval harnesses -- with policy and guardrails.
-
-

Specialized Expertise

-

- We bring deep domain expertise in specific technology areas, particularly valuable for organizations - in fintech, payments, mobile applications, and customer-facing platforms seeking to leverage modern - technologies including AI while maintaining robust security postures. -

+
+
Engagement models
    -
  • Payment processing systems and PCI compliance
  • -
  • Mobile application development (iOS/Android)
  • -
  • Customer loyalty and rewards platforms
  • -
  • API design and integration architecture
  • -
  • SaaS platform development and scaling
  • -
  • AI/LLM integration and agent development
  • -
  • Secure coding practices and application security
  • -
  • Open source strategy and contribution
  • +
  • Embedded -- join the team for a quarter or longer
  • +
  • Advisory -- recurring sessions with leadership
  • +
  • Project -- scoped deliverable, fixed timeline
-
+
-
-
-
-

Why Work With Us

+
+
+

Get in touch

- We've been in the trenches. From co-founding a startup through acquisition, managing teams through an IPO, - and building engineering organizations from scratch, we understand the challenges you face because we've - navigated them ourselves. We provide practical, battle-tested guidance without the theoretical fluff. -

-

- Whether you need short-term technical leadership during a transition, want to level up your engineering - practices, or require ongoing strategic advisorship, we adapt our engagement model to fit your needs and - budget. + If any of this is the shape of the problem you're working on, I'd like to + hear about it.

-
-
-
- -
-
-

Get In Touch

- Ready to discuss how we can help your organization? Let's talk about your challenges and explore how our - experience can accelerate your success. + matt@@withinfocus.com

-
-
+ diff --git a/input/_Footer.cshtml b/input/_Footer.cshtml new file mode 100644 index 0000000..c9037fd --- /dev/null +++ b/input/_Footer.cshtml @@ -0,0 +1,68 @@ +@{ + string entity = Document.GetString("Entity", "Matthew Bishop"); +} + diff --git a/input/_Layout.cshtml b/input/_Layout.cshtml index d39b0c0..bd24271 100644 --- a/input/_Layout.cshtml +++ b/input/_Layout.cshtml @@ -1,4 +1,12 @@ - +@{ + string title = Document.GetString("Title", "home"); + string description = Document.GetString("Description", + "Matt Bishop -- technology leader. Software consulting, cybersecurity, and AI adoption, based in Jacksonville."); + string hero = Document.GetString("Hero", ""); + string parentPath = Document.Destination.Parent.FullPath.TrimStart('/'); + string canonical = "https://www.withinfocus.com/" + (string.IsNullOrEmpty(parentPath) ? "" : parentPath + "/"); +} + @@ -6,46 +14,58 @@ - withinfocus :: @Document.GetString("Title", "home") + withinfocus :: @title + - + + + + + + + @if (!string.IsNullOrEmpty(hero)) + { + + } + + + + + + + - - - - - - - + + + + + + + + - -
+ + @await Html.PartialAsync("_Nav.cshtml") + +
@RenderBody() +
-
-

- All content copyright 2004 - @DateTime.Now.Year @Document.GetString("Entity", "Matthew Bishop"). -

-
-
+ @await Html.PartialAsync("_Footer.cshtml") - - + gtag('config', 'G-V9XNYTNNK5'); + diff --git a/input/_Nav.cshtml b/input/_Nav.cshtml new file mode 100644 index 0000000..d6451c1 --- /dev/null +++ b/input/_Nav.cshtml @@ -0,0 +1,25 @@ +@{ + string navKey = Document.GetString("NavKey", "home"); + string Active(string key) => navKey == key ? " site-nav__link--active" : ""; +} + diff --git a/input/assets/css/_components.scss b/input/assets/css/_components.scss new file mode 100644 index 0000000..175f5db --- /dev/null +++ b/input/assets/css/_components.scss @@ -0,0 +1,643 @@ +// Site components: nav, hero, cards, timeline, callouts, footer. + +// ---------- Nav ---------- + +.site-nav { + position: sticky; + top: 0; + z-index: 50; + background: color-mix(in srgb, var(--color-ink) 82%, transparent); + backdrop-filter: saturate(140%) blur(10px); + -webkit-backdrop-filter: saturate(140%) blur(10px); + border-bottom: 1px solid + color-mix(in srgb, var(--color-steel) 25%, transparent); +} + +.site-nav__inner { + display: flex; + align-items: center; + justify-content: space-between; + gap: var(--space-3); + padding-block: var(--space-2); +} + +.site-nav__brand { + font-family: var(--font-serif); + font-size: var(--fs-md); + font-weight: 700; + letter-spacing: -0.01em; + color: var(--color-bone); + text-decoration: none; +} + +.site-nav__brand:hover { + color: var(--color-yellow); +} + +.site-nav__links { + list-style: none; + padding: 0; + margin: 0; + display: flex; + flex-wrap: wrap; + gap: var(--space-3); +} + +.site-nav__link { + font-size: var(--fs-sm); + font-weight: 500; + letter-spacing: 0.02em; + color: var(--color-text-dim); + text-decoration: none; + padding-block: var(--space-1); + border-bottom: 1px solid transparent; +} + +.site-nav__link:hover, +.site-nav__link:focus-visible { + color: var(--color-bone); +} + +.site-nav__link--active { + color: var(--color-yellow); + border-bottom-color: var(--color-yellow); +} + +// Mobile menu toggle (CSS-only via checkbox). +.site-nav__toggle-input { + position: absolute; + opacity: 0; + pointer-events: none; +} + +.site-nav__toggle { + display: inline-flex; + width: 40px; + height: 40px; + align-items: center; + justify-content: center; + border-radius: var(--radius-sm); + color: var(--color-bone); +} + +.site-nav__toggle:hover { + color: var(--color-yellow); +} + +@media (max-width: 719px) { + .site-nav__links { + display: none; + width: 100%; + flex-direction: column; + gap: var(--space-2); + padding-top: var(--space-2); + } + + .site-nav__toggle-input:checked ~ .site-nav__inner .site-nav__links { + display: flex; + } + + .site-nav__inner { + flex-wrap: wrap; + } +} + +@media (min-width: 720px) { + .site-nav__toggle { + display: none; + } +} + +// ---------- Hero ---------- + +.hero { + padding-block: var(--space-4) var(--space-3); + border-bottom: 1px solid + color-mix(in srgb, var(--color-steel) 20%, transparent); + margin-bottom: var(--space-4); +} + +.hero--with-image { + position: relative; + overflow: hidden; + background: + linear-gradient( + 180deg, + color-mix(in srgb, var(--color-ink) 35%, transparent) 0%, + color-mix(in srgb, var(--color-ink) 85%, transparent) 70%, + var(--color-ink) 100% + ), + var(--hero-image, none) center / cover no-repeat; + min-height: 48vh; +} + +.hero__inner { + max-width: var(--measure-wide); +} + +.hero__title { + margin-bottom: var(--space-2); +} + +.hero--home { + display: grid; + gap: var(--space-5); + align-items: center; + padding-block: var(--space-7) var(--space-5); +} + +@media (min-width: 900px) { + .hero--home { + grid-template-columns: 1fr 1fr; + } +} + +.hero__portrait { + width: 100%; + max-width: 480px; + border-radius: var(--radius-lg); + justify-self: end; + aspect-ratio: 1 / 1; + object-fit: cover; +} + +// ---------- Cards ---------- + +.card { + display: flex; + flex-direction: column; + gap: var(--space-2); + padding: var(--space-3); + background: var(--color-surface); + border: 1px solid color-mix(in srgb, var(--color-steel) 18%, transparent); + border-radius: var(--radius-md); + text-decoration: none; + color: var(--color-text); + transition: + transform var(--motion-base) var(--ease-out), + border-color var(--motion-base) var(--ease-out), + background var(--motion-base) var(--ease-out); +} + +a.card:hover, +a.card:focus-visible { + transform: translateY(-2px); + border-color: var(--color-yellow); + background: var(--color-surface-raised); + color: var(--color-text); +} + +.card__kicker { + font-size: var(--fs-xs); + font-weight: 600; + letter-spacing: 0.16em; + text-transform: uppercase; + color: var(--color-steel); +} + +a.card:hover .card__kicker { + color: var(--color-yellow); +} + +.card__title { + font-family: var(--font-serif); + font-size: var(--fs-lg); + font-weight: 600; + color: var(--color-bone); + margin: 0; +} + +.card__body { + color: var(--color-text-dim); + line-height: var(--lh-snug); + font-size: var(--fs-sm); +} + +.card__more { + margin-top: auto; + font-size: var(--fs-sm); + color: var(--color-yellow); + font-weight: 600; +} + +// ---------- Service blocks (work page) ---------- + +.service { + padding: var(--space-3); + background: var(--color-surface); + border-left: 3px solid var(--color-yellow); + border-radius: 0 var(--radius-md) var(--radius-md) 0; +} + +.service__title { + font-family: var(--font-serif); + font-size: var(--fs-lg); + color: var(--color-bone); + margin: 0 0 var(--space-2); +} + +.service ul { + margin: var(--space-2) 0 0; + padding-left: 1.2em; + color: var(--color-text-dim); +} + +.service ul li { + margin-top: var(--space-1); + line-height: var(--lh-snug); +} + +// ---------- Timeline ---------- + +.timeline { + list-style: none; + padding: 0; + margin: var(--space-4) 0; + border-left: 1px solid color-mix(in srgb, var(--color-steel) 35%, transparent); + padding-left: var(--space-3); +} + +.timeline__item { + position: relative; + margin-bottom: var(--space-4); +} + +.timeline__item::before { + content: ""; + position: absolute; + left: calc(-1 * var(--space-3) - 5px); + top: 0.55em; + width: 9px; + height: 9px; + border-radius: 50%; + background: var(--color-yellow); +} + +.timeline__date { + font-size: var(--fs-xs); + font-weight: 600; + letter-spacing: 0.12em; + text-transform: uppercase; + color: var(--color-steel); + display: block; + margin-bottom: var(--space-1); +} + +.timeline__title { + font-family: var(--font-serif); + font-size: var(--fs-md); + font-weight: 600; + margin: 0 0 var(--space-1); + color: var(--color-bone); +} + +.timeline__body { + color: var(--color-text-dim); + line-height: var(--lh-snug); +} + +// ---------- Callout ---------- + +.callout { + padding: var(--space-3); + background: var(--color-surface-raised); + border: 1px solid var(--color-teal-deep); + border-radius: var(--radius-md); + margin: var(--space-4) 0; +} + +.callout__label { + font-size: var(--fs-xs); + font-weight: 700; + letter-spacing: 0.14em; + text-transform: uppercase; + color: var(--color-yellow); + margin-bottom: var(--space-1); +} + +.callout__title { + font-family: var(--font-serif); + font-size: var(--fs-md); + margin: 0 0 var(--space-1); + color: var(--color-bone); +} + +// ---------- Buttons ---------- + +.btn { + display: inline-flex; + align-items: center; + gap: var(--space-1); + padding: var(--space-2) var(--space-3); + border-radius: var(--radius-sm); + font-weight: 600; + text-decoration: none; + transition: + background var(--motion-fast) var(--ease-out), + color var(--motion-fast) var(--ease-out), + border-color var(--motion-fast) var(--ease-out); +} + +.btn--primary { + background: var(--color-yellow); + color: var(--color-ink); +} + +.btn--primary:hover, +.btn--primary:focus-visible { + background: var(--color-bone); + color: var(--color-ink); +} + +.btn--ghost { + border: 1px solid var(--color-steel); + color: var(--color-bone); +} + +.btn--ghost:hover, +.btn--ghost:focus-visible { + border-color: var(--color-yellow); + color: var(--color-yellow); +} + +.btn .icon { + width: 1em; + height: 1em; +} + +// ---------- Footer ---------- + +.site-footer { + margin-top: var(--space-5); + padding-block: var(--space-3); + border-top: 1px solid color-mix(in srgb, var(--color-steel) 25%, transparent); + color: var(--color-text-dim); + font-size: var(--fs-sm); +} + +.site-footer__grid { + display: grid; + gap: var(--space-4); + grid-template-columns: 1fr; +} + +@media (min-width: 720px) { + .site-footer__grid { + grid-template-columns: 1.5fr 1fr 1fr; + } +} + +.site-footer__col h6 { + color: var(--color-steel); + margin-bottom: var(--space-2); +} + +.site-footer__links { + list-style: none; + padding: 0; + margin: 0; +} + +.site-footer__links li { + margin-top: var(--space-1); +} + +.site-footer__social { + list-style: none; + padding: 0; + margin: 0; + display: flex; + gap: var(--space-2); +} + +.site-footer__social a { + display: inline-flex; + align-items: center; + justify-content: center; + width: 36px; + height: 36px; + border-radius: var(--radius-sm); + color: var(--color-text-dim); + border: 1px solid color-mix(in srgb, var(--color-steel) 30%, transparent); + text-decoration: none; +} + +.site-footer__social a:hover { + color: var(--color-yellow); + border-color: var(--color-yellow); +} + +.site-footer__social svg { + width: 18px; + height: 18px; +} + +.site-footer__bottom { + margin-top: var(--space-4); + font-size: var(--fs-xs); + color: var(--color-text-mute); +} + +// ---------- Stat row ---------- + +.stat-row { + display: grid; + gap: var(--space-3); + grid-template-columns: 1fr; + margin: var(--space-4) 0; +} + +@media (min-width: 720px) { + .stat-row { + grid-template-columns: repeat(3, 1fr); + } +} + +.stat { + padding: var(--space-2) 0; + border-top: 2px solid var(--color-yellow); +} + +.stat__value { + font-family: var(--font-serif); + font-size: var(--fs-2xl); + font-weight: 700; + color: var(--color-bone); + line-height: 1; +} + +.stat__label { + display: block; + margin-top: var(--space-1); + font-size: var(--fs-sm); + color: var(--color-text-dim); +} + +// ---------- Resume highlights ---------- + +.resume-role { + padding: var(--space-3) 0; + border-bottom: 1px solid + color-mix(in srgb, var(--color-steel) 20%, transparent); +} + +.resume-role__header { + display: flex; + flex-wrap: wrap; + gap: var(--space-2); + align-items: baseline; + justify-content: space-between; +} + +.resume-role__title { + font-family: var(--font-serif); + font-size: var(--fs-md); + color: var(--color-bone); + margin: 0; +} + +.resume-role__dates { + font-size: var(--fs-sm); + color: var(--color-steel); + font-variant-numeric: tabular-nums; +} + +.resume-role__org { + color: var(--color-yellow); + font-size: var(--fs-sm); + font-weight: 600; +} + +.resume-role__bullets { + margin: var(--space-1) 0 0; + padding-left: 1.2em; + color: var(--color-text-dim); +} + +.resume-role__bullets li { + margin-top: var(--space-1); + line-height: var(--lh-snug); +} + +// ---------- Split sections (alternating left/right) ---------- +// Text column alternates between the left and right half of the page. +// Optional .split__media column sits opposite -- an image, or left empty +// for text-only pages so the composition still breathes. + +.split { + display: grid; + gap: var(--space-3); + align-items: start; + margin-block: var(--space-5); + grid-template-columns: 1fr; +} + +.split__text { + max-width: var(--measure-prose); +} + +.split__text > * + * { + margin-top: var(--space-2); +} + +.split__text h2 { + margin-top: 0; + padding-top: 0; + border-top: none; +} + +.split__text ul, +.split__text ol { + padding-left: 1.4em; +} + +.split__text li { + margin-top: var(--space-1); + line-height: var(--lh-prose); +} + +.split__media { + width: 100%; + aspect-ratio: 4 / 3; + border-radius: var(--radius-md); + overflow: hidden; + background: var(--color-surface); +} + +.split__media img, +.split__media svg { + width: 100%; + height: 100%; + display: block; + object-fit: cover; +} + +// Logo panel variant: light background, logo contained with padding. +.split__media--logo { + background: var(--color-bone); + display: grid; + place-items: center; + padding: var(--space-4); + aspect-ratio: auto; +} + +.split__media--logo img, +.split__media--logo svg { + width: auto; + height: auto; + max-width: 100%; + max-height: 100%; + object-fit: contain; +} + +// Callout panel: sits in the media column as a text sidebar. +.split__callout { + background: var(--color-surface); + border-left: 3px solid var(--color-yellow); + border-radius: var(--radius-md); + padding: var(--space-3) var(--space-4); + font-size: var(--fs-sm); + line-height: var(--lh-prose); + color: var(--color-text-dim); +} + +.split__callout-title { + font-family: var(--font-sans); + font-size: var(--fs-xs); + font-weight: 600; + letter-spacing: 0.06em; + text-transform: uppercase; + color: var(--color-text-mute); + margin-bottom: var(--space-2); +} + +.split__callout ul { + padding-left: 1.2em; + margin: 0; +} + +.split__callout li { + margin-top: var(--space-1); +} + +.split__callout li strong { + color: var(--color-text); +} + +@media (min-width: 900px) { + .split { + grid-template-columns: 1fr 1fr; + gap: var(--space-5); + align-items: center; + } + + .split--reverse .split__text { + grid-column: 2; + grid-row: 1; + } + + .split--reverse .split__media { + grid-column: 1; + grid-row: 1; + } +} diff --git a/input/assets/css/_layout.scss b/input/assets/css/_layout.scss new file mode 100644 index 0000000..817cbee --- /dev/null +++ b/input/assets/css/_layout.scss @@ -0,0 +1,106 @@ +// Layout primitives. No utility classes beyond what pages actually use. + +.container { + width: 100%; + max-width: var(--measure-wide); + margin-inline: auto; + padding-inline: var(--space-3); +} + +@media (min-width: 768px) { + .container { + padding-inline: var(--space-4); + } +} + +.page { + padding-block: var(--space-3) var(--space-4); +} + +.section { + margin-block: var(--space-5); +} + +.section--tight { + margin-block: var(--space-3); +} + +// Two-up and three-up grids. +.grid { + display: grid; + gap: var(--space-4); +} + +.grid--2 { + grid-template-columns: 1fr; +} + +.grid--3 { + grid-template-columns: 1fr; +} + +.grid--4 { + grid-template-columns: 1fr; +} + +@media (min-width: 720px) { + .grid--2 { + grid-template-columns: repeat(2, 1fr); + } + + .grid--3 { + grid-template-columns: repeat(2, 1fr); + } + + .grid--4 { + grid-template-columns: repeat(2, 1fr); + } +} + +@media (min-width: 1000px) { + .grid--3 { + grid-template-columns: repeat(3, 1fr); + } + + .grid--4 { + grid-template-columns: repeat(4, 1fr); + } +} + +// Flex helpers. +.row { + display: flex; + flex-wrap: wrap; + gap: var(--space-2); +} + +.row--between { + justify-content: space-between; + align-items: center; +} + +.stack > * + * { + margin-top: var(--space-2); +} + +.stack--lg > * + * { + margin-top: var(--space-4); +} + +.measure { + max-width: var(--measure-prose); +} + +.measure--narrow { + max-width: var(--measure-narrow); +} + +.hide-sm { + display: none; +} + +@media (min-width: 720px) { + .hide-sm { + display: initial; + } +} diff --git a/input/assets/css/_reset.scss b/input/assets/css/_reset.scss new file mode 100644 index 0000000..3f70675 --- /dev/null +++ b/input/assets/css/_reset.scss @@ -0,0 +1,70 @@ +// Minimal reset. Modern-normalize flavored. + +*, +*::before, +*::after { + box-sizing: border-box; +} + +html { + -webkit-text-size-adjust: 100%; + text-size-adjust: 100%; + scroll-behavior: smooth; +} + +body { + margin: 0; + min-height: 100vh; + line-height: var(--lh-normal); + -webkit-font-smoothing: antialiased; + text-rendering: optimizeLegibility; +} + +img, +picture, +video, +canvas, +svg { + display: block; + max-width: 100%; + height: auto; +} + +button, +input, +select, +textarea { + font: inherit; + color: inherit; +} + +button { + background: transparent; + border: 0; + cursor: pointer; + padding: 0; +} + +:focus-visible { + outline: 2px solid var(--color-yellow); + outline-offset: 3px; + border-radius: var(--radius-sm); +} + +::selection { + background: var(--color-yellow); + color: var(--color-ink); +} + +// Hide visually but keep accessible to screen readers. +.sr-only { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + white-space: nowrap; + border: 0; +} diff --git a/input/assets/css/_tokens.scss b/input/assets/css/_tokens.scss new file mode 100644 index 0000000..c846ecf --- /dev/null +++ b/input/assets/css/_tokens.scss @@ -0,0 +1,78 @@ +// Design tokens for withinfocus.com +// Cool palette, dark default. Preserve the existing yellow (#fdc000) as the primary accent. + +:root { + // Surfaces (dark default) + --color-ink: #14161c; + --color-ink-2: #1d2029; + --color-ink-3: #252830; + + // Text + --color-bone: #f3efe6; + --color-bone-dim: #cfd2da; + --color-bone-mute: #8a8f99; + + // Accents + --color-yellow: #fdc000; + --color-yellow-dim: #b98c00; + --color-steel: #6c8aa6; + --color-teal-deep: #2b6471; + + // Semantic + --color-bg: var(--color-ink); + --color-surface: var(--color-ink-2); + --color-surface-raised: var(--color-ink-3); + --color-text: var(--color-bone); + --color-text-dim: var(--color-bone-dim); + --color-text-mute: var(--color-bone-mute); + --color-link: var(--color-yellow); + --color-link-hover: var(--color-yellow-dim); + --color-rule: var(--color-steel); + --color-accent: var(--color-teal-deep); + + // Type scale (major third, 1.250) + --font-serif: + "Source Serif 4", "Source Serif Pro", Georgia, "Times New Roman", serif; + --font-sans: "Source Sans 3", "Source Sans Pro", Arial, sans-serif; + --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace; + + --fs-xs: clamp(0.8rem, 0.78rem + 0.1vw, 0.85rem); + --fs-sm: clamp(0.92rem, 0.9rem + 0.1vw, 0.98rem); + --fs-base: clamp(1.05rem, 1rem + 0.25vw, 1.15rem); + --fs-md: clamp(1.25rem, 1.15rem + 0.5vw, 1.4rem); + --fs-lg: clamp(1.55rem, 1.4rem + 0.75vw, 1.8rem); + --fs-xl: clamp(2rem, 1.75rem + 1.25vw, 2.5rem); + --fs-2xl: clamp(2.5rem, 2.1rem + 2vw, 3.4rem); + --fs-3xl: clamp(3.25rem, 2.6rem + 3.25vw, 5rem); + + --lh-tight: 1.15; + --lh-snug: 1.3; + --lh-normal: 1.55; + --lh-prose: 1.65; + + // Spacing (8px base) + --space-1: 0.5rem; + --space-2: 1rem; + --space-3: 1.5rem; + --space-4: 2rem; + --space-5: 3rem; + --space-6: 4rem; + --space-7: 6rem; + --space-8: 8rem; + + // Layout + --measure-prose: 68ch; + --measure-wide: 1200px; + --measure-narrow: 640px; + + // Radii + --radius-sm: 4px; + --radius-md: 8px; + --radius-lg: 14px; + + // Motion + --motion-fast: 120ms; + --motion-base: 220ms; + --motion-slow: 380ms; + --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1); +} diff --git a/input/assets/css/_type.scss b/input/assets/css/_type.scss new file mode 100644 index 0000000..adf0d17 --- /dev/null +++ b/input/assets/css/_type.scss @@ -0,0 +1,179 @@ +// Typography. Source Serif 4 for display, Source Sans 3 for text. + +body { + font-family: var(--font-sans); + font-size: var(--fs-base); + color: var(--color-text); + background: var(--color-bg); +} + +h1, +h2, +h3, +h4, +h5, +h6 { + font-family: var(--font-serif); + font-weight: 600; + line-height: var(--lh-tight); + letter-spacing: -0.01em; + margin: 0 0 var(--space-2); + color: var(--color-bone); +} + +h1 { + font-size: var(--fs-3xl); + font-weight: 700; + letter-spacing: -0.02em; +} + +h2 { + font-size: var(--fs-2xl); +} + +h3 { + font-size: var(--fs-xl); +} + +h4 { + font-size: var(--fs-lg); +} + +h5 { + font-size: var(--fs-md); +} + +h6 { + font-size: var(--fs-base); + text-transform: uppercase; + letter-spacing: 0.08em; + color: var(--color-text-dim); +} + +p { + margin: 0 0 var(--space-2); + line-height: var(--lh-prose); + color: var(--color-text); +} + +a { + color: var(--color-link); + text-decoration-color: color-mix(in srgb, var(--color-link) 40%, transparent); + text-decoration-line: underline; + text-decoration-thickness: 1px; + text-underline-offset: 3px; + transition: color var(--motion-fast) var(--ease-out); +} + +a:hover { + color: var(--color-link-hover); + text-decoration-color: var(--color-teal-deep); + text-decoration-thickness: 2px; +} + +a:visited { + color: var(--color-link); +} + +strong { + color: var(--color-bone); + font-weight: 600; +} + +small { + font-size: var(--fs-sm); + color: var(--color-text-dim); +} + +abbr[title] { + border-bottom: 1px dotted var(--color-text-mute); + text-decoration: none; + cursor: help; +} + +code, +kbd, +pre, +samp { + font-family: var(--font-mono); + font-size: 0.92em; +} + +// Prose block for long-form running text. +.prose { + max-width: var(--measure-prose); + + > * + * { + margin-top: var(--space-2); + } + + h2 { + margin-top: var(--space-5); + padding-top: var(--space-3); + border-top: 1px solid + color-mix(in srgb, var(--color-steel) 30%, transparent); + } + + h3 { + margin-top: var(--space-4); + } + + ul, + ol { + padding-left: 1.4em; + + li { + margin-top: var(--space-1); + line-height: var(--lh-prose); + } + } +} + +// Kicker: small uppercase label above headlines. +.kicker { + display: inline-block; + font-family: var(--font-sans); + font-size: var(--fs-sm); + font-weight: 600; + letter-spacing: 0.16em; + text-transform: uppercase; + color: var(--color-yellow); + margin-bottom: var(--space-2); +} + +// Dek: subtitle below a page H1. +.dek { + font-family: var(--font-serif); + font-style: italic; + font-weight: 400; + font-size: var(--fs-md); + line-height: var(--lh-snug); + color: var(--color-text-dim); + max-width: var(--measure-prose); + margin: 0 0 var(--space-3); +} + +// Pull-quote. +.pull-quote { + border-left: 3px solid var(--color-yellow); + padding: var(--space-1) 0 var(--space-1) var(--space-3); + margin: var(--space-4) 0; + font-family: var(--font-serif); + font-size: var(--fs-lg); + font-style: italic; + line-height: var(--lh-snug); + color: var(--color-bone); + max-width: var(--measure-prose); +} + +// Figure / caption. +figure { + margin: var(--space-4) 0; +} + +figcaption { + font-size: var(--fs-sm); + color: var(--color-text-dim); + margin-top: var(--space-1); + font-style: italic; +} diff --git a/input/assets/css/styles.scss b/input/assets/css/styles.scss index 6dcf582..d262b60 100644 --- a/input/assets/css/styles.scss +++ b/input/assets/css/styles.scss @@ -1,29 +1,8 @@ -$primary: #252830 !default; -$secondary: #cfd2da !default; -$link: #fdc000 !default; - -@mixin body-font { - font-family: "Source Sans Pro", "Arial", sans-serif; -} - -body { - @include body-font; - background-color: $primary; - color: $secondary; -} - -a, -a:active, -a:hover, -a:visited { - color: $link; -} - -li { - margin-top: 0.5em; -} - -.jumbotron { - background-image: url("../pcb.webp"); - color: lighten($primary, 15%); -} +// withinfocus.com -- owned styles. No Bootstrap, no Font Awesome. +// Modular SCSS: tokens, reset, type, layout, components. + +@import "tokens"; +@import "reset"; +@import "type"; +@import "layout"; +@import "components"; diff --git a/input/assets/favicons/browserconfig.xml b/input/assets/favicons/browserconfig.xml index 3d38924..39e2ee0 100644 --- a/input/assets/favicons/browserconfig.xml +++ b/input/assets/favicons/browserconfig.xml @@ -2,8 +2,8 @@ - - #252830 + + #14161c diff --git a/input/assets/favicons/site.webmanifest b/input/assets/favicons/site.webmanifest index 1e4b5a5..99af4c8 100644 --- a/input/assets/favicons/site.webmanifest +++ b/input/assets/favicons/site.webmanifest @@ -3,17 +3,17 @@ "short_name": "withinfocus", "icons": [ { - "src": "/android-chrome-192x192.png", + "src": "/assets/favicons/android-chrome-192x192.png", "sizes": "192x192", "type": "image/png" }, { - "src": "/android-chrome-512x512.png", + "src": "/assets/favicons/android-chrome-512x512.png", "sizes": "512x512", "type": "image/png" } ], - "theme_color": "#252830", - "background_color": "#252830", + "theme_color": "#14161c", + "background_color": "#14161c", "display": "standalone" } diff --git a/input/assets/images/career-gatech.svg b/input/assets/images/career-gatech.svg new file mode 100644 index 0000000..8a5f197 --- /dev/null +++ b/input/assets/images/career-gatech.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/input/assets/images/career-imobile3.svg b/input/assets/images/career-imobile3.svg new file mode 100644 index 0000000..1d3d444 --- /dev/null +++ b/input/assets/images/career-imobile3.svg @@ -0,0 +1,66 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/input/assets/images/career-olo.svg b/input/assets/images/career-olo.svg new file mode 100644 index 0000000..5a6c800 --- /dev/null +++ b/input/assets/images/career-olo.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/input/assets/images/career-withinfocus.svg b/input/assets/images/career-withinfocus.svg new file mode 100644 index 0000000..2055b7e --- /dev/null +++ b/input/assets/images/career-withinfocus.svg @@ -0,0 +1,30 @@ + + Iron Compass — Logomark Color + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/input/assets/images/life-family.svg b/input/assets/images/life-family.svg new file mode 100644 index 0000000..7ab27ad --- /dev/null +++ b/input/assets/images/life-family.svg @@ -0,0 +1,8 @@ + + + + + Family + 1200 x 900 placeholder (4:3) + + diff --git a/input/assets/images/life-jacksonville.jpg b/input/assets/images/life-jacksonville.jpg new file mode 100644 index 0000000..7841a32 Binary files /dev/null and b/input/assets/images/life-jacksonville.jpg differ diff --git a/input/assets/images/life-jeep.jpg b/input/assets/images/life-jeep.jpg new file mode 100644 index 0000000..1a027d5 Binary files /dev/null and b/input/assets/images/life-jeep.jpg differ diff --git a/input/assets/images/life-jeep.svg b/input/assets/images/life-jeep.svg new file mode 100644 index 0000000..b6b7e00 --- /dev/null +++ b/input/assets/images/life-jeep.svg @@ -0,0 +1,8 @@ + + + + + Project Yellow Jacket + 1200 x 900 placeholder (4:3) + + diff --git a/input/assets/images/life-photography.jpg b/input/assets/images/life-photography.jpg new file mode 100644 index 0000000..dc2fb3a Binary files /dev/null and b/input/assets/images/life-photography.jpg differ diff --git a/input/assets/images/life-photography.svg b/input/assets/images/life-photography.svg new file mode 100644 index 0000000..54f1eec --- /dev/null +++ b/input/assets/images/life-photography.svg @@ -0,0 +1,8 @@ + + + + + Photography + 1200 x 900 placeholder (4:3) + + diff --git a/input/assets/images/life-robotics.jpg b/input/assets/images/life-robotics.jpg new file mode 100644 index 0000000..182220c Binary files /dev/null and b/input/assets/images/life-robotics.jpg differ diff --git a/input/assets/images/life-shop.svg b/input/assets/images/life-shop.svg new file mode 100644 index 0000000..56a7ff6 --- /dev/null +++ b/input/assets/images/life-shop.svg @@ -0,0 +1,156 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/input/assets/images/life-yoga.svg b/input/assets/images/life-yoga.svg new file mode 100644 index 0000000..112f371 --- /dev/null +++ b/input/assets/images/life-yoga.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/input/assets/me.jpg b/input/assets/me.jpg new file mode 100644 index 0000000..dd1dc8c Binary files /dev/null and b/input/assets/me.jpg differ diff --git a/input/assets/me.webp b/input/assets/me.webp deleted file mode 100644 index c822afd..0000000 Binary files a/input/assets/me.webp and /dev/null differ diff --git a/input/assets/pcb.webp b/input/assets/pcb.webp deleted file mode 100644 index 165e0cc..0000000 Binary files a/input/assets/pcb.webp and /dev/null differ