Deploy to GitHub pages

robstarbuck · Mar 8, 2024 · 9a8d7c0 · 9a8d7c0
commit 9a8d7c0
Show file tree

Hide file tree

Showing 28 changed files with 1,972 additions and 0 deletions.
diff --git a/404.html b/404.html
@@ -0,0 +1,74 @@
+<!DOCTYPE html>
+<html lang="en"><head>
+  <meta charset="UTF-8">
+  <title>404 | robstarbuck.uk</title>
+  <link rel="preconnect" href="https://rsms.me/">
+  <link rel="stylesheet" href="https://rsms.me/inter/inter.css">
+  <link rel="stylesheet" href="/font.css">
+
+  <link rel="stylesheet" href="/minireset.css">
+  <link rel="stylesheet" href="/vertical-rhythm.css">
+  <link rel="stylesheet" href="/index.css">
+  <link rel="stylesheet" href="/highlight-js/robstarbuck.uk.css">
+
+  <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=.75">
+
+
+
+  <script defer="" src="/scripts/back-button.js"></script>
+
+</head>
+<body>
+  <nav>
+    <a href="/">
+      robstarbuck.uk
+    </a>
+  </nav>
+  <main>
+
+  <h1>404</h1>
+
+
+    <p>Page Not Found</p>
+    <hr>
+    <ul>
+      <li><a href="/posts/count-to-1023-on-two-hands/">Count to 1023 on Two Hands</a></li><li><a href="/posts/steganography-in-js/">Steganography with Zero Width Characters (Z-Chars)</a></li><li><a href="/posts/treact-recursive-components-in-react/">Treact - Recursive Components in React</a></li><li><a href="/posts/web-components-and-slotted-element-interactions/">Web-components and slotted element interactions</a></li>
+    </ul>
+
+  </main>
+  <footer>
+    <a href="https://github.com/robstarbuck">
+      <!--?xml version="1.0" encoding="UTF-8" standalone="no"?-->
+
+<svg width="100%" height="100%" viewbox="0 0 1501 406" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink" space="preserve" xmlns:serif="http://www.serif.com/" style="fill: #2b2031;fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M177.281,41.988L147.014,41.988C146.233,41.988 145.6,42.622 145.6,43.403L145.6,58.201C145.6,58.982 146.233,59.618 147.014,59.618L158.821,59.618L158.821,78.003C158.821,78.003 156.17,78.907 148.84,78.907C140.193,78.907 128.113,75.747 128.113,49.183C128.113,22.614 140.692,19.118 152.501,19.118C162.724,19.118 167.127,20.918 169.93,21.785C170.811,22.055 171.625,21.178 171.625,20.397L175.001,6.099C175.001,5.733 174.877,5.293 174.461,4.994C173.323,4.182 166.38,0.297 148.84,0.297C128.634,0.297 107.908,8.894 107.908,50.219C107.908,91.545 131.638,97.704 151.635,97.704C168.192,97.704 178.236,90.628 178.236,90.628C178.65,90.4 178.695,89.821 178.695,89.556L178.695,43.403C178.695,42.622 178.062,41.988 177.281,41.988Z" style="fill-rule:nonzero;"></path>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M333.265,5.249C333.265,4.462 332.641,3.826 331.859,3.826L314.817,3.826C314.039,3.826 313.406,4.462 313.406,5.249C313.406,5.253 313.411,38.183 313.411,38.183L286.846,38.183L286.846,5.249C286.846,4.462 286.22,3.826 285.44,3.826L268.399,3.826C267.624,3.826 266.991,4.462 266.991,5.249L266.991,94.427C266.991,95.213 267.624,95.853 268.399,95.853L285.44,95.853C286.22,95.853 286.846,95.213 286.846,94.427L286.846,56.282L313.411,56.282C313.411,56.282 313.364,94.424 313.364,94.427C313.364,95.213 313.996,95.853 314.776,95.853L331.858,95.853C332.639,95.853 333.263,95.213 333.265,94.427L333.265,5.249Z" style="fill-rule:nonzero;"></path>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M209.44,16.951C209.44,10.815 204.521,5.856 198.451,5.856C192.387,5.856 187.463,10.815 187.463,16.951C187.463,23.081 192.387,28.054 198.451,28.054C204.521,28.054 209.44,23.081 209.44,16.951Z" style="fill-rule:nonzero;"></path>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M208.222,93.564L208.222,34.45C208.222,33.669 207.591,33.03 206.812,33.03L189.823,33.03C189.044,33.03 188.347,33.833 188.347,34.615L188.347,93.592C188.347,95.325 189.427,95.84 190.824,95.84L206.13,95.84C207.81,95.84 208.222,95.016 208.222,93.564Z" style="fill-rule:nonzero;"></path>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M398.032,33.164L381.121,33.164C380.346,33.164 379.714,33.803 379.714,34.59L379.714,78.316C379.714,78.316 375.417,81.46 369.319,81.46C363.222,81.46 361.604,78.693 361.604,72.722L361.604,34.59C361.604,33.803 360.974,33.164 360.197,33.164L343.033,33.164C342.259,33.164 341.624,33.803 341.624,34.59L341.624,75.609C341.624,93.344 351.508,97.683 365.105,97.683C376.261,97.683 385.255,91.52 385.255,91.52C385.255,91.52 385.683,94.768 385.877,95.153C386.07,95.537 386.575,95.925 387.121,95.925L398.04,95.877C398.814,95.877 399.449,95.237 399.449,94.453L399.443,34.59C399.443,33.803 398.812,33.164 398.032,33.164Z" style="fill-rule:nonzero;"></path>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M437.584,81.406C431.718,81.227 427.739,78.565 427.739,78.565L427.739,50.325C427.739,50.325 431.664,47.919 436.48,47.489C442.57,46.943 448.438,48.783 448.438,63.31C448.438,78.63 445.79,81.653 437.584,81.406ZM444.254,31.161C434.649,31.161 428.116,35.446 428.116,35.446L428.116,5.249C428.116,4.462 427.486,3.826 426.71,3.826L409.619,3.826C408.842,3.826 408.211,4.462 408.211,5.249L408.211,94.427C408.211,95.213 408.842,95.853 409.621,95.853L421.479,95.853C422.013,95.853 422.417,95.578 422.716,95.096C423.011,94.617 423.436,90.984 423.436,90.984C423.436,90.984 430.424,97.607 443.653,97.607C459.185,97.607 468.092,89.729 468.092,62.241C468.092,34.753 453.866,31.161 444.254,31.161Z" style="fill-rule:nonzero;"></path>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M257.202,33.022L244.418,33.022C244.418,33.022 244.399,16.137 244.399,16.133C244.399,15.494 244.069,15.174 243.33,15.174L225.91,15.174C225.232,15.174 224.869,15.473 224.869,16.123L224.869,33.576C224.869,33.576 216.139,35.683 215.548,35.853C214.961,36.024 214.528,36.566 214.528,37.213L214.528,48.18C214.528,48.968 215.158,49.604 215.937,49.604L224.869,49.604L224.869,75.989C224.869,95.585 238.615,97.51 247.89,97.51C252.129,97.51 257.199,96.149 258.036,95.84C258.542,95.654 258.836,95.13 258.836,94.561L258.851,82.497C258.851,81.71 258.186,81.073 257.437,81.073C256.691,81.073 254.787,81.376 252.825,81.376C246.545,81.376 244.418,78.457 244.418,74.678C244.418,70.901 244.417,49.604 244.417,49.604L257.202,49.604C257.98,49.604 258.612,48.968 258.612,48.18L258.612,34.443C258.612,33.656 257.98,33.022 257.202,33.022Z" style="fill-rule:nonzero;"></path>
+    </g>
+</svg>
+
+      <time datetime="2024-03-08 16:22:08.000">Built 2024-03-08</time>
+    </a>
+  </footer>
+
+
+
+
+</body></html>
diff --git a/README.md b/README.md
@@ -0,0 +1,4 @@
+# Site Build
+      - Page Count: 11
+      - Build Date: 2024-03-08 16:22:08
+
diff --git a/bg-paper-light.webp b/bg-paper-light.webp
diff --git a/cv.css b/cv.css
@@ -0,0 +1,105 @@
+:root {
+    --spacer: calc(var(--r) / 4);
+}
+
+main {
+    padding-top: var(--rh5);
+    padding-right: var(--rh4);
+    padding-bottom: var(--rh6);
+    padding-left: var(--rh8);
+}
+
+#cv-footer {
+    display:flex;
+    justify-content: end;
+    padding: var(--r) 0;
+    gap: var(--r);
+}
+
+#cv-footer a {
+    box-shadow: none;
+}
+
+h1 {
+    --r-count: 2;
+    --r-factor: 0.75;
+}
+
+h2 {
+    --r-count: 1.5;
+    --r-factor: 0.75;
+}
+
+h3 {
+    --r-count: 1;
+}
+
+ul {
+    position: absolute;
+    margin-top: calc(-1 * var(--rh6));
+    right: 0;
+    text-align: right;
+}
+
+[data-id="Education"]~h3, [data-id="Education"]~h4 {
+    display: inline-block;
+    margin: 0 var(--spacer) var(--spacer) 0;
+}
+
+
+h2+h3 {
+    display: inline-block;
+    margin-right: var(--spacer);
+}
+
+h3+h4 {
+    display: inline-block;
+    font-weight: normal;
+}
+
+p > strong {
+    font-weight: normal;
+}
+
+
+@media print {
+    * {
+        box-shadow: none !important;
+        page-break-before: avoid;
+        page-break-after: avoid;
+        break-inside: avoid;
+    }
+    h2:has(a):nth-of-type(5) {
+        page-break-before: always;
+    }
+    h2 {
+        page-break-before: auto;
+        break-inside: auto;
+    }
+    :root, body {
+        background: none;
+    }
+    :root::after, body::after {
+        content: none;
+    }
+    nav, footer {
+        display: none;
+    }
+    main {
+        padding: 0;
+    }
+    :root {
+        --r: 22px;
+    }
+    body {
+        padding: 0;
+    }
+    .content {
+        max-width: none;
+    }
+
+}
+
+@page {
+    margin: 2cm 1.5cm 1.5cm 2.5cm;
+}
diff --git a/cv/index.html b/cv/index.html
@@ -0,0 +1,112 @@
+<!DOCTYPE html>
+<html lang="en"><head>
+  <meta charset="UTF-8">
+  <title>CV | robstarbuck.uk</title>
+  <link rel="preconnect" href="https://rsms.me/">
+  <link rel="stylesheet" href="https://rsms.me/inter/inter.css">
+  <link rel="stylesheet" href="/font.css">
+  <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=.75">
+</head>
+<body>
+  <nav>
+    <a href="/">
+      robstarbuck.uk
+    </a>
+  </nav>
+  <main class="cv">
+    <div class="content">
+    <h2>Robert Starbuck</h2>
+<h3>Web Developer</h3>
+<h4>Born 1983</h4>
+<ul>
+<li>Bristol, BS5</li>
+<li>https://robstarbuck.uk</li>
+</ul>
+<p><strong>Frontend focussed developer and designer</strong>. With a background in design, I have a good eye for what works on a site. I'd fit in best with a small team. I'm experienced with React, Next.js, Apollo&nbsp;GraphQL, Typescript, JS, CSS, UX Development and Graphics Suites. I'm currently developing using web-components built with lit.dev.</p>
+<h1 data-id="Experience">Experience</h1>
+<h2><a href="https://rippl.work/" target="_blank">Rippl</a> - Incentives Platform</h2>
+<h3>Frontend Developer</h3>
+<h4>July 2022 - Present, Remote</h4>
+<p><strong>UI development with web-components built in lit.dev</strong>. Building a bespoke component librxxary and implementing those components accross Rippl sites and with the help of a brilliant team. Working with native web-components has posed some challenges with a shift away from callbacks to event driven interactions.</p>
+<h2><a href="https://polecat.com/" target="_blank">Polecat</a> - Reputation Management</h2>
+<h3>Frontend Developer</h3>
+<h4>April 2017 - December 2021, Bristol</h4>
+<p><strong>UI development with React in Typescript, incorporating functional programming with RamdaJS, occasionally contributing as a graphic designer</strong>. My contributions were various, and included visualisations with D3 and helping to refactor our sites to use React. The team was very gifted and I learnt a great deal. We strived to a fault for best practices and would always make time for stand-ups, retros and hackathons.</p>
+<h2><a href="https://www.buddi.co.uk" target="_blank">Buddi</a> - GPS Solutions</h2>
+<h3>UI Developer</h3>
+<h4>Oct 2015 - Aug 2016, London</h4>
+<p><strong>Full stack role building UIs and a new company website with Angular, Shopify and a Sagepay</strong>. The site was originally written in Jekyll and later rewritten in Hugo.</p>
+<h2><a href="https://web.cv" target="_blank">web.cv</a> - Personal Start-up</h2>
+<h3>Founder / Fullstack</h3>
+<h4>Sep 2014 - Sep 2015, London</h4>
+<p><strong>Unsuccessful start-up venture with a team of one</strong>. I built the frontend of web.cv with AngularJS with the hope of partnering with a backend engineer. Working by myself was good for discipline, though I certainly lacked the feedback I needed to either move the project forward or understand when to stop.</p>
+<h2><a href="https://merchantcantos.com" target="_blank">Merchant Cantos</a> - Marketing Agency</h2>
+<h3>Fullstack Developer</h3>
+<h4>Feb 2014 - Jun 2014, London</h4>
+<p><strong>Contract work as a front-end dev</strong>. Clients included several big names from ebay to facebook. Deadlines were tight and I was hardworked but fully enjoyed my time with the team.</p>
+<h2><a href="https://y.co" target="_blank">Y.CO</a> - The Yacht Company</h2>
+<h3>Fullstack</h3>
+<h4>Nov 2010 - Aug 2013, Monaco</h4>
+<p><strong>In-house developer for a yacht company based in Monaco</strong>. My role within the company was diverse. I mostly worked autonomously, managing projects and building tools for charter destinations and another for charter yacht selections. Whilst at the company I learnt to speak French. Voilà.</p>
+<h2><a href="https://www.compass-group.co.uk/" target="_blank">Acquire Services</a> - Procurement</h2>
+<h3>UI Developer</h3>
+<h4>Aug 2007 - Oct 2010, Skipton</h4>
+<h2><a href="https://skysports.com" target="_blank">Sky Sports</a></h2>
+<h3>ActionScript Developer</h3>
+<h4>June 2006 - Aug 2007, Harrogate</h4>
+<h1 data-id="Education">Education</h1>
+<h3>BA in Electronic Media Design</h3>
+<h4>2001 - 2004, University&nbsp;of&nbsp;Sunderland</h4>
+<h3>BTEC Design &amp; A level Photography</h3>
+<h4>1999 - 2001, Harrogate&nbsp;Art&nbsp;College</h4>
+<h3>9 GCSEs (Maths,English)</h3>
+<h4>1994 - 1999, Harrogate&nbsp;Grammar&nbsp;School</h4>
+
+    </div>
+  </main>
+  <div class="post-script">
+
+    <a href="/documents/cv/2024-02-04.pdf">⤓ PDF</a>
+
+
+    <a href="https://github.com/robstarbuck/documents/blob/master/cv/index.md">Markdown</a>
+
+  </div>
+  <footer>
+    <a href="https://github.com/robstarbuck">
+      <!--?xml version="1.0" encoding="UTF-8" standalone="no"?-->
+
+<svg width="100%" height="100%" viewbox="0 0 1501 406" version="1.1" xmlns="http://www.w3.org/2000/svg" xlink="http://www.w3.org/1999/xlink" space="preserve" xmlns:serif="http://www.serif.com/" style="fill: #2b2031;fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M177.281,41.988L147.014,41.988C146.233,41.988 145.6,42.622 145.6,43.403L145.6,58.201C145.6,58.982 146.233,59.618 147.014,59.618L158.821,59.618L158.821,78.003C158.821,78.003 156.17,78.907 148.84,78.907C140.193,78.907 128.113,75.747 128.113,49.183C128.113,22.614 140.692,19.118 152.501,19.118C162.724,19.118 167.127,20.918 169.93,21.785C170.811,22.055 171.625,21.178 171.625,20.397L175.001,6.099C175.001,5.733 174.877,5.293 174.461,4.994C173.323,4.182 166.38,0.297 148.84,0.297C128.634,0.297 107.908,8.894 107.908,50.219C107.908,91.545 131.638,97.704 151.635,97.704C168.192,97.704 178.236,90.628 178.236,90.628C178.65,90.4 178.695,89.821 178.695,89.556L178.695,43.403C178.695,42.622 178.062,41.988 177.281,41.988Z" style="fill-rule:nonzero;"></path>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M333.265,5.249C333.265,4.462 332.641,3.826 331.859,3.826L314.817,3.826C314.039,3.826 313.406,4.462 313.406,5.249C313.406,5.253 313.411,38.183 313.411,38.183L286.846,38.183L286.846,5.249C286.846,4.462 286.22,3.826 285.44,3.826L268.399,3.826C267.624,3.826 266.991,4.462 266.991,5.249L266.991,94.427C266.991,95.213 267.624,95.853 268.399,95.853L285.44,95.853C286.22,95.853 286.846,95.213 286.846,94.427L286.846,56.282L313.411,56.282C313.411,56.282 313.364,94.424 313.364,94.427C313.364,95.213 313.996,95.853 314.776,95.853L331.858,95.853C332.639,95.853 333.263,95.213 333.265,94.427L333.265,5.249Z" style="fill-rule:nonzero;"></path>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M209.44,16.951C209.44,10.815 204.521,5.856 198.451,5.856C192.387,5.856 187.463,10.815 187.463,16.951C187.463,23.081 192.387,28.054 198.451,28.054C204.521,28.054 209.44,23.081 209.44,16.951Z" style="fill-rule:nonzero;"></path>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M208.222,93.564L208.222,34.45C208.222,33.669 207.591,33.03 206.812,33.03L189.823,33.03C189.044,33.03 188.347,33.833 188.347,34.615L188.347,93.592C188.347,95.325 189.427,95.84 190.824,95.84L206.13,95.84C207.81,95.84 208.222,95.016 208.222,93.564Z" style="fill-rule:nonzero;"></path>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M398.032,33.164L381.121,33.164C380.346,33.164 379.714,33.803 379.714,34.59L379.714,78.316C379.714,78.316 375.417,81.46 369.319,81.46C363.222,81.46 361.604,78.693 361.604,72.722L361.604,34.59C361.604,33.803 360.974,33.164 360.197,33.164L343.033,33.164C342.259,33.164 341.624,33.803 341.624,34.59L341.624,75.609C341.624,93.344 351.508,97.683 365.105,97.683C376.261,97.683 385.255,91.52 385.255,91.52C385.255,91.52 385.683,94.768 385.877,95.153C386.07,95.537 386.575,95.925 387.121,95.925L398.04,95.877C398.814,95.877 399.449,95.237 399.449,94.453L399.443,34.59C399.443,33.803 398.812,33.164 398.032,33.164Z" style="fill-rule:nonzero;"></path>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M437.584,81.406C431.718,81.227 427.739,78.565 427.739,78.565L427.739,50.325C427.739,50.325 431.664,47.919 436.48,47.489C442.57,46.943 448.438,48.783 448.438,63.31C448.438,78.63 445.79,81.653 437.584,81.406ZM444.254,31.161C434.649,31.161 428.116,35.446 428.116,35.446L428.116,5.249C428.116,4.462 427.486,3.826 426.71,3.826L409.619,3.826C408.842,3.826 408.211,4.462 408.211,5.249L408.211,94.427C408.211,95.213 408.842,95.853 409.621,95.853L421.479,95.853C422.013,95.853 422.417,95.578 422.716,95.096C423.011,94.617 423.436,90.984 423.436,90.984C423.436,90.984 430.424,97.607 443.653,97.607C459.185,97.607 468.092,89.729 468.092,62.241C468.092,34.753 453.866,31.161 444.254,31.161Z" style="fill-rule:nonzero;"></path>
+    </g>
+    <g transform="matrix(4.16667,0,0,4.16667,-449.617,-1.23749)">
+        <path d="M257.202,33.022L244.418,33.022C244.418,33.022 244.399,16.137 244.399,16.133C244.399,15.494 244.069,15.174 243.33,15.174L225.91,15.174C225.232,15.174 224.869,15.473 224.869,16.123L224.869,33.576C224.869,33.576 216.139,35.683 215.548,35.853C214.961,36.024 214.528,36.566 214.528,37.213L214.528,48.18C214.528,48.968 215.158,49.604 215.937,49.604L224.869,49.604L224.869,75.989C224.869,95.585 238.615,97.51 247.89,97.51C252.129,97.51 257.199,96.149 258.036,95.84C258.542,95.654 258.836,95.13 258.836,94.561L258.851,82.497C258.851,81.71 258.186,81.073 257.437,81.073C256.691,81.073 254.787,81.376 252.825,81.376C246.545,81.376 244.418,78.457 244.418,74.678C244.418,70.901 244.417,49.604 244.417,49.604L257.202,49.604C257.98,49.604 258.612,48.968 258.612,48.18L258.612,34.443C258.612,33.656 257.98,33.022 257.202,33.022Z" style="fill-rule:nonzero;"></path>
+    </g>
+</svg>
+
+      <time datetime="2024-03-08 16:22:08.000">Built 2024-03-08</time>
+    </a>
+  </footer>
+
+<link rel="stylesheet" href="/minireset.css">
+<link rel="stylesheet" href="/vertical-rhythm.css">
+<link rel="stylesheet" href="/index.css">
+<link rel="stylesheet" href="/cv.css">
+
+</body></html>
diff --git a/documents/cv/2024-02-04.pdf b/documents/cv/2024-02-04.pdf
diff --git a/documents/cv/archive/2022-02-16.pdf b/documents/cv/archive/2022-02-16.pdf
diff --git a/documents/cv/archive/2022-05-23.pdf b/documents/cv/archive/2022-05-23.pdf
diff --git a/documents/cv/archive/2022-06-15.pdf b/documents/cv/archive/2022-06-15.pdf
diff --git a/documents/cv/archive/2022-10-01.pdf b/documents/cv/archive/2022-10-01.pdf
diff --git a/documents/cv/archive/2024-01-22.pdf b/documents/cv/archive/2024-01-22.pdf
diff --git a/font.css b/font.css
@@ -0,0 +1,24 @@
+/* https://rsms.me/inter/ */
+html, button {
+    font-family: "Inter", sans-serif;
+}
+
+@supports (font-variation-settings: normal) {
+    html, button {
+        font-family: "Inter var", sans-serif;
+    }
+}
+
+@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap');
+pre code {
+    border-radius: calc(var(--r) * 0.25);
+    display: block;
+    padding: calc(var(--pd) * 0.5);
+    color: var(--highlight-color);
+    background: var(--highlight-bg);
+
+    font-family: "JetBrains Mono", monospace;
+    font-optical-sizing: auto;
+    font-weight: 400;
+    font-style: normal;
+}