feat: improve README design and readability (#120)

README.md

@@ -1,4 +1,8 @@
-# Modern CV
+<h1 align="center">
+  <img src="assets/images/header.png" alt="Header">
+  <br><br>
+  Modern CV
+</h1>
 
 [![say thanks](https://img.shields.io/badge/Say%20Thanks-👍-1EAEDB.svg)](https://github.com/DeveloperPaul123/modern-cv/stargazers)
 [![Discord](https://img.shields.io/discord/652515194572111872?logo=Discord)](https://discord.gg/CX2ybByRnt)
@@ -7,6 +11,20 @@
 
 A port of the [Awesome-CV](https://github.com/posquit0/Awesome-CV) Latex resume template in [typst](https://github.com/typst/typst).
 
+## Features
+
+- Modern and clean design
+- Easy to use and customize (colors, profile picture, fonts, etc.)
+- Support for multiple sections (education, experience, skills, etc.)
+- Support for multiple languages
+
+## Preview
+
+| Resumes | Cover letters |
+| --- | --- |
+| ![Resume](assets/images/resume.png) | ![Cover Letter](assets/images/coverletter.png) |
+| ![Resume 2](assets/images/resume2.png) | ![Cover Letter 2](assets/images/coverletter2.png)|
+
 ## Requirements
 
 ### Tools
@@ -85,13 +103,6 @@ For more information on how to use and compile `typst` files, see the [official
 
 Documentation for this template is published with each commit. See the attached PDF on each Github Action run [here](https://github.com/DeveloperPaul123/modern-cv/actions).
 
-### Output Examples
-
-| Resumes | Cover letters |
-| --- | --- |
-| ![Resume](assets/images/resume.png) | ![Cover Letter](assets/images/coverletter.png) |
-| ![Resume 2](assets/images/resume2.png) | ![Cover Letter 2](assets/images/coverletter2.png)|
-
 ## Building and Testing Locally
 
 To build and test the project locally, you will need to install the `typst` CLI. You can find instructions on how to do this [here](https://github.com/typst/typst#installation).

lib.typ

@@ -273,9 +273,7 @@
         #block[
           #set text(size: 32pt, style: "normal", font: header-font)
           #if language == "zh" or language == "ja" [
-            #text(accent-color, weight: "thin")[#author.firstname]#text(
-              weight: "bold",
-            )[#author.lastname]
+            #text(accent-color, weight: "thin")[#author.firstname]#text(weight: "bold")[#author.lastname]
           ] else [
             #text(accent-color, weight: "thin")[#author.firstname]
             #text(weight: "bold")[#author.lastname]
@@ -350,33 +348,25 @@
           #if ("bitbucket" in author) [
             #separator
             #bitbucket-icon
-            #box[#link(
-                "https://bitbucket.org/" + author.bitbucket,
-              )[#author.bitbucket]]
+            #box[#link("https://bitbucket.org/" + author.bitbucket)[#author.bitbucket]]
           ]
           #if ("linkedin" in author) [
             #separator
             #linkedin-icon
             #box[
-              #link(
-                "https://www.linkedin.com/in/" + author.linkedin,
-              )[#author.firstname #author.lastname]
+              #link("https://www.linkedin.com/in/" + author.linkedin)[#author.firstname #author.lastname]
             ]
           ]
           #if ("twitter" in author) [
             #separator
             #twitter-icon
-            #box[#link(
-                "https://twitter.com/" + author.twitter,
-              )[\@#author.twitter]]
+            #box[#link("https://twitter.com/" + author.twitter)[\@#author.twitter]]
           ]
           #if ("scholar" in author) [
             #let fullname = str(author.firstname + " " + author.lastname)
             #separator
             #google-scholar-icon
-            #box[#link(
-                "https://scholar.google.com/citations?user=" + author.scholar,
-              )[#fullname]]
+            #box[#link("https://scholar.google.com/citations?user=" + author.scholar)[#fullname]]
           ]
           #if ("orcid" in author) [
             #separator
@@ -566,9 +556,7 @@
   show: body => context {
     set document(
       author: author.firstname + " " + author.lastname,
-      title: lflib
-        ._linguify("cover-letter", lang: language, from: lang_data)
-        .ok,
+      title: lflib._linguify("cover-letter", lang: language, from: lang_data).ok,
     )
     body
   }
@@ -615,9 +603,7 @@
         #block[
           #set text(size: 32pt, style: "normal", font: header-font)
           #if language == "zh" or language == "ja" [
-            #text(accent-color, weight: "thin")[#author.firstname]#text(
-              weight: "bold",
-            )[#author.lastname]
+            #text(accent-color, weight: "thin")[#author.firstname]#text(weight: "bold")[#author.lastname]
           ] else [
             #text(accent-color, weight: "thin")[#author.firstname]
             #text(weight: "bold")[#author.lastname]
@@ -680,9 +666,7 @@
       author_list.push[
         #linkedin-icon
         #box[
-          #link(
-            "https://www.linkedin.com/in/" + author.linkedin,
-          )[#author.firstname #author.lastname]
+          #link("https://www.linkedin.com/in/" + author.linkedin)[#author.firstname #author.lastname]
         ]
       ]
     }

scripts/update_thumbnails.ps1

@@ -2,4 +2,4 @@ typst compile -f png $PSScriptRoot/../template/resume.typ $PSScriptRoot/../asset
 typst compile -f png $PSScriptRoot/../template/coverletter.typ $PSScriptRoot/../assets/images/coverletter.png
 typst compile -f png $PSScriptRoot/../template/coverletter2.typ $PSScriptRoot/../assets/images/coverletter2.png
 
-oxipng.exe $PSScriptRoot/../assets/images/*
+oxipng.exe $PSScriptRoot/../assets/images/*.png

template/coverletter.typ

@@ -31,12 +31,14 @@
   paper-size: "us-gov-legal",
 )
 
-#hiring-entity-info(entity-info: (
+#hiring-entity-info(
+  entity-info: (
     target: "Company Recruitement Team",
     name: "Google, Inc.",
     street-address: "1600 AMPHITHEATRE PARKWAY",
     city: "MOUNTAIN VIEW, CA 94043",
-))
+  ),
+)
 
 #letter-heading(job-position: "Software Engineer", addressee: "Sir or Madame")
 

template/coverletter2.typ

@@ -19,12 +19,14 @@
   language: "sp",
 )
 
-#hiring-entity-info(entity-info: (
+#hiring-entity-info(
+  entity-info: (
     target: "Company Recruitement Team",
     name: "Google, Inc.",
     street-address: "1600 AMPHITHEATRE PARKWAY",
     city: "MOUNTAIN VIEW, CA 94043",
-))
+  ),
+)
 
 #letter-heading(job-position: "Software Engineer", addressee: "Sir or Madame")
 

template/resume.typ

@@ -93,21 +93,27 @@
 
 = Skills
 
-#resume-skill-item("Languages", (
+#resume-skill-item(
+  "Languages",
+  (
     strong("C++"),
     strong("Python"),
     "Java",
     "C#",
     "JavaScript",
     "TypeScript",
-))
+  ),
+)
 #resume-skill-item("Spoken Languages", (strong("English"), "Spanish"))
-#resume-skill-item("Programs", (
+#resume-skill-item(
+  "Programs",
+  (
     strong("Excel"),
     "Word",
     "Powerpoint",
     "Visual Studio",
-))
+  ),
+)
 
 = Education