mnalis/organicmaps-website
1
Fork 0
forked from organicmaps/website
Code Pull requests Activity

fix_v1

Browse source
This commit is contained in:
borntojesus 2023-12-05 01:27:16 +02:00
parent 66c1ac1f6e
commit d8c4f045fd
11 changed files with 104 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

52
sass/common/header.scss
View file

@ -48,9 +48,10 @@
@media (max-width: $media-md) {
position: absolute;
background-color: var(--common-green-primery);
top: 50rem;
top: 66rem;
width: 100%;
left: -100vw;
right: -100vw;
opacity: 0;
padding: 0 16rem;
overflow: scroll;
height: calc(100vh - 55rem);
@ -62,7 +63,7 @@
transition: left var(--transition), opacity var(--transition);
&.is-active {
left: 0;
right: 0;
opacity: 1;
}
}
@ -94,13 +95,53 @@
&__menu-btn {
display: none;
@media (max-width: $media-md) {
padding: 8rem 0 8rem 8rem;
width: 30rem;
height: 30rem;
margin-left: 20rem;
display: flex;
align-items: center;
position: relative;
&.is-active {
.header__close-line {
width: 0;
&:first-child {
transform: translate(-50%, -50%) rotate(45deg);
top: 15rem;
width: 100%;
}
&:last-child {
width: 100%;
transform: translate(-50%, -50%) rotate(-45deg);
bottom: 13rem;
}
}
}
}
}
&__close-line {
@media (max-width: $media-md) {
transition: all 0.5s;
height: 2rem;
width: 100%;
border-radius: 2rem;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: var(--common-black);
&:first-child {
top: 6rem;
}
&:last-child {
top: auto;
bottom: 3rem;
}
}
}
&__item {
text-align: center;
}
@ -130,6 +171,7 @@
&__card {
padding: 20rem 0;
color: var(--common-green);
}
&__icon-title {
@ -167,7 +209,7 @@
}
@keyframes header-play {
from{
from {
max-height: 0;
}
to {

4
sass/global/index.scss
View file

@ -17,6 +17,10 @@ body {
max-width: var(--container);
}
* {
transition: background-color 0.3s;
}
.logo .svg-logo {
@media(max-width: $media-md) {
max-width: 130rem;

5
sass/pages/home.scss
View file

@ -2,8 +2,9 @@
// Hero Section
.hero {
background: url('/images/hero/hero-bg.jpg') center center / cover no-repeat fixed;
min-height: 100vh;
background: var(--common-black) url('/images/hero/hero-bg.jpg') center center / cover no-repeat fixed;
height: 100vh;
max-height: 900rem;
padding: 80rem 0;
display: flex;
align-items: center;

15
sass/pages/volunteering.scss
View file

@ -9,6 +9,7 @@
align-items: center;
}
}
&__container {
display: flex;
flex-direction: column;
@ -39,9 +40,11 @@
border-bottom: 1rem solid var(--common-acord-button);
overflow: scroll;
max-height: 500rem;
> div {
max-height: 500rem;
max-height: 500rem;
}
img {
display: inline;
width: fit-content;
@ -84,12 +87,20 @@
justify-content: center;
align-items: center;
border-radius: 34rem;
&:before {
content: "+";
}
}
.is-active {
border-radius: 10rem;
border-radius: 10rem;
border: 1rem solid var(--common-acord-button);
background-color: var(--acordion-green-bg);
.section-volunteering__button {
&:before {
content: "-";
}
}
}
.is-active + .section-volunteering__content {

2
sass/variables/spasing.scss
View file

@ -14,5 +14,5 @@
--container-mob-section: 60rem;
--container-mob-padding: 16rem;
--menu-height: 55rem;
--menu-height: 90rem;
}

6
templates/common/header.html
View file

@ -125,8 +125,8 @@
{% include 'components/download-button.html' %}
</div>
<div class="header__menu-btn">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
<path fill-rule="evenodd" clip-rule="evenodd" d="M3 6C3 5.44772 3.44772 5 4 5H20C20.5523 5 21 5.44772 21 6C21 6.55228 20.5523 7 20 7H4C3.44772 7 3 6.55228 3 6ZM3 12C3 11.4477 3.44772 11 4 11H20C20.5523 11 21 11.4477 21 12C21 12.5523 20.5523 13 20 13H4C3.44772 13 3 12.5523 3 12ZM3 18C3 17.4477 3.44772 17 4 17H20C20.5523 17 21 17.4477 21 18C21 18.5523 20.5523 19 20 19H4C3.44772 19 3 18.5523 3 18Z" fill="#26312C"/>
</svg>
<div class="header__close-line"></div>
<div class="header__close-line"></div>
<div class="header__close-line"></div>
</div>
</div>

6
templates/faq.html
View file

@ -784,9 +784,7 @@
const seBtn = document.createElement('div')
seBtn.classList.add('section-volunteering__button')
const symB = document.createElement('span')
symB.classList.add('section-volunteering__symbol')
symB.innerText = "+"
const content = document.createElement('div')
content.classList.add('section-volunteering__content')
@ -798,7 +796,7 @@
content.append(contentBlock)
seBtn.append(symB)
select.append(h2Title, seBtn)

2
templates/section/hero.html
View file

@ -1,4 +1,4 @@
<section class="hero">
<section class="hero home-page">
<div class="container hero__container">
<div class="hero__content">
<h1 class="h1 hero__title">

34
templates/shortcodes/header-switch.html
View file

@ -3,19 +3,19 @@
const element = document.querySelector('.header')
const scrollThreshold = 20;
if (document.querySelector(".home-page")) {
window.addEventListener('scroll', function () {
let scrollPosition = window.scrollY || window.pageYOffset;
if (scrollPosition > scrollThreshold) {
element.classList.add('header--green');
} else {
element.classList.remove('header--green');
}
});
}
window.addEventListener('scroll', function () {
let scrollPosition = window.scrollY || window.pageYOffset;
if (scrollPosition > scrollThreshold) {
element.classList.add('header--green');
} else {
element.classList.remove('header--green');
}
});
} else {
const mobIcon = document.querySelector(".header__menu-btn")
const mobIcon = document.querySelector(".header__menu-btn")
const menu = document.querySelector('.header__row')
const wrapper = document.querySelector('html')
@ -25,5 +25,15 @@
wrapper.classList.toggle('frizz')
})
}
try {
const home = document.querySelector(".home-page")
if (!home) {
const header = document.querySelector('.header')
header.classList.add("header--green")
} else {
console.log("no0header")
}
} catch (err) {
console.log(err)
}
</script>

2
templates/shortcodes/paralax.html
View file

@ -18,7 +18,7 @@
if (yPos < 100) {
yPos = yPos + 1;
console.log(yPos);
}
} else if (scrollTop < lastScrollTop) {

14
templates/volunteering.html
View file

@ -38,7 +38,7 @@
{{ page.extra.section_item_title_1 | safe }}
</h2>
<div class="section-volunteering__button">
<span class="section-volunteering__symbol">+</span>
</div>
</div>
<div class="section-volunteering__content">
@ -79,7 +79,7 @@
{{ page.extra.section_item_title_2 | safe }}
</h2>
<div class="section-volunteering__button">
<span class="section-volunteering__symbol">+</span>
</div>
</div>
<div class="section-volunteering__content">
@ -120,7 +120,7 @@
{{ page.extra.section_item_title_3 | safe }}
</h2>
<div class="section-volunteering__button">
<span class="section-volunteering__symbol">+</span>
</div>
</div>
<div class="section-volunteering__content">
@ -161,7 +161,7 @@
{{ page.extra.section_item_title_3 | safe }}
</h2>
<div class="section-volunteering__button">
<span class="section-volunteering__symbol">+</span>
</div>
</div>
<div class="section-volunteering__content">
@ -202,7 +202,7 @@
{{ page.extra.section_item_title_4 | safe }}
</h2>
<div class="section-volunteering__button">
<span class="section-volunteering__symbol">+</span>
</div>
</div>
<div class="section-volunteering__content">
@ -246,7 +246,7 @@
{{ page.extra.section_item_title_4 | safe }}
</h2>
<div class="section-volunteering__button">
<span class="section-volunteering__symbol">+</span>
</div>
</div>
<div class="section-volunteering__content">
@ -287,7 +287,7 @@
{{ page.extra.section_marketing_title_1 | safe }}
</h2>
<div class="section-volunteering__button">
<span class="section-volunteering__symbol">+</span>
</div>
</div>
<div class="section-volunteering__content">