diff --git a/components/Header.js b/components/Header.js index 237d46c..36f5231 100644 --- a/components/Header.js +++ b/components/Header.js @@ -14,6 +14,9 @@ export default function Home() { Sztab + + Zaloguj siÄ™ + ); } diff --git a/pages/index.js b/pages/index.js index 98afa99..a286174 100644 --- a/pages/index.js +++ b/pages/index.js @@ -10,7 +10,7 @@ export default function Home() { margin: 1rem; } p { - border-left: 0.2rem solid black; + border-left: 0.2rem solid white; padding-left: 1rem; } `} diff --git a/styles/globals.scss b/styles/globals.scss index fcb5fad..22ae4d2 100644 --- a/styles/globals.scss +++ b/styles/globals.scss @@ -11,20 +11,46 @@ font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif; } +body { + background-color: var(--black1); + color: white; +} nav.main { height: 4rem; background-color: var(--black1); display: flex; align-items: center; + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); a { display: block; - padding: 0.5rem 1.5rem; + padding: 0 1.5rem; + display: flex; + align-items: center; + height: 100%; margin: 0 0.5rem; color: white; text-decoration: none; font-family: "Lexend", sans-serif; + transition-duration: 150ms; // font-size: 16px; + &:hover { + background-color: var(--black0); + } + &:focus { + outline: none; + background-color: var(--black0); + } + &:last-of-type { + background-color: #c0c0c0; + color: var(--black1); + margin-left: auto; + margin-right: 0; + &:hover, + &:focus { + background-color: #909090; + } + } } .logo { margin: 0 1rem 0 1rem;