diff --git a/Images/d36bcd94324a528f7ac00f4e6aa51f09.png b/Images/d36bcd94324a528f7ac00f4e6aa51f09.png new file mode 100644 index 0000000..b60899a Binary files /dev/null and b/Images/d36bcd94324a528f7ac00f4e6aa51f09.png differ diff --git a/Nav-bar.html b/Nav-bar.html new file mode 100644 index 0000000..437b791 --- /dev/null +++ b/Nav-bar.html @@ -0,0 +1,30 @@ + + + + + + + + Document + + + + + + + \ No newline at end of file diff --git a/index.html b/index.html deleted file mode 100644 index a5850a6..0000000 --- a/index.html +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - Document - - - diff --git a/nav-bar.css b/nav-bar.css new file mode 100644 index 0000000..37360d5 --- /dev/null +++ b/nav-bar.css @@ -0,0 +1,117 @@ +*, +*, +::before, +::after { + box-sizing: border-box; +} + +body { + margin: 0; +} + +/* Dropdown Button */ +.header-nav-mobile { + display: none; +} + +.dropbtn { + background-color: hsla(268, 75%, 44%, 1); + border: none; +} + +.nav-icon { + height: 15px; +} + +/* Nav-Bar */ +.header-nav { + color: white; + font-size: 1.25rem; + text-transform: uppercase; + text-align: center; +} +.dropdown { + position: absolute; + display: grid; + grid-template-columns: 1fr; + height: 100%; + box-shadow: 5px 0 0 0 hsla(268, 58%, 55%, 1); +} + +/* MenĂ¼ */ +.dropdown-content { + display: none; + position: absolute; + min-height: 100%; + left: 100%; + background-color: hsla(268, 58%, 55%, 1); + min-width: 200px; + box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2); + z-index: 1; +} + +/* Links inside the MenĂ¼ */ +.dropdown-content a { + color: white; + padding: 12px 16px; + text-decoration: none; + border-bottom: 2px solid white; + font-size: 1.25rem; +} + +.nav-links { + display: flex; + flex-direction: column; + margin: auto; +} + +/* Change hover color */ +.dropdown-content a:hover { + background-color: hsla(268, 75%, 44%, 1); +} + +/* Show the menu on hover */ +.dropdown:hover .dropdown-content { + display: flex; + flex-direction: column; + padding-left: 1rem; + padding-right: 1rem; + background-color: hsla(268, 58%, 55%, 1); +} + +/* Nav-Bar end*/ + +@media screen and (max-width: 800px) { + .dropdown { + top: 0; + max-height: 25px; + min-width: 100%; + } + + .dropdown-content { + top: 100%; + left: 0; + min-width: 100%; + text-align: center; + } + + .dropbtn { + display: flex; + } + + .nav-icon { + margin: auto 0; + } + + .header-nav-mobile { + display: flex; + margin: auto; + font-weight: 600; + color: white; + font-size: 1.15rem; + } + + .nav-links { + padding-bottom: 1.5rem; + } +} diff --git a/recordings.html b/recordings.html deleted file mode 100644 index a5850a6..0000000 --- a/recordings.html +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - Document - - - diff --git a/slides.html b/slides.html deleted file mode 100644 index a5850a6..0000000 --- a/slides.html +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - Document - - - diff --git a/students.html b/students.html deleted file mode 100644 index a5850a6..0000000 --- a/students.html +++ /dev/null @@ -1,10 +0,0 @@ - - - - - - - Document - - - diff --git a/style.css b/style.css deleted file mode 100644 index e69de29..0000000