Просмотр исходного кода

streamline components, update text

Aneurin Barker Snook 7 месяцев назад
Родитель
Сommit
7ff7b3b0c2

+ 10 - 10
index.html

@@ -8,7 +8,7 @@
     <link x-data="font" rel="preload" as="style" onload="this.onload=null; this.rel='stylesheet'" x-bind:href="url">
   </head>
   <body>
-    <main>
+    <main x-data="external">
       <section id="top">
         <header>
           <h1>
@@ -17,7 +17,7 @@
           </h1>
         </header>
 
-        <p><strong>Software engineer extraordinaire and founder of <a href="https://www.forandwhile.com" target="_blank" data-umami-event="Clicked link" data-umami-event-link="For &amp; While">For & While</a></strong></p>
+        <p><strong>Software engineer extraordinaire and founder of <a x-bind:href="businessUrl" target="_blank" data-umami-event="Clicked link" data-umami-event-link="For &amp; While">For & While</a></strong></p>
 
         <p>I have been working with computers for over twenty years and love to solve technical and business problems for a fair price.</p>
         <p>
@@ -112,18 +112,18 @@
         </header>
 
         <p>
-          You are welcome to browse my public code online, including the <a href="https://github.com/annybs/www.aneur.in" target="_blank" data-umami-event="Clicked link" data-umami-event-link="Website code">code of the website you're looking at right now</a>.
+          You are welcome to browse my public code online, including the <a x-bind:href="repoUrl" target="_blank" data-umami-event="Clicked link" data-umami-event-link="Website code">code of the website you're looking at right now</a>.
         </p>
 
         <ul>
           <li>
-            <a href="https://goto.aneur.in/go" target="_blank" data-umami-event="Clicked link" data-umami-event-link="Go projects">Go projects</a>
+            <a x-bind:href="goProjectsUrl" target="_blank" data-umami-event="Clicked link" data-umami-event-link="Go projects">Go projects</a>
           </li>
           <li>
-            <a href="https://goto.aneur.in/ts" target="_blank" data-umami-event="Clicked link" data-umami-event-link="TypeScript/JavaScript projects">TypeScript/JavaScript projects</a>
+            <a x-bind:href="tsProjectsUrl" target="_blank" data-umami-event="Clicked link" data-umami-event-link="TypeScript/JavaScript projects">TypeScript/JavaScript projects</a>
           </li>
           <li>
-            <a href="https://goto.aneur.in/pkg" target="_blank" data-umami-event="Clicked link" data-umami-event-link="Packages and Docker images">Packages and Docker images</a>
+            <a x-bind:href="packagesUrl" target="_blank" data-umami-event="Clicked link" data-umami-event-link="Packages and Docker images">Packages and Docker images</a>
           </li>
         </ul>
 
@@ -146,7 +146,7 @@
         </p>
 
         <ul>
-          <li>Day rate (7.5 hours): £300</li>
+          <li>Day rate: £300</li>
           <li>Hourly rate: £45</li>
         </ul>
 
@@ -167,7 +167,7 @@
         </header>
 
         <p>
-          I am currently offering <span class="cta">limited availability</span> to work.
+          I am currently offering <span class="cta">availability</span> to work.
         </p>
 
         <p>
@@ -185,14 +185,14 @@
           <h2>Contact</h2>
         </header>
 
-        <p x-data="contact">
+        <p>
           The best way to reach me is by email.
           Send a message to <a x-bind:href="`mailto:${email}`" x-text="email" data-umami-event="Clicked link" data-umami-event-link="Email"></a> summarising what you're looking for&#11834;or just to say hello!
           I look forward to hearing from you.
         </p>
 
         <p>
-          You can also find me on <a href="https://github.com/annybs/" target="_blank" data-umami-event="Clicked link" data-umami-event-link="GitHub">GitHub</a> and <a href="https://www.linkedin.com/in/aneurinbs/" target="_blank" data-umami-event="Clicked link" data-umami-event-link="LinkedIn">LinkedIn</a>.
+          You can also find me on <a x-bind:href="githubUrl" target="_blank" data-umami-event="Clicked link" data-umami-event-link="GitHub">GitHub</a> and <a x-bind:href="linkedinUrl" target="_blank" data-umami-event="Clicked link" data-umami-event-link="LinkedIn">LinkedIn</a>.
         </p>
       </section>
     </main>

