home page updates

Author: skarim

docs/src/content/docs/index.mdx

@@ -53,11 +53,11 @@ GitHub understands stacks end-to-end: the pull request UI shows a **stack map**
   <Image src={stackNavigator} alt="The stack navigator in a pull request header" />
 </div>
 
-## How It Works
+## Working with Stacks
 
-The `gh stack` CLI handles the local workflow: creating branches, managing rebases, pushing to GitHub, and creating PRs with the correct base branches. On GitHub, the PR UI gives reviewers the context they need — a stack map for navigation, focused diffs for each layer, and proper rules enforcement.
+**While the `gh stack` CLI makes the local workflow seamless, it is entirely optional.** You can create and manage Stacked PRs directly via the GitHub UI, the API, or your standard Git workflow. If you choose to use the CLI, it handles creating branches, managing rebases, pushing to GitHub, and creating PRs with the correct base branches. On GitHub, the PR UI gives reviewers the context they need — a stack map for navigation, focused diffs for each layer, and proper rules enforcement.
 
-When you're ready to merge, you can merge all or a part of the stack. Each PR can be merged directly or through the merge queue. After a merge, the remaining PRs in the stack are automatically rebased so the lowest unmerged PR targets the base branch.
+When you're ready to merge, you can merge all or a part of the stack. Each PR can be merged directly or through the merge queue. **If you want to merge multiple PRs at once (e.g., the bottom two PRs in a stack), simply wait for CI to pass on those specific layers, and you can merge them in a single step.** After a merge, the remaining PRs in the stack are automatically rebased so the lowest unmerged PR targets the updated base branch.
 
 ## Get Started
 

docs/src/styles/custom.css

@@ -248,6 +248,16 @@ header starlight-theme-select {
 	margin-right: auto;
 }
 
+.hero .tagline code {
+	font-size: 0.9em;
+	letter-spacing: -0.02em;
+	word-spacing: -0.1em;
+	padding: 0.15em 0.4em;
+	border-radius: 6px;
+	background: rgba(110, 118, 129, 0.15);
+	font-weight: 500;
+}
+
 /* Center the action button group */
 .hero .sl-flex .sl-flex {
 	justify-content: center !important;
@@ -596,6 +606,14 @@ a.sl-link-button[data-variant='primary']:hover,
 /* Code blocks and tables — let Starlight/ExpressiveCode handle layout.
    Colors flow through the --sl-color-* variables set above. */
 
+/* Light mode copy button: make icon visible on light code blocks */
+:root[data-theme='light'] .expressive-code .copy button {
+	background-color: rgba(175, 184, 193, 0.3) !important;
+}
+:root[data-theme='light'] .expressive-code .copy button::after {
+	background-color: #1f2328 !important;
+}
+
 /* Blockquotes — light color adjustments only */
 .sl-markdown-content blockquote {
 	color: #9198a1;