summaryrefslogtreecommitdiff
path: root/actualités.css
diff options
context:
space:
mode:
authorKévin Le Gouguec <kevin.legouguec@gmail.com>2020-11-23 23:36:54 +0100
committerKévin Le Gouguec <kevin.legouguec@gmail.com>2020-11-23 23:36:54 +0100
commitb908b8959658676faff68677d4466d18a141b9f3 (patch)
tree52de1ab198196b63959efd68427e5acfb2c73ed3 /actualités.css
parentebd46a8c1ba4e2578f63110d197031cf5b5212e8 (diff)
parent3c5114af62b777ec79a1b794be45e7c764bf5af5 (diff)
downloadquatuorbellefeuille.com-b908b8959658676faff68677d4466d18a141b9f3.tar.xz
Merge branch 'actus-links'
FSM help me, I'm writing JS now.
Diffstat (limited to 'actualités.css')
-rw-r--r--actualités.css46
1 files changed, 18 insertions, 28 deletions
diff --git a/actualités.css b/actualités.css
index 3cc5ff5..46ac00a 100644
--- a/actualités.css
+++ b/actualités.css
@@ -1,22 +1,36 @@
main {
- padding-left: 5%;
+ display: grid;
+ overflow: auto;
+ grid-template-columns: 60% 40%;
+}
+
+main > div {
+ padding: 2%;
+ overflow: auto;
}
.events {
display: grid;
- width: 58vw;
+ width: 50vw;
grid-auto-rows: 12vw;
grid-template-columns: repeat(auto-fit, 14vw);
- grid-gap: 1em;
+ grid-gap: 1vw;
background-color: #dbb;
}
.event {
position: relative;
background-color: #fff;
+}
+
+.event a {
+ position: absolute;
display: flex;
align-items: center;
justify-content: center;
+ height: 100%;
+ width: 100%;
+ text-decoration: none;
}
.event img {
@@ -33,8 +47,8 @@ main {
}
.event .summary {
- z-index: 1;
opacity: 0;
+ z-index: 1;
font-weight: bold;
color: white;
transition: 0.5s;
@@ -43,27 +57,3 @@ main {
.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: 60vw;
- max-width: 30%;
- max-height: 50vh;
- overflow: auto;
- background-color: #d88;
-}