src/thsf/static/css/wemakeporn.css

@@ -0,0 +1,27 @@
+.wemakeporn {
+  background-color: #FFD036;
+  color: #000000;
+  font-family: Arial, Helvetica, sans-serif;
+  border-radius: 1em;
+  border-width: 1em;
+  border-style: solid;
+  display: flex;
+  flex-direction: column;
+  padding: 0.5em;
+  transform: rotate(-20deg) translate(2em, -6em);
+  visibility: hidden;
+  position: fixed;
+}
+.wemakeporn:hover{
+  cursor: default;
+}
+
+.wemake {
+  font-size: 7em;
+  font-weight: bold;
+}
+
+.porn {
+  font-size: 12em;
+  font-weight: bold;
+}

src/thsf/templates/base.html

@@ -6,6 +6,8 @@
   <meta http-equiv="content-type" content="text/html; charset=utf-8">
   <link rel="stylesheet"
         href="{{ url_for('static', filename='css/colors.css') }}">
+  <link rel="stylesheet"
+        href="{{ url_for('static', filename='css/wemakeporn.css') }}">
   <link rel="stylesheet"
         href="{{ url_for('static', filename='css/wrappers.css') }}">
   <link rel="stylesheet"

src/thsf/templates/index.html

@@ -4,7 +4,13 @@
         <img class="logo"
             src="{{ url_for('static', filename='images/logo.svg') }}"
             alt="THSF 2023 - S/Extraire"
-            title="THSF 2023 - S/Extraire">
+            title="THSF 2023 - S/Extraire"
+            onclick="document.getElementById('wemakeporn').style.visibility='visible';">
+        <div id="wemakeporn" class="wemakeporn"
+             onclick="document.getElementById('wemakeporn').style.visibility='hidden';">
+          <div class="wemake">WE MAKE</div>
+          <div class="porn">PORN</div>
+        </div>
       </div>
       <div class="content">
         <h2>Le T.H.S.F est enfin de retour !</h2>