wip: switch dark mode to pure black

This commit is contained in:
2026-01-10 23:41:09 +00:00
parent 7d06d18ccb
commit d55ead82d7
20 changed files with 642 additions and 638 deletions

View File

@@ -9,12 +9,12 @@
document.documentElement.classList.add("dark");
}
})();
</script><link rel="stylesheet" href="/_astro/index._zunHdNh.css"></head> <body class="min-h-screen flex flex-col items-center justify-center p-8"> <div class="text-center"> <h1 class="text-[8rem] sm:text-[12rem] font-display font-bold leading-none
text-gray-300 dark:text-slate-700">
</script><link rel="stylesheet" href="/_astro/index.BZOQzl8l.css"></head> <body class="min-h-screen flex flex-col items-center justify-center p-8"> <div class="text-center"> <h1 class="text-[8rem] sm:text-[12rem] font-display font-bold leading-none
text-gray-300 dark:text-neutral-700">
404
</h1> <p class="text-xl mb-2 text-gray-600 dark:text-slate-400">
</h1> <p class="text-xl mb-2 text-gray-600 dark:text-neutral-400">
Page not found
</p> <p class="text-gray-500 dark:text-slate-500">
</p> <p class="text-gray-500 dark:text-neutral-500">
The page you're looking for doesn't exist.
</p> <a href="/" class="inline-flex items-center justify-center gap-2 mt-8
px-5 py-2.5 text-sm font-medium rounded-lg

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -8,130 +8,130 @@
document.documentElement.classList.add("dark");
}
})();
</script><link rel="stylesheet" href="/_astro/index._zunHdNh.css"></head> <body class="min-h-screen"> <header id="site-header" class="fixed top-0 inset-x-0 z-50 border-b border-transparent
</script><link rel="stylesheet" href="/_astro/index.BZOQzl8l.css"></head> <body class="min-h-screen"> <header id="site-header" class="fixed top-0 inset-x-0 z-50 border-b border-transparent
translate-y-[-100%] transition-transform duration-300
backdrop-blur-xl bg-gray-50/85 dark:bg-slate-950/85"> <div class="max-w-6xl mx-auto px-4 sm:px-6 h-16 flex items-center justify-between"> <!-- Logo / Title + Version --> <div class="flex items-center gap-3"> <a href="#hero" class="flex items-center gap-3 no-underline
text-gray-950 dark:text-slate-50
backdrop-blur-xl bg-gray-50/85 dark:bg-neutral-950/85"> <div class="max-w-6xl mx-auto px-4 sm:px-6 h-16 flex items-center justify-between"> <!-- Logo / Title + Version --> <div class="flex items-center gap-3"> <a href="#hero" class="flex items-center gap-3 no-underline
text-gray-950 dark:text-neutral-50
hover:text-sky-600 transition-colors"> <span class="font-display font-bold text-lg tracking-tight">
Git Common-Flow
</span> </a> <div class="hidden md:block"> <div class="relative" data-version-selector> <!-- Trigger button --> <button type="button" data-version-trigger aria-haspopup="listbox" aria-expanded="false" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-slate-700
border border-gray-200 dark:border-neutral-700
rounded-md bg-transparent cursor-pointer transition-colors
text-gray-600 dark:text-slate-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-slate-50"> <span>v1.0.0-rc.1</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-slate-900
border border-gray-200 dark:border-slate-700
text-gray-600 dark:text-neutral-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-neutral-50"> <span>v1.0.0-rc.1</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-neutral-900
border border-gray-200 dark:border-neutral-700
rounded-lg shadow-lg
opacity-0 invisible -translate-y-1 transition-all duration-150
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.1 </a> </div> </div> <script type="module">function c(){document.querySelectorAll("[data-version-selector]").forEach(e=>{if(e.dataset.initialized)return;e.dataset.initialized="true";const t=e.querySelector("[data-version-trigger]"),a=e.querySelector("[data-version-dropdown]"),n=e.querySelector("[data-arrow-icon]");if(!t||!a)return;const u=()=>{a.dataset.open="true",t.setAttribute("aria-expanded","true"),n&&(n.style.transform="rotate(180deg)")},o=()=>{delete a.dataset.open,t.setAttribute("aria-expanded","false"),n&&(n.style.transform="")};t.addEventListener("click",r=>{r.stopPropagation();const l=a.dataset.open==="true";document.querySelectorAll("[data-version-dropdown][data-open]").forEach(s=>{delete s.dataset.open;const i=s.previousElementSibling;i?.setAttribute("aria-expanded","false");const d=i?.querySelector("[data-arrow-icon]");d&&(d.style.transform="")}),l?o():u()}),document.addEventListener("click",r=>{e.contains(r.target)||o()}),document.addEventListener("keydown",r=>{r.key==="Escape"&&a.dataset.open==="true"&&(o(),t.focus())})})}c();document.addEventListener("astro:after-swap",c);</script> </div> </div> <!-- Desktop Navigation --> <nav class="hidden md:flex items-center gap-1"> <a href="#about" class="nav-link inline-flex items-center px-4 py-2 text-sm font-medium
rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50" data-nav-link data-section-id="about">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50" data-nav-link data-section-id="about">
About
</a> <a href="#spec" class="nav-link inline-flex items-center px-4 py-2 text-sm font-medium
rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50" data-nav-link data-section-id="spec">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50" data-nav-link data-section-id="spec">
Spec
</a> <a href="#faq" class="nav-link inline-flex items-center px-4 py-2 text-sm font-medium
rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50" data-nav-link data-section-id="faq">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50" data-nav-link data-section-id="faq">
FAQ
</a> </nav> <!-- Right side: Theme, GitHub --> <div class="flex items-center gap-3"> <button data-theme-toggle type="button" class="p-2 rounded-lg transition-colors duration-200
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-gray-100 dark:hover:bg-slate-800" aria-label="Toggle dark mode"> <!-- Sun icon (shown in dark mode) --> <svg data-sun-icon class="hidden w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800" aria-label="Toggle dark mode"> <!-- Sun icon (shown in dark mode) --> <svg data-sun-icon class="hidden w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343
6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16
12a4 4 0 11-8 0 4 4 0 018 0z"></path> </svg> <!-- Moon icon (shown in light mode) --> <svg data-moon-icon class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003
9.003 0 008.354-5.646z"></path> </svg> </button> <script type="module">function n(){const c=document.querySelectorAll("[data-theme-toggle]");function o(){const e=localStorage.getItem("theme");return e==="dark"||e==="light"?e:window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}function r(e){document.querySelectorAll("[data-sun-icon]").forEach(t=>{t.classList.toggle("hidden",!e)}),document.querySelectorAll("[data-moon-icon]").forEach(t=>{t.classList.toggle("hidden",e)})}function a(e){localStorage.setItem("theme",e),document.documentElement.classList.toggle("dark",e==="dark"),r(e==="dark")}const d=o();a(d),c.forEach(e=>{e.dataset.initialized||(e.dataset.initialized="true",e.addEventListener("click",()=>{const t=document.documentElement.classList.contains("dark");a(t?"light":"dark")}))}),window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",e=>{localStorage.getItem("theme")||a(e.matches?"dark":"light")})}n();document.addEventListener("astro:after-swap",n);</script> <a href="https://github.com/jimeh/common-flow" target="_blank" rel="noopener noreferrer" class="p-2 rounded-lg transition-colors
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-gray-100 dark:hover:bg-slate-800" aria-label="View on GitHub"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path> </svg> </a> <!-- Mobile menu button --> <button id="mobile-menu-btn" class="md:hidden p-2 rounded-lg
text-gray-500 dark:text-slate-500
hover:bg-gray-100 dark:hover:bg-slate-800" aria-label="Toggle menu"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation --> <nav id="mobile-nav" class="md:hidden hidden border-t border-gray-200 dark:border-slate-800"> <div class="px-4 py-3 space-y-1 text-center"> <div class="py-2 flex justify-center"> <div class="relative" data-version-selector> <!-- Trigger button --> <button type="button" data-version-trigger aria-haspopup="listbox" aria-expanded="false" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-slate-700
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800" aria-label="View on GitHub"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path> </svg> </a> <!-- Mobile menu button --> <button id="mobile-menu-btn" class="md:hidden p-2 rounded-lg
text-gray-500 dark:text-neutral-500
hover:bg-gray-100 dark:hover:bg-neutral-800" aria-label="Toggle menu"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation --> <nav id="mobile-nav" class="md:hidden hidden border-t border-gray-200 dark:border-neutral-800"> <div class="px-4 py-3 space-y-1 text-center"> <div class="py-2 flex justify-center"> <div class="relative" data-version-selector> <!-- Trigger button --> <button type="button" data-version-trigger aria-haspopup="listbox" aria-expanded="false" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-neutral-700
rounded-md bg-transparent cursor-pointer transition-colors
text-gray-600 dark:text-slate-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-slate-50"> <span>v1.0.0-rc.1</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-slate-900
border border-gray-200 dark:border-slate-700
text-gray-600 dark:text-neutral-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-neutral-50"> <span>v1.0.0-rc.1</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-neutral-900
border border-gray-200 dark:border-neutral-700
rounded-lg shadow-lg
opacity-0 invisible -translate-y-1 transition-all duration-150
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.1 </a> </div> </div> </div> <a href="#about" class="nav-link block py-2 text-gray-600 dark:text-slate-400
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.1 </a> </div> </div> </div> <a href="#about" class="nav-link block py-2 text-gray-600 dark:text-neutral-400
hover:text-sky-600" data-nav-link data-section-id="about">
About
</a> <a href="#spec" class="nav-link block py-2 text-gray-600 dark:text-slate-400
</a> <a href="#spec" class="nav-link block py-2 text-gray-600 dark:text-neutral-400
hover:text-sky-600" data-nav-link data-section-id="spec">
Spec
</a> <a href="#faq" class="nav-link block py-2 text-gray-600 dark:text-slate-400
</a> <a href="#faq" class="nav-link block py-2 text-gray-600 dark:text-neutral-400
hover:text-sky-600" data-nav-link data-section-id="faq">
FAQ
</a> </div> </nav> </header> <script type="module">function f(){const n=document.getElementById("site-header"),g=document.getElementById("hero"),o=document.getElementById("mobile-menu-btn"),s=document.getElementById("mobile-nav");if(!n||!g)return;const v=64;function c(){window.scrollY>=v?(n.classList.remove("translate-y-[-100%]"),n.classList.add("border-gray-200","dark:border-slate-800")):(n.classList.add("translate-y-[-100%]"),n.classList.remove("border-gray-200","dark:border-slate-800"))}window.addEventListener("scroll",c,{passive:!0}),c(),o&&s&&(o.addEventListener("click",()=>{s.classList.toggle("hidden")}),s.querySelectorAll("a").forEach(i=>{i.addEventListener("click",()=>{s.classList.add("hidden")})}));const r=document.querySelectorAll("[data-nav-link]"),l=[],u=new Set;r.forEach(i=>{const e=i.getAttribute("data-section-id");if(e&&!u.has(e)){u.add(e);const t=document.getElementById(e);t&&l.push({id:e,element:t})}});function m(){let e=null;for(const{id:t,element:d}of l)d.getBoundingClientRect().top<=100&&(e=t);r.forEach(t=>{const d=t.getAttribute("data-section-id");t.classList.toggle("active",d===e)})}let a=!1;window.addEventListener("scroll",()=>{a||(requestAnimationFrame(()=>{m(),a=!1}),a=!0)}),m()}f();document.addEventListener("astro:after-swap",f);</script> <main> <section id="hero" class="relative min-h-[75vh] flex flex-col items-center justify-center
</a> </div> </nav> </header> <script type="module">function f(){const n=document.getElementById("site-header"),g=document.getElementById("hero"),o=document.getElementById("mobile-menu-btn"),s=document.getElementById("mobile-nav");if(!n||!g)return;const v=64;function c(){window.scrollY>=v?(n.classList.remove("translate-y-[-100%]"),n.classList.add("border-gray-200","dark:border-neutral-800")):(n.classList.add("translate-y-[-100%]"),n.classList.remove("border-gray-200","dark:border-neutral-800"))}window.addEventListener("scroll",c,{passive:!0}),c(),o&&s&&(o.addEventListener("click",()=>{s.classList.toggle("hidden")}),s.querySelectorAll("a").forEach(i=>{i.addEventListener("click",()=>{s.classList.add("hidden")})}));const r=document.querySelectorAll("[data-nav-link]"),l=[],u=new Set;r.forEach(i=>{const e=i.getAttribute("data-section-id");if(e&&!u.has(e)){u.add(e);const t=document.getElementById(e);t&&l.push({id:e,element:t})}});function m(){let e=null;for(const{id:t,element:d}of l)d.getBoundingClientRect().top<=100&&(e=t);r.forEach(t=>{const d=t.getAttribute("data-section-id");t.classList.toggle("active",d===e)})}let a=!1;window.addEventListener("scroll",()=>{a||(requestAnimationFrame(()=>{m(),a=!1}),a=!0)}),m()}f();document.addEventListener("astro:after-swap",f);</script> <main> <section id="hero" class="relative min-h-[75vh] flex flex-col items-center justify-center
px-6 py-16 overflow-hidden"> <!-- Background gradient/texture --> <div class="absolute inset-0 bg-gradient-to-b
from-gray-100 to-gray-50
dark:from-slate-900 dark:to-slate-950"></div> <!-- Subtle grid pattern --> <div class="absolute inset-0 opacity-[0.03] dark:opacity-[0.05]
dark:from-neutral-900 dark:to-neutral-950"></div> <!-- Subtle grid pattern --> <div class="absolute inset-0 opacity-[0.03] dark:opacity-[0.05]
bg-[linear-gradient(theme(colors.gray.950)_1px,transparent_1px),linear-gradient(90deg,theme(colors.gray.950)_1px,transparent_1px)]
dark:bg-[linear-gradient(theme(colors.slate.400)_1px,transparent_1px),linear-gradient(90deg,theme(colors.slate.400)_1px,transparent_1px)]
dark:bg-[linear-gradient(theme(colors.neutral.600)_1px,transparent_1px),linear-gradient(90deg,theme(colors.neutral.600)_1px,transparent_1px)]
bg-[size:60px_60px]"></div> <!-- Top bar with version & theme --> <div class="absolute top-0 inset-x-0 flex items-center justify-between
px-6 py-4 animate-fade-in-down"> <div class="flex items-center gap-3"> <div class="relative" data-version-selector> <!-- Trigger button --> <button type="button" data-version-trigger aria-haspopup="listbox" aria-expanded="false" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-slate-700
border border-gray-200 dark:border-neutral-700
rounded-md bg-transparent cursor-pointer transition-colors
text-gray-600 dark:text-slate-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-slate-50"> <span>v1.0.0-rc.1</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-slate-900
border border-gray-200 dark:border-slate-700
text-gray-600 dark:text-neutral-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-neutral-50"> <span>v1.0.0-rc.1</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-neutral-900
border border-gray-200 dark:border-neutral-700
rounded-lg shadow-lg
opacity-0 invisible -translate-y-1 transition-all duration-150
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.1 </a> </div> </div> </div> <div class="flex items-center gap-2"> <button data-theme-toggle type="button" class="p-2 rounded-lg transition-colors duration-200
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-gray-100 dark:hover:bg-slate-800" aria-label="Toggle dark mode"> <!-- Sun icon (shown in dark mode) --> <svg data-sun-icon class="hidden w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800" aria-label="Toggle dark mode"> <!-- Sun icon (shown in dark mode) --> <svg data-sun-icon class="hidden w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343
6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16
12a4 4 0 11-8 0 4 4 0 018 0z"></path> </svg> <!-- Moon icon (shown in light mode) --> <svg data-moon-icon class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003
9.003 0 008.354-5.646z"></path> </svg> </button> <a href="https://github.com/jimeh/common-flow" target="_blank" rel="noopener noreferrer" class="p-2 rounded-lg transition-colors
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-white/50 dark:hover:bg-slate-800/50" aria-label="View on GitHub"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path> </svg> </a> </div> </div> <!-- Main content --> <div class="relative z-10 w-full max-w-4xl mx-auto text-center"> <!-- Title --> <h1 class="animate-fade-in-up mb-4
text-gray-950 dark:text-slate-50">
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-white/50 dark:hover:bg-neutral-800/50" aria-label="View on GitHub"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path> </svg> </a> </div> </div> <!-- Main content --> <div class="relative z-10 w-full max-w-4xl mx-auto text-center"> <!-- Title --> <h1 class="animate-fade-in-up mb-4
text-gray-950 dark:text-neutral-50">
Git Common-Flow
</h1> <!-- Tagline --> <p class="animate-fade-in-up delay-100
text-lg sm:text-xl max-w-2xl mx-auto mb-8
text-gray-600 dark:text-slate-400">
text-gray-600 dark:text-neutral-400">
A sensible git workflow for teams who ship
</p> <!-- Version badge --> <div class="animate-fade-in-up delay-200 mb-10"> <span class="inline-flex items-center px-3 py-1 font-mono text-xs font-medium
rounded-full border
bg-gray-100 border-gray-200 text-gray-500
dark:bg-slate-800/50 dark:border-slate-700 dark:text-slate-400">
dark:bg-neutral-800/50 dark:border-neutral-700 dark:text-neutral-400">
v1.0.0-rc.1 </span> </div> <!-- SVG Diagram --> <div class="animate-fade-in-up delay-300
relative mx-auto mb-12 p-4 sm:p-8
bg-white dark:bg-slate-900
bg-white dark:bg-neutral-900
rounded-2xl shadow-lg dark:shadow-none
border border-gray-200 dark:border-slate-800"> <img src="/spec/1.0.0-rc.1.svg" alt="Git Common-Flow diagram" class="w-full h-auto max-w-3xl mx-auto
border border-gray-200 dark:border-neutral-800"> <img src="/spec/1.0.0-rc.1.svg" alt="Git Common-Flow diagram" class="w-full h-auto max-w-3xl mx-auto
dark:invert dark:hue-rotate-180 dark:contrast-90"> </div> <!-- Navigation links --> <nav class="animate-fade-in-up delay-400
flex flex-wrap items-center justify-center gap-4"> <a href="#about" class="inline-flex items-center justify-center gap-2 px-5 py-2.5
text-sm font-medium rounded-lg transition-all cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50">
About
</a> <a href="#spec" class="inline-flex items-center justify-center gap-2 px-5 py-2.5
text-sm font-medium rounded-lg transition-all cursor-pointer
@@ -140,18 +140,18 @@ About
Read the Spec
</a> <a href="#faq" class="inline-flex items-center justify-center gap-2 px-5 py-2.5
text-sm font-medium rounded-lg transition-all cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50">
FAQ
</a> </nav> </div> <!-- Scroll indicator --> <a href="#about" class="absolute bottom-8 left-1/2 -translate-x-1/2
animate-fade-in delay-700
text-gray-500 dark:text-slate-500
hover:text-sky-600 transition-colors" aria-label="Scroll to content"> <svg class="w-6 h-6 animate-bounce-subtle" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3"></path> </svg> </a> </section> <section id="about" class="py-20 sm:py-28"> <div class="section-container"> <div class="max-w-3xl mx-auto"> <!-- Section header --> <div class="mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">About Common-Flow</h2> <p class="text-lg text-gray-600 dark:text-slate-400">
text-gray-500 dark:text-neutral-500
hover:text-sky-600 transition-colors" aria-label="Scroll to content"> <svg class="w-6 h-6 animate-bounce-subtle" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3"></path> </svg> </a> </section> <section id="about" class="py-20 sm:py-28"> <div class="section-container"> <div class="max-w-3xl mx-auto"> <!-- Section header --> <div class="mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">About Common-Flow</h2> <p class="text-lg text-gray-600 dark:text-neutral-400">
A practical git workflow that combines the best of GitHub Flow with
versioned releases
</p> </div> <!-- Introduction --> <div class="prose-spec mb-12"></div> <!-- Summary as feature cards --> <div class="mb-16"> <h3 class="text-xl font-display font-semibold mb-6
text-gray-950 dark:text-slate-50">
text-gray-950 dark:text-neutral-50">
Key Principles
</h3> <div class="prose-spec"><p>Common-Flow is an attempt to gather a sensible selection of the most common
usage patterns of git into a single and concise specification. It is based on
@@ -160,32 +160,32 @@ of <a href="https://guides.github.com/introduction/flow/">GitHub Flow</a>, while
into account how a lot of open source projects use git.</p>
<p>TL;DR: Common-Flow is basically GitHub Flow with the addition of versioned
releases, maintenance releases for old versions, and without the requirement to
deploy to production all the time.</p></div> </div> <!-- Feedback & License --> <div class="pt-8 border-t border-gray-200 dark:border-slate-800"> <div class="grid sm:grid-cols-2 gap-8"> <div> <h4 class="text-sm font-semibold uppercase tracking-wider mb-3
text-gray-500 dark:text-slate-500">
deploy to production all the time.</p></div> </div> <!-- Feedback & License --> <div class="pt-8 border-t border-gray-200 dark:border-neutral-800"> <div class="grid sm:grid-cols-2 gap-8"> <div> <h4 class="text-sm font-semibold uppercase tracking-wider mb-3
text-gray-500 dark:text-neutral-500">
Feedback
</h4> <p class="text-gray-600 dark:text-slate-400">
</h4> <p class="text-gray-600 dark:text-neutral-400">
Please <a href="https://github.com/jimeh/common-flow/issues" class="text-sky-600 hover:text-sky-400" target="_blank" rel="noopener noreferrer">open an issue on GitHub</a>.
</p> </div> <div> <h4 class="text-sm font-semibold uppercase tracking-wider mb-3
text-gray-500 dark:text-slate-500">
text-gray-500 dark:text-neutral-500">
License
</h4> <div class="text-gray-600 dark:text-slate-400"><p><a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons - CC BY 3.0</a></p></div> </div> </div> </div> </div> </div> </section> <section id="spec" class="py-20 sm:py-28"> <div class="section-container"> <!-- Section header --> <div class="max-w-3xl mx-auto mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">The Specification</h2> <p class="text-lg text-gray-600 dark:text-slate-400">
</h4> <div class="text-gray-600 dark:text-neutral-400"><p><a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons - CC BY 3.0</a></p></div> </div> </div> </div> </div> </div> </section> <section id="spec" class="py-20 sm:py-28"> <div class="section-container"> <!-- Section header --> <div class="max-w-3xl mx-auto mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">The Specification</h2> <p class="text-lg text-gray-600 dark:text-neutral-400">
The complete Git Common-Flow specification
</p> </div> <!-- Content with sidebar --> <div class="lg:flex lg:gap-8"> <!-- Sidebar --> <div class="lg:w-64 lg:flex-shrink-0"> <aside id="spec-sidebar" class="hidden lg:block lg:sticky lg:top-24 lg:self-start
lg:max-h-[calc(100vh-8rem)] lg:overflow-y-auto
lg:pr-8 lg:mr-8 lg:border-r border-gray-200 dark:border-slate-800"> <nav class="space-y-1 py-2"> <div class="text-xs font-semibold uppercase tracking-wider mb-4
text-gray-500 dark:text-slate-500">
lg:pr-8 lg:mr-8 lg:border-r border-gray-200 dark:border-neutral-800"> <nav class="space-y-1 py-2"> <div class="text-xs font-semibold uppercase tracking-wider mb-4
text-gray-500 dark:text-neutral-500">
Table of Contents
</div> <a href="#terminology" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800" data-sidebar-link data-section-id="terminology"> Terminology </a><a href="#specification" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800" data-sidebar-link data-section-id="specification"> Specification </a><a href="#spec-the-master-branch" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-the-master-branch"> The Master Branch </a><a href="#spec-changes" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-changes"> Changes </a><a href="#spec-git-best-practices" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-git-best-practices"> Git Best Practices </a><a href="#spec-versioning" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-versioning"> Versioning </a><a href="#spec-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-releases"> Releases </a><a href="#spec-bug-fixes-rollback" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-bug-fixes-rollback"> Bug Fixes &amp; Rollback </a><a href="#spec-maintenance-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-maintenance-releases"> Maintenance Releases </a> </nav> </aside> <!-- Mobile floating button --> <button id="spec-toc-toggle" class="lg:hidden fixed bottom-6 right-6 z-40
</div> <a href="#terminology" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800" data-sidebar-link data-section-id="terminology"> Terminology </a><a href="#specification" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800" data-sidebar-link data-section-id="specification"> Specification </a><a href="#spec-the-master-branch" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-the-master-branch"> The Master Branch </a><a href="#spec-changes" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-changes"> Changes </a><a href="#spec-git-best-practices" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-git-best-practices"> Git Best Practices </a><a href="#spec-versioning" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-versioning"> Versioning </a><a href="#spec-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-releases"> Releases </a><a href="#spec-bug-fixes-rollback" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-bug-fixes-rollback"> Bug Fixes &amp; Rollback </a><a href="#spec-maintenance-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-maintenance-releases"> Maintenance Releases </a> </nav> </aside> <!-- Mobile floating button --> <button id="spec-toc-toggle" class="lg:hidden fixed bottom-6 right-6 z-40
w-12 h-12 rounded-full shadow-lg
bg-sky-600 text-white
flex items-center justify-center
hover:bg-sky-500
transition-all duration-200" aria-label="Jump to section"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h7"></path> </svg> </button> <!-- Mobile TOC drawer --> <div id="spec-toc-drawer" class="lg:hidden fixed inset-0 z-50 hidden" data-toc-drawer> <!-- Backdrop --> <div class="absolute inset-0 bg-black/50" data-toc-backdrop></div> <!-- Drawer --> <div class="absolute bottom-0 inset-x-0 max-h-[70vh] overflow-y-auto
bg-gray-50 dark:bg-slate-950
bg-gray-50 dark:bg-neutral-950
rounded-t-2xl shadow-xl p-6"> <div class="flex items-center justify-between mb-4"> <span class="text-sm font-semibold uppercase tracking-wider
text-gray-500 dark:text-slate-500">
text-gray-500 dark:text-neutral-500">
Jump to Section
</span> <button class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-slate-800" data-toc-close aria-label="Close"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path> </svg> </button> </div> <nav class="space-y-1"> <a href="#terminology" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800" data-toc-link> Terminology </a><a href="#specification" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800" data-toc-link> Specification </a><a href="#spec-the-master-branch" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> The Master Branch </a><a href="#spec-changes" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Changes </a><a href="#spec-git-best-practices" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Git Best Practices </a><a href="#spec-versioning" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Versioning </a><a href="#spec-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Releases </a><a href="#spec-bug-fixes-rollback" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Bug Fixes &amp; Rollback </a><a href="#spec-maintenance-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Maintenance Releases </a> </nav> </div> </div> <script type="module">function u(){const a=document.querySelectorAll("[data-sidebar-link]"),o=[];a.forEach(n=>{const e=n.getAttribute("data-section-id");if(e){const t=document.getElementById(e);t&&o.push({id:e,element:t})}});function l(){let e=o[0]?.id;for(const{id:t,element:r}of o)r.getBoundingClientRect().top<=100&&(e=t);a.forEach(t=>{const r=t.getAttribute("data-section-id");t.classList.toggle("active",r===e)})}let s=!1;window.addEventListener("scroll",()=>{s||(requestAnimationFrame(()=>{l(),s=!1}),s=!0)}),l();const d=document.getElementById("spec-toc-toggle"),c=document.getElementById("spec-toc-drawer"),g=c?.querySelector("[data-toc-backdrop]"),m=c?.querySelector("[data-toc-close]"),v=c?.querySelectorAll("[data-toc-link]");function p(){c?.classList.remove("hidden"),document.body.style.overflow="hidden"}function i(){c?.classList.add("hidden"),document.body.style.overflow=""}d?.addEventListener("click",p),g?.addEventListener("click",i),m?.addEventListener("click",i),v?.forEach(n=>{n.addEventListener("click",i)});const f=document.getElementById("spec");f&&d&&new IntersectionObserver(([e])=>{d.classList.toggle("hidden",!e.isIntersecting)},{threshold:0}).observe(f)}u();document.addEventListener("astro:after-swap",u);</script> </div> <!-- Main content --> <div class="flex-1 min-w-0"> <article class="prose-spec"> <!-- Terminology --> <section id="terminology"> <h2>Terminology</h2> <ul>
</span> <button class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-neutral-800" data-toc-close aria-label="Close"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path> </svg> </button> </div> <nav class="space-y-1"> <a href="#terminology" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800" data-toc-link> Terminology </a><a href="#specification" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800" data-toc-link> Specification </a><a href="#spec-the-master-branch" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> The Master Branch </a><a href="#spec-changes" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Changes </a><a href="#spec-git-best-practices" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Git Best Practices </a><a href="#spec-versioning" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Versioning </a><a href="#spec-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Releases </a><a href="#spec-bug-fixes-rollback" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Bug Fixes &amp; Rollback </a><a href="#spec-maintenance-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Maintenance Releases </a> </nav> </div> </div> <script type="module">function u(){const a=document.querySelectorAll("[data-sidebar-link]"),o=[];a.forEach(n=>{const e=n.getAttribute("data-section-id");if(e){const t=document.getElementById(e);t&&o.push({id:e,element:t})}});function l(){let e=o[0]?.id;for(const{id:t,element:r}of o)r.getBoundingClientRect().top<=100&&(e=t);a.forEach(t=>{const r=t.getAttribute("data-section-id");t.classList.toggle("active",r===e)})}let s=!1;window.addEventListener("scroll",()=>{s||(requestAnimationFrame(()=>{l(),s=!1}),s=!0)}),l();const d=document.getElementById("spec-toc-toggle"),c=document.getElementById("spec-toc-drawer"),g=c?.querySelector("[data-toc-backdrop]"),m=c?.querySelector("[data-toc-close]"),v=c?.querySelectorAll("[data-toc-link]");function p(){c?.classList.remove("hidden"),document.body.style.overflow="hidden"}function i(){c?.classList.add("hidden"),document.body.style.overflow=""}d?.addEventListener("click",p),g?.addEventListener("click",i),m?.addEventListener("click",i),v?.forEach(n=>{n.addEventListener("click",i)});const f=document.getElementById("spec");f&&d&&new IntersectionObserver(([e])=>{d.classList.toggle("hidden",!e.isIntersecting)},{threshold:0}).observe(f)}u();document.addEventListener("astro:after-swap",u);</script> </div> <!-- Main content --> <div class="flex-1 min-w-0"> <article class="prose-spec"> <!-- Terminology --> <section id="terminology"> <h2>Terminology</h2> <ul>
<li><strong>Master Branch</strong> - Must always have passing tests, is considered bleeding
edge, and must be named <code>master</code>.</li>
<li><strong>Change Branches</strong> - Any branch that introduces changes like a new feature, a
@@ -347,9 +347,9 @@ into the master branch, that work should have happened against the master
branch in the first place.</li>
</ol>
</li>
</ol> </section> </article> </div> </div> </div> </section> <section id="faq" class="py-20 sm:py-28"> <div class="section-container"> <div class="max-w-3xl mx-auto"> <!-- Section header --> <div class="mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">FAQ</h2> <p class="text-lg text-gray-600 dark:text-slate-400">
</ol> </section> </article> </div> </div> </div> </section> <section id="faq" class="py-20 sm:py-28"> <div class="section-container"> <div class="max-w-3xl mx-auto"> <!-- Section header --> <div class="mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">FAQ</h2> <p class="text-lg text-gray-600 dark:text-neutral-400">
Common questions about Git Common-Flow
</p> </div> <!-- FAQ Items --> <div class="space-y-0"> </div> </div> </div> </section> <script type="module">function n(){document.querySelectorAll("[data-faq-item]").forEach(r=>{const t=r.querySelector("[data-faq-trigger]"),a=r.querySelector("[data-faq-content]"),s=r.querySelector("[data-faq-icon]");!t||!a||!s||t.addEventListener("click",()=>{const e=t.getAttribute("aria-expanded")==="true";t.setAttribute("aria-expanded",e?"false":"true"),a.classList.toggle("grid-rows-[1fr]",!e),a.classList.toggle("grid-rows-[0fr]",e),s.classList.toggle("rotate-180",!e)})})}n();document.addEventListener("astro:after-swap",n);</script> </main> <footer class="py-8 text-center text-sm
text-gray-500 dark:text-slate-500
border-t border-gray-200 dark:border-slate-800"> <div class="section-container"> <p> Git Common-Flow is authored by
text-gray-500 dark:text-neutral-500
border-t border-gray-200 dark:border-neutral-800"> <div class="section-container"> <p> Git Common-Flow is authored by
<a href="https://jimeh.me/" class="hover:text-sky-600" target="_blank" rel="noopener noreferrer"> Jim Myhrberg </a> </p> <p class="mt-2"> <a href="https://creativecommons.org/licenses/by/4.0/" class="hover:text-sky-600" target="_blank" rel="noopener noreferrer"> CC BY 4.0 </a> </p> </div> </footer> <!-- Re-init theme on Astro page transitions --> <script type="module">document.addEventListener("astro:after-swap",()=>{const e=localStorage.getItem("theme");e==="dark"||!e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.classList.add("dark"):document.documentElement.classList.remove("dark")});</script> </body> </html>

