update 14/03/2024 5:45

kurtounet · Mar 14, 2024 · a85db2d · a85db2d
1 parent c7582ae
commit a85db2d
Show file tree

Hide file tree

Showing 7 changed files with 74 additions and 18 deletions.
diff --git a/js/dist/Job.dev.js b/js/dist/Job.dev.js
@@ -38,6 +38,7 @@ var dataJob = [{
 }];
 
 function showUl(id) {
+  console.log(id);
   var box = document.getElementById(id);
   var ulskills = box.getElementsByTagName("ul")[0];
 
@@ -66,6 +67,7 @@ for (var job in dataJob) {
   var divYearCard = document.createElement("div");
   divYearCard.className = "yearCard";
   var ulskills = document.createElement("ul");
+  ulskills.id = "ul_" + i;
   ulskills.className = "ulskill";
   ulskills.id = "ulskill_" + String(i);
   var _iteratorNormalCompletion = true;
@@ -95,12 +97,28 @@ for (var job in dataJob) {
     }
   }
 
+  var divBox = document.createElement("div");
+  divBox.className = "btnCompagny";
+  var btnBox = document.createElement("button");
+  btnBox.id = "btn_" + i;
+
+  btnBox.onclick = function () {
+    //const box = document.getElementById("box_" + i);
+    var ulskills = document.getElementById("ul_" + i);
+
+    if (ulskills.style.display == "none") {
+      ulskills.style.display = "flex";
+    } else {
+      ulskills.style.display = "none";
+    }
+  };
+
+  divBox.appendChild(company);
+  divBox.appendChild(btnBox);
   card.appendChild(poste);
-  card.appendChild(company);
+  card.appendChild(divBox);
   card.appendChild(ulskills);
   divYearCard.appendChild(year);
-  divYearCard.appendChild(year);
-  divYearCard.appendChild(year);
   divYearCard.appendChild(card);
   var bullet = document.createElement("div");
   bullet.className = "bullet";
@@ -112,13 +130,9 @@ for (var job in dataJob) {
   bulletline.appendChild(line);
   var box = document.createElement("div");
   box.className = "box";
-  box.id = "box_" + i++;
-
-  box.onclick = function () {
-    showUl(this.id);
-  };
-
+  box.id = "box_" + i;
   box.appendChild(bulletline);
   box.appendChild(divYearCard);
   listjobs.appendChild(box);
+  i = i + 1;
 }
diff --git a/js/job.js b/js/job.js
@@ -107,6 +107,7 @@ let dataJob = [
 ];
 
 function showUl(id) {
+  console.log(id);
   const box = document.getElementById(id);
   const ulskills = box.getElementsByTagName("ul")[0];
 
@@ -140,6 +141,7 @@ for (const job in dataJob) {
   divYearCard.className = "yearCard";
 
   let ulskills = document.createElement("ul");
+  ulskills.id = "ul_" + i;
   ulskills.className = "ulskill";
   ulskills.id = "ulskill_" + String(i);
 
@@ -149,12 +151,29 @@ for (const job in dataJob) {
     ulskills.appendChild(liskills);
     console.log(sk);
   }
+  const divBox = document.createElement("div");
+  divBox.className = "btnCompagny";
+
+  const btnBox = document.createElement("button");
+  btnBox.id = "btn_" + i;
+  btnBox.onclick = function () {
+    //const box = document.getElementById("box_" + i);
+    const ulskills = document.getElementById("ul_" + i);
+
+    if (ulskills.style.display == "none") {
+      ulskills.style.display = "flex";
+    } else {
+      ulskills.style.display = "none";
+    }
+  };
+
+  divBox.appendChild(company);
+  divBox.appendChild(btnBox);
+
   card.appendChild(poste);
-  card.appendChild(company);
+  card.appendChild(divBox);
   card.appendChild(ulskills);
 
-  divYearCard.appendChild(year);
-  divYearCard.appendChild(year);
   divYearCard.appendChild(year);
   divYearCard.appendChild(card);
 
@@ -170,13 +189,11 @@ for (const job in dataJob) {
 
   const box = document.createElement("div");
   box.className = "box";
-  box.id = "box_" + i++;
-  box.onclick = function () {
-    showUl(this.id);
-  };
+  box.id = "box_" + i;
 
   box.appendChild(bulletline);
   box.appendChild(divYearCard);
 
   listjobs.appendChild(box);
+  i = i + 1;
 }
diff --git a/sass/_section_apropos.sass b/sass/_section_apropos.sass
@@ -12,6 +12,16 @@ section#a-propos
         grid-gap: 10px
         justify-items: center
 
+        .btnCompagny
+            background-color: #333
+            display: flex
+            flex-direction: row
+            justify-content: space-between
+
+            button
+                width: 30px
+                height: 30px
+
         .flex-col-center
 
             display: flex
@@ -23,6 +33,7 @@ section#a-propos
             flex-direction: row
             align-items: flex-start
             user-select: none
+
         &:hover
             cursor: pointer
 

diff --git a/sass/dist/_section_apropos.css b/sass/dist/_section_apropos.css
@@ -11,6 +11,16 @@ section#a-propos #list-jobs {
   grid-gap: 10px;
   justify-items: center;
 }
+section#a-propos #list-jobs .btnCompagny {
+  background-color: #333;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+section#a-propos #list-jobs .btnCompagny button {
+  width: 30px;
+  height: 30px;
+}
 section#a-propos #list-jobs .flex-col-center {
   display: flex;
   flex-direction: column;

diff --git a/sass/dist/_section_apropos.min.css b/sass/dist/_section_apropos.min.css
diff --git a/sass/dist/style.css b/sass/dist/style.css
@@ -108,6 +108,10 @@ section#a-propos #list-jobs .job-card ul {
   flex-direction: column;
   list-style-type: none;
 }
+section#a-propos button {
+  width: 20px;
+  height: 20px;
+}
 
 /* // $asset: "assets/images/logo-technologie/" */
 section#projets {