Главная Обзор Помощь
Регистрация Вход
hr
/
resume_builder
Следить 2
В избранное 0
Ответвить 0
Файлы Обсуждения 0 Запросы на слияние 0 Вики
Просмотр исходного кода

Move components into View

theenglishway (time) 2 лет назад
Родитель
96889f5bac
Сommit
61d71e3b30
2 измененных файлов с 259 добавлено и 227 удалено
Единый вид Показать статистику Diff
  1. 69 0
      cv_gen/lib/cv_gen_view.ex
  2. 190 227
      cv_gen/lib/templates/cv.html.heex

+ 69 - 0
cv_gen/lib/cv_gen_view.ex
Просмотреть файл 

@@ -13,6 +13,75 @@ defmodule CvGenView do
 
     """
 
     """
 
   end
 
   end
 
 
 
+  attr(:work, :map)
 
+
 
+  def work(assigns) do
 
+    ~H"""
 
+    <div>
 
+      <h1><%= @work.name %></h1>
 
+
 
+      <dl>
 
+        <dt class="position" lang="fr">Poste</dt>
 
+        <dd lang="fr"><%= @work.position %></dd>
 
+        <dt class="start_date">Date début</dt>
 
+        <dd><.date class="start_date" date={@work.startDate} /></dd>
 
+        <%= unless is_nil(@work[:endDate]) do %>
 
+          <dt class="end_date">Date fin</dt>
 
+          <dd><.date class="end_date" date={@work.endDate} /></dd>
 
+        <% end %>
 
+        <dt class="work_location"></dt>
 
+        <dd>Paris</dd>
 
+      </dl>
 
+
 
+      <p class="summary" lang="en"><%= @work.summary %></p>
 
+
 
+      <ul class="highlights">
 
+        <%= for highlight <- @work.highlights do %>
 
+          <li><%= highlight %></li>
 
+        <% end %>
 
+      </ul>
 
+    </div>
 
+    """
 
+  end
 
+
 
+  attr(:skill, :map)
 
+
 
+  def skill(assigns) do
 
+    ~H"""
 
+    <h1><%= @skill.name %></h1>
 
+    <ul>
 
+      <%= for kw <- @skill.keywords do %>
 
+        <li><%= kw %></li>
 
+      <% end %>
 
+    </ul>
 
+    """
 
+  end
 
+
 
+  attr(:educ, :map)
 
+
 
+  def education(assigns) do
 
+    ~H"""
 
+    <h1><%= @educ.institution %></h1>
 
+
 
+    <dl>
 
+      <dt class="location"></dt>
 
+      <dd><%= @educ[:location] %></dd>
 
+      <dt class="start_date">Date début</dt>
 
+      <dd><.date class="start_date" date={@educ.startDate} /></dd>
 
+      <dt class="end_date">Date fin</dt>
 
+      <dd><.date class="end_date" date={@educ.endDate} /></dd>
 
+    </dl>
 
+    """
 
+  end
 
+
 
+  attr(:lang, :map)
 
+
 
+  def language(assigns) do
 
+    ~H"""
 
+    <%= @lang.language %> (<%= @lang.fluency %>)
 
+    """
 
+  end
 
+
 
   def __after_compile__(_env, _bytecode) do
 
   def __after_compile__(_env, _bytecode) do
 
     CvGen.generate()
 
     CvGen.generate()
 
   end
 
   end

+ 190 - 227
cv_gen/lib/templates/cv.html.heex
Просмотреть файл 

@@ -1,230 +1,193 @@
 
 <!DOCTYPE html>
 
 <!DOCTYPE html>
 
 <html lang="en">
 
 <html lang="en">
 
-
 
-<head>
 
-  <meta charset="UTF-8">
 
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
-  <title>Document</title>
 
-  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" integrity="sha512NhSC1YmyruXifcj/KFRWoC561YpHpc5Jtzgvbuzx5VozKpWvQ+4nXhPdFgmx8xqexRcpAglTj9sIBWINXa8x5w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
 
-  <style>
 
-    @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800);
 
-    @charset "utf-8";
 
-
 
-    @-webkit-viewport {
 
-      width: device-width;
 
-    }
 
-
 
-    @-moz-viewport {
 
-      width: device-width;
 
-    }
 
-
 
-    @-ms-viewport {
 
-      width: device-width;
 
-    }
 
-
 
-    @-o-viewport {
 
-      width: device-width;
 
-    }
 
-
 
-    @viewport {
 
-      width: device-width;
 
-    }
 
-
 
-    html {
 
-      background-color: rgb(51, 73, 96);
 
-    }
 
-
 
-    * {
 
-      box-sizing: border-box;
 
-    }
 
-
 
-    h1, h2, h3, h4, h5, h6 {
 
-      font-size: 1em;
 
-    }
 
-
 
-    ol,
 
-    ul {
 
-      list-style: none;
 
-      padding-inline: 0;
 
-    }
 
-
 
