cv.html.heex 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  7. <title>Document</title>
  8. <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Open+Sans" />
  9. <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300" />
  10. <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@700" />
  11. <link
  12. rel="stylesheet"
  13. href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css"
  14. integrity="sha512NhSC1YmyruXifcj/KFRWoC561YpHpc5Jtzgvbuzx5VozKpWvQ+4nXhPdFgmx8xqexRcpAglTj9sIBWINXa8x5w=="
  15. crossorigin="anonymous"
  16. referrerpolicy="no-referrer"
  17. />
  18. <style>
  19. <%= Layout.resets() |> Phoenix.HTML.raw() %>
  20. <%= Layout.page_css() |> Phoenix.HTML.raw() %>
  21. dl {
  22. display: grid;
  23. grid-template-columns: auto 1fr;
  24. }
  25. dt {
  26. grid-column: 1/2;
  27. }
  28. dd {
  29. grid-column: 2/3;
  30. }
  31. <%= Work.css() |> Phoenix.HTML.raw() %>
  32. <%= Basics.css() |> Phoenix.HTML.raw() %>
  33. <%= Skill.css() |> Phoenix.HTML.raw() %>
  34. dt.work_location+dd::before {
  35. content: '🏢 ' attr(value);
  36. }
  37. dt.location::after {
  38. content: '🏠 ' attr(value);
  39. }
  40. </style>
  41. </head>
  42. <body>
  43. <div id="basics">
  44. <Basics.basics name={@basics.name} title={@basics.label} />
  45. </div>
  46. <div id="work" class="section">
  47. <h1>Expériences professionnelles</h1>
  48. <ol>
  49. <%= for work <- @work do %>
  50. <li>
  51. <Work.work {work} />
  52. </li>
  53. <% end %>
  54. </ol>
  55. </div>
  56. <div id="skills" class="section">
  57. <h1>Compétences</h1>
  58. <ul>
  59. <%= for skill <- @skills do %>
  60. <li><Skill.skill skill={skill} /></li>
  61. <% end %>
  62. </ul>
  63. </div>
  64. <div id="education" class="section">
  65. <h1>Formation</h1>
  66. <ol>
  67. <%= for educ <- @education do %>
  68. <li><Education.education educ={educ} /></li>
  69. <% end %>
  70. </ol>
  71. </div>
  72. <div id="languages" class="section">
  73. <h1>Langues</h1>
  74. <ul>
  75. <%= for lang <- @languages do %>
  76. <li><Language.language lang={lang} /></li>
  77. <% end %>
  78. </ul>
  79. </div>
  80. </body>
  81. </html>