biobulkbende/biobulkbende.org
0
0
Fork 0
mirror of https://github.com/biobulkbende/biobulkbende.org.git synced 2025-10-19 10:16:31 +00:00
Code Issues Projects Releases Wiki Activity

js automation and mobile menu

Browse Source
This commit is contained in:
Tancre
2020-09-18 22:01:59 +02:00
parent 7bb27cb2ed
commit ffe3634bcf
14 changed files with 3829 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
app/temp/styles/style.css
View File

@ -333,6 +333,9 @@ img {
width: 100%;
z-index: 2;
transition: background-color .3s ease-out; }
.site-header--is-expanded {
background-color: orange;
padding-bottom: 18px; }
@media (min-width: 800px) {
.site-header {
position: fixed;
@ -341,6 +344,52 @@ img {
.site-header__btn-container {
padding: 32px 0px 32px 0px;
float: right; } }
.site-header__menu-icon {
width: 20px;
height: 19px;
position: absolute;
z-index: 10;
top: 10px;
right: 10px; }
.site-header__menu-icon::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 3px;
background: #FFF;
transform-origin: 0 0;
transition: transform .3s ease-out; }
.site-header__menu-icon__middle {
position: absolute;
top: 8px;
left: 0;
width: 20px;
height: 3px;
background: #FFF;
transition: all .3s ease-out;
transform-origin: 0 50%; }
.site-header__menu-icon::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 20px;
height: 3px;
background: #FFF;
transform-origin: 0 100%;
transition: transform .3s ease-out; }
@media (min-width: 800px) {
.site-header__menu-icon {
display: none; } }
.site-header__menu-icon--close-x::before {
transform: rotate(45deg) scaleX(1.25); }
.site-header__menu-icon--close-x .site-header__menu-icon__middle {
transform: scaleX(0);
opacity: 0; }
.site-header__menu-icon--close-x::after {
transform: rotate(-45deg) scaleX(1.25) translateY(1px); }
.site-header__menu-content {
opacity: 0;
transform: scale(1.2);
@ -349,6 +398,10 @@ img {
z-index: -10;
padding-top: 90px;
text-align: center; }
.site-header__menu-content--is-visible {
transform: scale(1);
opacity: 1;
z-index: 1; }
@media (min-width: 800px) {
.site-header__menu-content {
opacity: 1;
@ -357,17 +410,24 @@ img {
transform: scale(1); } }
.site-header__logo {
position: absolute;
top: 3px;
top: 0px;
padding: 5px 15px;
left: 50%;
transform-origin: 50% 0%;
transform: translateX(-50%) scale(0.8);
transition: transform .3s ease-out; }
transition: transform .3s ease-out;
background-color: rgba(0, 0, 0, 0.5); }
.site-header__logo--orange-bg {
background-color: orange; }
@media (min-width: 800px) {
.site-header__logo {
padding: 0;
top: 3px;
position: relative;
float: left;
left: auto;
transform: translateX(0); } }
transform: translateX(0);
background-color: rgba(0, 0, 0, 0); } }
.primary-nav {
padding-top: 10px; }
@ -450,13 +510,13 @@ img {
.large-hero__title {
font-size: 4.8rem; } }
.large-hero__subtitle {
font-family: "CocogooseNormal";
font-weight: 400;
color: white;
font-size: 1.5rem;
margin: 0; }
@media (min-width: 530px) {
.large-hero__subtitle {
font-size: 2.9rem; } }
font-size: 2.4rem; } }
.large-hero__description {
color: #FFF;
font-weight: 00;

2
app/temp/styles/style.css.map
View File

File diff suppressed because one or more lines are too long