Changelog (#399)

* feat: add changelog feature and update site navigation

- Introduced a new Changelog page with pagination and detailed entry views.
- Added components for displaying changelog entries, pagination, and entry details.
- Updated site navigation to include a link to the new Changelog page.
- Enhanced localization for changelog-related texts in marketing.json.

* refactor: enhance Changelog page layout and entry display

- Increased the number of changelog entries displayed per page from 2 to 20 for better visibility.
- Improved the layout of the Changelog page by adjusting the container styles and removing unnecessary divs.
- Updated the ChangelogEntry component to enhance the visual presentation of entries, including a new date badge with an icon.
- Refined the CSS styles for Markdoc headings to improve typography and spacing.

* refactor: enhance Changelog page functionality and layout

- Increased the number of changelog entries displayed per page from 20 to 50 for improved user experience.
- Updated ChangelogEntry component to make the highlight prop optional and refined the layout for better visual clarity.
- Adjusted styles in ChangelogHeader and ChangelogPagination components for a more cohesive design.
- Removed unnecessary order fields from changelog markdown files to streamline content management.

* feat: enhance Changelog entry navigation and data loading

- Refactored ChangelogEntry page to load previous and next entries for improved navigation.
- Introduced ChangelogNavigation component to facilitate navigation between changelog entries.
- Updated ChangelogDetail component to display navigation links and entry details.
- Enhanced data fetching logic to retrieve all changelog entries alongside the current entry.
- Added localization keys for navigation text in marketing.json.

* Update package dependencies and enhance documentation layout

- Upgraded various packages including @turbo/gen and turbo to version 2.6.0, and react-hook-form to version 7.66.0.
- Updated lucide-react to version 0.552.0 across multiple packages.
- Refactored documentation layout components for improved styling and structure.
- Removed deprecated loading components and adjusted navigation elements for better user experience.
- Added placeholder notes in changelog entries for clarity.

apps/web/styles/globals.css

@@ -15,15 +15,15 @@
 @import './makerkit.css';
 
 /* plugins - update the below if you add a new plugin */
-@plugin "tailwindcss-animate";
+@plugin 'tailwindcss-animate';
 
 /* content sources - update the below if you add a new path */
-@source "../../../packages/*/src/**/*.{ts,tsx}";
-@source "../../../packages/features/*/src/**/*.{ts,tsx}";
-@source "../../../packages/billing/*/src/**/*.{ts,tsx}";
-@source "../../../packages/plugins/*/src/**/*.{ts,tsx}";
-@source "../../../packages/cms/*/src/**/*.{ts,tsx}";
-@source "../{app,components,config,lib}/**/*.{ts,tsx}";
+@source '../../../packages/*/src/**/*.{ts,tsx}';
+@source '../../../packages/features/*/src/**/*.{ts,tsx}';
+@source '../../../packages/billing/*/src/**/*.{ts,tsx}';
+@source '../../../packages/plugins/*/src/**/*.{ts,tsx}';
+@source '../../../packages/cms/*/src/**/*.{ts,tsx}';
+@source '../{app,components,config,lib}/**/*.{ts,tsx}';
 
 /* variants - update the below if you add a new variant */
 @variant dark (&:where(.dark, .dark *));
@@ -36,6 +36,15 @@
       'calt' 1;
   }
 
+  html,
+  body {
+    scroll-padding-top: 56px;
+  }
+
+  [id] {
+    scroll-margin-top: 56px;
+  }
+
   *,
   ::after,
   ::before,

apps/web/styles/markdoc.css

@@ -5,28 +5,24 @@
 * the blog post, documentation, etc.
  */
 
-.markdoc {
-  @apply text-foreground;
-}
-
 .markdoc h1 {
-  @apply font-heading text-foreground text-3xl font-medium tracking-tight lg:mt-14 dark:text-white;
+  @apply font-heading text-foreground mt-14 text-3xl font-semibold tracking-tight dark:text-white;
 }
 
 .markdoc h2 {
-  @apply font-heading text-foreground text-2xl font-medium tracking-tight lg:mt-6 lg:mb-3 dark:text-white;
+  @apply font-heading text-foreground mt-10 mb-2 text-xl font-semibold tracking-tight dark:text-white;
 }
 
 .markdoc h3 {
-  @apply font-heading text-foreground text-xl font-medium tracking-tight lg:mt-12 dark:text-white;
+  @apply font-heading text-foreground mt-8 mb-4 text-lg font-semibold tracking-tight dark:text-white;
 }
 
 .markdoc h4 {
-  @apply text-foreground mt-4 text-lg font-medium tracking-tight lg:mt-8 dark:text-white;
+  @apply text-foreground mt-6 text-base font-medium tracking-tight dark:text-white;
 }
 
 .markdoc h5 {
-  @apply text-foreground mt-3 text-base font-medium tracking-tight lg:mt-6 dark:text-white;
+  @apply text-foreground mt-5 text-sm font-medium tracking-tight dark:text-white;
 }
 
 .markdoc h6 {
@@ -34,11 +30,11 @@
 }
 
 .markdoc p {
-  @apply text-muted-foreground my-3 text-base leading-7;
+  @apply mt-7 text-base/7 text-gray-700 dark:text-gray-300;
 }
 
 .markdoc li {
-  @apply text-muted-foreground relative my-0.5 text-base leading-7;
+  @apply relative mt-2 text-base/7 text-gray-700 dark:text-gray-300;
 }
 
 .markdoc ul > li:before {
@@ -86,11 +82,15 @@
 }
 
 .markdoc pre {
-  @apply bg-muted/50 border-border text-foreground my-4 overflow-x-auto rounded-md border p-4 font-mono text-sm;
+  @apply bg-muted/50 border-border text-foreground my-4 overflow-x-auto rounded-md border px-4 py-2 font-mono text-sm;
 }
 
 .markdoc blockquote {
-  @apply border-primary text-muted-foreground my-4 border border-l-8 px-6 py-4 text-lg font-medium;
+  @apply my-4 rounded-md border px-4 py-2 text-base/7 text-gray-700 dark:text-gray-300;
+
+  p {
+    @apply mt-0;
+  }
 }
 
 .markdoc a {