From f4ca4cbe46d0d81fcfe6348606a2e3dbcbcb65c8 Mon Sep 17 00:00:00 2001
From: Reorx <novoreorx@gmail.com>
Date: Sat, 11 Feb 2023 15:15:41 +0800
Subject: [PATCH] theme reorx: enhance styles

---
 README.md                   |  2 +-
 sample.resume.json          | 13 +++++++++----
 src/themes/reorx/index.ejs  |  6 +++---
 src/themes/reorx/index.scss |  6 +++---
 4 files changed, 16 insertions(+), 11 deletions(-)

diff --git a/README.md b/README.md
index e11fbd3..df540cd 100755
--- a/README.md
+++ b/README.md
@@ -59,7 +59,7 @@ The core product of jsoncv is CV HTML, which is the HTML representation of your
 It is a compact, single-file HTML document that can be converted to PDF or hosted online to create a static CV website.
 
 CV HTML is designed with a specific layout to display a CV on an A4 sheet of paper.
-The CSS has been tailored to optimize printing, ensuring the best output whether printed on paper or saved as a PDF.
+The CSS has been tailored to optimize printing, ensuring the best typography whether printed on paper or saved as a PDF.
 Therefore, CV HTML is best suited for creating professional or academic CVs/resumes,
 rather than creative or interactive portfolio websites.
 
diff --git a/sample.resume.json b/sample.resume.json
index dc8ebde..83c4875 100644
--- a/sample.resume.json
+++ b/sample.resume.json
@@ -154,12 +154,17 @@
       ]
     },
     {
-      "name": "Compression",
+      "name": "UI Design",
       "level": "Master",
+      "summary": "Highly skilled in UI design with a strong understanding of design principles, user experience, and industry-standard tools. Proficient in creating visually appealing and user-friendly interfaces for web and mobile applications.",
       "keywords": [
-        "Mpeg",
-        "MP4",
-        "GIF"
+        "User Experience",
+        "Wireframing",
+        "Prototyping",
+        "Figma",
+        "Sketch",
+        "InVision",
+        "Axure"
       ]
     },
     {
diff --git a/src/themes/reorx/index.ejs b/src/themes/reorx/index.ejs
index 7b7c058..517a85f 100644
--- a/src/themes/reorx/index.ejs
+++ b/src/themes/reorx/index.ejs
@@ -144,7 +144,7 @@ function dateRange(item, level) {
         <%- linkInDiv(item.url) %>
       </div>
       <div class="row space-between">
-        <div class="roles _fz-4"><%= item.roles.join(', ') %></div>
+        <div class="roles _ul _fz-4"><%= item.roles.join(', ') %></div>
         <%- dateRange(item, 2) %>
       </div>
       <div class="p"><%- fn.renderMarkdown(item.description) %></div>
@@ -210,7 +210,7 @@ function dateRange(item, level) {
   <% for (const item of cv.skills) { %>
     <div class="skill section-item">
       <h3><%= item.name %></h3>
-      <div class="level row _fz-4"><%= item.level %></div>
+      <div class="level row _ul _fz-4"><%= item.level %></div>
       <% if (item.summary) { %>
         <div class="summary p"><%- fn.renderMarkdown(item.summary) %></div>
       <% } %>
@@ -237,7 +237,7 @@ function dateRange(item, level) {
   <% for (const item of cv.languages) { %>
     <div class="language section-item">
       <h3><%= item.language %></h3>
-      <div class="fluency row _fz-4"><%= item.fluency %></div>
+      <div class="fluency row _ul _fz-4"><%= item.fluency %></div>
       <% if (item.summary) { %>
         <div class="summary p"><%- fn.renderMarkdown(item.summary) %></div>
       <% } %>
diff --git a/src/themes/reorx/index.scss b/src/themes/reorx/index.scss
index c3abb31..17bb1b9 100644
--- a/src/themes/reorx/index.scss
+++ b/src/themes/reorx/index.scss
@@ -46,6 +46,7 @@ section {
 
     h3 {
       font-size: $fz-3;
+      line-height: 1.4;
       margin: 0;
     }
 
@@ -84,6 +85,8 @@ section {
     display: flex;
     flex-wrap: wrap;
     gap: 6px 8px;
+    margin-top: .8em;
+
     .item {
       font-size: 13px;
       color: #555;
@@ -139,9 +142,6 @@ section {
 }
 
 .skills-section {
-  .level {
-    margin: .8em 0;
-  }
 }
 
 footer {