Skip to content

Commit

Permalink
Merge branch 'hello-social' into staging
Browse files Browse the repository at this point in the history
  • Loading branch information
xxiicode committed Mar 26, 2024
2 parents 2e1c04a + cc13184 commit 1bd0402
Show file tree
Hide file tree
Showing 18 changed files with 837 additions and 640 deletions.
9 changes: 6 additions & 3 deletions app/current-page.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@ document.addEventListener("DOMContentLoaded", function () {
})
});


// hello-nav position when scrolling down
// planeo remplazar con sticky
/* // hello-nav position when scrolling down
document.addEventListener('DOMContentLoaded', function () {
let nav = document.querySelector("#navbar");
let navHamb = document.querySelector('.nav-hamburger');
Expand All @@ -23,6 +23,7 @@ document.addEventListener('DOMContentLoaded', function () {
if (scroll >= 60) {
nav.style.top = '-45px';
nav.style.top = '-30px';
navHamb.style.top = '15px';
navcloser.style.top = '15px';
navLinks.style.paddingTop = '90px';
Expand All @@ -35,4 +36,6 @@ document.addEventListener('DOMContentLoaded', function () {
});
});
console.log('current-page.js loaded!!!')
console.log('current-page.js loaded!!!')
*/
console.log('current-page.js loaded!!')
22 changes: 0 additions & 22 deletions app/docs-mobile-nav-v2-local.js
Original file line number Diff line number Diff line change
Expand Up @@ -52,25 +52,3 @@ document.addEventListener("DOMContentLoaded", function() {



/* Mobile nav Scroll observer for nav-title active */
const menuItems = document.querySelectorAll('#navbar ul li a');
const observer = new IntersectionObserver((entries) => {
entries.forEach((entry) => {
const targetId = entry.target.getAttribute('id');
if (entry.isIntersecting) {
menuItems.forEach((menuItem) => {
menuItem.classList.remove('active');
if (menuItem.getAttribute('href') === `#${targetId}`) {
menuItem.classList.add('active');
}
});
}
});
}, {
threshold: 0.1
});

const sections = document.querySelectorAll('section:not(:first-of-type)');
sections.forEach((section) => {
observer.observe(section);
});
76 changes: 67 additions & 9 deletions app/docs-nav-v3.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,20 +5,78 @@ console.log("Soy el docs-nav-v3.js");
const navOpener = document.querySelector('.nav-hamburger')
const navCloser = document.querySelector('.nav-close')
const navLinks = document.querySelector('.nav-links')
/* let navItems = navbar.querySelectorAll("li"); */


navOpener.addEventListener('click', () => {
navLinks.classList.add('open-nav')
navCloser.classList.add('open-nav')
navOpener.classList.add('close-nav')
navLinks.classList.add('open-nav')
navCloser.classList.add('open-nav')
navOpener.classList.add('close-nav')
})
navCloser.addEventListener('click', () => {
navLinks.classList.remove('open-nav')
navCloser.classList.remove('open-nav')
navOpener.classList.remove('close-nav')
navLinks.classList.remove('open-nav')
navCloser.classList.remove('open-nav')
navOpener.classList.remove('close-nav')
})

/* position fixed on nav */

document.addEventListener("DOMContentLoaded", function () {
let nav = document.querySelector(".nav-links");
let hamburger = document.querySelector(".nav-hamburger");

window.addEventListener("scroll", function () {
let scroll = window.scrollY;

if (window.innerWidth > 768) { // Verifica el ancho de la ventana
if (scroll >= 60) {
nav.classList.add("position-fixed");
} else {
nav.classList.remove("position-fixed");
}
}

if (scroll >= 60) {
hamburger.style.top = '18px';
} else {
hamburger.style.top = '168px';
}
});
});




/* end position fixed on nav */

/* Mobile nav Scroll observer for nav-title active */
const menuItems = document.querySelectorAll('#navbar ul li a');
const observer = new IntersectionObserver((entries) => {
entries.forEach((entry) => {
const targetId = entry.target.getAttribute('id');
if (entry.isIntersecting) {
menuItems.forEach((menuItem) => {
menuItem.classList.remove('active');
if (menuItem.getAttribute('href') === `#${targetId}`) {
menuItem.classList.add('active');
}
});
}
});
}, {
threshold: 0.1
});

const sections = document.querySelectorAll('section:not(:first-of-type)');
sections.forEach((section) => {
observer.observe(section);
});
/* END mobile nav scroll observer for nat-title active */







/* if (window.innerWidth <= 768) {
navItems.forEach(item => {
item.addEventListener('click', () => {
Expand Down Expand Up @@ -73,4 +131,4 @@ const observer = new IntersectionObserver((entries) => {
/* const sections = document.querySelectorAll('section');
sections.forEach((section) => {
observer.observe(section);
}); */
}); */
153 changes: 9 additions & 144 deletions app/docs-styles.css
Original file line number Diff line number Diff line change
@@ -1,62 +1,8 @@
html,
body {
background: #ecf0f3;
}