-    body {
 
-      width: 80;
 
-      max-width: 120ch;
 
-      margin-top: 2em;
 
-      margin-bottom: 2em;
 
-      margin-right: auto;
 
-      margin-left: auto;
 
-      padding: 1em;
 
-      background-color: white;
 
-      font-family: 'Open Sans', Arial, Tahoma;
 
-      font-weight: 400;
 
-
 
-      display: grid;
 
-      grid-template-areas:
 
-      "basics basics"
 
-      "work education"
 
-      "work skills"
 
-      "work languages"
 
-      "work _";
 
-    }
 
-
 
-    dl {
 
-      display: grid;
 
-      grid-template-columns: auto 1fr;
 
-    }
 
-
 
-    dt {
 
-      grid-column: 1/2;
 
-    }
 
-
 
-    dd {
 
-      grid-column: 2/3;
 
-    }
 
-
 
-    #basics {
 
-      grid-area: basics;
 
-
 
-      display: grid;
 
-      justify-items: center;
 
-    }
 
-
 
-    #work {
 
-      grid-area: work;
 
-    }
 
-
 
-    #basics>h1,
 
-    #basics>h2 {
 
-      text-transform: uppercase;
 
-    }
 
-
 
-    data.name::after {
 
-      content: attr(value);
 
-    }
 
-
 
-    data.position[lang="fr"]::after {
 
-      content: 'Poste: ' attr(value);
 
-    }
 
-
 
-    data.position[lang="en"]::after {
 
-      display: none;
 
-    }
 
-
 
-    dt.work_location+dd::before,
 
-    data.work_location::after {
 
-      content: '🏢 ' attr(value);
 
-    }
 
-
 
-    dt.location::after,
 
-    data.location::after {
 
-      content: '🏠 ' attr(value);
 
-    }
 
-
 
-    li h1,
 
-    li h2,
 
-    li h3 {
 
-      font-weight: 500;
 
-    }
 
-
 
-    #skills .tools::after {
 
-      content: "Outils";
 
-    }
 
-  </style>
 
-</head>
 
-
 
-<body>
 
-  <div id="basics">
 
-    <h1><%= @basics.name %></h1>
 
-    <h2><%= @basics.label %></h2>
 
-
 
-    <dl>
 
-      <dt class="location">Lieu</dt>
 
-      <dd><%= @basics.location.city %></dd>
 
-    </dl>
 
-  </div>
 
-
 
-  <div id="work">
 
-    <h1>Expériences professionnelles</h1>
 
-    <ol>
 
-      <%= for work <- @work do %>
 
-      <li>
 
-        <div>
 
-          <h1><%= work.name %></h1>
 
-
 
-          <dl>
 
-            <dt class="position" lang="fr">Poste</dt>
 
-            <dd lang="fr"><%= work.position %></dd>
 
-            <dt class="start_date">Date début</dt>
 
-            <dd><.date class="start_date" date={work.startDate}/></dd>
 
-            <%= unless is_nil(work[:endDate]) do %>
 
-              <dt class="end_date">Date fin</dt>
 
-              <dd><.date class="end_date" date={work.endDate}/></dd>
 
-              <% end %>
 
-            <dt class="work_location"></dt>
 
-            <dd>Paris</dd>
 
-          </dl>
 
-
 
-          <p class="summary" lang="en"><%= work.summary %></p>
 
-
 
-          <ul class="highlights">
 
-            <%= for highlight <- work.highlights do %>
 
-              <li><%= highlight %></li>
 
-            <% end %>
 
-          </ul>
 
-        </div>
 
-      </li>
 
-      <% end %>
 
-    </ol>
 
-  </div>
 
-
 
-  <div id="skills">
 
-    <h1>Compétences</h1>
 
-
 
-    <ul>
 
-      <%= for skill <- @skills do %>
 
-        <li>
 
-          <h1><%= skill.name %></h1>
 
-          <ul>
 
-            <%= for kw <- skill.keywords do %>
 
-              <li><%= kw %></li>
 
-            <% end %>
 
-          </ul>
 
-        </li>
 
-      <% end %>
 
-    </ul>
 
-  </div>
 
-
 
-  <div id="education">
 
-    <h1>Formation</h1>
 
-
 
-    <ol>
 
-      <%= for educ <- @education do %>
 
-        <li>
 
-          <h1><%= educ.institution %></h1>
 
-
 
-          <dl>
 
-            <dt class="location"></dt>
 
-            <dd><%= educ[:location] %></dd>
 
-            <dt class="start_date">Date début</dt>
 
-            <dd><.date class="start_date" date={educ.startDate}/></dd>
 
-            <dt class="end_date">Date fin</dt>
 
-            <dd><.date class="end_date" date={educ.endDate}/></dd>
 
-          </dl>
 
-        </li>
 
-      <% end %>
 
-    </ol>
 
-  </div>
 
-
 
-  <div id="languages">
 
-    <h1>Langues</h1>
 
-
 
-    <ul>
 
-      <%= for lang <- @languages do %>
 
-        <li><%= lang.language %> (<%= lang.fluency %>)</li>
 
-      <% end %>
 
-    </ul>
 
-  </div>
 
-</body>
 
