More site work

docs/build.yaml

@@ -56,6 +56,7 @@ targets:
         enabled: true
         options:
           process_without_directives: true
+          drop_indentation: true
         generate_for:
           include:
             - "lib/src/snippets/**/*.dart"

docs/content/type_converters.md

@@ -20,8 +20,8 @@ a `TypeConverter` for that:
 
 <Snippet href="/lib/src/snippets/type_converters/converters.dart" name="converter" />
 
-1. The original JSON type converter classes are [deprecated](#type-converters-and-json-serialization),
-   which is why the `v2`-variants should generally be used instead.
+This is using the `JsonTypeConverter2` classes, the original ones are [deprecated](#type-converters-and-json-serialization)
+and will be removed in the next major drift version.
 
 Finally, we can use that converter in a table declaration:
 

docs/lib/_styles.scss

@@ -6,7 +6,9 @@
 @use "src/styles/jaspr";
 @use "src/styles/ui";
 
+$color-mode-type: media-query;
 @import "package:jaspr_docsy/style";
+@import "src/styles/flutter_favorite";
 
 :root {
   @include dracula.light;

docs/lib/jaspr_options.dart

@@ -11,7 +11,8 @@ import 'package:drift_website/src/components/search_input.dart' as prefix2;
 import 'package:drift_website/src/components/web_compatibility.dart' as prefix3;
 import 'package:drift_website/src/search/component.dart' as prefix4;
 import 'package:jaspr_content_snippets/internal/client.dart' as prefix5;
-import 'package:jaspr_docsy/components/internal/tabs.dart' as prefix6;
+import 'package:jaspr_docsy/components/internal/sidebar_toggle.dart' as prefix6;
+import 'package:jaspr_docsy/components/internal/tabs.dart' as prefix7;
 
 /// Default [JasprOptions] for use with your jaspr project.
 ///
@@ -53,13 +54,21 @@ JasprOptions get defaultJasprOptions => JasprOptions(
       'jaspr_content_snippets:internal/client',
     ),
 
-    prefix6.InternalTabHeaders: ClientTarget<prefix6.InternalTabHeaders>(
+    prefix6.MobileSidebarToggle: ClientTarget<prefix6.MobileSidebarToggle>(
+      'jaspr_docsy:components/internal/sidebar_toggle',
+      params: _prefix6MobileSidebarToggle,
+    ),
+
+    prefix7.InternalTabHeaders: ClientTarget<prefix7.InternalTabHeaders>(
       'jaspr_docsy:components/internal/tabs',
-      params: _prefix6InternalTabHeaders,
+      params: _prefix7InternalTabHeaders,
     ),
   },
   styles: () => [],
 );
 
-Map<String, dynamic> _prefix6InternalTabHeaders(prefix6.InternalTabHeaders c) =>
+Map<String, dynamic> _prefix6MobileSidebarToggle(
+  prefix6.MobileSidebarToggle c,
+) => {'target': c.target};
+Map<String, dynamic> _prefix7InternalTabHeaders(prefix7.InternalTabHeaders c) =>
     {'items': c.items};

docs/lib/src/components/flutter_favorite.dart

@@ -0,0 +1,17 @@
+import 'package:jaspr/jaspr.dart';
+
+final class FlutterFavoriteIcon extends StatelessComponent {
+  @override
+  Component build(BuildContext context) {
+    return div(classes: 'row favorite', [
+      a(
+        classes: 'justify-content-end',
+        href: 'https://docs.flutter.dev/packages-and-plugins/favorites',
+        [
+          img(classes: 'light', src: '/images/ff_light.png'),
+          img(classes: 'dark', src: '/images/ff_dark.png'),
+        ],
+      ),
+    ]);
+  }
+}

docs/lib/src/components/header.dart

@@ -20,6 +20,11 @@ final class DriftHeader extends StatelessComponent {
             active: tab == currentTab,
             children: [text(tab.name)],
           ),
+        NavbarLink(
+          href: 'https://pub.dev/packages/drift',
+          active: false,
+          children: [text('pub.dev')],
+        ),
       ],
       search: const DriftSearchInput(),
     );

docs/lib/src/layouts/docs.dart

@@ -2,6 +2,7 @@ import 'package:jaspr/server.dart';
 import 'package:jaspr_content/jaspr_content.dart' hide TableOfContents;
 import 'package:jaspr_docsy/jaspr_docsy.dart';
 
+import '../components/flutter_favorite.dart';
 import '../components/footer.dart';
 import '../components/header.dart';
 import '../components/modal.dart';
@@ -25,7 +26,10 @@ final class DriftDocsLayout extends DocsyLayout {
 
   @override
   Component buildContent(Page page, Component child) {
-    return PageContent(page: page, renderedMarkdown: child);
+    return fragment([
+      if (page.url == '/') FlutterFavoriteIcon(),
+      PageContent(page: page, renderedMarkdown: child),
+    ]);
   }
 
   @override

docs/lib/src/snippets/type_converters/converters.dart

@@ -22,16 +22,16 @@ class Preferences {
   // #docregion simplified
   static JsonTypeConverter2<Preferences, String, Object?> converter =
       TypeConverter.json2(
-    fromJson: (json) => Preferences.fromJson(json as Map<String, Object?>),
-    toJson: (pref) => pref.toJson(),
-  );
+        fromJson: (json) => Preferences.fromJson(json as Map<String, Object?>),
+        toJson: (pref) => pref.toJson(),
+      );
   // #enddocregion simplified
   // #docregion jsonb
   static JsonTypeConverter2<Preferences, Uint8List, Object?> binaryConverter =
       TypeConverter.jsonb(
-    fromJson: (json) => Preferences.fromJson(json as Map<String, Object?>),
-    toJson: (pref) => pref.toJson(),
-  );
+        fromJson: (json) => Preferences.fromJson(json as Map<String, Object?>),
+        toJson: (pref) => pref.toJson(),
+      );
   // #enddocregion jsonb
   // #docregion start
 }
@@ -40,9 +40,7 @@ class Preferences {
 // #docregion converter
 // stores preferences as strings
 class PreferenceConverter extends TypeConverter<Preferences, String>
-    with
-        // (1)!
-        JsonTypeConverter2<Preferences, String, Map<String, Object?>> {
+    with JsonTypeConverter2<Preferences, String, Map<String, Object?>> {
   const PreferenceConverter();
 
   @override
@@ -75,4 +73,5 @@ class Users extends Table {
   TextColumn get preferences =>
       text().map(const PreferenceConverter()).nullable()();
 }
+
 // #enddocregion table

docs/lib/src/styles/_flutter_favorite.scss

@@ -0,0 +1,26 @@
+.favorite {
+  position: sticky;
+
+  a {
+    display: flex;
+    margin-top: -1.5rem;
+  }
+
+  img {
+    width: 4em;
+  }
+
+  .dark {
+    display: none;
+  }
+
+  @include color-mode(dark) {
+    .light {
+        display: none;
+    }
+
+    .dark {
+        display: block;
+    }
+  }
+}