body {
border-top: 12px solid #7637f9;
}

* {
font-family: BiotifMedium;
}

.BiotifMedium {
font-family: BiotifMedium;
}

.BiotifBold {
font-family: BiotifBold;
}

.BiotifExtraBold {
font-family: BiotifExtraBold;
}

* {
color: #4f4f58;
}

h1,
h2,
h3,
h4,
h5,
strong {
color: #12123a;
}

p,
p a,
li,
li a,
p strong,
p span,
li strong {
font-family: 'freight-text-pro', serif;
}

p strong,
li strong {
font-family: 'FreightTextProSemibold', serif;
}

a {
color: #4f4f58;
position: relative;
width: max-content;
}

a::before {
content: '';
position: absolute;
Expand All @@ -70,60 +16,24 @@ a::before {
transform: scaleX(0);
transition: transform .3s ease-in-out;
}

a:hover::before {
transform-origin: left;
transform: scaleX(1);
}

body nav {
nav.sub-sites {
position: fixed;
/* display: flex; */
display: none;
flex-direction: column;
gap: 20px;
padding: 20px;
background-color: white;
width: 240px;
height: 100vh;
top: 12px;
right: 0px;
transition: right .3s ease-in-out;
z-index: 350;
overflow-y: auto;
}

.hamburger {
z-index: 400;
position: fixed;
padding: 0;
right: 12px;
top: 32px;
background-color: #ffffff;
border-color: transparent;
border-radius: 18px;
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
}

.close {
z-index: 380;
position: fixed;
padding: 0;
right: 12px;
top: 32px;
background-color: #ffffff;
border-color: transparent;
border-radius: 18px;
width: 50px;
height: 50px;
align-items: center;
justify-content: center;
display: none;
}



.open-nav {
display: flex;
Expand All @@ -137,13 +47,6 @@ nav h2 {
z-index: 11;
}



body main {
padding-top: 20px;
margin-inline: 20px;
}

nav ul {
list-style: none;
}
Expand All @@ -160,40 +63,12 @@ ul.arrow-bullet {
list-style-image: url(../../imgs/arrow-right.svg);
}

a.web-url {
display: flex;
align-items: center;
flex-direction: row;
}

img.web-icon {
height: 25px;
margin-right: 8px;
margin-top: -2px;
}

a img.external-url-icon,
a img.web-icon {
opacity: 0.6;
}

a:hover img.external-url-icon,
a:hover img.web-icon {
opacity: 1;
}

main section.cover {
display: flex;
flex-direction: column;
gap: 40px;
align-items: flex-start;
}

/* main div#cover div#cover-image {
display: flex;
align-items: center;
} */

nav ul li a {
font-family: BiotifMedium;
text-transform: none !important;
Expand All @@ -214,7 +89,7 @@ nav ul li a {
align-self: flex-start;
width: 77%;
}
.hamburger, .nav-close {
.hamburger, .close {
top: 47px;
}
}
Expand All @@ -224,29 +99,19 @@ nav ul li a {
}
}
@media (min-width: 768px) {
body nav {
position: fixed;
nav.sub-sites {
position: sticky;
display: flex;
flex-direction: column;
gap: 0;
padding: 20px;
background-color: white;
width: 300px;
width: 250px;
height: 100vh;
top: 12px;
top: 0px;
right: unset;
}

body main {
width: 760px;
left: 400px;
position: absolute;
padding-top: 60px;
margin-inline:unset;

}

body > button.hamburger,body > button.close {
button.hamburger, button.close {
display: none;
}

Expand Down
Loading

0 comments on commit 1bd0402

Please sign in to comment.