-
 
+  <head>
 
+    <meta charset="UTF-8" />
 
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
+    <title>Document</title>
 
+    <link
 
+      rel="stylesheet"
 
+      href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css"
 
+      integrity="sha512NhSC1YmyruXifcj/KFRWoC561YpHpc5Jtzgvbuzx5VozKpWvQ+4nXhPdFgmx8xqexRcpAglTj9sIBWINXa8x5w=="
 
+      crossorigin="anonymous"
 
+      referrerpolicy="no-referrer"
 
+    />
 
+    <style>
 
+      @import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800);
 
+      @charset "utf-8";
 
+
 
+      @-webkit-viewport {
 
+        width: device-width;
 
+      }
 
+
 
+      @-moz-viewport {
 
+        width: device-width;
 
+      }
 
+
 
+      @-ms-viewport {
 
+        width: device-width;
 
+      }
 
+
 
+      @-o-viewport {
 
+        width: device-width;
 
+      }
 
+
 
+      @viewport {
 
+        width: device-width;
 
+      }
 
+
 
+      html {
 
+        background-color: rgb(51, 73, 96);
 
+      }
 
+
 
+      * {
 
+        box-sizing: border-box;
 
+      }
 
+
 
+      h1, h2, h3, h4, h5, h6 {
 
+        font-size: 1em;
 
+      }
 
+
 
+      ol,
 
+      ul {
 
+        list-style: none;
 
+        padding-inline: 0;
 
+      }
 
+
 
+      body {
 
+        width: 80;
 
+        max-width: 120ch;
 
+        margin-top: 2em;
 
+        margin-bottom: 2em;
 
+        margin-right: auto;
 
+        margin-left: auto;
 
+        padding: 1em;
 
+        background-color: white;
 
+        font-family: 'Open Sans', Arial, Tahoma;
 
+        font-weight: 400;
 
+
 
+        display: grid;
 
+        grid-template-areas:
 
+        "basics basics"
 
+        "work education"
 
+        "work skills"
 
+        "work languages"
 
+        "work _";
 
+      }
 
+
 
+      dl {
 
+        display: grid;
 
+        grid-template-columns: auto 1fr;
 
+      }
 
+
 
+      dt {
 
+        grid-column: 1/2;
 
+      }
 
+
 
+      dd {
 
+        grid-column: 2/3;
 
+      }
 
+
 
+      #basics {
 
+        grid-area: basics;
 
+
 
+        display: grid;
 
+        justify-items: center;
 
+      }
 
+
 
+      #work {
 
+        grid-area: work;
 
+      }
 
+
 
+      #basics>h1,
 
+      #basics>h2 {
 
+        text-transform: uppercase;
 
+      }
 
+
 
+      data.name::after {
 
+        content: attr(value);
 
+      }
 
+
 
+      data.position[lang="fr"]::after {
 
+        content: 'Poste: ' attr(value);
 
+      }
 
+
 
+      data.position[lang="en"]::after {
 
+        display: none;
 
+      }
 
+
 
+      dt.work_location+dd::before,
 
+      data.work_location::after {
 
+        content: '🏢 ' attr(value);
 
+      }
 
+
 
+      dt.location::after,
 
+      data.location::after {
 
+        content: '🏠 ' attr(value);
 
+      }
 
+
 
+      li h1,
 
+      li h2,
 
+      li h3 {
 
+        font-weight: 500;
 
+      }
 
+
 
+      #skills .tools::after {
 
+        content: "Outils";
 
+      }
 
+    </style>
 
+  </head>
 
+
 
+  <body>
 
+    <div id="basics">
 
+      <h1><%= @basics.name %></h1>
 
+      <h2><%= @basics.label %></h2>
 
+
 
+      <dl>
 
+        <dt class="location">Lieu</dt>
 
+        <dd><%= @basics.location.city %></dd>
 
+      </dl>
 
+    </div>
 
+
 
+    <div id="work">
 
+      <h1>Expériences professionnelles</h1>
 
+      <ol>
 
+        <%= for work <- @work do %>
 
+          <li>
 
+            <.work work={work} />
 
+          </li>
 
+        <% end %>
 
+      </ol>
 
+    </div>
 
+
 
+    <div id="skills">
 
+      <h1>Compétences</h1>
 
+
 
+      <ul>
 
+        <%= for skill <- @skills do %>
 
+          <li><.skill skill={skill} /></li>
 
+        <% end %>
 
+      </ul>
 
+    </div>
 
+
 
+    <div id="education">
 
+      <h1>Formation</h1>
 
+
 
+      <ol>
 
+        <%= for educ <- @education do %>
 
+          <li><.education educ={educ} /></li>
 
+        <% end %>
 
+      </ol>
 
+    </div>
 
+
 
+    <div id="languages">
 
+      <h1>Langues</h1>
 
+
 
+      <ul>
 
+        <%= for lang <- @languages do %>
 
+          <li><.language lang={lang} /></li>
 
+        <% end %>
 
+      </ul>
 
+    </div>
 
+  </body>
 
 </html>
 
 </html>