Files
ApolloNvim2025/web/html/novinky.html
T
2026-09-18 20:59:08 +02:00

857 lines
35 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="cs">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>📰 Novinky | ApolloNvim</title>
<!-- Meta description & SEO -->
<meta
name="description"
content="Changelog a novinky ApolloNvim – sledujte vývoj distribuce, nové verze a plány do budoucna."
/>
<meta name="author" content="Lukáš Kaňka" />
<meta
name="keywords"
content="ApolloNvim, Neovim, changelog, novinky, aktualizace, verze, vývoj"
/>
<!-- Open Graph -->
<meta property="og:type" content="website" />
<meta
property="og:url"
content="https://apollo-nvim.lukan.cz/novinky.html"
/>
<meta property="og:title" content="📰 Novinky | ApolloNvim" />
<meta
property="og:description"
content="Changelog a novinky ApolloNvim – sledujte vývoj distribuce a nové verze."
/>
<meta property="og:image" content="../img/apollonvim.jpg" />
<meta property="og:locale" content="cs_CZ" />
<meta property="og:site_name" content="ApolloNvim" />
<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="📰 Novinky | ApolloNvim" />
<meta
name="twitter:description"
content="Changelog a novinky ApolloNvim – sledujte vývoj distribuce."
/>
<meta name="twitter:image" content="../img/apollonvim.jpg" />
<!-- Google Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600;700&display=swap"
rel="stylesheet"
/>
<!-- Stylesheets -->
<link rel="stylesheet" href="../css/style.css" />
<link rel="stylesheet" href="../css/animations.css" />
<!-- Canonical -->
<link
rel="canonical"
href="https://apollo-nvim.lukan.cz/novinky.html"
/>
<style>
/* ── Timeline ── */
.timeline-wrap {
max-width: 760px;
margin: 0 auto;
}
.timeline {
position: relative;
padding-left: 2.5rem;
list-style: none;
margin: 0;
padding-top: 0.5rem;
}
.timeline::before {
content: "";
position: absolute;
left: 0.55rem;
top: 0;
bottom: 0;
width: 2px;
background: linear-gradient(
to bottom,
var(--purple),
var(--cyan),
transparent
);
border-radius: 99px;
}
.timeline__item {
position: relative;
margin-bottom: 3rem;
}
.timeline__item::before {
content: "";
position: absolute;
left: -2.05rem;
top: 0.35rem;
width: 14px;
height: 14px;
border-radius: 50%;
background: var(--purple);
border: 3px solid var(--bg);
box-shadow: 0 0 0 2px var(--purple);
transition:
box-shadow var(--transition),
background var(--transition);
}
.timeline__item:hover::before {
background: var(--cyan);
box-shadow:
0 0 0 2px var(--cyan),
0 0 12px rgba(6, 182, 212, 0.4);
}
.timeline__item--current::before {
background: var(--green, #22c55e);
box-shadow:
0 0 0 2px var(--green, #22c55e),
0 0 14px rgba(34, 197, 94, 0.5);
animation: pulse-dot 2s ease-in-out infinite;
}
@keyframes pulse-dot {
0%,
100% {
box-shadow:
0 0 0 2px var(--green, #22c55e),
0 0 8px rgba(34, 197, 94, 0.4);
}
50% {
box-shadow:
0 0 0 2px var(--green, #22c55e),
0 0 20px rgba(34, 197, 94, 0.7);
}
}
.timeline__header {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0.6rem;
margin-bottom: 0.85rem;
}
.timeline__version {
font-family: var(--font-mono);
font-size: 1.15rem;
font-weight: 700;
color: var(--text-primary);
}
.timeline__date {
font-size: 0.8rem;
color: var(--text-muted);
margin-left: auto;
}
.timeline__card {
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius-lg);
padding: 1.5rem 1.75rem;
transition:
border-color var(--transition),
box-shadow var(--transition);
}
.timeline__item:hover .timeline__card {
border-color: var(--purple);
box-shadow: 0 4px 24px rgba(139, 92, 246, 0.1);
}
.timeline__card ul {
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
gap: 0.55rem;
}
.timeline__card li {
display: flex;
align-items: flex-start;
gap: 0.6rem;
font-size: 0.9rem;
color: var(--text-secondary, var(--text-muted));
line-height: 1.5;
}
.timeline__card li::before {
content: "▸";
color: var(--purple);
flex-shrink: 0;
margin-top: 0.05rem;
}
/* ── Roadmap cards ── */
.roadmap-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
gap: 1.25rem;
margin-top: 3rem;
}
.roadmap-card {
background: var(--surface);
border: 1px solid var(--border);
border-radius: var(--radius-lg);
padding: 1.5rem;
display: flex;
flex-direction: column;
gap: 0.6rem;
transition:
transform var(--transition),
border-color var(--transition),
box-shadow var(--transition);
}
.roadmap-card:hover {
transform: translateY(-3px);
border-color: var(--cyan);
box-shadow: 0 6px 24px rgba(6, 182, 212, 0.12);
}
.roadmap-card__icon {
font-size: 1.75rem;
line-height: 1;
}
.roadmap-card__title {
font-size: 1rem;
font-weight: 700;
color: var(--text-primary);
margin: 0;
}
.roadmap-card__desc {
font-size: 0.85rem;
color: var(--text-muted);
line-height: 1.55;
margin: 0;
}
.roadmap-card__status {
margin-top: auto;
padding-top: 0.5rem;
}
/* ── CTA / Odber ── */
.news-cta {
text-align: center;
padding: 4rem 2rem;
background: linear-gradient(
135deg,
rgba(139, 92, 246, 0.08) 0%,
rgba(6, 182, 212, 0.05) 100%
);
border-radius: var(--radius-lg);
border: 1px solid var(--border);
}
.news-cta__title {
font-size: clamp(1.25rem, 3vw, 1.75rem);
font-weight: 700;
color: var(--text-primary);
margin-bottom: 0.75rem;
}
.news-cta__subtitle {
font-size: 1rem;
color: var(--text-muted);
margin-bottom: 2rem;
}
/* Animate on scroll */
.animate-on-scroll {
opacity: 0;
transform: translateY(24px);
transition:
opacity 0.55s ease,
transform 0.55s ease;
}
.animate-on-scroll.visible {
opacity: 1;
transform: translateY(0);
}
@media (max-width: 640px) {
.roadmap-grid {
grid-template-columns: 1fr 1fr;
}
}
@media (max-width: 420px) {
.roadmap-grid {
grid-template-columns: 1fr;
}
}
</style>
</head>
<body>
<!-- ===================== NAVBAR ===================== -->
<header class="navbar" id="navbar">
<nav class="navbar__inner" aria-label="Hlavní navigace">
<a
href="../index.html"
class="navbar__logo"
aria-label="ApolloNvim – Domů"
>🚀 <span>ApolloNvim</span></a
>
<ul class="navbar__links" id="nav-links" role="list">
<li><a href="../index.html">Domů</a></li>
<li><a href="./instalace.html">Instalace</a></li>
<li><a href="./pluginy.html">Pluginy</a></li>
<li><a href="./tutorialy.html">Tutoriály</a></li>
<li>
<a
href="./novinky.html"
class="active"
aria-current="page"
>Novinky</a
>
</li>
<li><a href="./zkratky.html">Zkratky</a></li>
</ul>
<button
id="hamburger"
class="navbar__hamburger"
aria-label="Otevřít menu"
aria-expanded="false"
aria-controls="mobile-menu"
>
<span></span><span></span><span></span>
</button>
</nav>
<div class="navbar__mobile" id="mobile-menu" hidden>
<ul role="list">
<li><a href="../index.html">Domů</a></li>
<li><a href="./instalace.html">Instalace</a></li>
<li><a href="./pluginy.html">Pluginy</a></li>
<li><a href="./tutorialy.html">Tutoriály</a></li>
<li><a href="./novinky.html" class="active">Novinky</a></li>
<li><a href="./zkratky.html">Zkratky</a></li>
</ul>
</div>
</header>
<main id="main-content">
<!-- ===================== HERO ===================== -->
<section
class="hero"
aria-labelledby="hero-title"
style="min-height: 42vh"
>
<canvas id="particles-canvas" aria-hidden="true"></canvas>
<div
class="hero__content"
style="padding-top: 6rem; padding-bottom: 4rem"
>
<div class="hero__badge">
<span>📰 Changelog & Aktualizace</span>
</div>
<h1 id="hero-title" class="hero__title">Novinky</h1>
<p class="hero__subtitle">Changelog a novinky ApolloNvim</p>
</div>
</section>
<!-- ===================== CHANGELOG TIMELINE ===================== -->
<section class="section" aria-labelledby="changelog-title">
<div class="container">
<header class="section-title section-title--center">
<h2 id="changelog-title">📋 Changelog</h2>
<p class="section__subtitle section__subtitle--center">
Historie verzí a provedených změn
</p>
<div class="section-title__line"></div>
</header>
<div class="timeline-wrap" style="margin-top: 3.5rem">
<ol class="timeline" aria-label="Changelog ApolloNvim">
<li
class="timeline__item timeline__item--current animate-on-scroll"
>
<div class="timeline__header">
<span class="timeline__version"
>v26.09</span
>
<span class="badge badge--green"
>Aktuální</span
>
<time
class="timeline__date"
datetime="2026-09"
>Září 2026</time
>
</div>
<div class="timeline__card">
<ul>
<li>Úprava instalačních scriptů</li>
<li>
Aktualizace pluginů v ApolloNvim
</li>
<li>
Aktualizace odkazů na webu
</li>
<li>
Retest instalace z Gitu
</li>
</ul>
</div>
</li>
<!-- v25.05 -->
<li
class="timeline__item animate-on-scroll"
>
<div class="timeline__header">
<span class="timeline__version"
>v26.05</span
>
<span class="badge badge--purple"
>Květen 2026</span
>
<time
class="timeline__date"
datetime="2026-05"
>Květen 2026</time
>
</div>
<div class="timeline__card">
<ul>
<li>Nový redesign webu ApolloNvim</li>
<li>
Vícestrankový web s HTML/CSS/JS
strukturou
</li>
<li>
Temný vesmírný design inspirovaný
Dracula tématem
</li>
<li>
Stránky: Domů, Instalace, Pluginy,
Tutoriály, Novinky, Zkratky
</li>
<li>
Particle systém s animovanými
hvězdičkami
</li>
<li>
Kopírovatelné terminálové bloky,
responzivní design
</li>
</ul>
</div>
</li>
<!-- v25.04 -->
<li class="timeline__item animate-on-scroll">
<div class="timeline__header">
<span class="timeline__version"
>v25.04</span
>
<span class="badge badge--purple"
>Duben 2025</span
>
<time
class="timeline__date"
datetime="2025-04"
>Duben 2025</time
>
</div>
<div class="timeline__card">
<ul>
<li>
Verze 25.04 – aktuální stabilní
vydání
</li>
</ul>
</div>
</li>
<!-- v25.02 -->
<li class="timeline__item animate-on-scroll">
<div class="timeline__header">
<span class="timeline__version"
>v25.02</span
>
<span class="badge badge--purple"
>Únor 2025</span
>
<time
class="timeline__date"
datetime="2025-02"
>Únor 2025</time
>
</div>
<div class="timeline__card">
<ul>
<li>Nový web ApolloNvim</li>
<li>Lokalizace do angličtiny</li>
<li>
Vylepšená instalace pro jednodušší
onboarding
</li>
<li>Podpora pouze pro Linux a Mac</li>
</ul>
</div>
</li>
<!-- v25.01 -->
<li class="timeline__item animate-on-scroll">
<div class="timeline__header">
<span class="timeline__version"
>v25.01</span
>
<span class="badge badge--purple"
>Leden 2025</span
>
<time
class="timeline__date"
datetime="2025-01"
>Leden 2025</time
>
</div>
<div class="timeline__card">
<ul>
<li>
Nová instalace s přepracovaným
procesem nastavení
</li>
<li>
Nový website – moderní design a
lepší přehlednost
</li>
<li>
Nový obrázek ApolloNvim –
aktualizovaná vizuální identita
</li>
</ul>
</div>
</li>
<!-- v24.10 -->
<li class="timeline__item animate-on-scroll">
<div class="timeline__header">
<span class="timeline__version"
>v24.10</span
>
<span class="badge badge--purple"
>Říjen 2024</span
>
<time
class="timeline__date"
datetime="2024-10"
>Říjen 2024</time
>
</div>
<div class="timeline__card">
<ul>
<li>
Podpora PHP – LSP a snippety pro PHP
vývojáře
</li>
<li>
Automatická instalace pluginů po
přidání do <code>init.vim</code>
</li>
<li>
Rainbow Vim – plugin pro barevné
závorky pro lepší čitelnost kódu
</li>
<li>
Gitgutter – plugin pro správu a
zobrazení git změn v editoru
</li>
</ul>
</div>
</li>
</ol>
</div>
<!-- /.timeline-wrap -->
</div>
<!-- /.container -->
</section>
<!-- ===================== ROADMAP ===================== -->
<section
class="section section--alt"
aria-labelledby="roadmap-title"
>
<div class="container">
<header class="section-title section-title--center">
<h2 id="roadmap-title">🗺️ Plán vývoje</h2>
<p class="section__subtitle section__subtitle--center">
Co připravujeme pro budoucí verze ApolloNvim
</p>
<div class="section-title__line"></div>
</header>
<div class="roadmap-grid">
<div class="roadmap-card animate-on-scroll">
<div class="roadmap-card__icon" aria-hidden="true">
🎨
</div>
<h3 class="roadmap-card__title">
Nová uvítací obrazovka
</h3>
<p class="roadmap-card__desc">
Vlastní dashboard při startu – rychlé otevření
posledních souborů, zkratky a statistiky.
</p>
<div class="roadmap-card__status">
<span class="badge badge--yellow"
>Plánováno</span
>
</div>
</div>
<div class="roadmap-card animate-on-scroll">
<div class="roadmap-card__icon" aria-hidden="true">
🔌
</div>
<h3 class="roadmap-card__title">Nové pluginy</h3>
<p class="roadmap-card__desc">
Rozšiřování knihovny pluginů o nejlepší nástroje
z ekosystému Neovim komunity.
</p>
<div class="roadmap-card__status">
<span class="badge badge--yellow"
>Plánováno</span
>
</div>
</div>
<div class="roadmap-card animate-on-scroll">
<div class="roadmap-card__icon" aria-hidden="true">
📚
</div>
<h3 class="roadmap-card__title">
Návody k pluginům
</h3>
<p class="roadmap-card__desc">
Podrobné tutoriály pro každý zahrnutý plugin s
příklady a tipy pro efektivní použití.
</p>
<div class="roadmap-card__status">
<span class="badge badge--cyan">Probíhá</span>
</div>
</div>
<div class="roadmap-card animate-on-scroll">
<div class="roadmap-card__icon" aria-hidden="true">
⚡
</div>
<h3 class="roadmap-card__title">
Instalátor přes link z Git
</h3>
<p class="roadmap-card__desc">
Jednořádkový instalátor přímo z Codeberg – bez
klonování, bez komplikací.
</p>
<div class="roadmap-card__status">
<span class="badge badge--yellow"
>Plánováno</span
>
</div>
</div>
</div>
<!-- /.roadmap-grid -->
</div>
<!-- /.container -->
</section>
<!-- ===================== CTA / ODBER ===================== -->
<section class="section" aria-labelledby="news-cta-title">
<div class="container">
<div class="news-cta animate-on-scroll">
<p
style="font-size: 2.5rem; margin-bottom: 1rem"
aria-hidden="true"
>
✈️
</p>
<h2 id="news-cta-title" class="news-cta__title">
Sledujte novinky na Telegramu
</h2>
<p class="news-cta__subtitle">
Buďte první, kdo se dozví o nových verzích,
pluginech a tutoriálech ApolloNvim.
</p>
<a
href="https://t.me/apollonvim"
class="btn-primary"
target="_blank"
rel="noopener noreferrer"
aria-label="Připojit se na Telegram ApolloNvim (otevře se v novém okně)"
>
<span>✈️</span> Připojit se na Telegram
</a>
</div>
</div>
</section>
</main>
<!-- ===================== FOOTER ===================== -->
<footer class="footer" role="contentinfo">
<div class="container">
<div class="footer__grid">
<div class="footer__brand">
<a
href="../index.html"
class="footer__logo"
aria-label="ApolloNvim – Domů"
>
🚀 ApolloNvim
</a>
<p class="footer__tagline">
Rychlý, lehký a plně konfigurovatelný Neovim pro
Front-End vývojáře.
</p>
<p
class="footer__love"
aria-label="Vytvořeno s láskou a klávesnicí"
>
Made with ❤️ and ⌨️
</p>
</div>
<nav class="footer__nav" aria-label="Patička navigace">
<h4 class="footer__nav-title">Navigace</h4>
<ul class="footer__nav-list" role="list">
<li>
<a href="../index.html" class="footer__link"
>Domů</a
>
</li>
<li>
<a href="./instalace.html" class="footer__link"
>Instalace</a
>
</li>
<li>
<a href="./pluginy.html" class="footer__link"
>Pluginy</a
>
</li>
<li>
<a href="./tutorialy.html" class="footer__link"
>Tutoriály</a
>
</li>
<li>
<a href="./novinky.html" class="footer__link"
>Novinky</a
>
</li>
<li>
<a href="./zkratky.html" class="footer__link"
>Zkratky</a
>
</li>
</ul>
</nav>
<div class="footer__links">
<h4 class="footer__nav-title">Externe</h4>
<ul class="footer__nav-list" role="list">
<li>
<a
href="https://t.me/apollonvim"
class="footer__link"
target="_blank"
rel="noopener noreferrer"
aria-label="Telegram (otevře se v novém okně)"
>
✈️ Telegram
</a>
</li>
<li>
<a
href="https://codeberg.org/Kankys/ApolloNvim2025"
class="footer__link"
target="_blank"
rel="noopener noreferrer"
aria-label="Codeberg repozitář (otevře se v novém okně)"
>
🏔️ Codeberg
</a>
</li>
<li>
<a
href="https://lukaskanka.cz/"
class="footer__link"
target="_blank"
rel="noopener noreferrer"
aria-label="Web autora (otevře se v novém okně)"
>
🧑‍💻 Web autora
</a>
</li>
</ul>
</div>
</div>
<div class="footer__bottom">
<p class="footer__copy">
Copyright &copy; 2024 &ndash; 2026 🚀 ApolloNvim / Lukáš
Kaňka
</p>
<p class="footer__version">
<span class="badge badge--version">v26.09</span>
</p>
</div>
</div>
</footer>
<!-- ===================== SCRIPTS ===================== -->
<script src="../js/particles.js"></script>
<script src="../js/main.js"></script>
<script>
// Animate on scroll observer
(function () {
const elements =
document.querySelectorAll(".animate-on-scroll");
if (!elements.length) return;
const observer = new IntersectionObserver(
(entries) => {
entries.forEach((entry) => {
if (entry.isIntersecting) {
entry.target.classList.add("visible");
observer.unobserve(entry.target);
}
});
},
{ threshold: 0.1, rootMargin: "0px 0px -40px 0px" },
);
elements.forEach((el, i) => {
el.style.transitionDelay = i * 100 + "ms";
observer.observe(el);
});
})();
</script>
</body>
</html>