From 16aa71507686214af512b4e0d90bccecde940ab1 Mon Sep 17 00:00:00 2001
From: LJ5O <75009579+LJ5O@users.noreply.github.com>
Date: Tue, 29 Apr 2025 17:23:17 +0200
Subject: [PATCH] New diploma display

---
 src/assets/svg/education/diploma.svg | 166 +++++++++++++++++++++++++++
 src/components/education/diploma.vue |  35 ++++++
 src/views/EducationView.vue          |   2 +
 3 files changed, 203 insertions(+)
 create mode 100644 src/assets/svg/education/diploma.svg
 create mode 100644 src/components/education/diploma.vue

diff --git a/src/assets/svg/education/diploma.svg b/src/assets/svg/education/diploma.svg
new file mode 100644
index 0000000..8539d8c
--- /dev/null
+++ b/src/assets/svg/education/diploma.svg
@@ -0,0 +1,166 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="159.23848mm"
+   height="98.414795mm"
+   viewBox="0 0 159.23848 98.414795"
+   version="1.1"
+   id="svg2556"
+   inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
+   sodipodi:docname="diploma.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview2558"
+     pagecolor="#ffffff"
+     bordercolor="#999999"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.7500982"
+     inkscape:cx="345.9547"
+     inkscape:cy="356.61997"
+     inkscape:window-width="1854"
+     inkscape:window-height="1011"
+     inkscape:window-x="66"
+     inkscape:window-y="32"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="layer17" />
+  <defs
+     id="defs2553" />
+  <g
+     inkscape:label="Calque 1"
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(-13.85463,-54.848419)">
+    <g
+       inkscape:groupmode="layer"
+       id="layer17"
+       inkscape:label="Diploma"
+       transform="translate(-474.09288,-119.83197)">
+      <rect
+         style="fill:#fff6d5;stroke-width:0.264583"
+         id="rect5970"
+         width="159.23848"
+         height="98.414795"
+         x="487.94751"
+         y="174.68039"
+         ry="3.2035432" />
+      <rect
+         style="fill:#454837;stroke-width:0.277784"
+         id="rect7851"
+         width="122.22212"
+         height="7.4638681"
+         x="493.69971"
+         y="181.26762"
+         ry="3.2035432" />
+      <rect
+         style="fill:#536c67;stroke-width:0.1893"
+         id="rect7851-3"
+         width="107.51003"
+         height="3.9405153"
+         x="501.05573"
+         y="201.69247"
+         ry="1.6912961" />
+      <rect
+         style="fill:#939dac;stroke-width:0.168628"
+         id="rect7851-3-6"
+         width="85.311623"
+         height="3.9405153"
+         x="512.15491"
+         y="210.38097"
+         ry="1.6912961" />
+      <rect
+         style="fill:#37483e;stroke-width:0.127644"
+         id="rect7851-3-6-7"
+         width="48.881725"
+         height="3.9405153"
+         x="492.86826"
+         y="236.44052"
+         ry="1.6912961" />
+      <rect
+         style="fill:#8a916f;stroke-width:0.127644"
+         id="rect7851-3-6-7-6"
+         width="48.881725"
+         height="3.9405153"
+         x="536.98535"
+         y="261.30219"
+         ry="1.6912961" />
+      <rect
+         style="fill:#6f916f;stroke-width:0.127644"
+         id="rect7851-3-6-7-6-2"
+         width="48.881725"
+         height="3.9405153"
+         x="590.09088"
+         y="261.30219"
+         ry="1.6912961" />
+      <rect
+         style="fill:#9dac93;stroke-width:0.105245"
+         id="rect7851-3-6-7-5"
+         width="33.231369"
+         height="3.9405153"
+         x="546.35278"
+         y="236.42688"
+         ry="1.6912961" />
+      <rect
+         style="fill:#918a6f;stroke-width:0.132549"
+         id="rect7851-3-6-7-5-3"
+         width="52.710571"
+         height="3.9405153"
+         x="586.36078"
+         y="236.42688"
+         ry="1.6912961" />
+      <g
+         id="g8231"
+         inkscape:label="medaille">
+        <path
+           id="rect8198"
+           style="fill:#216778;stroke-width:0.220013"
+           d="m 624.8011,193.0331 5.67099,3.35426 -7.20474,14.16253 -1.14144,-4.609 -4.52955,1.25474 z"
+           sodipodi:nodetypes="cccccc" />
+        <path
+           id="rect8198-5"
+           style="fill:#216778;stroke-width:0.220071"
+           d="m 636.20276,192.95551 -5.674,3.35426 7.20857,14.16253 1.14204,-4.609 4.53196,1.25474 z"
+           sodipodi:nodetypes="cccccc" />
+        <circle
+           style="fill:#ffd42a;stroke-width:0.264583"
+           id="path8196"
+           cx="630.65381"
+           cy="189.82104"
+           r="7.7457604" />
+      </g>
+      <g
+         id="g8477"
+         inkscape:label="noeud">
+        <path
+           id="rect8198-5-2"
+           style="fill:#ff5555;stroke-width:0.180532"
+           d="m 511.88414,255.16587 -4.88113,2.62391 6.20126,11.0788 0.98246,-3.60544 3.89867,0.98153 z"
+           sodipodi:nodetypes="cccccc" />
+        <path
+           id="rect8198-5-2-7"
+           style="fill:#ff5555;stroke-width:0.173822"
+           d="m 508.46986,255.51709 4.70188,2.52525 -5.97353,10.66219 -0.94638,-3.46986 -3.7555,0.94462 z"
+           sodipodi:nodetypes="cccccc" />
+        <path
+           id="path8340"
+           style="fill:#ff5555;stroke-width:0.0918128"
+           d="m 506.32764,244.45652 c -4.20587,10e-6 -7.61541,3.00399 -7.6155,6.70964 -3e-5,3.70572 3.40955,6.70982 7.6155,6.70982 4.20595,0 7.61554,-3.0041 7.61551,-6.70982 -9e-5,-3.70565 -3.40964,-6.70964 -7.61551,-6.70964 z m 0,2.72956 c 3.23989,-4e-5 5.86635,1.71751 5.86635,4.7737 0,3.05619 -2.62646,5.5337 -5.86635,5.53366 -3.23982,-5e-5 -4.7012,-2.47754 -4.7012,-5.53366 0,-3.05612 1.46138,-4.77365 4.7012,-4.7737 z"
+           sodipodi:nodetypes="ssssssssss" />
+        <path
+           id="path8340-1"
+           style="fill:#ff5555;stroke-width:0.0918128"
+           d="m 513.9064,244.47979 c -4.20587,0 -7.61542,3.00398 -7.61551,6.70964 -3e-5,3.70572 3.40955,6.70982 7.61551,6.70983 4.20595,-1e-5 7.61554,-3.00411 7.6155,-6.70983 -8e-5,-3.70566 -3.40963,-6.70964 -7.6155,-6.70964 z m 0,2.72957 c 3.23989,-5e-5 4.35829,1.71751 4.35829,4.77369 0,3.05619 -1.1184,5.5337 -4.35829,5.53366 -3.23983,-4e-5 -5.86619,-2.47754 -5.86619,-5.53366 0,-3.05612 2.62637,-4.77365 5.86619,-4.77369 z"
+           sodipodi:nodetypes="ssssssssss" />
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/src/components/education/diploma.vue b/src/components/education/diploma.vue
new file mode 100644
index 0000000..8b8abf0
--- /dev/null
+++ b/src/components/education/diploma.vue
@@ -0,0 +1,35 @@
+<template>
+  <div class="line">
+    <p>
+        <span><img class="diploma_svg" :src="diplomaSvg"/></span>
+        {{ text }}</p>
+  </div>
+</template>
+
+<script setup>
+    defineProps({
+        text:{
+            type:String,
+            required:true
+        }
+    });
+
+    import diplomaSvg from "@/assets/svg/education/diploma.svg";
+</script>
+
+<style scoped>
+    .line{
+        border-bottom: 2px solid white;
+    }
+    .diploma_svg{
+        width: 64px;
+    }
+    p{
+        color: white;
+        position: relative;
+        text-align: center;
+        justify-content: center;
+        font-size: 1.4em;
+        margin-bottom: 10px;
+    }
+</style>
\ No newline at end of file
diff --git a/src/views/EducationView.vue b/src/views/EducationView.vue
index b9c6ec9..cfcd44f 100644
--- a/src/views/EducationView.vue
+++ b/src/views/EducationView.vue
@@ -7,6 +7,7 @@
       <p>{{ $t("education.introduction") }}</p> 
 
         <schoolDisplay :name="schools[0].name" :desc="schools[0].desc" :img="schools[0].img" :link="schools[0].link"/>
+        <diploma text="Brevet des collèges"/>
     </article>
 
   </template>
@@ -16,6 +17,7 @@
 
   import Header from '@/components/header.vue';
   import schoolDisplay from '@/components/education/schoolDisplay.vue';
+  import diploma from '@/components/education/diploma.vue';
   import SkillsList from '@/components/skills/skillsList.vue';
 
   const i18n = useI18n();