From 6f79c3f6dd4b2db347547b22bf7727fadcbd4dfb Mon Sep 17 00:00:00 2001
From: Kévin Le Gouguec <kevin.legouguec@gmail.com>
Date: Sun, 22 Nov 2020 00:45:33 +0100
Subject: Rename events page

Also add the boilerplate.
---
 "actualit\303\251s.css" | 63 +++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 63 insertions(+)
 create mode 100644 "actualit\303\251s.css"

(limited to 'actualités.css')

diff --git "a/actualit\303\251s.css" "b/actualit\303\251s.css"
new file mode 100644
index 0000000..6a2bd4a
--- /dev/null
+++ "b/actualit\303\251s.css"
@@ -0,0 +1,63 @@
+.events {
+    display: grid;
+    width: 60%;
+    grid-auto-rows: 14vw;
+    grid-template-columns: repeat(auto-fit, 14vw);
+    grid-gap: 1em;
+    margin-left: auto;
+    margin-right: 0;
+    background-color: #ccc;
+}
+
+.event {
+    position: relative;
+    background-color: #fff;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.event img {
+    position: absolute;
+    object-position: center;
+    object-fit: cover;
+    height: 100%;
+    width: 100%;
+    transition: 0.5s;
+}
+
+.event:hover img {
+    filter: grayscale(0.8) brightness(0.4);
+}
+
+.event .summary {
+    z-index: 1;
+    opacity: 0;
+    font-weight: bold;
+    color: white;
+    transition: 0.5s;
+}
+
+.event:hover .summary {
+    opacity: 1;
+}
+
+.event .details {
+    display: none;
+}
+
+.event input {
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    cursor: pointer;
+    opacity: 0;
+    z-index: 2;
+}
+
+.event input:checked ~ .details {
+    display: block;
+    position: fixed;
+    top: 10em;
+    left: 0;
+}
-- 
cgit v1.2.3