diff --git a/index.html b/index.html index 444ff40..3477d4f 100644 --- a/index.html +++ b/index.html @@ -28,7 +28,8 @@ - + + = + Contact A propos diff --git a/styles/main.css b/styles/main.css index 3a8e31c..5bc979d 100644 --- a/styles/main.css +++ b/styles/main.css @@ -8,6 +8,9 @@ body { margin: 0; } +a:link { color: black; } +a:visited { color: black; } + /* HEADER --------------------------------------------*/ .header .title { @@ -17,14 +20,14 @@ body { color: #ebebeb; } -.nav-bar a:link { color: white; } -.nav-bar a:visited { color: white; } +.nav-left a:link { color: white; } +.nav-left a:visited { color: white; } .nav-bar a:hover { color: #555; background-color: #ebebeb; - border: 10px solid #ebebeb; + /*border: 10px solid #ebebeb; border-radius: 25px; - font-size: 20px; + font-size: 20px;*/ } @@ -40,13 +43,13 @@ body { .nav-bar a { padding: 5px 20px; - margin: 0 10px 0 10px; + margin: 0 1px 0 1px; text-align: center; text-decoration: none; - border-radius: 25%; + border-radius: 10px; transition: - border 300ms, - font-size 300ms, + /*border 300ms, + font-size 300ms,*/ background-color 300ms, color 300ms; } @@ -64,21 +67,33 @@ body { } .dropdown-menu { - display: inline-block; + color: white; + text-align: center; + width: 40px; + cursor: pointer; +} + + +#dd-menu { + position: absolute; + opacity: 0; + height: 0; + cursor: pointer; } .dropdown-menu-content { display: none; position: absolute; right: 0; + height: 0; background-color: #f9f9f9; min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1; + transition: height 300ms; } .dropdown-menu-content a { - color: black; padding: 12px 16; text-decoration: none; display: block; @@ -89,8 +104,9 @@ body { background-color: #f1f1f1; } -.dropdown-menu:hover .dropdown-menu-content { +#dd-menu:checked + .dropdown-menu-content { display: block; + height: 60px; } /* MAIN CONTENT --------------------------------------------*/