102 lines
2.0 KiB
Sass
102 lines
2.0 KiB
Sass
/*
|
|
* This is a manifest file that'll be compiled into application.css, which will include all the files
|
|
* listed below.
|
|
*
|
|
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
|
|
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
|
|
*
|
|
* You're free to add application-wide styles to this file and they'll appear at the bottom of the
|
|
* compiled file so the styles you add here take precedence over styles defined in any styles
|
|
* defined in the other CSS/SCSS files in this directory. It is generally better to create a new
|
|
* file per style scope.
|
|
*
|
|
*= require_tree .
|
|
*= require_self
|
|
*/
|
|
|
|
html
|
|
box-sizing: border-box
|
|
//display: flex
|
|
justify-content: center
|
|
min-height: 100vh
|
|
|
|
body
|
|
//flex: 1 1 auto
|
|
display: flex
|
|
flex-direction: column
|
|
min-height: 100vh
|
|
margin: 0
|
|
background: image-url('backgrounds/felt-green.png')
|
|
font-size: 2vmin
|
|
|
|
a
|
|
text-decoration: none
|
|
color: white
|
|
outline: none
|
|
|
|
h1
|
|
font-size: 7vmin
|
|
margin: 0 0 5vmin 0
|
|
|
|
header
|
|
font-size: 3vmin
|
|
// margin-bottom: 10vmin
|
|
nav
|
|
padding: 1vmin
|
|
background: #222
|
|
//position: fixed
|
|
top: 0
|
|
transition: top 0.2s ease-in-out
|
|
width: 100%
|
|
&.nav-up
|
|
top: -40px
|
|
ul
|
|
margin: 0
|
|
display: flex
|
|
li
|
|
flex: 1 1 auto
|
|
text-align: center
|
|
|
|
#content
|
|
flex: 3 1 auto
|
|
//background: hotpink
|
|
display: flex
|
|
flex-direction: column
|
|
flex-wrap: wrap
|
|
align-items: center
|
|
|
|
|
|
#home-headline
|
|
flex: 1 1 auto
|
|
text-align: center
|
|
h1
|
|
font-size: 10vmin
|
|
color: #111
|
|
background: green
|
|
padding: 5vmin
|
|
margin: 0
|
|
border: 3px solid black
|
|
|
|
#main-menu
|
|
flex: 1 1 auto
|
|
font-size: 5vmin
|
|
display: flex
|
|
flex-direction: column
|
|
a
|
|
background: green
|
|
margin: 4px 0 4px
|
|
padding: 8px
|
|
border: 2px solid black
|
|
text-align: center
|
|
&:hover
|
|
background: #bada55
|
|
color: black
|
|
&:active
|
|
background: (#bada55 + 100)
|
|
|
|
*, *:before, *:after
|
|
box-sizing: inherit
|
|
|
|
li
|
|
list-style: none
|