1
0
Fork 0

[SITE] new mobile menu (plain CSS) & removed animation assets of bootstrap

This commit is contained in:
Jannik Beyerstedt 2016-10-28 23:32:29 +02:00
parent 2ecf9ea656
commit 1544f888ca
21 changed files with 176 additions and 124 deletions

View file

@ -1656,31 +1656,6 @@ input[type="reset"].btn-block,
input[type="button"].btn-block {
width: 100%; }
.fade {
opacity: 0;
transition: opacity 0.15s linear; }
.fade.active {
opacity: 1; }
.collapse {
display: none; }
.collapse.active {
display: block; }
tr.collapse.active {
display: table-row; }
tbody.collapse.active {
display: table-row-group; }
.collapsing {
position: relative;
height: 0;
overflow: hidden;
transition-timing-function: ease;
transition-duration: .35s;
transition-property: height; }
.align-baseline {
vertical-align: baseline !important; }

File diff suppressed because one or more lines are too long

View file

@ -8,7 +8,11 @@
body {
margin: 0;
font-family: 'Alegreya Sans', "Verdana", "Arial", sans-serif;
min-width: 300px; }
min-width: 300px;
overflow-x: hidden; }
div.site-wrap {
background-color: #fff; }
h1, h2, h3, h4 {
margin-bottom: 18px;
@ -85,6 +89,9 @@ header img {
margin: 4px 0;
float: left; }
.nav-trigger {
display: none; }
nav {
box-sizing: border-box; }
nav ul.nav {
@ -116,26 +123,58 @@ nav {
nav ul.nav a {
margin: 30px 9px 1px; } }
nav.mobile {
width: 200px;
height: 100%;
position: fixed;
right: -200px;
z-index: 0; }
.site-wrap {
position: relative;
left: 0;
z-index: 1; }
@media (max-width: 575px) {
nav button.navbar-toggler {
float: right;
margin-top: 24px;
font-family: inherit;
font-weight: 300; }
nav ul.mobileNav {
color: #fff;
background-color: #424242;
padding: 1rem 1rem; }
nav ul.mobileNav a {
font-size: 20px;
font-weight: 300; }
nav ul.mobileNav a.active {
color: #2dac01;
font-weight: 700; }
.navbar-toggler {
label[for="nav-trigger"] {
position: absolute;
right: 15px;
top: 24px;
z-index: 2;
padding: 0.5rem 0.75rem;
font-size: 1.25rem;
line-height: 1; } }
line-height: 1;
font-family: inherit;
font-weight: 300;
color: #373a3c;
background-color: #fff; }
nav.mobile {
background-color: #424242; }
nav.mobile ul.mobileNav {
color: #fff;
padding: 1rem 1rem;
padding-top: 28px; }
nav.mobile ul.mobileNav li {
margin-bottom: 0.4em; }
nav.mobile ul.mobileNav li a {
font-size: 20px;
font-weight: 300; }
nav.mobile ul.mobileNav li a.active {
color: #2dac01;
font-weight: 700; }
nav.mobile ul.mobileNav ul > li {
margin-bottom: 0.2em; }
.nav-trigger:checked + label {
right: 215px; }
.nav-trigger:checked ~ .site-wrap {
left: -200px;
box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.5); }
.nav-trigger:checked ~ nav.mobile {
right: 0; }
.nav-trigger + label, nav.mobile {
transition: right 0.2s; }
.site-wrap {
transition: left 0.2s; } }
footer {
margin-top: 25px;

File diff suppressed because one or more lines are too long

View file

@ -27,6 +27,6 @@ main {
@media (max-width: 575px) {
main {
padding-top: 16vh; } }
padding-top: 10vh; } }
/*# sourceMappingURL=home.css.map */

View file

@ -2,9 +2,11 @@
* for specific template
*/
body {
background-color: #424242;
color: #fff; }
div.site-wrap {
background-color: #424242; }
a {
color: #34c501; }
a:active, a:hover {
@ -20,8 +22,9 @@ main p a:visited {
border: none; } }
@media (max-width: 575px) {
.navbar-toggler {
color: #fff; } }
label[for="nav-trigger"] {
color: #fff;
background-color: #424242; } }
footer {
background-color: #303030;

File diff suppressed because one or more lines are too long