Minor imporvements

Zergus · Oct 19, 2023 · 0f95bea · 0f95bea
1 parent 2b9b44a
commit 0f95bea
Show file tree

Hide file tree

Showing 7 changed files with 37 additions and 22 deletions.
diff --git a/bundle.js b/bundle.js
diff --git a/scripts/generate-md.js b/scripts/generate-md.js
@@ -2,7 +2,7 @@ const fs = require("fs");
 const path = require("path");
 
 // Define the path to the JSON file
-const jsonFilePath = path.join(__dirname, "../data", "info.json");
+const jsonFilePath = path.join(__dirname, "../src/data", "info.json");
 
 // Read the JSON file
 fs.readFile(jsonFilePath, "utf8", (err, data) => {

diff --git a/src/App.tsx → src/components/App.tsx b/src/App.tsx → src/components/App.tsx
@@ -1,6 +1,6 @@
 import React from "react";
 import { BrowserRouter, Link, Route, Routes } from "react-router-dom";
-import CV from "./components/CV";
+import CV from "./CV";
 
 const App = () => {
   return (

diff --git a/src/components/CV.tsx b/src/components/CV.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import data from "../../data/info.json";
+import data from "../data/info.json";
 
 const CV = () => {
   return (
@@ -14,7 +14,7 @@ const CV = () => {
       <div className="flex flex-col sm:flex-row">
         <div className="w-full sm:w-1/3 border-r-0 sm:border-r-2 pr-0 sm:pr-4 pb-4 sm:pb-0">
           <div className="mb-6">
-            <h2 className="text-2xl font-semibold mb-4">Details</h2>
+            <h2 className="text-2xl font-semibold mb-4 w-full">Details</h2>
             <ul className="list-inside">
               {data.details.map((detail, index) => (
                 <li key={index} className="items-center mb-2">
@@ -37,9 +37,12 @@ const CV = () => {
             {data.skills.map(({ category, skills }, index) => (
               <div key={index} className="mb-4">
                 <h3 className="text-lg font-semibold mb-2">{category}:</h3>
-                <ul className="flex flex-wrap gap-4 list-inside list-disc">
+                <ul
+                  className="flex flex-wrap gap-4 list-inside list-disc"
+                  role="list"
+                >
                   {skills.map((skill, i) => (
-                    <li key={i} className="text-base">
+                    <li key={i} className="text-base underline" role="listitem">
                       {skill}
                     </li>
                   ))}

diff --git a/data/info.json → src/data/info.json b/data/info.json → src/data/info.json
diff --git a/src/index.css b/src/index.css
@@ -1,31 +1,43 @@
 @import 'tailwindcss/base';
 @import 'tailwindcss/components';
 @import 'tailwindcss/utilities';
+@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
+
+body {
+    font-family: 'Roboto', sans-serif;
+}
+
+h2.text-2xl.font-semibold {
+    background: linear-gradient(to right, grey, white);
+    display: inline-block;
+    padding: 0.2em 0.4em;
+    width: 100%;
+}
 
 @media print {
     html {
         scroll-behavior: smooth;
     }
 
     body {
-    font-size: 0.8em;
-}
+        font-size: 0.8em;
+    }
 
-h1 {
-    font-size: 1.5em;
-}
+    h1 {
+        font-size: 1.5em;
+    }
 
-h2 {
-    font-size: 1.3em;
-}
+    h2 {
+        font-size: 1.3em;
+    }
 
-h3 {
-    font-size: 1.2em;
-}
+    h3 {
+        font-size: 1.2em;
+    }
 
-h4 {
-    font-size: 1.1em;
-}
+    h4 {
+        font-size: 1.1em;
+    }
 
     .shadow-md,
     .rounded-lg {

diff --git a/src/index.tsx b/src/index.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import { createRoot } from "react-dom/client";
 import "./index.css";
-import App from "./App";
+import App from "./components/App";
 
 const container = document.getElementById("root");
 const root = createRoot(container!);