View File

@@ -8,130 +8,130 @@
document.documentElement.classList.add("dark");
}
})();
</script><link rel="stylesheet" href="/_astro/index._zunHdNh.css"></head> <body class="min-h-screen"> <header id="site-header" class="fixed top-0 inset-x-0 z-50 border-b border-transparent
</script><link rel="stylesheet" href="/_astro/index.BZOQzl8l.css"></head> <body class="min-h-screen"> <header id="site-header" class="fixed top-0 inset-x-0 z-50 border-b border-transparent
translate-y-[-100%] transition-transform duration-300
backdrop-blur-xl bg-gray-50/85 dark:bg-slate-950/85"> <div class="max-w-6xl mx-auto px-4 sm:px-6 h-16 flex items-center justify-between"> <!-- Logo / Title + Version --> <div class="flex items-center gap-3"> <a href="#hero" class="flex items-center gap-3 no-underline
text-gray-950 dark:text-slate-50
backdrop-blur-xl bg-gray-50/85 dark:bg-neutral-950/85"> <div class="max-w-6xl mx-auto px-4 sm:px-6 h-16 flex items-center justify-between"> <!-- Logo / Title + Version --> <div class="flex items-center gap-3"> <a href="#hero" class="flex items-center gap-3 no-underline
text-gray-950 dark:text-neutral-50
hover:text-sky-600 transition-colors"> <span class="font-display font-bold text-lg tracking-tight">
Git Common-Flow
</span> </a> <div class="hidden md:block"> <div class="relative" data-version-selector> <!-- Trigger button --> <button type="button" data-version-trigger aria-haspopup="listbox" aria-expanded="false" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-slate-700
border border-gray-200 dark:border-neutral-700
rounded-md bg-transparent cursor-pointer transition-colors
text-gray-600 dark:text-slate-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-slate-50"> <span>v1.0.0-rc.2</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-slate-900
border border-gray-200 dark:border-slate-700
text-gray-600 dark:text-neutral-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-neutral-50"> <span>v1.0.0-rc.2</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-neutral-900
border border-gray-200 dark:border-neutral-700
rounded-lg shadow-lg
opacity-0 invisible -translate-y-1 transition-all duration-150
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.1 </a> </div> </div> <script type="module">function c(){document.querySelectorAll("[data-version-selector]").forEach(e=>{if(e.dataset.initialized)return;e.dataset.initialized="true";const t=e.querySelector("[data-version-trigger]"),a=e.querySelector("[data-version-dropdown]"),n=e.querySelector("[data-arrow-icon]");if(!t||!a)return;const u=()=>{a.dataset.open="true",t.setAttribute("aria-expanded","true"),n&&(n.style.transform="rotate(180deg)")},o=()=>{delete a.dataset.open,t.setAttribute("aria-expanded","false"),n&&(n.style.transform="")};t.addEventListener("click",r=>{r.stopPropagation();const l=a.dataset.open==="true";document.querySelectorAll("[data-version-dropdown][data-open]").forEach(s=>{delete s.dataset.open;const i=s.previousElementSibling;i?.setAttribute("aria-expanded","false");const d=i?.querySelector("[data-arrow-icon]");d&&(d.style.transform="")}),l?o():u()}),document.addEventListener("click",r=>{e.contains(r.target)||o()}),document.addEventListener("keydown",r=>{r.key==="Escape"&&a.dataset.open==="true"&&(o(),t.focus())})})}c();document.addEventListener("astro:after-swap",c);</script> </div> </div> <!-- Desktop Navigation --> <nav class="hidden md:flex items-center gap-1"> <a href="#about" class="nav-link inline-flex items-center px-4 py-2 text-sm font-medium
rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50" data-nav-link data-section-id="about">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50" data-nav-link data-section-id="about">
About
</a> <a href="#spec" class="nav-link inline-flex items-center px-4 py-2 text-sm font-medium
rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50" data-nav-link data-section-id="spec">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50" data-nav-link data-section-id="spec">
Spec
</a> <a href="#faq" class="nav-link inline-flex items-center px-4 py-2 text-sm font-medium
rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50" data-nav-link data-section-id="faq">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50" data-nav-link data-section-id="faq">
FAQ
</a> </nav> <!-- Right side: Theme, GitHub --> <div class="flex items-center gap-3"> <button data-theme-toggle type="button" class="p-2 rounded-lg transition-colors duration-200
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-gray-100 dark:hover:bg-slate-800" aria-label="Toggle dark mode"> <!-- Sun icon (shown in dark mode) --> <svg data-sun-icon class="hidden w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800" aria-label="Toggle dark mode"> <!-- Sun icon (shown in dark mode) --> <svg data-sun-icon class="hidden w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343
6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16
12a4 4 0 11-8 0 4 4 0 018 0z"></path> </svg> <!-- Moon icon (shown in light mode) --> <svg data-moon-icon class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003
9.003 0 008.354-5.646z"></path> </svg> </button> <script type="module">function n(){const c=document.querySelectorAll("[data-theme-toggle]");function o(){const e=localStorage.getItem("theme");return e==="dark"||e==="light"?e:window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}function r(e){document.querySelectorAll("[data-sun-icon]").forEach(t=>{t.classList.toggle("hidden",!e)}),document.querySelectorAll("[data-moon-icon]").forEach(t=>{t.classList.toggle("hidden",e)})}function a(e){localStorage.setItem("theme",e),document.documentElement.classList.toggle("dark",e==="dark"),r(e==="dark")}const d=o();a(d),c.forEach(e=>{e.dataset.initialized||(e.dataset.initialized="true",e.addEventListener("click",()=>{const t=document.documentElement.classList.contains("dark");a(t?"light":"dark")}))}),window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",e=>{localStorage.getItem("theme")||a(e.matches?"dark":"light")})}n();document.addEventListener("astro:after-swap",n);</script> <a href="https://github.com/jimeh/common-flow" target="_blank" rel="noopener noreferrer" class="p-2 rounded-lg transition-colors
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-gray-100 dark:hover:bg-slate-800" aria-label="View on GitHub"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path> </svg> </a> <!-- Mobile menu button --> <button id="mobile-menu-btn" class="md:hidden p-2 rounded-lg
text-gray-500 dark:text-slate-500
hover:bg-gray-100 dark:hover:bg-slate-800" aria-label="Toggle menu"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation --> <nav id="mobile-nav" class="md:hidden hidden border-t border-gray-200 dark:border-slate-800"> <div class="px-4 py-3 space-y-1 text-center"> <div class="py-2 flex justify-center"> <div class="relative" data-version-selector> <!-- Trigger button --> <button type="button" data-version-trigger aria-haspopup="listbox" aria-expanded="false" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-slate-700
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800" aria-label="View on GitHub"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path> </svg> </a> <!-- Mobile menu button --> <button id="mobile-menu-btn" class="md:hidden p-2 rounded-lg
text-gray-500 dark:text-neutral-500
hover:bg-gray-100 dark:hover:bg-neutral-800" aria-label="Toggle menu"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation --> <nav id="mobile-nav" class="md:hidden hidden border-t border-gray-200 dark:border-neutral-800"> <div class="px-4 py-3 space-y-1 text-center"> <div class="py-2 flex justify-center"> <div class="relative" data-version-selector> <!-- Trigger button --> <button type="button" data-version-trigger aria-haspopup="listbox" aria-expanded="false" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-neutral-700
rounded-md bg-transparent cursor-pointer transition-colors
text-gray-600 dark:text-slate-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-slate-50"> <span>v1.0.0-rc.2</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-slate-900
border border-gray-200 dark:border-slate-700
text-gray-600 dark:text-neutral-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-neutral-50"> <span>v1.0.0-rc.2</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-neutral-900
border border-gray-200 dark:border-neutral-700
rounded-lg shadow-lg
opacity-0 invisible -translate-y-1 transition-all duration-150
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.1 </a> </div> </div> </div> <a href="#about" class="nav-link block py-2 text-gray-600 dark:text-slate-400
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.1 </a> </div> </div> </div> <a href="#about" class="nav-link block py-2 text-gray-600 dark:text-neutral-400
hover:text-sky-600" data-nav-link data-section-id="about">
About
</a> <a href="#spec" class="nav-link block py-2 text-gray-600 dark:text-slate-400
</a> <a href="#spec" class="nav-link block py-2 text-gray-600 dark:text-neutral-400
hover:text-sky-600" data-nav-link data-section-id="spec">
Spec
</a> <a href="#faq" class="nav-link block py-2 text-gray-600 dark:text-slate-400
</a> <a href="#faq" class="nav-link block py-2 text-gray-600 dark:text-neutral-400
hover:text-sky-600" data-nav-link data-section-id="faq">
FAQ
</a> </div> </nav> </header> <script type="module">function f(){const n=document.getElementById("site-header"),g=document.getElementById("hero"),o=document.getElementById("mobile-menu-btn"),s=document.getElementById("mobile-nav");if(!n||!g)return;const v=64;function c(){window.scrollY>=v?(n.classList.remove("translate-y-[-100%]"),n.classList.add("border-gray-200","dark:border-slate-800")):(n.classList.add("translate-y-[-100%]"),n.classList.remove("border-gray-200","dark:border-slate-800"))}window.addEventListener("scroll",c,{passive:!0}),c(),o&&s&&(o.addEventListener("click",()=>{s.classList.toggle("hidden")}),s.querySelectorAll("a").forEach(i=>{i.addEventListener("click",()=>{s.classList.add("hidden")})}));const r=document.querySelectorAll("[data-nav-link]"),l=[],u=new Set;r.forEach(i=>{const e=i.getAttribute("data-section-id");if(e&&!u.has(e)){u.add(e);const t=document.getElementById(e);t&&l.push({id:e,element:t})}});function m(){let e=null;for(const{id:t,element:d}of l)d.getBoundingClientRect().top<=100&&(e=t);r.forEach(t=>{const d=t.getAttribute("data-section-id");t.classList.toggle("active",d===e)})}let a=!1;window.addEventListener("scroll",()=>{a||(requestAnimationFrame(()=>{m(),a=!1}),a=!0)}),m()}f();document.addEventListener("astro:after-swap",f);</script> <main> <section id="hero" class="relative min-h-[75vh] flex flex-col items-center justify-center
</a> </div> </nav> </header> <script type="module">function f(){const n=document.getElementById("site-header"),g=document.getElementById("hero"),o=document.getElementById("mobile-menu-btn"),s=document.getElementById("mobile-nav");if(!n||!g)return;const v=64;function c(){window.scrollY>=v?(n.classList.remove("translate-y-[-100%]"),n.classList.add("border-gray-200","dark:border-neutral-800")):(n.classList.add("translate-y-[-100%]"),n.classList.remove("border-gray-200","dark:border-neutral-800"))}window.addEventListener("scroll",c,{passive:!0}),c(),o&&s&&(o.addEventListener("click",()=>{s.classList.toggle("hidden")}),s.querySelectorAll("a").forEach(i=>{i.addEventListener("click",()=>{s.classList.add("hidden")})}));const r=document.querySelectorAll("[data-nav-link]"),l=[],u=new Set;r.forEach(i=>{const e=i.getAttribute("data-section-id");if(e&&!u.has(e)){u.add(e);const t=document.getElementById(e);t&&l.push({id:e,element:t})}});function m(){let e=null;for(const{id:t,element:d}of l)d.getBoundingClientRect().top<=100&&(e=t);r.forEach(t=>{const d=t.getAttribute("data-section-id");t.classList.toggle("active",d===e)})}let a=!1;window.addEventListener("scroll",()=>{a||(requestAnimationFrame(()=>{m(),a=!1}),a=!0)}),m()}f();document.addEventListener("astro:after-swap",f);</script> <main> <section id="hero" class="relative min-h-[75vh] flex flex-col items-center justify-center
px-6 py-16 overflow-hidden"> <!-- Background gradient/texture --> <div class="absolute inset-0 bg-gradient-to-b
from-gray-100 to-gray-50
dark:from-slate-900 dark:to-slate-950"></div> <!-- Subtle grid pattern --> <div class="absolute inset-0 opacity-[0.03] dark:opacity-[0.05]
dark:from-neutral-900 dark:to-neutral-950"></div> <!-- Subtle grid pattern --> <div class="absolute inset-0 opacity-[0.03] dark:opacity-[0.05]
bg-[linear-gradient(theme(colors.gray.950)_1px,transparent_1px),linear-gradient(90deg,theme(colors.gray.950)_1px,transparent_1px)]
dark:bg-[linear-gradient(theme(colors.slate.400)_1px,transparent_1px),linear-gradient(90deg,theme(colors.slate.400)_1px,transparent_1px)]
dark:bg-[linear-gradient(theme(colors.neutral.600)_1px,transparent_1px),linear-gradient(90deg,theme(colors.neutral.600)_1px,transparent_1px)]
bg-[size:60px_60px]"></div> <!-- Top bar with version & theme --> <div class="absolute top-0 inset-x-0 flex items-center justify-between
px-6 py-4 animate-fade-in-down"> <div class="flex items-center gap-3"> <div class="relative" data-version-selector> <!-- Trigger button --> <button type="button" data-version-trigger aria-haspopup="listbox" aria-expanded="false" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-slate-700
border border-gray-200 dark:border-neutral-700
rounded-md bg-transparent cursor-pointer transition-colors
text-gray-600 dark:text-slate-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-slate-50"> <span>v1.0.0-rc.2</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-slate-900
border border-gray-200 dark:border-slate-700
text-gray-600 dark:text-neutral-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-neutral-50"> <span>v1.0.0-rc.2</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-neutral-900
border border-gray-200 dark:border-neutral-700
rounded-lg shadow-lg
opacity-0 invisible -translate-y-1 transition-all duration-150
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.1 </a> </div> </div> </div> <div class="flex items-center gap-2"> <button data-theme-toggle type="button" class="p-2 rounded-lg transition-colors duration-200
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-gray-100 dark:hover:bg-slate-800" aria-label="Toggle dark mode"> <!-- Sun icon (shown in dark mode) --> <svg data-sun-icon class="hidden w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800" aria-label="Toggle dark mode"> <!-- Sun icon (shown in dark mode) --> <svg data-sun-icon class="hidden w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343
6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16
12a4 4 0 11-8 0 4 4 0 018 0z"></path> </svg> <!-- Moon icon (shown in light mode) --> <svg data-moon-icon class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003
9.003 0 008.354-5.646z"></path> </svg> </button> <a href="https://github.com/jimeh/common-flow" target="_blank" rel="noopener noreferrer" class="p-2 rounded-lg transition-colors
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-white/50 dark:hover:bg-slate-800/50" aria-label="View on GitHub"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path> </svg> </a> </div> </div> <!-- Main content --> <div class="relative z-10 w-full max-w-4xl mx-auto text-center"> <!-- Title --> <h1 class="animate-fade-in-up mb-4
text-gray-950 dark:text-slate-50">
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-white/50 dark:hover:bg-neutral-800/50" aria-label="View on GitHub"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path> </svg> </a> </div> </div> <!-- Main content --> <div class="relative z-10 w-full max-w-4xl mx-auto text-center"> <!-- Title --> <h1 class="animate-fade-in-up mb-4
text-gray-950 dark:text-neutral-50">
Git Common-Flow
</h1> <!-- Tagline --> <p class="animate-fade-in-up delay-100
text-lg sm:text-xl max-w-2xl mx-auto mb-8
text-gray-600 dark:text-slate-400">
text-gray-600 dark:text-neutral-400">
A sensible git workflow for teams who ship
</p> <!-- Version badge --> <div class="animate-fade-in-up delay-200 mb-10"> <span class="inline-flex items-center px-3 py-1 font-mono text-xs font-medium
rounded-full border
bg-gray-100 border-gray-200 text-gray-500
dark:bg-slate-800/50 dark:border-slate-700 dark:text-slate-400">
dark:bg-neutral-800/50 dark:border-neutral-700 dark:text-neutral-400">
v1.0.0-rc.2 </span> </div> <!-- SVG Diagram --> <div class="animate-fade-in-up delay-300
relative mx-auto mb-12 p-4 sm:p-8
bg-white dark:bg-slate-900
bg-white dark:bg-neutral-900
rounded-2xl shadow-lg dark:shadow-none
border border-gray-200 dark:border-slate-800"> <img src="/spec/1.0.0-rc.2.svg" alt="Git Common-Flow diagram" class="w-full h-auto max-w-3xl mx-auto
border border-gray-200 dark:border-neutral-800"> <img src="/spec/1.0.0-rc.2.svg" alt="Git Common-Flow diagram" class="w-full h-auto max-w-3xl mx-auto
dark:invert dark:hue-rotate-180 dark:contrast-90"> </div> <!-- Navigation links --> <nav class="animate-fade-in-up delay-400
flex flex-wrap items-center justify-center gap-4"> <a href="#about" class="inline-flex items-center justify-center gap-2 px-5 py-2.5
text-sm font-medium rounded-lg transition-all cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50">
About
</a> <a href="#spec" class="inline-flex items-center justify-center gap-2 px-5 py-2.5
text-sm font-medium rounded-lg transition-all cursor-pointer
@@ -140,18 +140,18 @@ About
Read the Spec
</a> <a href="#faq" class="inline-flex items-center justify-center gap-2 px-5 py-2.5
text-sm font-medium rounded-lg transition-all cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50">
FAQ
</a> </nav> </div> <!-- Scroll indicator --> <a href="#about" class="absolute bottom-8 left-1/2 -translate-x-1/2
animate-fade-in delay-700
text-gray-500 dark:text-slate-500
hover:text-sky-600 transition-colors" aria-label="Scroll to content"> <svg class="w-6 h-6 animate-bounce-subtle" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3"></path> </svg> </a> </section> <section id="about" class="py-20 sm:py-28"> <div class="section-container"> <div class="max-w-3xl mx-auto"> <!-- Section header --> <div class="mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">About Common-Flow</h2> <p class="text-lg text-gray-600 dark:text-slate-400">
text-gray-500 dark:text-neutral-500
hover:text-sky-600 transition-colors" aria-label="Scroll to content"> <svg class="w-6 h-6 animate-bounce-subtle" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3"></path> </svg> </a> </section> <section id="about" class="py-20 sm:py-28"> <div class="section-container"> <div class="max-w-3xl mx-auto"> <!-- Section header --> <div class="mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">About Common-Flow</h2> <p class="text-lg text-gray-600 dark:text-neutral-400">
A practical git workflow that combines the best of GitHub Flow with
versioned releases
</p> </div> <!-- Introduction --> <div class="prose-spec mb-12"></div> <!-- Summary as feature cards --> <div class="mb-16"> <h3 class="text-xl font-display font-semibold mb-6
text-gray-950 dark:text-slate-50">
text-gray-950 dark:text-neutral-50">
Key Principles
</h3> <div class="prose-spec"><p>Common-Flow is an attempt to gather a sensible selection of the most common
usage patterns of git into a single and concise specification. It is based on
@@ -160,32 +160,32 @@ of <a href="https://guides.github.com/introduction/flow/">GitHub Flow</a>, while
into account how a lot of open source projects use git.</p>
<p>TL;DR: Common-Flow is basically GitHub Flow with the addition of versioned
releases, maintenance releases for old versions, and without the requirement to
deploy to production all the time.</p></div> </div> <!-- Feedback & License --> <div class="pt-8 border-t border-gray-200 dark:border-slate-800"> <div class="grid sm:grid-cols-2 gap-8"> <div> <h4 class="text-sm font-semibold uppercase tracking-wider mb-3
text-gray-500 dark:text-slate-500">
deploy to production all the time.</p></div> </div> <!-- Feedback & License --> <div class="pt-8 border-t border-gray-200 dark:border-neutral-800"> <div class="grid sm:grid-cols-2 gap-8"> <div> <h4 class="text-sm font-semibold uppercase tracking-wider mb-3
text-gray-500 dark:text-neutral-500">
Feedback
</h4> <p class="text-gray-600 dark:text-slate-400">
</h4> <p class="text-gray-600 dark:text-neutral-400">
Please <a href="https://github.com/jimeh/common-flow/issues" class="text-sky-600 hover:text-sky-400" target="_blank" rel="noopener noreferrer">open an issue on GitHub</a>.
</p> </div> <div> <h4 class="text-sm font-semibold uppercase tracking-wider mb-3
text-gray-500 dark:text-slate-500">
text-gray-500 dark:text-neutral-500">
License
</h4> <div class="text-gray-600 dark:text-slate-400"><p><a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons - CC BY 3.0</a></p></div> </div> </div> </div> </div> </div> </section> <section id="spec" class="py-20 sm:py-28"> <div class="section-container"> <!-- Section header --> <div class="max-w-3xl mx-auto mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">The Specification</h2> <p class="text-lg text-gray-600 dark:text-slate-400">
</h4> <div class="text-gray-600 dark:text-neutral-400"><p><a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons - CC BY 3.0</a></p></div> </div> </div> </div> </div> </div> </section> <section id="spec" class="py-20 sm:py-28"> <div class="section-container"> <!-- Section header --> <div class="max-w-3xl mx-auto mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">The Specification</h2> <p class="text-lg text-gray-600 dark:text-neutral-400">
The complete Git Common-Flow specification
</p> </div> <!-- Content with sidebar --> <div class="lg:flex lg:gap-8"> <!-- Sidebar --> <div class="lg:w-64 lg:flex-shrink-0"> <aside id="spec-sidebar" class="hidden lg:block lg:sticky lg:top-24 lg:self-start
lg:max-h-[calc(100vh-8rem)] lg:overflow-y-auto
lg:pr-8 lg:mr-8 lg:border-r border-gray-200 dark:border-slate-800"> <nav class="space-y-1 py-2"> <div class="text-xs font-semibold uppercase tracking-wider mb-4
text-gray-500 dark:text-slate-500">
lg:pr-8 lg:mr-8 lg:border-r border-gray-200 dark:border-neutral-800"> <nav class="space-y-1 py-2"> <div class="text-xs font-semibold uppercase tracking-wider mb-4
text-gray-500 dark:text-neutral-500">
Table of Contents
</div> <a href="#terminology" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800" data-sidebar-link data-section-id="terminology"> Terminology </a><a href="#specification" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800" data-sidebar-link data-section-id="specification"> Specification </a><a href="#spec-the-master-branch" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-the-master-branch"> The Master Branch </a><a href="#spec-change-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-change-branches"> Change Branches </a><a href="#spec-pull-requests" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-pull-requests"> Pull Requests </a><a href="#spec-versioning" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-versioning"> Versioning </a><a href="#spec-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-releases"> Releases </a><a href="#spec-release-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-release-branches"> Release Branches </a><a href="#spec-bug-fixes-rollback" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-bug-fixes-rollback"> Bug Fixes &amp; Rollback </a><a href="#spec-git-best-practices" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-git-best-practices"> Git Best Practices </a> </nav> </aside> <!-- Mobile floating button --> <button id="spec-toc-toggle" class="lg:hidden fixed bottom-6 right-6 z-40
</div> <a href="#terminology" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800" data-sidebar-link data-section-id="terminology"> Terminology </a><a href="#specification" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800" data-sidebar-link data-section-id="specification"> Specification </a><a href="#spec-the-master-branch" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-the-master-branch"> The Master Branch </a><a href="#spec-change-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-change-branches"> Change Branches </a><a href="#spec-pull-requests" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-pull-requests"> Pull Requests </a><a href="#spec-versioning" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-versioning"> Versioning </a><a href="#spec-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-releases"> Releases </a><a href="#spec-release-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-release-branches"> Release Branches </a><a href="#spec-bug-fixes-rollback" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-bug-fixes-rollback"> Bug Fixes &amp; Rollback </a><a href="#spec-git-best-practices" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-git-best-practices"> Git Best Practices </a> </nav> </aside> <!-- Mobile floating button --> <button id="spec-toc-toggle" class="lg:hidden fixed bottom-6 right-6 z-40
w-12 h-12 rounded-full shadow-lg
bg-sky-600 text-white
flex items-center justify-center
hover:bg-sky-500
transition-all duration-200" aria-label="Jump to section"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h7"></path> </svg> </button> <!-- Mobile TOC drawer --> <div id="spec-toc-drawer" class="lg:hidden fixed inset-0 z-50 hidden" data-toc-drawer> <!-- Backdrop --> <div class="absolute inset-0 bg-black/50" data-toc-backdrop></div> <!-- Drawer --> <div class="absolute bottom-0 inset-x-0 max-h-[70vh] overflow-y-auto
bg-gray-50 dark:bg-slate-950
bg-gray-50 dark:bg-neutral-950
rounded-t-2xl shadow-xl p-6"> <div class="flex items-center justify-between mb-4"> <span class="text-sm font-semibold uppercase tracking-wider
text-gray-500 dark:text-slate-500">
text-gray-500 dark:text-neutral-500">
Jump to Section
</span> <button class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-slate-800" data-toc-close aria-label="Close"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path> </svg> </button> </div> <nav class="space-y-1"> <a href="#terminology" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800" data-toc-link> Terminology </a><a href="#specification" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800" data-toc-link> Specification </a><a href="#spec-the-master-branch" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> The Master Branch </a><a href="#spec-change-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Change Branches </a><a href="#spec-pull-requests" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Pull Requests </a><a href="#spec-versioning" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Versioning </a><a href="#spec-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Releases </a><a href="#spec-release-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Release Branches </a><a href="#spec-bug-fixes-rollback" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Bug Fixes &amp; Rollback </a><a href="#spec-git-best-practices" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Git Best Practices </a> </nav> </div> </div> <script type="module">function u(){const a=document.querySelectorAll("[data-sidebar-link]"),o=[];a.forEach(n=>{const e=n.getAttribute("data-section-id");if(e){const t=document.getElementById(e);t&&o.push({id:e,element:t})}});function l(){let e=o[0]?.id;for(const{id:t,element:r}of o)r.getBoundingClientRect().top<=100&&(e=t);a.forEach(t=>{const r=t.getAttribute("data-section-id");t.classList.toggle("active",r===e)})}let s=!1;window.addEventListener("scroll",()=>{s||(requestAnimationFrame(()=>{l(),s=!1}),s=!0)}),l();const d=document.getElementById("spec-toc-toggle"),c=document.getElementById("spec-toc-drawer"),g=c?.querySelector("[data-toc-backdrop]"),m=c?.querySelector("[data-toc-close]"),v=c?.querySelectorAll("[data-toc-link]");function p(){c?.classList.remove("hidden"),document.body.style.overflow="hidden"}function i(){c?.classList.add("hidden"),document.body.style.overflow=""}d?.addEventListener("click",p),g?.addEventListener("click",i),m?.addEventListener("click",i),v?.forEach(n=>{n.addEventListener("click",i)});const f=document.getElementById("spec");f&&d&&new IntersectionObserver(([e])=>{d.classList.toggle("hidden",!e.isIntersecting)},{threshold:0}).observe(f)}u();document.addEventListener("astro:after-swap",u);</script> </div> <!-- Main content --> <div class="flex-1 min-w-0"> <article class="prose-spec"> <!-- Terminology --> <section id="terminology"> <h2>Terminology</h2> <ul>
</span> <button class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-neutral-800" data-toc-close aria-label="Close"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path> </svg> </button> </div> <nav class="space-y-1"> <a href="#terminology" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800" data-toc-link> Terminology </a><a href="#specification" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800" data-toc-link> Specification </a><a href="#spec-the-master-branch" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> The Master Branch </a><a href="#spec-change-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Change Branches </a><a href="#spec-pull-requests" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Pull Requests </a><a href="#spec-versioning" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Versioning </a><a href="#spec-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Releases </a><a href="#spec-release-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Release Branches </a><a href="#spec-bug-fixes-rollback" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Bug Fixes &amp; Rollback </a><a href="#spec-git-best-practices" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Git Best Practices </a> </nav> </div> </div> <script type="module">function u(){const a=document.querySelectorAll("[data-sidebar-link]"),o=[];a.forEach(n=>{const e=n.getAttribute("data-section-id");if(e){const t=document.getElementById(e);t&&o.push({id:e,element:t})}});function l(){let e=o[0]?.id;for(const{id:t,element:r}of o)r.getBoundingClientRect().top<=100&&(e=t);a.forEach(t=>{const r=t.getAttribute("data-section-id");t.classList.toggle("active",r===e)})}let s=!1;window.addEventListener("scroll",()=>{s||(requestAnimationFrame(()=>{l(),s=!1}),s=!0)}),l();const d=document.getElementById("spec-toc-toggle"),c=document.getElementById("spec-toc-drawer"),g=c?.querySelector("[data-toc-backdrop]"),m=c?.querySelector("[data-toc-close]"),v=c?.querySelectorAll("[data-toc-link]");function p(){c?.classList.remove("hidden"),document.body.style.overflow="hidden"}function i(){c?.classList.add("hidden"),document.body.style.overflow=""}d?.addEventListener("click",p),g?.addEventListener("click",i),m?.addEventListener("click",i),v?.forEach(n=>{n.addEventListener("click",i)});const f=document.getElementById("spec");f&&d&&new IntersectionObserver(([e])=>{d.classList.toggle("hidden",!e.isIntersecting)},{threshold:0}).observe(f)}u();document.addEventListener("astro:after-swap",u);</script> </div> <!-- Main content --> <div class="flex-1 min-w-0"> <article class="prose-spec"> <!-- Terminology --> <section id="terminology"> <h2>Terminology</h2> <ul>
<li><strong>Master Branch</strong> - Must always have passing tests, is considered bleeding
edge, and must be named <code>master</code>.</li>
<li><strong>Change Branches</strong> - Any branch that introduces changes like a new feature, a
@@ -381,9 +381,9 @@ and creates a merge commit to mark the integration of the branch with
master.</li>
</ol>
</li>
</ol> </section> </article> </div> </div> </div> </section> <section id="faq" class="py-20 sm:py-28"> <div class="section-container"> <div class="max-w-3xl mx-auto"> <!-- Section header --> <div class="mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">FAQ</h2> <p class="text-lg text-gray-600 dark:text-slate-400">
</ol> </section> </article> </div> </div> </div> </section> <section id="faq" class="py-20 sm:py-28"> <div class="section-container"> <div class="max-w-3xl mx-auto"> <!-- Section header --> <div class="mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">FAQ</h2> <p class="text-lg text-gray-600 dark:text-neutral-400">
Common questions about Git Common-Flow
</p> </div> <!-- FAQ Items --> <div class="space-y-0"> </div> </div> </div> </section> <script type="module">function n(){document.querySelectorAll("[data-faq-item]").forEach(r=>{const t=r.querySelector("[data-faq-trigger]"),a=r.querySelector("[data-faq-content]"),s=r.querySelector("[data-faq-icon]");!t||!a||!s||t.addEventListener("click",()=>{const e=t.getAttribute("aria-expanded")==="true";t.setAttribute("aria-expanded",e?"false":"true"),a.classList.toggle("grid-rows-[1fr]",!e),a.classList.toggle("grid-rows-[0fr]",e),s.classList.toggle("rotate-180",!e)})})}n();document.addEventListener("astro:after-swap",n);</script> </main> <footer class="py-8 text-center text-sm
text-gray-500 dark:text-slate-500
border-t border-gray-200 dark:border-slate-800"> <div class="section-container"> <p> Git Common-Flow is authored by
text-gray-500 dark:text-neutral-500
border-t border-gray-200 dark:border-neutral-800"> <div class="section-container"> <p> Git Common-Flow is authored by
<a href="https://jimeh.me/" class="hover:text-sky-600" target="_blank" rel="noopener noreferrer"> Jim Myhrberg </a> </p> <p class="mt-2"> <a href="https://creativecommons.org/licenses/by/4.0/" class="hover:text-sky-600" target="_blank" rel="noopener noreferrer"> CC BY 4.0 </a> </p> </div> </footer> <!-- Re-init theme on Astro page transitions --> <script type="module">document.addEventListener("astro:after-swap",()=>{const e=localStorage.getItem("theme");e==="dark"||!e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.classList.add("dark"):document.documentElement.classList.remove("dark")});</script> </body> </html>

