wip: illus banner popularization

public/education/education.js

@@ -193,7 +193,7 @@ class GameStudioClub {
             contents: [
                 {
                     tag: "div",
-                    class: "title-banner",
+                    class: "title-banner game-banner",
                     id: "game-studio-club", // anchor id
                     contents: [{ tag: "h2", contents: "Game Studio Club" }],
                 },
@@ -428,8 +428,6 @@ module.exports = GameStudioClub;
 },{}],5:[function(require,module,exports){
 "use strict";
 
-const { images_url } = require("../../../../constants");
-
 const VULGARISATION_THEMES = [
     {
         title: "Qu'est-ce qui se passe dans mon ordinateur ?",
@@ -480,7 +478,7 @@ class Popularization {
             contents: [
                 {
                     tag: "div",
-                    class: "title-banner",
+                    class: "title-banner popu-banner",
                     id: "popularization", // anchor id
                     contents: [{ tag: "h2", contents: "Ateliers de vulgarisation" }],
                 },
@@ -577,7 +575,7 @@ class Popularization {
 
 module.exports = Popularization;
 
-},{"../../../../constants":2}],6:[function(require,module,exports){
+},{}],6:[function(require,module,exports){
 "use strict";
 
 const GameStudioClub = require("./components/game-studio-club");

src/pages/education/components/game-studio-club.js

@@ -84,7 +84,7 @@ class GameStudioClub {
             contents: [
                 {
                     tag: "div",
-                    class: "title-banner",
+                    class: "title-banner game-banner",
                     id: "game-studio-club", // anchor id
                     contents: [{ tag: "h2", contents: "Game Studio Club" }],
                 },

src/pages/education/components/popularization.js

 "use strict";
 
-const { images_url } = require("../../../../constants");
-
 const VULGARISATION_THEMES = [
     {
         title: "Qu'est-ce qui se passe dans mon ordinateur ?",
@@ -52,7 +50,7 @@ class Popularization {
             contents: [
                 {
                     tag: "div",
-                    class: "title-banner",
+                    class: "title-banner popu-banner",
                     id: "popularization", // anchor id
                     contents: [{ tag: "h2", contents: "Ateliers de vulgarisation" }],
                 },

src/pages/education/education.scss

@@ -13,7 +13,12 @@
         justify-content: flex-end;
         flex-direction: column;
         height: 300px;
-        background-image: url("../../../assets/images/game_studio_banner.png");
+        &.game-banner {
+            background-image: url("../../../assets/images/game_studio_banner.png");
+        }
+        &.popu-banner {
+            background-image: url("../../../assets/images/popularization_banner.png");
+        }
         background-size: cover;
         background-repeat: no-repeat;
         background-position: 0% 90%;
@@ -21,7 +26,7 @@
             color: white;
             font-size: 2.5em;
             margin: 40px;
-            text-shadow: 0 0 6px #000;
+            text-shadow: 0 0 6px #0003;
         }
     }
     .section-contents {

style/pages/education/education.css

 /* Error: Undefined variable.
  *    ,
- * 42 |             background-color: $light_0;
+ * 47 |             background-color: $light_0;
  *    |                               ^^^^^^^^
  *    '
- *   src/pages/education/education.scss 42:31  root stylesheet */
+ *   src/pages/education/education.scss 47:31  root stylesheet */
 
 body::before {
   font-family: "Source Code Pro", "SF Mono", Monaco, Inconsolata, "Fira Mono",
@@ -13,5 +13,5 @@ body::before {
   padding: 1em;
   margin-bottom: 1em;
   border-bottom: 2px solid black;
-  content: "Error: Undefined variable.\a    \2577 \a 42 \2502              background-color: $light_0;\a    \2502                                ^^^^^^^^\a    \2575 \a   src/pages/education/education.scss 42:31  root stylesheet";
+  content: "Error: Undefined variable.\a    \2577 \a 47 \2502              background-color: $light_0;\a    \2502                                ^^^^^^^^\a    \2575 \a   src/pages/education/education.scss 47:31  root stylesheet";
 }

style/style.css

@@ -98,16 +98,21 @@ main #page-container #education-page .title-banner {
   justify-content: flex-end;
   flex-direction: column;
   height: 300px;
-  background-image: url("../../../assets/images/game_studio_banner.png");
   background-size: cover;
   background-repeat: no-repeat;
   background-position: 0% 90%;
 }
+main #page-container #education-page .title-banner.game-banner {
+  background-image: url("../../../assets/images/game_studio_banner.png");
+}
+main #page-container #education-page .title-banner.popu-banner {
+  background-image: url("../../../assets/images/popularization_banner.png");
+}
 main #page-container #education-page .title-banner h2 {
   color: white;
   font-size: 2.5em;
   margin: 40px;
-  text-shadow: 0 0 6px #000;
+  text-shadow: 0 0 6px #0003;
 }
 main #page-container #education-page .section-contents {
   margin: 20px 40px 60px;

style/style.css.map

-{"version":3,"sourceRoot":"","sources":["../src/style.scss","../src/theme.scss","../src/pages/education/education.scss"],"names":[],"mappings":"AAEA;EAQI;EACA;;AARA;EACI;EACA,OCLC;EDMD;EACA;EACA;;AAIJ;EACI;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;;AAEI;EACI;EACA;EACA;EACA;;AACA;EACI;;AACA;EACI;EACA;EACA;EACA;EACA,OCrCd;EDsCc;EACA;;AACA;EACI;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGA;EACI,OC/DnB;EDgEmB;;AAIJ;EACI,OCrEnB;;ADwEe;EACI;EACA;;AACA;EACI,OCzEtB;ED0EsB;;AAII;EACI,OClF/B;;AD4FL;EACI;EACA;EACA;EACA;;AEhGJ;EACI;EACA;;AAEJ;EACI;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;;AAGR;EACI;EACA;EACA;EACA;EACA;;AACA;EACI;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA,kBDtCF;ECuCE;;AACA;EACI;EACA;EACA;EACA;;AACA;EACI;;AAEJ;AAAA;EAEI;EACA;;AAIZ;EACI;EACA;EACA;EACA;EACA;;AACA;EAyCI;EACA;EACA;EACA;EACA;;AA5CA;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAOJ;EACI,OD9GX;EC+GW;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;;AAEJ;EACI;EACA;EACA;;AAIJ;EACI;EACA;;AAMhB;EACI;EACA;EACA,kBDtJF;ECuJE;;AACA;AAAA;EAEI;EACA;EACA;EACA;;AAEA;AAAA;EACI;;AAGA;AAAA;EACI;EACA;;AACA;AAAA;EACI;EACA;;AFvExB;EACI;EACA;EACA","file":"style.css"}
+{"version":3,"sourceRoot":"","sources":["../src/style.scss","../src/theme.scss","../src/pages/education/education.scss"],"names":[],"mappings":"AAEA;EAQI;EACA;;AARA;EACI;EACA,OCLC;EDMD;EACA;EACA;;AAIJ;EACI;EACA;EACA;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;;AAEI;EACI;EACA;EACA;EACA;;AACA;EACI;;AACA;EACI;EACA;EACA;EACA;EACA,OCrCd;EDsCc;EACA;;AACA;EACI;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGA;EACI,OC/DnB;EDgEmB;;AAIJ;EACI,OCrEnB;;ADwEe;EACI;EACA;;AACA;EACI,OCzEtB;ED0EsB;;AAII;EACI,OClF/B;;AD4FL;EACI;EACA;EACA;EACA;;AEhGJ;EACI;EACA;;AAEJ;EACI;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EAOA;EACA;EACA;;AARA;EACI;;AAEJ;EACI;;AAKJ;EACI;EACA;EACA;EACA;;AAGR;EACI;EACA;EACA;EACA;EACA;;AACA;EACI;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA,kBD3CF;EC4CE;;AACA;EACI;EACA;EACA;EACA;;AACA;EACI;;AAEJ;AAAA;EAEI;EACA;;AAIZ;EACI;EACA;EACA;EACA;EACA;;AACA;EAyCI;EACA;EACA;EACA;EACA;;AA5CA;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;;AAOJ;EACI,ODnHX;ECoHW;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;;AAEJ;EACI;EACA;EACA;;AAIJ;EACI;EACA;;AAMhB;EACI;EACA;EACA,kBD3JF;EC4JE;;AACA;AAAA;EAEI;EACA;EACA;EACA;;AAEA;AAAA;EACI;;AAGA;AAAA;EACI;EACA;;AACA;AAAA;EACI;EACA;;AF5ExB;EACI;EACA;EACA","file":"style.css"}
\ No newline at end of file