diff --git a/CSS/styles.css b/CSS/styles.css index 2f01fe6..767902d 100644 --- a/CSS/styles.css +++ b/CSS/styles.css @@ -1,17 +1,23 @@ - - - body{ margin: 0; background: linear-gradient(180deg,rgba(63,94,251,0.7),rgba(252,70,107,0.7) 100%); } +ul{ + margin: 0; + padding: 0; +} header{ margin-bottom: 20vh; } +p { + margin: 0; + font-size: 25px ; +} nav{ + font-size: 20px ; top: 0; left: 0; z-index: 1; @@ -19,6 +25,7 @@ nav{ display: flex; align-items: center; justify-content: space-around; + flex-direction: row-reverse; background: linear-gradient(45deg,orange 35%,darkred); width: 100%; @@ -52,24 +59,16 @@ main{ #btn_up{ position: fixed; - background-color: transparent; - border-color: transparent; right: 2vw; bottom: 2vh; height: 4vh; width: 4vh; } -li{ +nav li{ display: inline-block; - } -p{ - font-family: unset; - font-size: 30px; - -} .img_gauche_txt_droite{ @@ -102,7 +101,7 @@ p{ .img_droite_txt_gauche{ - display: flex; + display: inline-flex; flex-direction: row-reverse; justify-content: space-around; align-items: center; @@ -122,31 +121,30 @@ p{ .img_droite_txt_gauche p:hover{ box-shadow: -15px -10px rgba(0,0,0,0.5); } -.img_droite_txt_gauche img{border-radius: 10px;} +.img_droite_txt_gauche img{border-radius: 10px;transform: transform linear 1s;} .img_droite_txt_gauche img:not(:hover) { + transform: transform linear 1s; filter: saturate(0.2); - transform: scale(0.8,0.8); + transform: scale(0.9,0.9); } -#pied_de_page{ - font-size: 15px; -} .page{ - display: block; list-style-type: none; text-decoration: none; color: black; - margin-right: 10vh; - font-size: 2vh; + +} +.page p{margin-right: 10vh; + transition: transform linear 0.2s; } -.page:hover{ - transform: scale(1.2,1.2); +.page p:hover{ color: gold; + transform: scale(1.2,1.2); } @@ -154,6 +152,48 @@ p{ footer{ - background-color: orange; - padding-bottom: 15vh; + display: flex; + padding: 2%; + align-items: center; + flex-direction: row-reverse; + justify-content: space-around; + background-color: grey; + + +} + + + +footer #reseaux li{ + list-style-type: none; + text-decoration: none; + display: inline-block; +} +footer #reseaux p{ + color: black; + padding-left: 15px; + font-size: 25px; +} + +footer #reseaux li img{ + width: 3vw; + height: 3vh; +} + +footer #reseaux li img:not(:hover){ + transition: transform linear 0.5s; + opacity: 50%; +} +footer #reseaux li img:hover{ + transition: transform linear 0.2s; + transform: scale(1.5); +} + +footer #autres{ + margin-top: 2%; +} + +footer #autres p{ + color: black; + font-size: 30px; } \ No newline at end of file diff --git a/HTML/page_2.html b/HTML/page_2.html index e69de29..a6351be 100644 --- a/HTML/page_2.html +++ b/HTML/page_2.html @@ -0,0 +1,29 @@ + + + + Casino du coeur + + + + + + +
+ + + +
+ \ No newline at end of file diff --git a/HTML/page_3.html b/HTML/page_3.html index e9e7265..0173798 100644 --- a/HTML/page_3.html +++ b/HTML/page_3.html @@ -8,20 +8,20 @@ -
+
diff --git a/HTML/page_4.html b/HTML/page_4.html index e69de29..c251355 100644 --- a/HTML/page_4.html +++ b/HTML/page_4.html @@ -0,0 +1,29 @@ + + + + Casino du coeur + + + + + + +
+ + + +
+ \ No newline at end of file diff --git a/credits.txt b/credits.txt index e69de29..9401525 100644 --- a/credits.txt +++ b/credits.txt @@ -0,0 +1 @@ +icone : https://icones8.fr/ https://fontawesome.com diff --git a/img/icone/instagram.svg b/img/icone/instagram.svg new file mode 100644 index 0000000..fcd0bef --- /dev/null +++ b/img/icone/instagram.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/img/icone/tiktok.svg b/img/icone/tiktok.svg new file mode 100644 index 0000000..26ed991 --- /dev/null +++ b/img/icone/tiktok.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/img/icone/twitter.svg b/img/icone/twitter.svg new file mode 100644 index 0000000..349bbf9 --- /dev/null +++ b/img/icone/twitter.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/index.html b/index.html index 9b97567..b83ee9d 100644 --- a/index.html +++ b/index.html @@ -5,6 +5,7 @@ Casino du coeur + @@ -17,14 +18,14 @@ @@ -58,10 +59,25 @@