View File

@@ -8,130 +8,130 @@
document.documentElement.classList.add("dark");
}
})();
</script><link rel="stylesheet" href="/_astro/index._zunHdNh.css"></head> <body class="min-h-screen"> <header id="site-header" class="fixed top-0 inset-x-0 z-50 border-b border-transparent
</script><link rel="stylesheet" href="/_astro/index.BZOQzl8l.css"></head> <body class="min-h-screen"> <header id="site-header" class="fixed top-0 inset-x-0 z-50 border-b border-transparent
translate-y-[-100%] transition-transform duration-300
backdrop-blur-xl bg-gray-50/85 dark:bg-slate-950/85"> <div class="max-w-6xl mx-auto px-4 sm:px-6 h-16 flex items-center justify-between"> <!-- Logo / Title + Version --> <div class="flex items-center gap-3"> <a href="#hero" class="flex items-center gap-3 no-underline
text-gray-950 dark:text-slate-50
backdrop-blur-xl bg-gray-50/85 dark:bg-neutral-950/85"> <div class="max-w-6xl mx-auto px-4 sm:px-6 h-16 flex items-center justify-between"> <!-- Logo / Title + Version --> <div class="flex items-center gap-3"> <a href="#hero" class="flex items-center gap-3 no-underline
text-gray-950 dark:text-neutral-50
hover:text-sky-600 transition-colors"> <span class="font-display font-bold text-lg tracking-tight">
Git Common-Flow
</span> </a> <div class="hidden md:block"> <div class="relative" data-version-selector> <!-- Trigger button --> <button type="button" data-version-trigger aria-haspopup="listbox" aria-expanded="false" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-slate-700
border border-gray-200 dark:border-neutral-700
rounded-md bg-transparent cursor-pointer transition-colors
text-gray-600 dark:text-slate-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-slate-50"> <span>v1.0.0-rc.3</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-slate-900
border border-gray-200 dark:border-slate-700
text-gray-600 dark:text-neutral-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-neutral-50"> <span>v1.0.0-rc.3</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-neutral-900
border border-gray-200 dark:border-neutral-700
rounded-lg shadow-lg
opacity-0 invisible -translate-y-1 transition-all duration-150
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.1 </a> </div> </div> <script type="module">function c(){document.querySelectorAll("[data-version-selector]").forEach(e=>{if(e.dataset.initialized)return;e.dataset.initialized="true";const t=e.querySelector("[data-version-trigger]"),a=e.querySelector("[data-version-dropdown]"),n=e.querySelector("[data-arrow-icon]");if(!t||!a)return;const u=()=>{a.dataset.open="true",t.setAttribute("aria-expanded","true"),n&&(n.style.transform="rotate(180deg)")},o=()=>{delete a.dataset.open,t.setAttribute("aria-expanded","false"),n&&(n.style.transform="")};t.addEventListener("click",r=>{r.stopPropagation();const l=a.dataset.open==="true";document.querySelectorAll("[data-version-dropdown][data-open]").forEach(s=>{delete s.dataset.open;const i=s.previousElementSibling;i?.setAttribute("aria-expanded","false");const d=i?.querySelector("[data-arrow-icon]");d&&(d.style.transform="")}),l?o():u()}),document.addEventListener("click",r=>{e.contains(r.target)||o()}),document.addEventListener("keydown",r=>{r.key==="Escape"&&a.dataset.open==="true"&&(o(),t.focus())})})}c();document.addEventListener("astro:after-swap",c);</script> </div> </div> <!-- Desktop Navigation --> <nav class="hidden md:flex items-center gap-1"> <a href="#about" class="nav-link inline-flex items-center px-4 py-2 text-sm font-medium
rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50" data-nav-link data-section-id="about">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50" data-nav-link data-section-id="about">
About
</a> <a href="#spec" class="nav-link inline-flex items-center px-4 py-2 text-sm font-medium
rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50" data-nav-link data-section-id="spec">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50" data-nav-link data-section-id="spec">
Spec
</a> <a href="#faq" class="nav-link inline-flex items-center px-4 py-2 text-sm font-medium
rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50" data-nav-link data-section-id="faq">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50" data-nav-link data-section-id="faq">
FAQ
</a> </nav> <!-- Right side: Theme, GitHub --> <div class="flex items-center gap-3"> <button data-theme-toggle type="button" class="p-2 rounded-lg transition-colors duration-200
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-gray-100 dark:hover:bg-slate-800" aria-label="Toggle dark mode"> <!-- Sun icon (shown in dark mode) --> <svg data-sun-icon class="hidden w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800" aria-label="Toggle dark mode"> <!-- Sun icon (shown in dark mode) --> <svg data-sun-icon class="hidden w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343
6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16
12a4 4 0 11-8 0 4 4 0 018 0z"></path> </svg> <!-- Moon icon (shown in light mode) --> <svg data-moon-icon class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003
9.003 0 008.354-5.646z"></path> </svg> </button> <script type="module">function n(){const c=document.querySelectorAll("[data-theme-toggle]");function o(){const e=localStorage.getItem("theme");return e==="dark"||e==="light"?e:window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"}function r(e){document.querySelectorAll("[data-sun-icon]").forEach(t=>{t.classList.toggle("hidden",!e)}),document.querySelectorAll("[data-moon-icon]").forEach(t=>{t.classList.toggle("hidden",e)})}function a(e){localStorage.setItem("theme",e),document.documentElement.classList.toggle("dark",e==="dark"),r(e==="dark")}const d=o();a(d),c.forEach(e=>{e.dataset.initialized||(e.dataset.initialized="true",e.addEventListener("click",()=>{const t=document.documentElement.classList.contains("dark");a(t?"light":"dark")}))}),window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",e=>{localStorage.getItem("theme")||a(e.matches?"dark":"light")})}n();document.addEventListener("astro:after-swap",n);</script> <a href="https://github.com/jimeh/common-flow" target="_blank" rel="noopener noreferrer" class="p-2 rounded-lg transition-colors
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-gray-100 dark:hover:bg-slate-800" aria-label="View on GitHub"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path> </svg> </a> <!-- Mobile menu button --> <button id="mobile-menu-btn" class="md:hidden p-2 rounded-lg
text-gray-500 dark:text-slate-500
hover:bg-gray-100 dark:hover:bg-slate-800" aria-label="Toggle menu"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation --> <nav id="mobile-nav" class="md:hidden hidden border-t border-gray-200 dark:border-slate-800"> <div class="px-4 py-3 space-y-1 text-center"> <div class="py-2 flex justify-center"> <div class="relative" data-version-selector> <!-- Trigger button --> <button type="button" data-version-trigger aria-haspopup="listbox" aria-expanded="false" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-slate-700
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800" aria-label="View on GitHub"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path> </svg> </a> <!-- Mobile menu button --> <button id="mobile-menu-btn" class="md:hidden p-2 rounded-lg
text-gray-500 dark:text-neutral-500
hover:bg-gray-100 dark:hover:bg-neutral-800" aria-label="Toggle menu"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path> </svg> </button> </div> </div> <!-- Mobile Navigation --> <nav id="mobile-nav" class="md:hidden hidden border-t border-gray-200 dark:border-neutral-800"> <div class="px-4 py-3 space-y-1 text-center"> <div class="py-2 flex justify-center"> <div class="relative" data-version-selector> <!-- Trigger button --> <button type="button" data-version-trigger aria-haspopup="listbox" aria-expanded="false" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-neutral-700
rounded-md bg-transparent cursor-pointer transition-colors
text-gray-600 dark:text-slate-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-slate-50"> <span>v1.0.0-rc.3</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-slate-900
border border-gray-200 dark:border-slate-700
text-gray-600 dark:text-neutral-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-neutral-50"> <span>v1.0.0-rc.3</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-neutral-900
border border-gray-200 dark:border-neutral-700
rounded-lg shadow-lg
opacity-0 invisible -translate-y-1 transition-all duration-150
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.1 </a> </div> </div> </div> <a href="#about" class="nav-link block py-2 text-gray-600 dark:text-slate-400
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.1 </a> </div> </div> </div> <a href="#about" class="nav-link block py-2 text-gray-600 dark:text-neutral-400
hover:text-sky-600" data-nav-link data-section-id="about">
About
</a> <a href="#spec" class="nav-link block py-2 text-gray-600 dark:text-slate-400
</a> <a href="#spec" class="nav-link block py-2 text-gray-600 dark:text-neutral-400
hover:text-sky-600" data-nav-link data-section-id="spec">
Spec
</a> <a href="#faq" class="nav-link block py-2 text-gray-600 dark:text-slate-400
</a> <a href="#faq" class="nav-link block py-2 text-gray-600 dark:text-neutral-400
hover:text-sky-600" data-nav-link data-section-id="faq">
FAQ
</a> </div> </nav> </header> <script type="module">function f(){const n=document.getElementById("site-header"),g=document.getElementById("hero"),o=document.getElementById("mobile-menu-btn"),s=document.getElementById("mobile-nav");if(!n||!g)return;const v=64;function c(){window.scrollY>=v?(n.classList.remove("translate-y-[-100%]"),n.classList.add("border-gray-200","dark:border-slate-800")):(n.classList.add("translate-y-[-100%]"),n.classList.remove("border-gray-200","dark:border-slate-800"))}window.addEventListener("scroll",c,{passive:!0}),c(),o&&s&&(o.addEventListener("click",()=>{s.classList.toggle("hidden")}),s.querySelectorAll("a").forEach(i=>{i.addEventListener("click",()=>{s.classList.add("hidden")})}));const r=document.querySelectorAll("[data-nav-link]"),l=[],u=new Set;r.forEach(i=>{const e=i.getAttribute("data-section-id");if(e&&!u.has(e)){u.add(e);const t=document.getElementById(e);t&&l.push({id:e,element:t})}});function m(){let e=null;for(const{id:t,element:d}of l)d.getBoundingClientRect().top<=100&&(e=t);r.forEach(t=>{const d=t.getAttribute("data-section-id");t.classList.toggle("active",d===e)})}let a=!1;window.addEventListener("scroll",()=>{a||(requestAnimationFrame(()=>{m(),a=!1}),a=!0)}),m()}f();document.addEventListener("astro:after-swap",f);</script> <main> <section id="hero" class="relative min-h-[75vh] flex flex-col items-center justify-center
</a> </div> </nav> </header> <script type="module">function f(){const n=document.getElementById("site-header"),g=document.getElementById("hero"),o=document.getElementById("mobile-menu-btn"),s=document.getElementById("mobile-nav");if(!n||!g)return;const v=64;function c(){window.scrollY>=v?(n.classList.remove("translate-y-[-100%]"),n.classList.add("border-gray-200","dark:border-neutral-800")):(n.classList.add("translate-y-[-100%]"),n.classList.remove("border-gray-200","dark:border-neutral-800"))}window.addEventListener("scroll",c,{passive:!0}),c(),o&&s&&(o.addEventListener("click",()=>{s.classList.toggle("hidden")}),s.querySelectorAll("a").forEach(i=>{i.addEventListener("click",()=>{s.classList.add("hidden")})}));const r=document.querySelectorAll("[data-nav-link]"),l=[],u=new Set;r.forEach(i=>{const e=i.getAttribute("data-section-id");if(e&&!u.has(e)){u.add(e);const t=document.getElementById(e);t&&l.push({id:e,element:t})}});function m(){let e=null;for(const{id:t,element:d}of l)d.getBoundingClientRect().top<=100&&(e=t);r.forEach(t=>{const d=t.getAttribute("data-section-id");t.classList.toggle("active",d===e)})}let a=!1;window.addEventListener("scroll",()=>{a||(requestAnimationFrame(()=>{m(),a=!1}),a=!0)}),m()}f();document.addEventListener("astro:after-swap",f);</script> <main> <section id="hero" class="relative min-h-[75vh] flex flex-col items-center justify-center
px-6 py-16 overflow-hidden"> <!-- Background gradient/texture --> <div class="absolute inset-0 bg-gradient-to-b
from-gray-100 to-gray-50
dark:from-slate-900 dark:to-slate-950"></div> <!-- Subtle grid pattern --> <div class="absolute inset-0 opacity-[0.03] dark:opacity-[0.05]
dark:from-neutral-900 dark:to-neutral-950"></div> <!-- Subtle grid pattern --> <div class="absolute inset-0 opacity-[0.03] dark:opacity-[0.05]
bg-[linear-gradient(theme(colors.gray.950)_1px,transparent_1px),linear-gradient(90deg,theme(colors.gray.950)_1px,transparent_1px)]
dark:bg-[linear-gradient(theme(colors.slate.400)_1px,transparent_1px),linear-gradient(90deg,theme(colors.slate.400)_1px,transparent_1px)]
dark:bg-[linear-gradient(theme(colors.neutral.600)_1px,transparent_1px),linear-gradient(90deg,theme(colors.neutral.600)_1px,transparent_1px)]
bg-[size:60px_60px]"></div> <!-- Top bar with version & theme --> <div class="absolute top-0 inset-x-0 flex items-center justify-between
px-6 py-4 animate-fade-in-down"> <div class="flex items-center gap-3"> <div class="relative" data-version-selector> <!-- Trigger button --> <button type="button" data-version-trigger aria-haspopup="listbox" aria-expanded="false" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-slate-700
border border-gray-200 dark:border-neutral-700
rounded-md bg-transparent cursor-pointer transition-colors
text-gray-600 dark:text-slate-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-slate-50"> <span>v1.0.0-rc.3</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-slate-900
border border-gray-200 dark:border-slate-700
text-gray-600 dark:text-neutral-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-neutral-50"> <span>v1.0.0-rc.3</span> <svg data-arrow-icon class="w-3.5 h-3.5 transition-transform duration-150" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path> </svg> </button> <!-- Dropdown menu --> <div data-version-dropdown role="listbox" aria-label="Select version" class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-neutral-900
border border-gray-200 dark:border-neutral-700
rounded-lg shadow-lg
opacity-0 invisible -translate-y-1 transition-all duration-150
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-slate-400 hover:bg-gray-100 dark:hover:bg-slate-800 hover:text-gray-950 dark:hover:text-slate-50">
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"> <a href="/spec/1.0.0-rc.5" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.5 </a><a href="/spec/1.0.0-rc.4" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.4 </a><a href="/spec/1.0.0-rc.3" role="option" aria-selected="true" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50 bg-sky-500/15 dark:bg-sky-500/20 text-sky-600 dark:text-sky-400">
v1.0.0-rc.3 </a><a href="/spec/1.0.0-rc.2" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.2 </a><a href="/spec/1.0.0-rc.1" role="option" aria-selected="false" class="block px-3 py-2 font-mono text-sm rounded transition-colors text-gray-600 dark:text-neutral-400 hover:bg-gray-100 dark:hover:bg-neutral-800 hover:text-gray-950 dark:hover:text-neutral-50">
v1.0.0-rc.1 </a> </div> </div> </div> <div class="flex items-center gap-2"> <button data-theme-toggle type="button" class="p-2 rounded-lg transition-colors duration-200
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-gray-100 dark:hover:bg-slate-800" aria-label="Toggle dark mode"> <!-- Sun icon (shown in dark mode) --> <svg data-sun-icon class="hidden w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800" aria-label="Toggle dark mode"> <!-- Sun icon (shown in dark mode) --> <svg data-sun-icon class="hidden w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343
6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16
12a4 4 0 11-8 0 4 4 0 018 0z"></path> </svg> <!-- Moon icon (shown in light mode) --> <svg data-moon-icon class="w-5 h-5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003
9.003 0 008.354-5.646z"></path> </svg> </button> <a href="https://github.com/jimeh/common-flow" target="_blank" rel="noopener noreferrer" class="p-2 rounded-lg transition-colors
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-white/50 dark:hover:bg-slate-800/50" aria-label="View on GitHub"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path> </svg> </a> </div> </div> <!-- Main content --> <div class="relative z-10 w-full max-w-4xl mx-auto text-center"> <!-- Title --> <h1 class="animate-fade-in-up mb-4
text-gray-950 dark:text-slate-50">
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-white/50 dark:hover:bg-neutral-800/50" aria-label="View on GitHub"> <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"> <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path> </svg> </a> </div> </div> <!-- Main content --> <div class="relative z-10 w-full max-w-4xl mx-auto text-center"> <!-- Title --> <h1 class="animate-fade-in-up mb-4
text-gray-950 dark:text-neutral-50">
Git Common-Flow
</h1> <!-- Tagline --> <p class="animate-fade-in-up delay-100
text-lg sm:text-xl max-w-2xl mx-auto mb-8
text-gray-600 dark:text-slate-400">
text-gray-600 dark:text-neutral-400">
A sensible git workflow for teams who ship
</p> <!-- Version badge --> <div class="animate-fade-in-up delay-200 mb-10"> <span class="inline-flex items-center px-3 py-1 font-mono text-xs font-medium
rounded-full border
bg-gray-100 border-gray-200 text-gray-500
dark:bg-slate-800/50 dark:border-slate-700 dark:text-slate-400">
dark:bg-neutral-800/50 dark:border-neutral-700 dark:text-neutral-400">
v1.0.0-rc.3 </span> </div> <!-- SVG Diagram --> <div class="animate-fade-in-up delay-300
relative mx-auto mb-12 p-4 sm:p-8
bg-white dark:bg-slate-900
bg-white dark:bg-neutral-900
rounded-2xl shadow-lg dark:shadow-none
border border-gray-200 dark:border-slate-800"> <img src="/spec/1.0.0-rc.3.svg" alt="Git Common-Flow diagram" class="w-full h-auto max-w-3xl mx-auto
border border-gray-200 dark:border-neutral-800"> <img src="/spec/1.0.0-rc.3.svg" alt="Git Common-Flow diagram" class="w-full h-auto max-w-3xl mx-auto
dark:invert dark:hue-rotate-180 dark:contrast-90"> </div> <!-- Navigation links --> <nav class="animate-fade-in-up delay-400
flex flex-wrap items-center justify-center gap-4"> <a href="#about" class="inline-flex items-center justify-center gap-2 px-5 py-2.5
text-sm font-medium rounded-lg transition-all cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50">
About
</a> <a href="#spec" class="inline-flex items-center justify-center gap-2 px-5 py-2.5
text-sm font-medium rounded-lg transition-all cursor-pointer
@@ -140,18 +140,18 @@ About
Read the Spec
</a> <a href="#faq" class="inline-flex items-center justify-center gap-2 px-5 py-2.5
text-sm font-medium rounded-lg transition-all cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50">
dark:hover:bg-neutral-800 dark:hover:text-neutral-50">
FAQ
</a> </nav> </div> <!-- Scroll indicator --> <a href="#about" class="absolute bottom-8 left-1/2 -translate-x-1/2
animate-fade-in delay-700
text-gray-500 dark:text-slate-500
hover:text-sky-600 transition-colors" aria-label="Scroll to content"> <svg class="w-6 h-6 animate-bounce-subtle" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3"></path> </svg> </a> </section> <section id="about" class="py-20 sm:py-28"> <div class="section-container"> <div class="max-w-3xl mx-auto"> <!-- Section header --> <div class="mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">About Common-Flow</h2> <p class="text-lg text-gray-600 dark:text-slate-400">
text-gray-500 dark:text-neutral-500
hover:text-sky-600 transition-colors" aria-label="Scroll to content"> <svg class="w-6 h-6 animate-bounce-subtle" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 14l-7 7m0 0l-7-7m7 7V3"></path> </svg> </a> </section> <section id="about" class="py-20 sm:py-28"> <div class="section-container"> <div class="max-w-3xl mx-auto"> <!-- Section header --> <div class="mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">About Common-Flow</h2> <p class="text-lg text-gray-600 dark:text-neutral-400">
A practical git workflow that combines the best of GitHub Flow with
versioned releases
</p> </div> <!-- Introduction --> <div class="prose-spec mb-12"></div> <!-- Summary as feature cards --> <div class="mb-16"> <h3 class="text-xl font-display font-semibold mb-6
text-gray-950 dark:text-slate-50">
text-gray-950 dark:text-neutral-50">
Key Principles
</h3> <div class="prose-spec"><p>Common-Flow is an attempt to gather a sensible selection of the most common
usage patterns of git into a single and concise specification. It is based on
@@ -160,32 +160,32 @@ of <a href="https://guides.github.com/introduction/flow/">GitHub Flow</a>, while
into account how a lot of open source projects use git.</p>
<p>In short, Common-Flow is essentially GitHub Flow with the addition of versioned
releases, optional release branches, and without the requirement to deploy to
production all the time.</p></div> </div> <!-- Feedback & License --> <div class="pt-8 border-t border-gray-200 dark:border-slate-800"> <div class="grid sm:grid-cols-2 gap-8"> <div> <h4 class="text-sm font-semibold uppercase tracking-wider mb-3
text-gray-500 dark:text-slate-500">
production all the time.</p></div> </div> <!-- Feedback & License --> <div class="pt-8 border-t border-gray-200 dark:border-neutral-800"> <div class="grid sm:grid-cols-2 gap-8"> <div> <h4 class="text-sm font-semibold uppercase tracking-wider mb-3
text-gray-500 dark:text-neutral-500">
Feedback
</h4> <p class="text-gray-600 dark:text-slate-400">
</h4> <p class="text-gray-600 dark:text-neutral-400">
Please <a href="https://github.com/jimeh/common-flow/issues" class="text-sky-600 hover:text-sky-400" target="_blank" rel="noopener noreferrer">open an issue on GitHub</a>.
</p> </div> <div> <h4 class="text-sm font-semibold uppercase tracking-wider mb-3
text-gray-500 dark:text-slate-500">
text-gray-500 dark:text-neutral-500">
License
</h4> <div class="text-gray-600 dark:text-slate-400"><p><a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons - CC BY 3.0</a></p></div> </div> </div> </div> </div> </div> </section> <section id="spec" class="py-20 sm:py-28"> <div class="section-container"> <!-- Section header --> <div class="max-w-3xl mx-auto mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">The Specification</h2> <p class="text-lg text-gray-600 dark:text-slate-400">
</h4> <div class="text-gray-600 dark:text-neutral-400"><p><a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons - CC BY 3.0</a></p></div> </div> </div> </div> </div> </div> </section> <section id="spec" class="py-20 sm:py-28"> <div class="section-container"> <!-- Section header --> <div class="max-w-3xl mx-auto mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">The Specification</h2> <p class="text-lg text-gray-600 dark:text-neutral-400">
The complete Git Common-Flow specification
</p> </div> <!-- Content with sidebar --> <div class="lg:flex lg:gap-8"> <!-- Sidebar --> <div class="lg:w-64 lg:flex-shrink-0"> <aside id="spec-sidebar" class="hidden lg:block lg:sticky lg:top-24 lg:self-start
lg:max-h-[calc(100vh-8rem)] lg:overflow-y-auto
lg:pr-8 lg:mr-8 lg:border-r border-gray-200 dark:border-slate-800"> <nav class="space-y-1 py-2"> <div class="text-xs font-semibold uppercase tracking-wider mb-4
text-gray-500 dark:text-slate-500">
lg:pr-8 lg:mr-8 lg:border-r border-gray-200 dark:border-neutral-800"> <nav class="space-y-1 py-2"> <div class="text-xs font-semibold uppercase tracking-wider mb-4
text-gray-500 dark:text-neutral-500">
Table of Contents
</div> <a href="#terminology" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800" data-sidebar-link data-section-id="terminology"> Terminology </a><a href="#specification" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800" data-sidebar-link data-section-id="specification"> Specification </a><a href="#spec-tldr" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-tldr"> TL;DR </a><a href="#spec-the-master-branch" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-the-master-branch"> The Master Branch </a><a href="#spec-change-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-change-branches"> Change Branches </a><a href="#spec-pull-requests" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-pull-requests"> Pull Requests </a><a href="#spec-versioning" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-versioning"> Versioning </a><a href="#spec-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-releases"> Releases </a><a href="#spec-release-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-release-branches"> Release Branches </a><a href="#spec-bug-fixes-rollback" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-bug-fixes-rollback"> Bug Fixes &amp; Rollback </a><a href="#spec-git-best-practices" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-git-best-practices"> Git Best Practices </a> </nav> </aside> <!-- Mobile floating button --> <button id="spec-toc-toggle" class="lg:hidden fixed bottom-6 right-6 z-40
</div> <a href="#terminology" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800" data-sidebar-link data-section-id="terminology"> Terminology </a><a href="#specification" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800" data-sidebar-link data-section-id="specification"> Specification </a><a href="#spec-tldr" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-tldr"> TL;DR </a><a href="#spec-the-master-branch" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-the-master-branch"> The Master Branch </a><a href="#spec-change-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-change-branches"> Change Branches </a><a href="#spec-pull-requests" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-pull-requests"> Pull Requests </a><a href="#spec-versioning" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-versioning"> Versioning </a><a href="#spec-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-releases"> Releases </a><a href="#spec-release-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-release-branches"> Release Branches </a><a href="#spec-bug-fixes-rollback" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-bug-fixes-rollback"> Bug Fixes &amp; Rollback </a><a href="#spec-git-best-practices" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-sidebar-link data-section-id="spec-git-best-practices"> Git Best Practices </a> </nav> </aside> <!-- Mobile floating button --> <button id="spec-toc-toggle" class="lg:hidden fixed bottom-6 right-6 z-40
w-12 h-12 rounded-full shadow-lg
bg-sky-600 text-white
flex items-center justify-center
hover:bg-sky-500
transition-all duration-200" aria-label="Jump to section"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h7"></path> </svg> </button> <!-- Mobile TOC drawer --> <div id="spec-toc-drawer" class="lg:hidden fixed inset-0 z-50 hidden" data-toc-drawer> <!-- Backdrop --> <div class="absolute inset-0 bg-black/50" data-toc-backdrop></div> <!-- Drawer --> <div class="absolute bottom-0 inset-x-0 max-h-[70vh] overflow-y-auto
bg-gray-50 dark:bg-slate-950
bg-gray-50 dark:bg-neutral-950
rounded-t-2xl shadow-xl p-6"> <div class="flex items-center justify-between mb-4"> <span class="text-sm font-semibold uppercase tracking-wider
text-gray-500 dark:text-slate-500">
text-gray-500 dark:text-neutral-500">
Jump to Section
</span> <button class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-slate-800" data-toc-close aria-label="Close"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path> </svg> </button> </div> <nav class="space-y-1"> <a href="#terminology" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800" data-toc-link> Terminology </a><a href="#specification" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800" data-toc-link> Specification </a><a href="#spec-tldr" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> TL;DR </a><a href="#spec-the-master-branch" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> The Master Branch </a><a href="#spec-change-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Change Branches </a><a href="#spec-pull-requests" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Pull Requests </a><a href="#spec-versioning" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Versioning </a><a href="#spec-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Releases </a><a href="#spec-release-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Release Branches </a><a href="#spec-bug-fixes-rollback" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Bug Fixes &amp; Rollback </a><a href="#spec-git-best-practices" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800 pl-6 text-[0.8125rem]" data-toc-link> Git Best Practices </a> </nav> </div> </div> <script type="module">function u(){const a=document.querySelectorAll("[data-sidebar-link]"),o=[];a.forEach(n=>{const e=n.getAttribute("data-section-id");if(e){const t=document.getElementById(e);t&&o.push({id:e,element:t})}});function l(){let e=o[0]?.id;for(const{id:t,element:r}of o)r.getBoundingClientRect().top<=100&&(e=t);a.forEach(t=>{const r=t.getAttribute("data-section-id");t.classList.toggle("active",r===e)})}let s=!1;window.addEventListener("scroll",()=>{s||(requestAnimationFrame(()=>{l(),s=!1}),s=!0)}),l();const d=document.getElementById("spec-toc-toggle"),c=document.getElementById("spec-toc-drawer"),g=c?.querySelector("[data-toc-backdrop]"),m=c?.querySelector("[data-toc-close]"),v=c?.querySelectorAll("[data-toc-link]");function p(){c?.classList.remove("hidden"),document.body.style.overflow="hidden"}function i(){c?.classList.add("hidden"),document.body.style.overflow=""}d?.addEventListener("click",p),g?.addEventListener("click",i),m?.addEventListener("click",i),v?.forEach(n=>{n.addEventListener("click",i)});const f=document.getElementById("spec");f&&d&&new IntersectionObserver(([e])=>{d.classList.toggle("hidden",!e.isIntersecting)},{threshold:0}).observe(f)}u();document.addEventListener("astro:after-swap",u);</script> </div> <!-- Main content --> <div class="flex-1 min-w-0"> <article class="prose-spec"> <!-- Terminology --> <section id="terminology"> <h2>Terminology</h2> <ul>
</span> <button class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-neutral-800" data-toc-close aria-label="Close"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path> </svg> </button> </div> <nav class="space-y-1"> <a href="#terminology" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800" data-toc-link> Terminology </a><a href="#specification" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800" data-toc-link> Specification </a><a href="#spec-tldr" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> TL;DR </a><a href="#spec-the-master-branch" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> The Master Branch </a><a href="#spec-change-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Change Branches </a><a href="#spec-pull-requests" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Pull Requests </a><a href="#spec-versioning" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Versioning </a><a href="#spec-releases" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Releases </a><a href="#spec-release-branches" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Release Branches </a><a href="#spec-bug-fixes-rollback" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Bug Fixes &amp; Rollback </a><a href="#spec-git-best-practices" class="sidebar-link block py-2 px-4 text-sm rounded-md transition-colors text-gray-500 hover:text-gray-950 hover:bg-gray-100 dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800 pl-6 text-[0.8125rem]" data-toc-link> Git Best Practices </a> </nav> </div> </div> <script type="module">function u(){const a=document.querySelectorAll("[data-sidebar-link]"),o=[];a.forEach(n=>{const e=n.getAttribute("data-section-id");if(e){const t=document.getElementById(e);t&&o.push({id:e,element:t})}});function l(){let e=o[0]?.id;for(const{id:t,element:r}of o)r.getBoundingClientRect().top<=100&&(e=t);a.forEach(t=>{const r=t.getAttribute("data-section-id");t.classList.toggle("active",r===e)})}let s=!1;window.addEventListener("scroll",()=>{s||(requestAnimationFrame(()=>{l(),s=!1}),s=!0)}),l();const d=document.getElementById("spec-toc-toggle"),c=document.getElementById("spec-toc-drawer"),g=c?.querySelector("[data-toc-backdrop]"),m=c?.querySelector("[data-toc-close]"),v=c?.querySelectorAll("[data-toc-link]");function p(){c?.classList.remove("hidden"),document.body.style.overflow="hidden"}function i(){c?.classList.add("hidden"),document.body.style.overflow=""}d?.addEventListener("click",p),g?.addEventListener("click",i),m?.addEventListener("click",i),v?.forEach(n=>{n.addEventListener("click",i)});const f=document.getElementById("spec");f&&d&&new IntersectionObserver(([e])=>{d.classList.toggle("hidden",!e.isIntersecting)},{threshold:0}).observe(f)}u();document.addEventListener("astro:after-swap",u);</script> </div> <!-- Main content --> <div class="flex-1 min-w-0"> <article class="prose-spec"> <!-- Terminology --> <section id="terminology"> <h2>Terminology</h2> <ul>
<li><strong>Master Branch</strong> - Must be named "master", must always have passing tests,
and is not guaranteed to always work in production environments.</li>
<li><strong>Change Branches</strong> - Any branch that introduces changes like a new feature, a
@@ -390,9 +390,9 @@ and creates a merge commit to mark the integration of the branch with
master.</li>
</ol>
</li>
</ol> </section> </article> </div> </div> </div> </section> <section id="faq" class="py-20 sm:py-28"> <div class="section-container"> <div class="max-w-3xl mx-auto"> <!-- Section header --> <div class="mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">FAQ</h2> <p class="text-lg text-gray-600 dark:text-slate-400">
</ol> </section> </article> </div> </div> </div> </section> <section id="faq" class="py-20 sm:py-28"> <div class="section-container"> <div class="max-w-3xl mx-auto"> <!-- Section header --> <div class="mb-12 text-center"> <h2 class="text-3xl sm:text-4xl mb-4">FAQ</h2> <p class="text-lg text-gray-600 dark:text-neutral-400">
Common questions about Git Common-Flow
</p> </div> <!-- FAQ Items --> <div class="space-y-0"> </div> </div> </div> </section> <script type="module">function n(){document.querySelectorAll("[data-faq-item]").forEach(r=>{const t=r.querySelector("[data-faq-trigger]"),a=r.querySelector("[data-faq-content]"),s=r.querySelector("[data-faq-icon]");!t||!a||!s||t.addEventListener("click",()=>{const e=t.getAttribute("aria-expanded")==="true";t.setAttribute("aria-expanded",e?"false":"true"),a.classList.toggle("grid-rows-[1fr]",!e),a.classList.toggle("grid-rows-[0fr]",e),s.classList.toggle("rotate-180",!e)})})}n();document.addEventListener("astro:after-swap",n);</script> </main> <footer class="py-8 text-center text-sm
text-gray-500 dark:text-slate-500
border-t border-gray-200 dark:border-slate-800"> <div class="section-container"> <p> Git Common-Flow is authored by
text-gray-500 dark:text-neutral-500
border-t border-gray-200 dark:border-neutral-800"> <div class="section-container"> <p> Git Common-Flow is authored by
<a href="https://jimeh.me/" class="hover:text-sky-600" target="_blank" rel="noopener noreferrer"> Jim Myhrberg </a> </p> <p class="mt-2"> <a href="https://creativecommons.org/licenses/by/4.0/" class="hover:text-sky-600" target="_blank" rel="noopener noreferrer"> CC BY 4.0 </a> </p> </div> </footer> <!-- Re-init theme on Astro page transitions --> <script type="module">document.addEventListener("astro:after-swap",()=>{const e=localStorage.getItem("theme");e==="dark"||!e&&window.matchMedia("(prefers-color-scheme: dark)").matches?document.documentElement.classList.add("dark"):document.documentElement.classList.remove("dark")});</script> </body> </html>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -16,7 +16,7 @@ const { introduction, summary, license } = Astro.props;
<!-- Section header -->
<div class="mb-12 text-center">
<h2 class="text-3xl sm:text-4xl mb-4">About Common-Flow</h2>
<p class="text-lg text-gray-600 dark:text-slate-400">
<p class="text-lg text-gray-600 dark:text-neutral-400">
A practical git workflow that combines the best of GitHub Flow with
versioned releases
</p>
@@ -29,7 +29,7 @@ const { introduction, summary, license } = Astro.props;
<div class="mb-16">
<h3
class="text-xl font-display font-semibold mb-6
text-gray-950 dark:text-slate-50"
text-gray-950 dark:text-neutral-50"
>
Key Principles
</h3>
@@ -37,16 +37,16 @@ const { introduction, summary, license } = Astro.props;
</div>
<!-- Feedback & License -->
<div class="pt-8 border-t border-gray-200 dark:border-slate-800">
<div class="pt-8 border-t border-gray-200 dark:border-neutral-800">
<div class="grid sm:grid-cols-2 gap-8">
<div>
<h4
class="text-sm font-semibold uppercase tracking-wider mb-3
text-gray-500 dark:text-slate-500"
text-gray-500 dark:text-neutral-500"
>
Feedback
</h4>
<p class="text-gray-600 dark:text-slate-400">
<p class="text-gray-600 dark:text-neutral-400">
Please{" "}
<a
href={`${config.repoUrl}/issues`}
@@ -59,11 +59,11 @@ const { introduction, summary, license } = Astro.props;
<div>
<h4
class="text-sm font-semibold uppercase tracking-wider mb-3
text-gray-500 dark:text-slate-500"
text-gray-500 dark:text-neutral-500"
>
License
</h4>
<div class="text-gray-600 dark:text-slate-400" set:html={license} />
<div class="text-gray-600 dark:text-neutral-400" set:html={license} />
</div>
</div>
</div>

