102 lines
2.3 KiB
CSS
102 lines
2.3 KiB
CSS
/*
|
|
* 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, or any plugin's
|
|
* vendor/assets/stylesheets directory 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 other CSS/SCSS
|
|
* files in this directory. Styles in this file should be added after the last require_* statement.
|
|
* It is generally better to create a new file per style scope.
|
|
*
|
|
*= require_tree .
|
|
*= require_self
|
|
*/
|
|
|
|
.dark-primary-color { background: #303F9F; }
|
|
.default-primary-color { background: #3F51B5; }
|
|
.light-primary-color { background: #C5CAE9; }
|
|
.text-primary-color { color: #FFFFFF; }
|
|
.accent-color { background: #009688; }
|
|
.primary-text-color { color: #212121; }
|
|
.secondary-text-color { color: #757575; }
|
|
.divider-color { border-color: #BDBDBD; }
|
|
|
|
body {
|
|
margin: 0;
|
|
}
|
|
|
|
main {
|
|
margin: 8px;
|
|
}
|
|
|
|
nav {
|
|
background-color: #3F51B5;
|
|
width: 100%;
|
|
display: grid;
|
|
grid-template-columns: 1fr auto 1fr;
|
|
box-shadow: 0 16px 24px 2px rgba(0,0,0,0.14), 0 6px 30px 5px rgba(0,0,0,0.12), 0 8px 10px -5px rgba(0,0,0,0.20);
|
|
}
|
|
|
|
nav a {
|
|
color: white;
|
|
text-decoration: none;
|
|
text-transform: uppercase;
|
|
font-family: Helvetica, sans-serif;
|
|
font-size: 18px;
|
|
transition: .3s all ease-in-out;
|
|
}
|
|
|
|
nav a:hover {
|
|
background-color: #009688;
|
|
}
|
|
|
|
#nav-toggle {
|
|
display: none;
|
|
}
|
|
|
|
#nav-toggle:checked ~ .left-menu {
|
|
display: grid;
|
|
grid-row: 2;
|
|
grid-column: 1/-1;
|
|
}
|
|
|
|
.burger-menu {
|
|
display: inline-block;
|
|
grid-column: 1;
|
|
align-self: center;
|
|
margin-left: 1rem;
|
|
}
|
|
|
|
.left-menu {
|
|
display: none;
|
|
grid-column: 1;
|
|
align-self: center;
|
|
}
|
|
|
|
.left-menu a {
|
|
padding: 15px 0 10px 1rem;
|
|
font-size: 18px;
|
|
font-weight: 500;
|
|
letter-spacing: .5px;
|
|
}
|
|
|
|
.right-menu {
|
|
grid-column: 3;
|
|
text-align: right;
|
|
align-self: center;
|
|
}
|
|
|
|
.right-menu a {
|
|
padding: 18px 1rem 17px 1rem;
|
|
}
|
|
|
|
.logo {
|
|
grid-column: 2;
|
|
padding: 1rem;
|
|
font-family: Helvetica, sans-serif;
|
|
font-size: 18px;
|
|
font-weight: 800;
|
|
letter-spacing: 0.5px;
|
|
} |