diff --git a/js/customElements/header.js b/js/customElements/header.js index 1fe8c52e6387104e190e3296a9bf2c4614b619c2..33e37c60f9d5f406c39524eb5cce83f9c40f21ba 100644 --- a/js/customElements/header.js +++ b/js/customElements/header.js @@ -7,7 +7,7 @@ class Header extends HTMLElement { <div class="header-wrapper" > <div class="header-homepage"> <div class="align-holder" > - <h1>${pageTitle}</h1 > + <a class="noStyleLink" href="#hideHeader"><h1>${pageTitle}</h1 ></h1> </div > </div > <div class="header-separator header-separator-bottom " > @@ -16,6 +16,7 @@ class Header extends HTMLElement { </div > <jl-main_menu id = "mainMenu"></jl-main_menu> </header> + <span id="hideHeader"></span> `; } } diff --git a/scss/_general.scss b/scss/_general.scss index 29c6d74e33dbbb2d5fb0f2fc7ddb290a2a5f4b93..c0bb7a0e598be149c96e2f5564c733d18f77a2a4 100644 --- a/scss/_general.scss +++ b/scss/_general.scss @@ -1,72 +1,80 @@ -body { - margin: 0; - background-color: $back-color-2; - color: $text-color; - font-family: 'Source Sans Pro', sans-serif; - - width: calc(100% - 1px); - height: 100%; +html { + scroll-behavior: smooth; } -button{ - background-color: $accent-color; - color: #fff; - text-transform: uppercase; - border: 0; - padding: 5px; - cursor: pointer; - border-radius: 5px; - transition: background-color $link-hover-animation-time linear; +body { + margin: 0; + background-color: $back-color-2; + color: $text-color; + font-family: 'Source Sans Pro', sans-serif; + width: calc(100% - 1px); + height: 100%; +} - &:hover, &:active, &:focus { - background-color: $accent-color-2; - outline: none; - } +button { + background-color: $accent-color; + color: #fff; + text-transform: uppercase; + border: 0; + padding: 5px; + cursor: pointer; + border-radius: 5px; + transition: background-color $link-hover-animation-time linear; + &:hover, + &:active, + &:focus { + background-color: $accent-color-2; + outline: none; + } } -.spacer{ - clear: both; +.spacer { + clear: both; } -a{ - padding: 0; - color: $accent-color; - text-decoration:underline; - transition: color $link-hover-animation-time; +a { + padding: 0; + color: $accent-color; + text-decoration: underline; + transition: color $link-hover-animation-time; + &:HOVER { + color: $accent-color-2; + } +} - &:HOVER{ - color: $accent-color-2; - } +.noStyleLink { + text-decoration: none; } h1 { - color: $title-color; - text-transform: uppercase; + color: $title-color; + text-transform: uppercase; } .red { - color: red; + color: red; } -.center{ - text-align: center; +.center { + text-align: center; } -.left{ - text-align: left; + +.left { + text-align: left; } -.right{ - text-align: left; + +.right { + text-align: left; } -.block{ - text-align: justify; - text-justify: auto; +.block { + text-align: justify; + text-justify: auto; } img { - border-radius: $border-radius-image; - - &.no-corner { - border-radius: 0; - } + border-radius: $border-radius-image; + &.no-corner { + border-radius: 0; + } } \ No newline at end of file