Père 200 A24

C'est demain, et le thème c'est les Schtroumpfs. Connard.

core/static/core/style.scss

@@ -8,6 +8,15 @@ $large-devices: 992px;
 /*--------------------------------GENERAL------------------------------*/
 
 body {
+  background: url("img/badge_pere_200.svg") repeat space right;
+  // the main content has width: 90%
+  // so a bgc of 5% makes the picture perfectly fit
+  // between the screen border and the main div
+  // However, it's ugly on small screens
+  background-size: 5%;
+  @media (max-width: 700px) {
+    background-size: 100px;
+  }
   position: relative;
   width: 100%;
   font-family: sans-serif;
@@ -321,6 +330,14 @@ a:not(.button) {
     }
   }
 
+  #pere-200-background {
+    opacity: 20%;
+    background-size: 100%;
+    position: absolute;
+    left: 50%;
+    transform: translateX(-50%);
+  }
+
   #content {
     padding: 1em 1%;
     box-shadow: $shadow-color 0 5px 10px;

core/templates/core/base.jinja

@@ -45,9 +45,11 @@
       {% if not popup %}
         <header class="header">
           <div class="header-logo">
-            <a class="header-logo-picture" href="{{ url('core:index') }}" style="background-image: url('{{ static('core/img/logo_no_text.png') }}')">
-              &nbsp;
-            </a>
+            <a
+              class="header-logo-picture"
+              href="{{ url('core:index') }}"
+              style="background-image: url('{{ static('core/img/badge_pere_200.svg') }}')"
+            ></a>
             <a class="header-logo-text" href="{{ url('core:index') }}">
               <span>Association des Étudiants</span>
               <span>de l'Université de Technologie de Belfort-Montbéliard</span>
@@ -257,7 +259,6 @@
     {% endblock %}
 
     <div id="page">
-
       <ul id="quick_notif">
         {% for n in quick_notifs %}
           <li>{{ n }}</li>
@@ -265,6 +266,11 @@
       </ul>
 
       <div id="content">
+        <img
+          src="{{ static("/core/img/badge_pere_200.svg") }}"
+          alt="badge pere 200"
+          id="pere-200-background"
+        />
         {% if list_of_tabs %}
           <div class="tool_bar">
             <div class="tools">