View File

@@ -14,7 +14,7 @@ const { items } = Astro.props;
<!-- Section header -->
<div class="mb-12 text-center">
<h2 class="text-3xl sm:text-4xl mb-4">FAQ</h2>
<p class="text-lg text-gray-600 dark:text-slate-400">
<p class="text-lg text-gray-600 dark:text-neutral-400">
Common questions about Git Common-Flow
</p>
</div>
@@ -24,14 +24,14 @@ const { items } = Astro.props;
{
items.map((item, index) => (
<div
class="border-b border-gray-200 dark:border-slate-800"
class="border-b border-gray-200 dark:border-neutral-800"
data-faq-item
>
<button
class="flex justify-between items-center w-full py-6 text-left
font-display text-lg font-semibold cursor-pointer
transition-colors
text-gray-950 dark:text-slate-50
text-gray-950 dark:text-neutral-50
hover:text-sky-600"
aria-expanded="false"
data-faq-trigger
@@ -58,7 +58,7 @@ const { items } = Astro.props;
>
<div class="overflow-hidden">
<div
class="pb-6 text-gray-600 dark:text-slate-400 prose-spec"
class="pb-6 text-gray-600 dark:text-neutral-400 prose-spec"
set:html={item.answer}
/>
</div>

View File

@@ -4,8 +4,8 @@ import { config } from "../config";
<footer
class="py-8 text-center text-sm
text-gray-500 dark:text-slate-500
border-t border-gray-200 dark:border-slate-800"
text-gray-500 dark:text-neutral-500
border-t border-gray-200 dark:border-neutral-800"
>
<div class="section-container">
<p>

View File

@@ -14,7 +14,7 @@ const { version } = Astro.props;
id="site-header"
class="fixed top-0 inset-x-0 z-50 border-b border-transparent
translate-y-[-100%] transition-transform duration-300
backdrop-blur-xl bg-gray-50/85 dark:bg-slate-950/85"
backdrop-blur-xl bg-gray-50/85 dark:bg-neutral-950/85"
>
<div
class="max-w-6xl mx-auto px-4 sm:px-6 h-16 flex items-center justify-between"
@@ -24,7 +24,7 @@ const { version } = Astro.props;
<a
href="#hero"
class="flex items-center gap-3 no-underline
text-gray-950 dark:text-slate-50
text-gray-950 dark:text-neutral-50
hover:text-sky-600 transition-colors"
>
<span class="font-display font-bold text-lg tracking-tight">
@@ -45,9 +45,9 @@ const { version } = Astro.props;
href="#about"
class="nav-link inline-flex items-center px-4 py-2 text-sm font-medium
rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50"
dark:hover:bg-neutral-800 dark:hover:text-neutral-50"
data-nav-link
data-section-id="about"
>
@@ -57,9 +57,9 @@ const { version } = Astro.props;
href="#spec"
class="nav-link inline-flex items-center px-4 py-2 text-sm font-medium
rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50"
dark:hover:bg-neutral-800 dark:hover:text-neutral-50"
data-nav-link
data-section-id="spec"
>
@@ -69,9 +69,9 @@ const { version } = Astro.props;
href="#faq"
class="nav-link inline-flex items-center px-4 py-2 text-sm font-medium
rounded-lg transition-colors cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50"
dark:hover:bg-neutral-800 dark:hover:text-neutral-50"
data-nav-link
data-section-id="faq"
>
@@ -88,9 +88,9 @@ const { version } = Astro.props;
target="_blank"
rel="noopener noreferrer"
class="p-2 rounded-lg transition-colors
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-gray-100 dark:hover:bg-slate-800"
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800"
aria-label="View on GitHub"
>
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
@@ -105,8 +105,8 @@ const { version } = Astro.props;
<button
id="mobile-menu-btn"
class="md:hidden p-2 rounded-lg
text-gray-500 dark:text-slate-500
hover:bg-gray-100 dark:hover:bg-slate-800"
text-gray-500 dark:text-neutral-500
hover:bg-gray-100 dark:hover:bg-neutral-800"
aria-label="Toggle menu"
>
<svg
@@ -128,7 +128,7 @@ const { version } = Astro.props;
<!-- Mobile Navigation -->
<nav
id="mobile-nav"
class="md:hidden hidden border-t border-gray-200 dark:border-slate-800"
class="md:hidden hidden border-t border-gray-200 dark:border-neutral-800"
>
<div class="px-4 py-3 space-y-1 text-center">
<div class="py-2 flex justify-center">
@@ -139,7 +139,7 @@ const { version } = Astro.props;
</div>
<a
href="#about"
class="nav-link block py-2 text-gray-600 dark:text-slate-400
class="nav-link block py-2 text-gray-600 dark:text-neutral-400
hover:text-sky-600"
data-nav-link
data-section-id="about"
@@ -148,7 +148,7 @@ const { version } = Astro.props;
</a>
<a
href="#spec"
class="nav-link block py-2 text-gray-600 dark:text-slate-400
class="nav-link block py-2 text-gray-600 dark:text-neutral-400
hover:text-sky-600"
data-nav-link
data-section-id="spec"
@@ -157,7 +157,7 @@ const { version } = Astro.props;
</a>
<a
href="#faq"
class="nav-link block py-2 text-gray-600 dark:text-slate-400
class="nav-link block py-2 text-gray-600 dark:text-neutral-400
hover:text-sky-600"
data-nav-link
data-section-id="faq"
@@ -184,10 +184,10 @@ const { version } = Astro.props;
function updateHeaderVisibility() {
if (window.scrollY >= navbarHeight) {
header.classList.remove("translate-y-[-100%]");
header.classList.add("border-gray-200", "dark:border-slate-800");
header.classList.add("border-gray-200", "dark:border-neutral-800");
} else {
header.classList.add("translate-y-[-100%]");
header.classList.remove("border-gray-200", "dark:border-slate-800");
header.classList.remove("border-gray-200", "dark:border-neutral-800");
}
}

View File

@@ -20,7 +20,7 @@ const { version, svgPath } = Astro.props;
<div
class="absolute inset-0 bg-gradient-to-b
from-gray-100 to-gray-50
dark:from-slate-900 dark:to-slate-950"
dark:from-neutral-900 dark:to-neutral-950"
>
</div>
@@ -28,7 +28,7 @@ const { version, svgPath } = Astro.props;
<div
class="absolute inset-0 opacity-[0.03] dark:opacity-[0.05]
bg-[linear-gradient(theme(colors.gray.950)_1px,transparent_1px),linear-gradient(90deg,theme(colors.gray.950)_1px,transparent_1px)]
dark:bg-[linear-gradient(theme(colors.slate.400)_1px,transparent_1px),linear-gradient(90deg,theme(colors.slate.400)_1px,transparent_1px)]
dark:bg-[linear-gradient(theme(colors.neutral.600)_1px,transparent_1px),linear-gradient(90deg,theme(colors.neutral.600)_1px,transparent_1px)]
bg-[size:60px_60px]"
>
</div>
@@ -51,9 +51,9 @@ const { version, svgPath } = Astro.props;
target="_blank"
rel="noopener noreferrer"
class="p-2 rounded-lg transition-colors
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-white/50 dark:hover:bg-slate-800/50"
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-white/50 dark:hover:bg-neutral-800/50"
aria-label="View on GitHub"
>
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24">
@@ -71,7 +71,7 @@ const { version, svgPath } = Astro.props;
<!-- Title -->
<h1
class="animate-fade-in-up mb-4
text-gray-950 dark:text-slate-50"
text-gray-950 dark:text-neutral-50"
>
Git Common-Flow
</h1>
@@ -80,7 +80,7 @@ const { version, svgPath } = Astro.props;
<p
class="animate-fade-in-up delay-100
text-lg sm:text-xl max-w-2xl mx-auto mb-8
text-gray-600 dark:text-slate-400"
text-gray-600 dark:text-neutral-400"
>
A sensible git workflow for teams who ship
</p>
@@ -91,7 +91,7 @@ const { version, svgPath } = Astro.props;
class="inline-flex items-center px-3 py-1 font-mono text-xs font-medium
rounded-full border
bg-gray-100 border-gray-200 text-gray-500
dark:bg-slate-800/50 dark:border-slate-700 dark:text-slate-400"
dark:bg-neutral-800/50 dark:border-neutral-700 dark:text-neutral-400"
>
v{version}
</span>
@@ -101,9 +101,9 @@ const { version, svgPath } = Astro.props;
<div
class="animate-fade-in-up delay-300
relative mx-auto mb-12 p-4 sm:p-8
bg-white dark:bg-slate-900
bg-white dark:bg-neutral-900
rounded-2xl shadow-lg dark:shadow-none
border border-gray-200 dark:border-slate-800"
border border-gray-200 dark:border-neutral-800"
>
<img
src={svgPath}
@@ -122,9 +122,9 @@ const { version, svgPath } = Astro.props;
href="#about"
class="inline-flex items-center justify-center gap-2 px-5 py-2.5
text-sm font-medium rounded-lg transition-all cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50"
dark:hover:bg-neutral-800 dark:hover:text-neutral-50"
>
About
</a>
@@ -141,9 +141,9 @@ const { version, svgPath } = Astro.props;
href="#faq"
class="inline-flex items-center justify-center gap-2 px-5 py-2.5
text-sm font-medium rounded-lg transition-all cursor-pointer
text-gray-600 dark:text-slate-400
text-gray-600 dark:text-neutral-400
hover:bg-gray-100 hover:text-gray-950
dark:hover:bg-slate-800 dark:hover:text-slate-50"
dark:hover:bg-neutral-800 dark:hover:text-neutral-50"
>
FAQ
</a>
@@ -155,7 +155,7 @@ const { version, svgPath } = Astro.props;
href="#about"
class="absolute bottom-8 left-1/2 -translate-x-1/2
animate-fade-in delay-700
text-gray-500 dark:text-slate-500
text-gray-500 dark:text-neutral-500
hover:text-sky-600 transition-colors"
aria-label="Scroll to content"
>

View File

@@ -17,7 +17,7 @@ const { terminology, terminologyTitle, specification, tocItems } = Astro.props;
<!-- Section header -->
<div class="max-w-3xl mx-auto mb-12 text-center">
<h2 class="text-3xl sm:text-4xl mb-4">The Specification</h2>
<p class="text-lg text-gray-600 dark:text-slate-400">
<p class="text-lg text-gray-600 dark:text-neutral-400">
The complete Git Common-Flow specification
</p>
</div>

View File

@@ -12,12 +12,12 @@ const { items } = Astro.props;
id="spec-sidebar"
class="hidden lg:block lg:sticky lg:top-24 lg:self-start
lg:max-h-[calc(100vh-8rem)] lg:overflow-y-auto
lg:pr-8 lg:mr-8 lg:border-r border-gray-200 dark:border-slate-800"
lg:pr-8 lg:mr-8 lg:border-r border-gray-200 dark:border-neutral-800"
>
<nav class="space-y-1 py-2">
<div
class="text-xs font-semibold uppercase tracking-wider mb-4
text-gray-500 dark:text-slate-500"
text-gray-500 dark:text-neutral-500"
>
Table of Contents
</div>
@@ -29,7 +29,7 @@ const { items } = Astro.props;
"sidebar-link block py-2 px-4 text-sm rounded-md",
"transition-colors",
"text-gray-500 hover:text-gray-950 hover:bg-gray-100",
"dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800",
"dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800",
item.level === 3 && "pl-6 text-[0.8125rem]",
]}
data-sidebar-link
@@ -74,18 +74,18 @@ const { items } = Astro.props;
<!-- Drawer -->
<div
class="absolute bottom-0 inset-x-0 max-h-[70vh] overflow-y-auto
bg-gray-50 dark:bg-slate-950
bg-gray-50 dark:bg-neutral-950
rounded-t-2xl shadow-xl p-6"
>
<div class="flex items-center justify-between mb-4">
<span
class="text-sm font-semibold uppercase tracking-wider
text-gray-500 dark:text-slate-500"
text-gray-500 dark:text-neutral-500"
>
Jump to Section
</span>
<button
class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-slate-800"
class="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-neutral-800"
data-toc-close
aria-label="Close"
>
@@ -113,7 +113,7 @@ const { items } = Astro.props;
"sidebar-link block py-2 px-4 text-sm rounded-md",
"transition-colors",
"text-gray-500 hover:text-gray-950 hover:bg-gray-100",
"dark:text-slate-500 dark:hover:text-slate-50 dark:hover:bg-slate-800",
"dark:text-neutral-500 dark:hover:text-neutral-50 dark:hover:bg-neutral-800",
item.level === 3 && "pl-6 text-[0.8125rem]",
]}
data-toc-link

