change chronology table

docs/.vuepress/config.ts

@@ -43,8 +43,8 @@ export default defineUserConfig({
           description: "Описание",
           role: "Роль",
           technologies: "Технологии",
-          start: "Начало",
-          statusOrEnd: "Статус/Окончание",
+          status: "Статус",
+          dates: "Даты",
         },
       },
       "/eng/": {
@@ -64,8 +64,8 @@ export default defineUserConfig({
           description: "Description",
           role: "Role",
           technologies: "Technologies",
-          start: "Start",
-          statusOrEnd: "Status/End",
+          status: "Status",
+          dates: "Dates",
         },
       },
     },

docs/.vuepress/modules/work/ChronologicalWorksTable/ChronologicalWorksTable.vue

@@ -1,21 +1,20 @@
 <script lang="ts">
 export default {
-  name: 'WorksPage',
+  name: "WorksPage",
   computed: {
     tableTheme() {
       return this.$themeLocale.worksTable ?? {};
     },
   },
-}
+};
 </script>
 
 <script lang="ts" setup>
-import { CHRONOLOGICAL_WORKS } from '../data.ts'
-import { renderDate } from '../../../global.ts'
-import { work as w } from '../domain'
+import { CHRONOLOGICAL_WORKS } from "../data.ts";
+import { renderDate } from "../../../global.ts";
+import { work as w } from "../domain";
 </script>
 
-
 <template>
   <table>
     <thead>
@@ -24,21 +23,37 @@ import { work as w } from '../domain'
         <th>{{ tableTheme.description }}</th>
         <th>{{ tableTheme.role }}</th>
         <th>{{ tableTheme.technologies }}</th>
-        <th>{{ tableTheme.start }}</th>
-        <th>{{ tableTheme.statusOrEnd }}</th>
+        <th>{{ tableTheme.status }}</th>
+        <th>{{ tableTheme.dates }}</th>
       </tr>
-
     </thead>
     <tbody>
       <tr v-for="work in CHRONOLOGICAL_WORKS">
-          <td><a rel="nofollow noopener" :href="w.getExternalLink(work)">{{ work.name }}</a></td>
-          <td>{{ work.description }}</td>
-          <td v-html="work.roles.join(', ')"></td>
-          <td>{{ work.technologies.join(', ') }}</td>
-          <td>{{ renderDate(work.startDate) }}</td>
-          <td>{{ work.endDate ? renderDate(work.endDate) : work.status }}</td>
+        <td>
+          <a rel="nofollow noopener" :href="w.getExternalLink(work)">{{
+            work.name
+          }}</a>
+        </td>
+        <td>{{ work.description }}</td>
+        <td v-html="work.roles.join(', ')"></td>
+        <td>{{ work.technologies.join(", ") }}</td>
+        <td>{{ work.status }}</td>
+        <td>
+          <div>
+            <small :class="{ grey: work.endDate }">{{ renderDate(work.startDate) }}</small>
+          </div>
+          <div v-if="work.endDate">
+            <small>{{ renderDate(work.endDate) }}</small>
+          </div>
+        </td>
       </tr>
     </tbody>
   </table>
 </template>
 
+<style lang="css">
+.grey {
+  color: rgba(0,0,0,0.4);
+}
+
+</style>

docs/.vuepress/modules/work/ChronologicalWorksTable/TechnologyList.ts

@@ -1,7 +0,0 @@
-import { NonEmptyArray } from "../../../global.ts";
-import { Technology } from "../domain/mod.ts";
-import { AnyNode, TextNode } from "ren/node.ts";
-
-export const TechnologyList: (techs: NonEmptyArray<Technology>) => AnyNode = (
-  techs,
-) => new TextNode(techs.join(", "));