From 885a4424bd6b587d1c55f19bde1d1fc129762f51 Mon Sep 17 00:00:00 2001 From: KEZEL BENOIT p1907091 Date: Mon, 16 Dec 2019 13:34:50 +0100 Subject: [PATCH] adding animations :3 --- Assets/Pages/Autres/checkout.html | 6 +++--- Assets/css/css.css | 19 +++++++++++++++++-- 2 files changed, 20 insertions(+), 5 deletions(-) diff --git a/Assets/Pages/Autres/checkout.html b/Assets/Pages/Autres/checkout.html index c3b1dd4..1d3032e 100644 --- a/Assets/Pages/Autres/checkout.html +++ b/Assets/Pages/Autres/checkout.html @@ -13,9 +13,9 @@ diff --git a/Assets/css/css.css b/Assets/css/css.css index ada064f..57b8c70 100644 --- a/Assets/css/css.css +++ b/Assets/css/css.css @@ -5,13 +5,15 @@ html{ } body { - background: linear-gradient(to left, rgb(10, 1, 92), rgb(0, 82, 50)); margin: 0; padding: 0; font-family: 'Roboto', sans-serif; z-index: 2; + background: linear-gradient(to left, rgb(10, 1, 92), rgb(0, 82, 50)); + } + img { width: 30%; float: left; @@ -20,6 +22,12 @@ img { .content { background-color: #ddd; padding: 2vw; + animation: 1s slider; +} + +@keyframes content{ + 0%{height: 0%} + 100%{height: 100%} } h1 { @@ -178,6 +186,12 @@ div#slider { width: 100%; max-width: 1920px; margin: auto; + animation: 1s slider; +} + +@keyframes slider{ + 0%{margin-top: 150%} + 100%{margin-top: 0%} } div#slider figure { @@ -235,7 +249,8 @@ div#slider figure { } .title{ - background-color: rgba(255, 255, 255, 0.4) + background-color: rgba(255, 255, 255, 0.4); + animation: 1s right; } /*================================================*/