cesnimda/ResumeSite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
1b5204e7f89492078d5d52e6b7deb4a6b0e99652
ResumeSite/docs/design/05-mockups/M4-mobile-dark.svg
T
cesnimda 1f695d3932 docs: establish approved Phase 1 design + Phase 2 spec as project foundation 
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-03 21:07:25 +02:00

134 lines
9.1 KiB
XML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 900 1240" font-family="Segoe UI, Arial, sans-serif">
<rect width="900" height="1240" fill="#05070B"/>
<text x="60" y="48" fill="#E5A93D" font-family="Consolas, monospace" font-size="12">M4: mobile 390px — homepage (left) · nav overlay open (right)</text>
<!-- ============ PHONE 1: homepage ============ -->
<rect x="60" y="80" width="390" height="1100" rx="24" fill="#0B0E14" stroke="#E8ECF2" stroke-opacity="0.16"/>
<!-- slim header 56 -->
<line x1="60" y1="136" x2="450" y2="136" stroke="#E8ECF2" stroke-opacity="0.08"/>
<rect x="84" y="94" width="28" height="28" rx="7" fill="#11151D" stroke="#E8ECF2" stroke-opacity="0.16"/>
<text x="98" y="113" fill="#E8ECF2" font-family="Consolas, monospace" font-size="11" font-weight="bold" text-anchor="middle">CB</text>
<!-- CV icon button -->
<rect x="330" y="94" width="40" height="28" rx="7" fill="#3ECFAE"/>
<path d="M350 100 v10 m-4 -4 l4 4 l4 -4 M344 114 h12" stroke="#062A22" stroke-width="1.6" fill="none"/>
<!-- burger -->
<g stroke="#E8ECF2" stroke-width="1.6">
<line x1="390" y1="102" x2="414" y2="102"/><line x1="390" y1="110" x2="414" y2="110"/><line x1="390" y1="118" x2="414" y2="118"/>
</g>
<!-- hero -->
<text x="84" y="192" fill="#3ECFAE" font-family="Consolas, monospace" font-size="10" letter-spacing="1.5">SYSTEMS DEVELOPER · NORWAY</text>
<text x="84" y="234" fill="#E8ECF2" font-size="34" font-weight="600">Connor</text>
<text x="84" y="272" fill="#E8ECF2" font-size="34" font-weight="600">Babbington</text>
<text x="84" y="308" fill="#9AA4B2" font-size="15">I design, build and run web systems.</text>
<text x="84" y="332" fill="#9AA4B2" font-size="15">8+ years in UK local government —</text>
<text x="84" y="356" fill="#9AA4B2" font-size="15">now building full-stack in Norway.</text>
<path d="M84 384 H240 l8 8 H330" fill="none" stroke="#3ECFAE" stroke-width="1.5"/>
<circle cx="335" cy="392" r="3.5" fill="#3ECFAE"/>
<!-- chips 2 rows -->
<g font-family="Consolas, monospace" font-size="10.5">
<rect x="84" y="410" width="128" height="26" rx="13" fill="#11151D" stroke="#E8ECF2" stroke-opacity="0.08"/>
<text x="148" y="427" fill="#9AA4B2" text-anchor="middle">Tønsberg, Norway</text>
<rect x="220" y="410" width="108" height="26" rx="13" fill="#11151D" stroke="#E8ECF2" stroke-opacity="0.08"/>
<text x="274" y="427" fill="#9AA4B2" text-anchor="middle">Work permit ✓</text>
<rect x="84" y="444" width="150" height="26" rx="13" fill="#11151D" stroke="#E8ECF2" stroke-opacity="0.08"/>
<text x="159" y="461" fill="#9AA4B2" text-anchor="middle">Remote/hybrid/on-site</text>
<rect x="242" y="444" width="150" height="26" rx="13" fill="#11151D" stroke="#E8ECF2" stroke-opacity="0.08"/>
<text x="317" y="461" fill="#9AA4B2" text-anchor="middle">EN native · NO B1</text>
</g>
<!-- stacked CTAs full width, 48px -->
<rect x="84" y="494" width="342" height="48" rx="8" fill="#3ECFAE"/>
<text x="255" y="524" fill="#062A22" font-size="15" font-weight="600" text-anchor="middle">View projects</text>
<rect x="84" y="552" width="342" height="48" rx="8" fill="none" stroke="#E8ECF2" stroke-opacity="0.16"/>
<text x="255" y="582" fill="#E8ECF2" font-size="15" text-anchor="middle">Download CV · pdf</text>
<!-- proof 2x2 -->
<g>
<rect x="84" y="628" width="165" height="72" rx="10" fill="#11151D" stroke="#E8ECF2" stroke-opacity="0.08"/>
<text x="100" y="660" fill="#E8ECF2" font-size="18" font-weight="600">8+ yrs</text>
<text x="100" y="682" fill="#5C6675" font-family="Consolas, monospace" font-size="9" letter-spacing="1">EXPERIENCE</text>
<rect x="261" y="628" width="165" height="72" rx="10" fill="#11151D" stroke="#E8ECF2" stroke-opacity="0.08"/>
<text x="277" y="660" fill="#E8ECF2" font-size="15" font-weight="600">Public sector</text>
<text x="277" y="682" fill="#5C6675" font-family="Consolas, monospace" font-size="9" letter-spacing="1">BACKGROUND</text>
<rect x="84" y="710" width="165" height="72" rx="10" fill="#11151D" stroke="#E8ECF2" stroke-opacity="0.08"/>
<text x="100" y="742" fill="#E8ECF2" font-size="15" font-weight="600">.NET · React</text>
<text x="100" y="764" fill="#5C6675" font-family="Consolas, monospace" font-size="9" letter-spacing="1">CORE STACK</text>
<rect x="261" y="710" width="165" height="72" rx="10" fill="#11151D" stroke="#E8ECF2" stroke-opacity="0.08"/>
<text x="277" y="742" fill="#E8ECF2" font-size="15" font-weight="600">In Norway</text>
<text x="277" y="764" fill="#5C6675" font-family="Consolas, monospace" font-size="9" letter-spacing="1">PERMIT ✓</text>
</g>
<!-- project card -->
<text x="84" y="836" fill="#3ECFAE" font-family="Consolas, monospace" font-size="10" letter-spacing="1.5">02 — PROJECTS</text>
<rect x="84" y="856" width="342" height="290" rx="12" fill="#11151D" stroke="#E8ECF2" stroke-opacity="0.08"/>
<rect x="84" y="856" width="342" height="170" rx="12" fill="#171C26"/>
<rect x="84" y="1010" width="342" height="16" fill="#171C26"/>
<text x="255" y="948" fill="#5C6675" font-size="11" text-anchor="middle">[ JobTrack screenshot 16:10 ]</text>
<rect x="342" y="872" width="70" height="24" rx="12" fill="#0B0E14" stroke="#3ECFAE" stroke-opacity="0.4"/>
<circle cx="356" cy="884" r="3" fill="#3ECFAE"/>
<text x="366" y="889" fill="#3ECFAE" font-family="Consolas, monospace" font-size="9.5">ACTIVE</text>
<text x="104" y="1058" fill="#E8ECF2" font-size="18" font-weight="600">JobTrack</text>
<text x="104" y="1082" fill="#9AA4B2" font-size="13">A workspace for the whole job-application journey.</text>
<g font-family="Consolas, monospace" font-size="10" fill="#9AA4B2">
<rect x="104" y="1096" width="56" height="22" rx="11" fill="#171C26"/><text x="132" y="1111" text-anchor="middle">.NET 9</text>
<rect x="168" y="1096" width="52" height="22" rx="11" fill="#171C26"/><text x="194" y="1111" text-anchor="middle">React</text>
<rect x="228" y="1096" width="60" height="22" rx="11" fill="#171C26"/><text x="258" y="1111" text-anchor="middle">Docker</text>
</g>
<text x="104" y="1136" fill="#3ECFAE" font-size="13">Read case study →</text>
<!-- ============ PHONE 2: nav overlay ============ -->
<rect x="480" y="80" width="390" height="1100" rx="24" fill="#0B0E14" stroke="#E8ECF2" stroke-opacity="0.16"/>
<rect x="480" y="80" width="390" height="1100" rx="24" fill="#11151D" fill-opacity="0.98"/>
<!-- overlay header -->
<rect x="504" y="94" width="28" height="28" rx="7" fill="#171C26" stroke="#E8ECF2" stroke-opacity="0.16"/>
<text x="518" y="113" fill="#E8ECF2" font-family="Consolas, monospace" font-size="11" font-weight="bold" text-anchor="middle">CB</text>
<g stroke="#E8ECF2" stroke-width="1.8">
<line x1="812" y1="98" x2="832" y2="118"/><line x1="832" y1="98" x2="812" y2="118"/>
</g>
<!-- language + theme row -->
<rect x="504" y="152" width="240" height="44" rx="22" fill="#171C26" stroke="#E8ECF2" stroke-opacity="0.08"/>
<rect x="508" y="156" width="116" height="36" rx="18" fill="#0B0E14" stroke="#E8ECF2" stroke-opacity="0.16"/>
<text x="566" y="179" fill="#E8ECF2" font-family="Consolas, monospace" font-size="13" text-anchor="middle">EN</text>
<text x="686" y="179" fill="#9AA4B2" font-family="Consolas, monospace" font-size="13" text-anchor="middle">NO</text>
<circle cx="800" cy="174" r="22" fill="#171C26" stroke="#E8ECF2" stroke-opacity="0.08"/>
<path d="M806 166 a9 9 0 1 0 4 12 a8 8 0 0 1 -4 -12" fill="#9AA4B2"/>
<!-- nav stack: large targets -->
<g font-size="28" font-weight="600">
<text x="504" y="292" fill="#E8ECF2">Home</text>
<text x="504" y="368" fill="#E8ECF2">Projects</text>
<text x="504" y="444" fill="#E8ECF2">Experience</text>
<text x="504" y="520" fill="#E8ECF2">About</text>
<text x="504" y="596" fill="#E8ECF2">Contact</text>
</g>
<g font-family="Consolas, monospace" font-size="11" fill="#5C6675">
<text x="504" y="316">/</text>
<text x="504" y="392">/projects · 3</text>
<text x="504" y="468">/experience</text>
<text x="504" y="544">/about</text>
<text x="504" y="620">/contact</text>
</g>
<line x1="504" y1="660" x2="846" y2="660" stroke="#E8ECF2" stroke-opacity="0.08"/>
<!-- CV buttons -->
<rect x="504" y="692" width="342" height="48" rx="8" fill="#3ECFAE"/>
<text x="675" y="722" fill="#062A22" font-size="15" font-weight="600" text-anchor="middle">Download CV — English</text>
<rect x="504" y="752" width="342" height="48" rx="8" fill="none" stroke="#E8ECF2" stroke-opacity="0.16"/>
<text x="675" y="782" fill="#E8ECF2" font-size="15" text-anchor="middle">Last ned CV — Norsk</text>
<!-- contact shortcuts -->
<g font-family="Consolas, monospace" font-size="13" fill="#9AA4B2">
<text x="504" y="852">connor.babbington@cesnimda.co.uk ⧉</text>
<text x="504" y="888">linkedin ↗</text>
<text x="504" y="924">git.cesnimda.uk ↗</text>
</g>
<text x="504" y="1150" fill="#5C6675" font-family="Consolas, monospace" font-size="11">overlay: full-screen, body scroll locked, Esc/× closes,</text>
<text x="504" y="1168" fill="#5C6675" font-family="Consolas, monospace" font-size="11">focus trapped · targets ≥ 44px</text>
</svg>
Reference in New Issue View Git Blame Copy Permalink