View File

@@ -6,9 +6,9 @@
data-theme-toggle
type="button"
class="p-2 rounded-lg transition-colors duration-200
text-gray-500 dark:text-slate-500
hover:text-gray-950 dark:hover:text-slate-50
hover:bg-gray-100 dark:hover:bg-slate-800"
text-gray-500 dark:text-neutral-500
hover:text-gray-950 dark:hover:text-neutral-50
hover:bg-gray-100 dark:hover:bg-neutral-800"
aria-label="Toggle dark mode"
>
<!-- Sun icon (shown in dark mode) -->

View File

@@ -15,10 +15,10 @@ const { currentVersion, versions } = Astro.props;
aria-haspopup="listbox"
aria-expanded="false"
class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm font-mono
border border-gray-200 dark:border-slate-700
border border-gray-200 dark:border-neutral-700
rounded-md bg-transparent cursor-pointer transition-colors
text-gray-600 dark:text-slate-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-slate-50"
text-gray-600 dark:text-neutral-400
hover:border-sky-600 hover:text-gray-950 dark:hover:text-neutral-50"
>
<span>v{currentVersion}</span>
<svg
@@ -42,8 +42,8 @@ const { currentVersion, versions } = Astro.props;
role="listbox"
aria-label="Select version"
class="absolute top-full left-0 mt-2 min-w-full p-1.5 z-50
bg-gray-50 dark:bg-slate-900
border border-gray-200 dark:border-slate-700
bg-gray-50 dark:bg-neutral-900
border border-gray-200 dark:border-neutral-700
rounded-lg shadow-lg
opacity-0 invisible -translate-y-1 transition-all duration-150
data-[open]:opacity-100 data-[open]:visible data-[open]:translate-y-0"
@@ -56,9 +56,9 @@ const { currentVersion, versions } = Astro.props;
aria-selected={v === currentVersion}
class:list={[
"block px-3 py-2 font-mono text-sm rounded transition-colors",
"text-gray-600 dark:text-slate-400",
"hover:bg-gray-100 dark:hover:bg-slate-800",
"hover:text-gray-950 dark:hover:text-slate-50",
"text-gray-600 dark:text-neutral-400",
"hover:bg-gray-100 dark:hover:bg-neutral-800",
"hover:text-gray-950 dark:hover:text-neutral-50",
v === currentVersion && [
"bg-sky-500/15 dark:bg-sky-500/20",
"text-sky-600 dark:text-sky-400",

View File

@@ -6,14 +6,14 @@ import Default from "../layouts/Default.astro";
<div class="text-center">
<h1
class="text-[8rem] sm:text-[12rem] font-display font-bold leading-none
text-gray-300 dark:text-slate-700"
text-gray-300 dark:text-neutral-700"
>
404
</h1>
<p class="text-xl mb-2 text-gray-600 dark:text-slate-400">
<p class="text-xl mb-2 text-gray-600 dark:text-neutral-400">
Page not found
</p>
<p class="text-gray-500 dark:text-slate-500">
<p class="text-gray-500 dark:text-neutral-500">
The page you're looking for doesn't exist.
</p>
<a

View File

@@ -62,8 +62,8 @@ html {
}
.dark body {
background-color: theme(colors.slate.950);
color: theme(colors.slate.50);
background-color: theme(colors.neutral.950);
color: theme(colors.neutral.50);
}
/* Typography */
@@ -86,7 +86,7 @@ html {
.dark h4,
.dark h5,
.dark h6 {
color: theme(colors.slate.50);
color: theme(colors.neutral.50);
}
h1 {
@@ -133,7 +133,7 @@ html {
}
.dark code {
background-color: rgba(148, 163, 184, 0.15);
background-color: rgba(163, 163, 163, 0.15);
}
pre {
@@ -146,7 +146,7 @@ html {
}
.dark pre {
background-color: theme(colors.slate.900);
background-color: theme(colors.neutral.900);
}
pre>code {
@@ -196,7 +196,7 @@ html {
}
.dark blockquote {
color: theme(colors.slate.400);
color: theme(colors.neutral.400);
}
/* Strong text */
@@ -352,7 +352,7 @@ html {
}
.dark .prose-spec h2 {
border-bottom-color: theme(colors.slate.800);
border-bottom-color: theme(colors.neutral.800);
}
.prose-spec h2:first-child {
@@ -368,7 +368,7 @@ html {
}
.dark .prose-spec h3 {
color: theme(colors.slate.400);
color: theme(colors.neutral.400);
}
.prose-spec p {
@@ -376,7 +376,7 @@ html {
}
.dark .prose-spec p {
color: theme(colors.slate.400);
color: theme(colors.neutral.400);
}
.prose-spec strong {
@@ -384,7 +384,7 @@ html {
}
.dark .prose-spec strong {
color: theme(colors.slate.50);
color: theme(colors.neutral.50);
}
.prose-spec li {
@@ -392,7 +392,7 @@ html {
}
.dark .prose-spec li {
color: theme(colors.slate.400);
color: theme(colors.neutral.400);
}
/* Nested ordered list counters (spec numbering: 1., 1.1., 1.2.) */
@@ -417,6 +417,10 @@ html {
color: theme(colors.slate.500);
}
.dark .prose-spec ol>li::before {
color: theme(colors.neutral.500);
}
.prose-spec img {
max-width: 100%;
height: auto;
@@ -430,24 +434,24 @@ html {
/* Nav link active state (toggled by JavaScript) */
.nav-link.active {
color: theme(colors.sky.600) !important;
background-color: theme(colors.sky.500 / 15%) !important;
color: theme(colors.sky.700) !important;
background-color: theme(colors.sky.600 / 15%) !important;
}
.dark .nav-link.active {
color: theme(colors.sky.400) !important;
background-color: theme(colors.sky.500 / 20%) !important;
background-color: theme(colors.sky.700 / 20%) !important;
}
/* Sidebar link active state (toggled by JavaScript) */
.sidebar-link.active {
color: theme(colors.sky.600) !important;
background-color: theme(colors.sky.500 / 15%) !important;
color: theme(colors.sky.700) !important;
background-color: theme(colors.sky.600 / 15%) !important;
}
.dark .sidebar-link.active {
color: theme(colors.sky.400) !important;
background-color: theme(colors.sky.500 / 20%) !important;
background-color: theme(colors.sky.600 / 20%) !important;
}
/* Sidebar scrollbar styling */
@@ -465,6 +469,6 @@ html {
}
.dark #spec-sidebar::-webkit-scrollbar-thumb {
background-color: theme(colors.slate.800);
background-color: theme(colors.neutral.800);
}
}