91ba50ea2c
gates / gates (push) Failing after 13m42s
On /alkalmazasok the Alkalmazasok group renders expanded, which gives the sidebar a 16px scrollbar and narrows it from 239 to 224. At .95rem the Hungarian label wrapped to two lines there (the English one still fitted, which is why it showed on one page and not its twin). Sized to the narrow case, measured not guessed.
322 lines
24 KiB
HTML
322 lines
24 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="hu" class="no-js">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<script>document.documentElement.className=document.documentElement.className.replace('no-js','js');</script>
|
|
<meta name="robots" content="noindex, nofollow">
|
|
<meta name="description" content="Otthoni szerver a saját otthonodban: fényképek, dokumentumok, médiatár. 58 telepíthető alkalmazás, háromszintű automatikus mentés, magyar vagy angol nyelvű vezérlőpult. Most zárt teszt indul.">
|
|
<title>Felhom.eu — Saját felhőd, saját szabályaid | Otthoni szerver szolgáltatás</title>
|
|
<script defer src="/assets/gallery.js?v=2"></script>
|
|
<link rel="canonical" href="https://felhom.eu/">
|
|
<link rel="alternate" hreflang="hu" href="https://felhom.eu/">
|
|
<link rel="alternate" hreflang="en" href="https://felhom.eu/en/">
|
|
<link rel="alternate" hreflang="x-default" href="https://felhom.eu/">
|
|
<link rel="stylesheet" href="/assets/site.css?v=21">
|
|
<link rel="stylesheet" href="/assets/shell.css?v=21">
|
|
<link rel="icon" type="image/png" href="/assets/logo_favicon_2.svg">
|
|
<script defer src="https://stats.felhom.eu/script.js" data-website-id="d419db57-5e1c-48df-bdb3-c29f25fb1661"></script>
|
|
</head>
|
|
<body class="shell page-index">
|
|
<header class="mobile-topbar">
|
|
<a href="/preview/m3/" class="mobile-topbar-logo"><img src="/assets/logo_notext_white.svg" alt="Felhom.eu"></a>
|
|
<button type="button" class="nav-burger" id="navBurger" aria-expanded="false" aria-controls="sidebar" aria-label="Menü">
|
|
<span class="hamburger-box"><span class="hamburger-line"></span><span class="hamburger-line"></span><span class="hamburger-line"></span></span>
|
|
</button>
|
|
</header>
|
|
<div class="nav-backdrop" id="navBackdrop" hidden></div>
|
|
<nav class="sidebar" id="sidebar">
|
|
<div class="sidebar-header">
|
|
<a href="/preview/m3/" class="sidebar-logo-link">
|
|
<img src="/assets/logo_notext_white.svg" alt="" class="sidebar-logo" aria-hidden="true">
|
|
<img src="/assets/logo-wordmark.png" alt="felhom.eu" class="sidebar-word">
|
|
</a>
|
|
</div>
|
|
<ul class="nav-links">
|
|
<li><a href="/preview/m3/" class="active"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg>Kezdőlap</a></li>
|
|
<li><a href="/preview/m3/#szolgaltatasok"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rocket"/></svg>Szolgáltatások</a></li>
|
|
<li class="nav-group">
|
|
<button type="button" class="nav-group-toggle" aria-expanded="false" aria-controls="nav-group-apps"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg>Alkalmazások<svg class="ico nav-chevron" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-chevron-down"/></svg></button>
|
|
<ul id="nav-group-apps" class="nav-links nav-links-sub nav-links-nested">
|
|
<li><a href="/preview/m3/alkalmazasok">Minden alkalmazás</a></li>
|
|
<li><a href="/preview/m3/alkalmazasok#fajlkezeles-irodai">Fájlkezelés & Irodai</a></li>
|
|
<li><a href="/preview/m3/alkalmazasok#media-szorakozas">Média & Szórakozás</a></li>
|
|
<li><a href="/preview/m3/alkalmazasok#otthon-eletmod">Otthon & Életmód</a></li>
|
|
<li><a href="/preview/m3/alkalmazasok#produktivitas-tudaskezeles">Produktivitás & Tudáskezelés</a></li>
|
|
<li><a href="/preview/m3/alkalmazasok#rendszer-fejlesztes">Rendszer & Fejlesztés</a></li>
|
|
</ul>
|
|
</li>
|
|
<li><a href="/preview/m3/technologiak"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-layers"/></svg>Technológiák</a></li>
|
|
<li><a href="/preview/m3/biztonsagimentes"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg>Biztonsági mentés</a></li>
|
|
</ul>
|
|
<div class="sidebar-bottom">
|
|
<a href="/preview/m3/teszteles" class="btn btn-outline sidebar-cta">Jelentkezem tesztelőnek →</a>
|
|
<div class="nav-group-label">A Felhomról</div>
|
|
<ul class="nav-links nav-links-sub">
|
|
<li><a href="/preview/m3/#hogyan-mukodik">Hogyan működik</a></li>
|
|
<li><a href="/preview/m3/gyik">GYIK</a></li>
|
|
<li><a href="/preview/m3/kapcsolat">Kapcsolat</a></li>
|
|
</ul>
|
|
<div class="sidebar-footer">
|
|
<details class="lang-globe"><summary class="lang-globe-btn" aria-label="Nyelv" title="Nyelv"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg></summary><ul class="lang-globe-menu"><li><a href="/preview/m3/" lang="hu" hreflang="hu" class="lang-globe-item current" aria-current="true">Magyar</a></li><li><a href="/preview/m3/en/" lang="en" hreflang="en" class="lang-globe-item">English</a></li></ul></details>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
<main class="content">
|
|
<div class="page-header">
|
|
<h1>Saját felhőd, saját szabályaid</h1>
|
|
<span class="domain-badge">Otthoni szerver szolgáltatás</span>
|
|
</div>
|
|
|
|
<section class="hero-row">
|
|
<div class="hero-copy">
|
|
<p class="hero-lede">Egy kis gép az otthonodban: a fényképeid, a dokumentumaid, a filmjeid. Minden éjjel mentés készül. Mi figyeljük, te használod.</p>
|
|
<a href="/teszteles" class="btn btn-primary btn-lg">Jelentkezem tesztelőnek →</a>
|
|
</div>
|
|
<div class="hero-window" aria-label="A vezérlőpult képe">
|
|
<div class="hero-window-bar">
|
|
<span class="hw-dot"></span><span class="hw-dot"></span><span class="hw-dot"></span>
|
|
<span class="hero-window-title">otthonod.hu <span class="sample">minta</span></span>
|
|
</div>
|
|
<div class="hero-window-body">
|
|
<p class="hero-window-lede">Így néz ki a doboz vezérlőpultja.</p>
|
|
<div class="launch-grid launch-grid--mini">
|
|
<a class="launch-cell" href="/alkalmazasok#immich">
|
|
<span class="launch-tile" style="background: hsl(18, 45%, 38%)"><span class="launch-mono">I</span><img class="launch-logo" src="/assets/immich-logo.svg" alt="" loading="lazy"></span>
|
|
<span class="launch-name">Immich</span>
|
|
</a>
|
|
<a class="launch-cell" href="/alkalmazasok#jellyfin">
|
|
<span class="launch-tile" style="background: hsl(348, 45%, 38%)"><span class="launch-mono">J</span><img class="launch-logo" src="/assets/jellyfin-logo.svg" alt="" loading="lazy"></span>
|
|
<span class="launch-name">Jellyfin</span>
|
|
</a>
|
|
<a class="launch-cell" href="/alkalmazasok#nextcloud">
|
|
<span class="launch-tile" style="background: hsl(201, 45%, 38%)"><span class="launch-mono">N</span><img class="launch-logo" src="/assets/nextcloud-logo.svg" alt="" loading="lazy"></span>
|
|
<span class="launch-name">Nextcloud</span>
|
|
</a>
|
|
<a class="launch-cell" href="/alkalmazasok#vaultwarden">
|
|
<span class="launch-tile" style="background: hsl(66, 45%, 38%)"><span class="launch-mono">V</span><img class="launch-logo" src="/assets/vaultwarden-logo.svg" alt="" loading="lazy"></span>
|
|
<span class="launch-name">Vaultwarden</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="shell-section" id="szolgaltatasok">
|
|
<div class="sec-head">
|
|
<h2>Mit tud a doboz ma?</h2>
|
|
<p>Nem terv és nem ígéret: ezek ma működő funkciók egy éles Felhom dobozon.</p>
|
|
</div>
|
|
<div class="caps">
|
|
<div class="caps-group">
|
|
<h3>Amit nap mint nap használsz</h3>
|
|
<ul class="caps-list">
|
|
<li class="caps-item">
|
|
<h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-camera"/></svg> Fényképek, dokumentumok, média</h4>
|
|
<p>A telefonod fotói automatikusan feltöltődnek a saját gépedre. A beszkennelt papírjaidat a rendszer felismeri és keresővé teszi. A filmjeid, zenéid böngészőből és mobil appból is mennek.</p>
|
|
</li>
|
|
<li class="caps-item">
|
|
<h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-folder"/></svg> Hálózati megosztás</h4>
|
|
<p>A doboz mappái megjelennek a Windows Intézőben és a Mac Finderben: úgy húzod rájuk a fájlokat, mint bármelyik másik mappára. Megosztásonként beállítható, hogy csak olvasható legyen.</p>
|
|
</li>
|
|
<li class="caps-item">
|
|
<h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-package"/></svg> 58 telepíthető alkalmazás</h4>
|
|
<p>A vezérlőpultból telepíthetők, pár kattintással, parancssor nélkül. Szinte mind nyílt forráskódú, és mind a te gépeden fut.</p>
|
|
</li>
|
|
<li class="caps-item">
|
|
<h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-globe"/></svg> Magyarul vagy angolul</h4>
|
|
<p>A vezérlőpult magyarul és angolul is használható. A nyelvet a háztartás választja, és a dobozról érkező e-mailek is ezt a nyelvet követik.</p>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="caps-group">
|
|
<h3>Ami a háttérben véd</h3>
|
|
<ul class="caps-list">
|
|
<li class="caps-item">
|
|
<h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-shield-check"/></svg> Háromszintű automatikus mentés</h4>
|
|
<p>Minden éjjel készül egy mentés a dobozon, egy másodpéldány egy második meghajtóra (ha van), és egy titkosított másolat egy távoli tárhelyre. A megosztott mappáid a második meghajtón és a távoli másolatban is benne vannak.</p>
|
|
</li>
|
|
<li class="caps-item">
|
|
<h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-lock"/></svg> Helyreállítási kód, amit csak te ismersz</h4>
|
|
<p>A távoli mentésed titkosításának kulcsa egy helyreállítási kód, ami pontosan egyszer jelenik meg: a te képernyődön. Mi nem ismerjük, és nem tudjuk visszaállítani. Ez azt is jelenti, hogy a kód nélkül a távoli mentés nekünk sem olvasható: tedd el jól.</p>
|
|
</li>
|
|
<li class="caps-item">
|
|
<h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Visszaállítás, ha baj van</h4>
|
|
<p>Egy törölt fájl visszahozható a mentésből. Ha maga a doboz megy tönkre, az újratelepített rendszerre a titkosított távoli mentésből visszahozhatók az alkalmazásaid adatai, a helyreállítási kóddal.</p>
|
|
</li>
|
|
<li class="caps-item">
|
|
<h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-home"/></svg> Internetkimaradáskor is működik</h4>
|
|
<p>A doboz az otthonodban van. Ha elmegy a net, az otthoni hálózaton továbbra is eléred a fotóidat és a fájljaidat: nem egy távoli szolgáltató engedélyétől függenek.</p>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="caps-group">
|
|
<h3>Amiről mi gondoskodunk</h3>
|
|
<ul class="caps-list">
|
|
<li class="caps-item">
|
|
<h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-stethoscope"/></svg> Távoli felügyelet, automatikus frissítés</h4>
|
|
<p>Figyeljük a doboz állapotát. A vezérlőpult magától frissül a legutóbbi kiadásra, és a doboz rendszere is megkapja a biztonsági frissítéseket. Neked nem kell csinálnod semmit. Ha valami elromlik, mi látjuk.</p>
|
|
</li>
|
|
<li class="caps-item">
|
|
<h4><svg class="ico-lg" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-rotate-cw"/></svg> Óvatos alkalmazásfrissítés</h4>
|
|
<p>Egy alkalmazás új verziója csak akkor jut el hozzád, ha előbb kipróbáltuk. Frissítés előtt friss mentés készül, és ha az új verzió nem indul el rendesen, a doboz magától visszaállítja az előzőt, az adataiddal együtt.</p>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="shell-section" id="vezerlopult">
|
|
<div class="sec-head">
|
|
<h2>Így néz ki a vezérlőpult</h2>
|
|
<p>Valódi képek egy Felhom dobozról. Kattints rájuk a teljes mérethez.</p>
|
|
</div>
|
|
<div class="dash-grid">
|
|
<figure class="dash-shot">
|
|
<a href="/assets/dashboard-start-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-start-hu.webp" alt="A vezérlőpult Indítópultja: az otthon telepített alkalmazások csempéi" width="1440" height="900" loading="lazy"></a>
|
|
<figcaption><strong>Indítópult</strong>: minden alkalmazásod egy kattintásra.</figcaption>
|
|
</figure>
|
|
<figure class="dash-shot">
|
|
<a href="/assets/dashboard-apps-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-apps-hu.webp" alt="Az Alkalmazások oldal: telepített és telepíthető alkalmazások kártyái, állapottal" width="1440" height="900" loading="lazy"></a>
|
|
<figcaption><strong>Alkalmazások</strong>: telepítés pár kattintással, és látod, mi fut és mi naprakész.</figcaption>
|
|
</figure>
|
|
<figure class="dash-shot">
|
|
<a href="/assets/dashboard-app-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-app-hu.webp" alt="Egy alkalmazás saját oldala: mire jó, képek, és az első lépések" width="1440" height="900" loading="lazy"></a>
|
|
<figcaption><strong>Egy alkalmazás oldala</strong>: mire jó, hova tedd a fájlokat, és hogyan kezdj hozzá.</figcaption>
|
|
</figure>
|
|
<figure class="dash-shot">
|
|
<a href="/assets/dashboard-backups-hu.webp" data-gallery="dashboard"><img src="/assets/dashboard-backups-hu.webp" alt="A mentések oldala: minden alkalmazás adatbázisának éjszakai mentése, ellenőrizve" width="1440" height="900" loading="lazy"></a>
|
|
<figcaption><strong>Mentések</strong>: minden éjjel minden alkalmazás adatbázisa mentésre kerül, és ellenőrizzük.</figcaption>
|
|
</figure>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="shell-section" id="hogyan-mukodik">
|
|
<div class="sec-head">
|
|
<h2>Hogyan működik?</h2>
|
|
<p>Az első beszélgetéstől a működő rendszerig.</p>
|
|
</div>
|
|
<div class="flow">
|
|
<div class="flow-step">
|
|
<h3>Egyeztetés</h3>
|
|
<p>Megbeszéljük az igényeidet: milyen alkalmazásokra van szükséged, és mekkora tárhelyet szeretnél.</p>
|
|
</div>
|
|
<div class="flow-step">
|
|
<h3>Hardver kiválasztás</h3>
|
|
<p>Segítünk megtalálni a legjobb ár-érték arányú gépet, ami az igényeidnek megfelel.</p>
|
|
</div>
|
|
<div class="flow-step">
|
|
<h3>Telepítés</h3>
|
|
<p>Feltelepítjük és bekonfiguráljuk az alkalmazásokat, a mentéseket, és a monitoringot.</p>
|
|
</div>
|
|
<div class="flow-step">
|
|
<h3>Átadás</h3>
|
|
<p>Bemutatjuk a rendszert, segítünk áthozni a meglévő adataidat, és válaszolunk minden kérdésedre.</p>
|
|
</div>
|
|
<div class="flow-step">
|
|
<h3>Üzemeltetés</h3>
|
|
<p>Figyeljük a rendszert, frissítünk, mentéseket ellenőrzünk. Te csak használod.</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="shell-section" id="miert">
|
|
<div class="sec-head">
|
|
<h2>Miért a sajátod?</h2>
|
|
<p>Ugyanaz a kényelem, más feltételekkel.</p>
|
|
</div>
|
|
<div class="vs">
|
|
<div class="vs-head">
|
|
<div>Felhőszolgáltatónál</div>
|
|
<div>Saját dobozon</div>
|
|
</div>
|
|
<div class="vs-row">
|
|
<div>Havonta fizetsz a tárhelyért és a prémium funkciókért, és az árak csak nőnek idővel.</div>
|
|
<div><strong>A gép a tiéd, örökre.</strong> Nincs tárhely-előfizetés, ami évről évre drágul: az áramot fizeted, és ha kéred, az üzemeltetést.</div>
|
|
</div>
|
|
<div class="vs-row">
|
|
<div>A fotóid, dokumentumaid, személyes adataid idegen szervereken vannak, idegen kezekben.</div>
|
|
<div><strong>Az adataid az otthonodban maradnak</strong>, nem a Google vagy a Microsoft szerverein. A távoli mentésbe csak titkosítva kerülnek.</div>
|
|
</div>
|
|
<div class="vs-row">
|
|
<div>A tárhely fogy, és ha betelt, megint fizetsz.</div>
|
|
<div><strong>Nincs 15GB-os limit.</strong> Bővítheted ahogy nőnek az igényeid, TB-okkal, ha kell.</div>
|
|
</div>
|
|
<div class="vs-row">
|
|
<div>Nem te döntöd el, milyen szolgáltatásokat használsz, és mikor szűnnek meg.</div>
|
|
<div><strong>Te döntöd el, milyen szolgáltatásokat futtatsz.</strong> Te vagy a főnök, nem a szolgáltató.</div>
|
|
</div>
|
|
</div>
|
|
<div class="band">
|
|
<div class="band-item">
|
|
<h3>Amit telepíthetsz</h3>
|
|
<p>Fájlkezelés, fotók és média, dokumentumok, jelszókezelés, okosotthon, fejlesztői eszközök. Nextcloud, Immich, Jellyfin, Paperless-ngx, Vaultwarden, Home Assistant és még 52 másik: <strong>58 alkalmazás</strong>, szinte mind nyílt forráskódú.</p>
|
|
<a href="/alkalmazasok" class="btn btn-outline">Összes alkalmazás megtekintése →</a>
|
|
</div>
|
|
<div class="band-item">
|
|
<h3>Ami alatta fut</h3>
|
|
<p>Docker konténerek egy Proxmox alapon, háromszintű mentés, titkosított alagút nyitott port nélkül, magyar vagy angol vezérlőpult. Az igényeidhez igazítjuk, a <strong>legegyszerűbbtől a legkomolyabbig</strong>.</p>
|
|
<a href="/technologiak" class="btn btn-outline">Technológiákról bővebben →</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="shell-section" id="zart-teszt">
|
|
<div class="sec-head">
|
|
<h2>Zárt teszt</h2>
|
|
<p>Néhány magyar háztartással most kezdjük el élesben használni a rendszert.</p>
|
|
</div>
|
|
<div class="app-info-grid">
|
|
<div class="app-info-card">
|
|
<h3>Valódi használat</h3>
|
|
<p>Nem demó: a doboz nálad marad, és az igazi fényképeidet, dokumentumaidat teszed rá. Segítünk a telepítésben és az átállásban, utána te használod a mindennapokban.</p>
|
|
</div>
|
|
<div class="app-info-card">
|
|
<h3>Visszajelzés</h3>
|
|
<p>Cserébe azt kérjük, hogy mondd el, mi zavaró, mi érthetetlen, mi nem működik. Egy „ezt a gombot nem találtam" ér nekünk a legtöbbet: abból tudjuk, mit kell kijavítani.</p>
|
|
</div>
|
|
</div>
|
|
<div class="alerts-container">
|
|
<div class="alert-banner alert-banner-warning">
|
|
<span class="alert-icon"><svg class="ico" aria-hidden="true"><use href="/assets/icons.svg?v=1#i-triangle-alert"/></svg></span>
|
|
<span class="alert-message"><strong>Ismert korlátok, őszintén.</strong> A vezérlőpulthoz jelenleg <strong>egy közös háztartási jelszó</strong> tartozik, külön családtagi fiókok még nincsenek (az egyes alkalmazásoknak viszont saját felhasználóik lehetnek). A <strong>TV-re streamelés (DLNA)</strong> még nincs: egyelőre böngészőből és mobil appból megy a médiatár. És mivel ez teszt, számíts arra, hogy találsz hibát: ez a lényege.</span>
|
|
</div>
|
|
</div>
|
|
<div class="close-cta">
|
|
<p>Ha ez érdekel, írj. <strong>Nem kötelez semmire</strong>, először csak beszélgetünk.</p>
|
|
<a href="/teszteles" class="btn btn-primary btn-lg">Jelentkezem tesztelőnek →</a>
|
|
<div class="who-mini">
|
|
<img src="/assets/operator-portrait-small.webp" alt="Nagyfenyvesi Viktor, a Felhom üzemeltetője" width="160" height="200" loading="lazy">
|
|
<p>A Felhom mögött egy ember áll: <strong>Nagyfenyvesi Viktor</strong>. Ha írsz, ő válaszol. <a href="/kapcsolat#ki-all-mogotte">Ki áll mögötte →</a></p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
</main>
|
|
<script>
|
|
(function(){
|
|
var b=document.getElementById('navBurger'),s=document.getElementById('sidebar'),k=document.getElementById('navBackdrop');
|
|
if(!b||!s||!k)return;
|
|
function open(){s.classList.add('is-open');k.hidden=false;document.body.classList.add('nav-open');b.setAttribute('aria-expanded','true');}
|
|
function close(){s.classList.remove('is-open');k.hidden=true;document.body.classList.remove('nav-open');b.setAttribute('aria-expanded','false');}
|
|
b.addEventListener('click',function(){s.classList.contains('is-open')?close():open();});
|
|
k.addEventListener('click',close);
|
|
document.addEventListener('keydown',function(e){if(e.key==='Escape'&&s.classList.contains('is-open')){close();b.focus();}});
|
|
s.querySelectorAll('a').forEach(function(l){l.addEventListener('click',close);});
|
|
window.addEventListener('resize',function(){if(window.innerWidth>768)close();});
|
|
})();
|
|
document.addEventListener('click',function(e){
|
|
var btn=e.target.closest?e.target.closest('.nav-group-toggle'):null;
|
|
if(!btn)return;
|
|
var g=btn.closest('.nav-group');if(!g)return;
|
|
var willOpen=!g.classList.contains('is-open');
|
|
document.querySelectorAll('.nav-group.is-open').forEach(function(x){
|
|
x.classList.remove('is-open');
|
|
var t=x.querySelector('.nav-group-toggle');if(t)t.setAttribute('aria-expanded','false');
|
|
});
|
|
if(willOpen){g.classList.add('is-open');btn.setAttribute('aria-expanded','true');}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|