Adjust fonts and branding

Make branding more consistent.

packages/web/src/components/molecules/Brand/index.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 
 export const Brand = () => (
-	<span className="rounded-[0.25em] lowercase align-middle font-headings bg-positive text-negative px-1.5 font-semibold -mx-2 before:content-['@']">
+	<span className="rounded-[0.25em] lowercase align-middle font-headings bg-positive text-negative px-[0.125em] pb-[0.2em] inline-block leading-none font-semibold -mx-2 before:content-['@']">
     TheoryOfNekomata
   </span>
 );

packages/web/src/components/molecules/Footer/index.tsx

@@ -2,6 +2,18 @@ import * as React from 'react';
 import {Layouts} from '@tesseract-design/viewfinder-react';
 import {Brand} from '@/components/molecules/Brand';
 
+const formatYear = (yearStarted: number, yearEnded: number) => {
+	if (yearStarted === yearEnded) {
+		return yearStarted;
+	}
+
+	return (
+		<>
+			{yearStarted}&ndash;{yearEnded}
+		</>
+	);
+}
+
 export const Footer = () => (
 	<footer className="py-12 sm:py-24 flex items-center relative">
 		<div
@@ -144,7 +156,7 @@ export const Footer = () => (
 					<Brand/>
 				</span>
 				{' '}
-				{new Date().getFullYear()}.
+				{formatYear(2023, new Date().getFullYear())}.
 			</div>
 		</Layouts.Basic.ContentContainer>
 	</footer>

packages/web/src/pages/index.tsx

@@ -37,6 +37,21 @@ const envisionSectionData = new Array(6).fill(null).map((_, index) => ({
 }));
 
 const featuredProjectData = [
+  {
+    title: 'yasumi',
+    description: 'HATEOAS-first, resource-based backend framework in Node.',
+    links:[
+      {
+        href: 'https://code.modal.sh/modal-soft/yasumi',
+        children: 'Explore Code',
+        primary: true,
+      },
+    ],
+    showcase: {
+      type: 'img' as const,
+      src: '/images/a96d02d8cc43cc3b9f1e77c43dfa5644.png',
+    },
+  },
   {
     title: 'formxtra',
     description: "Extract and set form values through the DOM—no frameworks required!",