+ 2 - 9
src/components/Analytics.ts

@@ -1,14 +1,7 @@
-export interface AnalyticsState {
-  scriptUrl: string
-  websiteId: string
-}
-
 export default function Analytics(websiteId: string) {
-  const scriptUrl = 'https://analytics.cloud.forandwhile.com/script.js'
-
-  return function(): AnalyticsState {
+  return function() {
     return {
-      scriptUrl,
+      scriptUrl: 'https://analytics.cloud.forandwhile.com/script.js',
       websiteId,
     }
   }

+ 1 - 1
src/components/Color.ts

@@ -7,7 +7,7 @@ export interface ColorState {
   setCurrentScheme(value: ColorScheme, save?: boolean): void
 }
 
-export default function Color(): ColorState {
+export default function Color() {
   const state: ColorState = {
     currentScheme: 'auto',
 

+ 0 - 11
src/components/Contact.ts

@@ -1,11 +0,0 @@
-export interface ContactState {
-  email: string
-}
-
-export default function Contact(): ContactState {
-  const email = 'moc.elihwdnarof@niruena'.split('').reverse().join('')
-
-  return {
-    email,
-  }
-}

+ 17 - 0
src/components/External.ts

@@ -0,0 +1,17 @@
+export default function External() {
+  return {
+    businessUrl: 'https://www.forandwhile.com',
+    githubUrl: 'https://github.com/annybs/',
+    linkedinUrl: 'https://www.linkedin.com/in/aneurinbs/',
+
+    repoUrl: 'https://github.com/annybs/www.aneur.in',
+
+    goProjectsUrl: 'https://goto.aneur.in/go',
+    packagesUrl: 'https://goto.aneur.in/pkg',
+    tsProjectsUrl: 'https://goto.aneur.in/ts',
+
+    get email() {
+      return 'moc.elihwdnarof@niruena'.split('').reverse().join('')
+    },
+  }
+}

+ 2 - 8
src/components/Font.ts

@@ -1,11 +1,5 @@
-export interface FontState {
-  url: string
-}
-
-export default function Font(): FontState {
-  const url = `//${document.location.host}/assets/IosevkaCustom@30.3.0/style.css`
-
+export default function Font() {
   return {
-    url,
+    url: `//${document.location.host}/assets/IosevkaCustom@30.3.0/style.css`,
   }
 }

+ 1 - 3
src/components/Skills.ts

@@ -19,8 +19,6 @@ export interface SkillsState {
 }
 
 export default function Skills(): SkillsState {
-  const url = `//${document.location.host}/data/skills.json`
-
   function readCurrentTag() {
     const usp = new URLSearchParams(window.location.search)
     return usp.get('skill')
@@ -59,7 +57,7 @@ export default function Skills(): SkillsState {
       this.descriptions = readCurrentDescriptions()
 
       try {
-        const res = await fetch(url)
+        const res = await fetch(`//${document.location.host}/data/skills.json`)
         if (res.status !== 200) throw new Error('not OK')
 
         const data = await res.json() as Skill[]

+ 2 - 2
src/main.ts

@@ -2,7 +2,7 @@ import './style.scss'
 import Alpine from 'alpinejs'
 import Analytics from './components/Analytics'
 import Color from './components/Color'
-import Contact from './components/Contact'
+import External from './components/External'
 import Font from './components/Font'
 import Skills from './components/Skills'
 
@@ -10,7 +10,7 @@ function main() {
   (window as unknown as { Alpine: typeof Alpine }).Alpine = Alpine
   Alpine.data('analytics', Analytics(import.meta.env.VITE_ANALYTICS_WEBSITE_ID || ''))
   Alpine.data('color', Color)
-  Alpine.data('contact', Contact)
+  Alpine.data('external', External)
   Alpine.data('font', Font)
   Alpine.data('skills', Skills)
   Alpine.start()