diff --git a/TASK.md b/TASK.md index 01dfc9b..fa261c1 100644 --- a/TASK.md +++ b/TASK.md @@ -15,7 +15,7 @@ ## Current Status -v1.24.0 deployed. Sidebar layout support for blog posts. +v1.24.2 deployed. Mobile menu redesigned with sidebar integration and typography standardization. ## Completed @@ -158,6 +158,20 @@ v1.24.0 deployed. Sidebar layout support for blog posts. - [x] Aggregate component registration in convex.config.ts - [x] Stats query updated to use aggregate counts - [x] Aggregate component documentation in prds/howstatsworks.md +- [x] Sidebar navigation anchor links fixed for collapsed/expanded sections +- [x] Navigation scroll calculation with proper header offset (80px) +- [x] Expand ancestors before scrolling to ensure target visibility +- [x] Removed auto-expand from scroll handler to preserve manual collapse state +- [x] Collapse button event handling improved to prevent link navigation +- [x] Heading extraction updated to filter out code blocks +- [x] Sidebar no longer shows example headings from markdown code examples +- [x] Mobile menu redesigned with left-aligned navigation controls +- [x] Hamburger menu order changed (hamburger, search, theme toggle) +- [x] Sidebar table of contents integrated into mobile menu +- [x] Desktop sidebar hidden on mobile when sidebar layout is enabled +- [x] SidebarContext created to share sidebar data between components +- [x] Mobile menu typography standardized with CSS variables +- [x] Font-family standardized using inherit for consistency ## Deployment Steps diff --git a/changelog.md b/changelog.md index 0655660..870341c 100644 --- a/changelog.md +++ b/changelog.md @@ -4,6 +4,53 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/). +## [1.24.2] - 2025-12-23 + +### Changed + +- Mobile menu redesigned for better sidebar integration + - Mobile navigation controls moved to left side (hamburger, search, theme toggle) + - Hamburger menu order: hamburger first, then search, then theme toggle + - Sidebar table of contents now appears in mobile menu when page has sidebar layout + - Desktop sidebar hidden on mobile (max-width: 768px) since it's accessible via hamburger menu + - Back button and CopyPageDropdown remain visible above main content on mobile +- Mobile menu typography standardized + - All mobile menu elements now use CSS variables for font sizes + - Font-family standardized using `inherit` to match body font from global.css + - Mobile menu TOC links use consistent font sizing with desktop sidebar + - Added CSS variables: `--font-size-mobile-toc-title` and `--font-size-mobile-toc-link` + +### Technical + +- Updated `src/components/Layout.tsx`: Reordered mobile nav controls, added sidebar context integration +- Updated `src/components/MobileMenu.tsx`: Added sidebar headings rendering in mobile menu +- Updated `src/pages/Post.tsx`: Provides sidebar headings to context for mobile menu +- Updated `src/context/SidebarContext.tsx`: New context for sharing sidebar data between components +- Updated `src/styles/global.css`: Mobile menu positioning, sidebar hiding on mobile, font standardization + +## [1.24.1] - 2025-12-23 + +### Fixed + +- Sidebar navigation anchor links now work correctly when sections are collapsed or expanded + - Fixed navigation scroll calculation to use proper header offset (80px) + - Expand ancestors before scrolling to ensure target is visible + - Use requestAnimationFrame to ensure DOM updates complete before scrolling + - Removed auto-expand from scroll handler to prevent interfering with manual collapse/expand + - Collapse button now properly isolated from link clicks with event handlers + +### Changed + +- Updated `extractHeadings.ts` to filter out headings inside code blocks + - Prevents sidebar from showing example headings from markdown code examples + - Removes fenced code blocks (```) and indented code blocks before extracting headings + - Ensures sidebar only shows actual page headings, not code examples + +### Technical + +- Updated `src/components/PageSidebar.tsx`: Improved navigation logic and collapse button event handling +- Updated `src/utils/extractHeadings.ts`: Added `removeCodeBlocks` function to filter code before heading extraction + ## [1.24.0] - 2025-12-23 ### Added diff --git a/content/blog/fork-configuration-guide.md b/content/blog/fork-configuration-guide.md index e06c877..71eae13 100644 --- a/content/blog/fork-configuration-guide.md +++ b/content/blog/fork-configuration-guide.md @@ -7,6 +7,7 @@ published: true tags: ["configuration", "setup", "fork", "tutorial"] readTime: "4 min read" featured: true +layout: "sidebar" featuredOrder: 0 authorName: "Markdown" authorImage: "/images/authors/markdown.png" diff --git a/content/blog/git-commit-message-best-practices.md b/content/blog/git-commit-message-best-practices.md new file mode 100644 index 0000000..7e06336 --- /dev/null +++ b/content/blog/git-commit-message-best-practices.md @@ -0,0 +1,250 @@ +--- +title: "Git commit message best practices" +description: "A guide to writing clear, consistent commit messages that help your team understand changes and generate better changelogs." +date: "2025-01-17" +slug: "git-commit-message-best-practices" +published: true +tags: ["git", "development", "best-practices", "workflow"] +readTime: "5 min read" +featured: false +authorName: "Markdown" +authorImage: "/images/authors/markdown.png" +excerpt: "Learn the Conventional Commits standard and write commit messages that make your project history clear and useful." +--- + +# Git commit message best practices + +Good commit messages make project history readable. They help teammates understand changes, generate changelogs automatically, and make debugging easier. This guide covers the most common standard: Conventional Commits. + +## Why commit messages matter + +Commit messages document what changed and why. They serve as a project timeline. Clear messages help when: + +- Reviewing code changes +- Debugging issues +- Generating release notes +- Onboarding new team members +- Understanding project evolution + +Bad commit messages like "updates" or "fix" provide no context. Good messages explain the change and its purpose. + +## The Conventional Commits standard + +Conventional Commits is the most widely adopted format. It uses a simple structure: + +``` +[optional scope]: + +[optional body] + +[optional footer(s)] +``` + +The type and description are required. Everything else is optional. + +## Commit types + +Use these standard types: + +| Type | When to use | +| ---------- | ----------------------------------------------- | +| `feat` | New feature | +| `fix` | Bug fix | +| `docs` | Documentation changes | +| `style` | Formatting, missing semicolons (no code change) | +| `refactor` | Code restructuring without changing behavior | +| `perf` | Performance improvements | +| `test` | Adding or updating tests | +| `chore` | Maintenance tasks, dependency updates | +| `ci` | CI/CD changes | +| `build` | Build system changes | +| `revert` | Reverting a previous commit | + +## Writing good commit messages + +### Subject line rules + +Keep the subject line under 50 characters. Use imperative mood. Write "add feature" not "added feature" or "adds feature". + +**Good examples:** + +``` +feat: add search functionality +fix: resolve write conflict in stats mutation +docs: update README with sync commands +refactor: simplify theme context logic +perf: optimize post query with index +``` + +**Bad examples:** + +``` +feature: updates +fix: bug +docs: changes +``` + +### Adding a body + +For complex changes, add a body after a blank line. Explain what changed and why: + +``` +feat: add visitor tracking to stats page + +Track active sessions using heartbeat system with 30-second +intervals. Sessions expire after 2 minutes of inactivity. +Uses event records pattern to prevent write conflicts. + +Closes #123 +``` + +### Using scopes + +Scopes are optional but helpful for larger projects. They indicate which part of the codebase changed: + +``` +feat(api): add pagination to posts endpoint +fix(ui): resolve mobile menu closing issue +docs(readme): add deployment instructions +``` + +## Common patterns + +### Feature additions + +``` +feat: add dark mode toggle + +Implements theme switching with localStorage persistence. +Supports four themes: dark, light, tan, cloud. +``` + +### Bug fixes + +``` +fix: prevent duplicate heartbeat mutations + +Adds 5-second debounce window using refs to prevent +overlapping calls. Resolves write conflicts in activeSessions. +``` + +### Documentation updates + +``` +docs: add Convex best practices section + +Includes patterns for avoiding write conflicts, using +indexes, and making mutations idempotent. +``` + +### Refactoring + +``` +refactor: extract search logic into custom hook + +Moves search state and handlers from component to +useSearch hook for better reusability. +``` + +## Benefits of consistent commits + +### Automatic changelog generation + +Tools like semantic-release read commit messages and generate changelogs automatically. Each `feat:` becomes a minor version bump. Each `fix:` becomes a patch. + +### Better code review + +Reviewers see the intent immediately. A commit titled "feat: add search modal" is clearer than "updates". + +### Easier debugging + +When investigating issues, clear commit messages help identify when bugs were introduced. Git blame becomes more useful. + +### Team collaboration + +Consistent messages create shared understanding. New team members learn the pattern quickly. + +## Quick reference + +**Format:** + +``` +: +``` + +**Types:** feat, fix, docs, style, refactor, perf, test, chore, ci, build, revert + +**Rules:** + +- Use lowercase for types +- Imperative mood ("add" not "added") +- Under 50 characters for subject +- No period at end of subject +- Add body for complex changes + +**Examples:** + +``` +feat: add search functionality +fix: resolve write conflict in stats mutation +docs: update README with sync commands +refactor: simplify theme context logic +perf: optimize post query with index +chore: update dependencies +``` + +## Setting up commit templates + +Create a git commit template to remind yourself of the format: + +**Create `.gitmessage` in your project root:** + +``` +# : +# +# +# +#