From db5494dff0b2b8b344f37a2fa1d2f8b9c450098f Mon Sep 17 00:00:00 2001 From: Valentin Popov Date: Sat, 6 Jan 2018 12:12:53 +0000 Subject: Initial commit --- _sass/_layout.scss | 89 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 89 insertions(+) create mode 100644 _sass/_layout.scss (limited to '_sass/_layout.scss') diff --git a/_sass/_layout.scss b/_sass/_layout.scss new file mode 100644 index 0000000..58b03a2 --- /dev/null +++ b/_sass/_layout.scss @@ -0,0 +1,89 @@ +.container { + margin: 0 auto; + max-width: 800px; + width: 80%; +} + +main, footer, .nav-container { + margin: 0 auto; + max-width: 800px; + width: 80%; +} + +.nav { + box-shadow: 0 2px 2px -2px $shadow-color; + overflow: auto; + + &-container { + margin: 1rem auto; + position: relative; + text-align: center; + } + + &-title { + @include transition(all .2s ease-out); + color: $default-color; + display: inline-block; + margin: 0; + padding-right: .2rem; + + &:hover, + &:focus { + opacity: .6; + } + } + + ul { + list-style-type: none; + margin: 1rem 0 0; + padding: 0; + text-align: center; + } + + li { + @include transition(all .2s ease-out); + color: $default-color; + display: inline-block; + opacity: .6; + padding: 0 2rem 0 0; + + &:last-child { + padding-right: 0; + } + + &:hover, + &:focus { + opacity: 1; + } + } + + a { + color: $default-color; + font-family: $sans-serif; + } +} + +@media (min-width: 600px) { + .nav { + &-container { + text-align: left; + } + + ul { + bottom: 0; + position: absolute; + right: 0; + } + } +} + +footer { + font-family: $serif-secondary; + padding: 2rem 0; + text-align: center; + + span { + color: $default-color; + font-size: .8rem; + } +} -- cgit v1.2.3