From aee3325163235d91912a06a137b17f128dc03756 Mon Sep 17 00:00:00 2001 From: Lyanis Souidi Date: Thu, 5 Jan 2023 13:05:09 +0100 Subject: [PATCH] =?UTF-8?q?Cr=C3=A9ation=20des=20pages=20+=20responsive=20?= =?UTF-8?q?header?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- about/index.html | 23 +++++++++++ assets/css/header.css | 80 +++++++++++++++++++++++++++++++++++++++ assets/css/style.css | 3 ++ assets/img/close-menu.svg | 9 +++++ assets/img/open-menu.svg | 6 +++ assets/js/header.js | 12 ++++++ contact/index.php | 23 +++++++++++ faq/index.html | 23 +++++++++++ index.html | 23 +++++++++++ product/index.html | 23 +++++++++++ 10 files changed, 225 insertions(+) create mode 100644 about/index.html create mode 100644 assets/css/header.css create mode 100644 assets/css/style.css create mode 100644 assets/img/close-menu.svg create mode 100644 assets/img/open-menu.svg create mode 100644 assets/js/header.js create mode 100644 contact/index.php create mode 100644 faq/index.html create mode 100644 index.html create mode 100644 product/index.html diff --git a/about/index.html b/about/index.html new file mode 100644 index 0000000..768dfbb --- /dev/null +++ b/about/index.html @@ -0,0 +1,23 @@ + + + + + Elite Solar + + + + + +
+

Elite Solar

+ + +
+ + \ No newline at end of file diff --git a/assets/css/header.css b/assets/css/header.css new file mode 100644 index 0000000..173e4ff --- /dev/null +++ b/assets/css/header.css @@ -0,0 +1,80 @@ +header { + overflow: hidden; + background-color: #f1f1f1; + padding: 20px 10px; +} + +header h1 { + float: left; + font-size: 25px; + font-weight: bold; +} + +#menu li { + display: inline; +} + +#menu li.active a { + background-color: dodgerblue; + color: white; +} + +#menu li a:hover { + background-color: #ddd; + color: black; +} + +#menu li a { + color: black; + padding: 12px; + text-decoration: none; + font-size: 18px; + line-height: 25px; + border-radius: 4px; +} + +#burger-menu { + transform: translateY(25%); +} + +@media screen and (min-width: 700px) { + #menu li a { + border-radius: 4px; + } + .visible { + display:block; + } + #menu { + float: right; + /*display: block;*/ + } + + #burger-menu { + display: none; + float: right; + } +} + +@media screen and (max-width: 700px) { + .invisible { +display : none; + + } + #menu li a { + float: none; + display: block; + text-align: left; + } + + #menu { + float: none; + /*display: none;*/ + margin-top: 80px; + padding: 0; + } + + #burger-menu { + display: block; + float: right; + } +} \ No newline at end of file diff --git a/assets/css/style.css b/assets/css/style.css new file mode 100644 index 0000000..4e41b69 --- /dev/null +++ b/assets/css/style.css @@ -0,0 +1,3 @@ +body { + margin: 0; +} \ No newline at end of file diff --git a/assets/img/close-menu.svg b/assets/img/close-menu.svg new file mode 100644 index 0000000..f7ecdb5 --- /dev/null +++ b/assets/img/close-menu.svg @@ -0,0 +1,9 @@ + + + + + + + + \ No newline at end of file diff --git a/assets/img/open-menu.svg b/assets/img/open-menu.svg new file mode 100644 index 0000000..e2c823e --- /dev/null +++ b/assets/img/open-menu.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/assets/js/header.js b/assets/js/header.js new file mode 100644 index 0000000..c59f661 --- /dev/null +++ b/assets/js/header.js @@ -0,0 +1,12 @@ +function burgerMenu() { + const btn = document.getElementById("burger-menu"); + const menu = document.getElementById("menu"); + + if (btn.src.endsWith("assets/img/open-menu.svg")) { + btn.src = btn.src.replace("open-menu.svg", "close-menu.svg"); + menu.className = ""; + } else { + btn.src = btn.src.replace("close-menu.svg", "open-menu.svg"); + menu.className = "invisible"; + } +} \ No newline at end of file diff --git a/contact/index.php b/contact/index.php new file mode 100644 index 0000000..f24979f --- /dev/null +++ b/contact/index.php @@ -0,0 +1,23 @@ + + + + + Elite Solar + + + + + +
+

Elite Solar

+ + +
+ + \ No newline at end of file diff --git a/faq/index.html b/faq/index.html new file mode 100644 index 0000000..e77fa83 --- /dev/null +++ b/faq/index.html @@ -0,0 +1,23 @@ + + + + + Elite Solar + + + + + +
+

Elite Solar

+ + +
+ + \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..f1b5f09 --- /dev/null +++ b/index.html @@ -0,0 +1,23 @@ + + + + + Elite Solar + + + + + +
+

Elite Solar

+ + +
+ + \ No newline at end of file diff --git a/product/index.html b/product/index.html new file mode 100644 index 0000000..4581b88 --- /dev/null +++ b/product/index.html @@ -0,0 +1,23 @@ + + + + + Elite Solar + + + + + +
+

Elite Solar

+ + +
+ + \ No newline at end of file