RubyGems - docyard - Versions diffs - 0.6.0 → 0.8.0 - Mend

docyard 0.6.0 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (177) hide show

checksums.yaml +4 -4
data/.rubocop.yml +5 -1
data/CHANGELOG.md +34 -1
data/lib/docyard/build/asset_bundler.rb +22 -7
data/lib/docyard/build/file_copier.rb +49 -27
data/lib/docyard/build/sitemap_generator.rb +6 -6
data/lib/docyard/build/static_generator.rb +82 -50
data/lib/docyard/builder.rb +20 -10
data/lib/docyard/cli.rb +6 -3
data/lib/docyard/components/aliases.rb +29 -0
data/lib/docyard/components/processors/callout_processor.rb +124 -0
data/lib/docyard/components/processors/code_block_diff_preprocessor.rb +106 -0
data/lib/docyard/components/processors/code_block_focus_preprocessor.rb +79 -0
data/lib/docyard/components/processors/code_block_options_preprocessor.rb +78 -0
data/lib/docyard/components/processors/code_block_processor.rb +175 -0
data/lib/docyard/components/processors/code_snippet_import_preprocessor.rb +127 -0
data/lib/docyard/components/processors/heading_anchor_processor.rb +39 -0
data/lib/docyard/components/processors/icon_processor.rb +53 -0
data/lib/docyard/components/processors/table_of_contents_processor.rb +68 -0
data/lib/docyard/components/processors/table_wrapper_processor.rb +22 -0
data/lib/docyard/components/processors/tabs_processor.rb +48 -0
data/lib/docyard/components/support/code_block/feature_extractor.rb +117 -0
data/lib/docyard/components/support/code_block/icon_detector.rb +44 -0
data/lib/docyard/components/support/code_block/line_parser.rb +84 -0
data/lib/docyard/components/support/code_block/line_wrapper.rb +50 -0
data/lib/docyard/components/support/code_block/patterns.rb +55 -0
data/lib/docyard/components/support/code_detector.rb +61 -0
data/lib/docyard/components/support/tabs/icon_detector.rb +62 -0
data/lib/docyard/components/support/tabs/parser.rb +195 -0
data/lib/docyard/components/support/tabs/range_finder.rb +46 -0
data/lib/docyard/config/branding_resolver.rb +183 -0
data/lib/docyard/{constants.rb → config/constants.rb} +7 -4
data/lib/docyard/config/validator.rb +122 -99
data/lib/docyard/config.rb +38 -36
data/lib/docyard/initializer.rb +15 -76
data/lib/docyard/navigation/breadcrumb_builder.rb +133 -0
data/lib/docyard/{prev_next_builder.rb → navigation/prev_next_builder.rb} +6 -3
data/lib/docyard/navigation/sidebar/children_discoverer.rb +51 -0
data/lib/docyard/navigation/sidebar/config_parser.rb +208 -0
data/lib/docyard/navigation/sidebar/file_resolver.rb +78 -0
data/lib/docyard/{sidebar → navigation/sidebar}/file_system_scanner.rb +2 -1
data/lib/docyard/navigation/sidebar/item.rb +96 -0
data/lib/docyard/navigation/sidebar/local_config_loader.rb +51 -0
data/lib/docyard/navigation/sidebar/metadata_extractor.rb +69 -0
data/lib/docyard/navigation/sidebar/metadata_reader.rb +47 -0
data/lib/docyard/navigation/sidebar/path_prefixer.rb +34 -0
data/lib/docyard/navigation/sidebar/renderer.rb +144 -0
data/lib/docyard/navigation/sidebar/sorter.rb +21 -0
data/lib/docyard/navigation/sidebar/tree_builder.rb +139 -0
data/lib/docyard/navigation/sidebar/tree_filter.rb +55 -0
data/lib/docyard/navigation/sidebar_builder.rb +159 -0
data/lib/docyard/rendering/icon_helpers.rb +13 -0
data/lib/docyard/{icons → rendering/icons}/phosphor.rb +26 -1
data/lib/docyard/{markdown.rb → rendering/markdown.rb} +19 -13
data/lib/docyard/rendering/renderer.rb +163 -0
data/lib/docyard/rendering/template_resolver.rb +172 -0
data/lib/docyard/routing/fallback_resolver.rb +92 -0
data/lib/docyard/search/build_indexer.rb +74 -0
data/lib/docyard/search/dev_indexer.rb +155 -0
data/lib/docyard/search/pagefind_support.rb +33 -0
data/lib/docyard/{asset_handler.rb → server/asset_handler.rb} +24 -19
data/lib/docyard/{server.rb → server/dev_server.rb} +32 -9
data/lib/docyard/server/pagefind_handler.rb +63 -0
data/lib/docyard/{preview_server.rb → server/preview_server.rb} +2 -2
data/lib/docyard/server/rack_application.rb +192 -0
data/lib/docyard/server/resolution_result.rb +29 -0
data/lib/docyard/{router.rb → server/router.rb} +4 -4
data/lib/docyard/templates/assets/css/code.css +18 -51
data/lib/docyard/templates/assets/css/components/breadcrumbs.css +143 -0
data/lib/docyard/templates/assets/css/components/callout.css +67 -67
data/lib/docyard/templates/assets/css/components/code-block.css +180 -282
data/lib/docyard/templates/assets/css/components/heading-anchor.css +28 -15
data/lib/docyard/templates/assets/css/components/icon.css +0 -1
data/lib/docyard/templates/assets/css/components/logo.css +0 -2
data/lib/docyard/templates/assets/css/components/nav-menu.css +237 -0
data/lib/docyard/templates/assets/css/components/navigation.css +186 -167
data/lib/docyard/templates/assets/css/components/prev-next.css +76 -47
data/lib/docyard/templates/assets/css/components/search.css +561 -0
data/lib/docyard/templates/assets/css/components/tab-bar.css +163 -0
data/lib/docyard/templates/assets/css/components/table-of-contents.css +127 -114
data/lib/docyard/templates/assets/css/components/tabs.css +119 -160
data/lib/docyard/templates/assets/css/components/theme-toggle.css +48 -44
data/lib/docyard/templates/assets/css/landing.css +815 -0
data/lib/docyard/templates/assets/css/layout.css +503 -87
data/lib/docyard/templates/assets/css/main.css +1 -3
data/lib/docyard/templates/assets/css/markdown.css +111 -93
data/lib/docyard/templates/assets/css/reset.css +0 -3
data/lib/docyard/templates/assets/css/typography.css +43 -41
data/lib/docyard/templates/assets/css/variables.css +268 -208
data/lib/docyard/templates/assets/favicon.svg +7 -8
data/lib/docyard/templates/assets/fonts/Inter-Variable.ttf +0 -0
data/lib/docyard/templates/assets/js/components/code-block.js +24 -42
data/lib/docyard/templates/assets/js/components/heading-anchor.js +26 -24
data/lib/docyard/templates/assets/js/components/navigation.js +181 -70
data/lib/docyard/templates/assets/js/components/search.js +610 -0
data/lib/docyard/templates/assets/js/components/sidebar-toggle.js +29 -0
data/lib/docyard/templates/assets/js/components/tab-navigation.js +145 -0
data/lib/docyard/templates/assets/js/components/table-of-contents.js +153 -66
data/lib/docyard/templates/assets/js/components/tabs.js +31 -69
data/lib/docyard/templates/assets/js/theme.js +0 -3
data/lib/docyard/templates/assets/logo-dark.svg +8 -2
data/lib/docyard/templates/assets/logo.svg +7 -4
data/lib/docyard/templates/config/docyard.yml.erb +37 -34
data/lib/docyard/templates/errors/404.html.erb +1 -1
data/lib/docyard/templates/errors/500.html.erb +1 -1
data/lib/docyard/templates/layouts/default.html.erb +19 -56
data/lib/docyard/templates/layouts/splash.html.erb +176 -0
data/lib/docyard/templates/partials/_breadcrumbs.html.erb +24 -0
data/lib/docyard/templates/partials/_code_block.html.erb +6 -4
data/lib/docyard/templates/partials/_doc_footer.html.erb +25 -0
data/lib/docyard/templates/partials/_features.html.erb +15 -0
data/lib/docyard/templates/partials/_footer.html.erb +42 -0
data/lib/docyard/templates/partials/_head.html.erb +22 -0
data/lib/docyard/templates/partials/_header.html.erb +49 -0
data/lib/docyard/templates/partials/_heading_anchor.html.erb +3 -1
data/lib/docyard/templates/partials/_hero.html.erb +27 -0
data/lib/docyard/templates/partials/_nav_group.html.erb +25 -11
data/lib/docyard/templates/partials/_nav_leaf.html.erb +1 -1
data/lib/docyard/templates/partials/_nav_menu.html.erb +42 -0
data/lib/docyard/templates/partials/_nav_nested_section.html.erb +11 -0
data/lib/docyard/templates/partials/_nav_section.html.erb +1 -1
data/lib/docyard/templates/partials/_prev_next.html.erb +9 -3
data/lib/docyard/templates/partials/_scripts.html.erb +7 -0
data/lib/docyard/templates/partials/_search_modal.html.erb +41 -0
data/lib/docyard/templates/partials/_search_trigger.html.erb +18 -0
data/lib/docyard/templates/partials/_sidebar.html.erb +21 -4
data/lib/docyard/templates/partials/_tab_bar.html.erb +25 -0
data/lib/docyard/templates/partials/_table_of_contents.html.erb +12 -12
data/lib/docyard/templates/partials/_table_of_contents_toggle.html.erb +1 -3
data/lib/docyard/templates/partials/_tabs.html.erb +2 -2
data/lib/docyard/templates/partials/_theme_toggle.html.erb +2 -11
data/lib/docyard/utils/html_helpers.rb +14 -0
data/lib/docyard/utils/path_resolver.rb +2 -1
data/lib/docyard/utils/url_helpers.rb +20 -0
data/lib/docyard/version.rb +1 -1
data/lib/docyard.rb +22 -15
metadata +89 -50
data/lib/docyard/components/callout_processor.rb +0 -121
data/lib/docyard/components/code_block_diff_preprocessor.rb +0 -104
data/lib/docyard/components/code_block_feature_extractor.rb +0 -113
data/lib/docyard/components/code_block_focus_preprocessor.rb +0 -77
data/lib/docyard/components/code_block_icon_detector.rb +0 -40
data/lib/docyard/components/code_block_line_wrapper.rb +0 -46
data/lib/docyard/components/code_block_options_preprocessor.rb +0 -76
data/lib/docyard/components/code_block_patterns.rb +0 -51
data/lib/docyard/components/code_block_processor.rb +0 -176
data/lib/docyard/components/code_detector.rb +0 -59
data/lib/docyard/components/code_line_parser.rb +0 -80
data/lib/docyard/components/code_snippet_import_preprocessor.rb +0 -125
data/lib/docyard/components/heading_anchor_processor.rb +0 -34
data/lib/docyard/components/icon_detector.rb +0 -57
data/lib/docyard/components/icon_processor.rb +0 -51
data/lib/docyard/components/table_of_contents_processor.rb +0 -64
data/lib/docyard/components/table_wrapper_processor.rb +0 -18
data/lib/docyard/components/tabs_parser.rb +0 -191
data/lib/docyard/components/tabs_processor.rb +0 -44
data/lib/docyard/components/tabs_range_finder.rb +0 -42
data/lib/docyard/rack_application.rb +0 -172
data/lib/docyard/renderer.rb +0 -120
data/lib/docyard/routing/resolution_result.rb +0 -31
data/lib/docyard/sidebar/config_parser.rb +0 -180
data/lib/docyard/sidebar/item.rb +0 -58
data/lib/docyard/sidebar/renderer.rb +0 -137
data/lib/docyard/sidebar/tree_builder.rb +0 -59
data/lib/docyard/sidebar_builder.rb +0 -102
data/lib/docyard/templates/markdown/getting-started/installation.md.erb +0 -77
data/lib/docyard/templates/markdown/guides/configuration.md.erb +0 -202
data/lib/docyard/templates/markdown/guides/markdown-features.md.erb +0 -247
data/lib/docyard/templates/markdown/index.md.erb +0 -82
/data/lib/docyard/{sidebar → navigation/sidebar}/title_extractor.rb +0 -0
/data/lib/docyard/{icons → rendering/icons}/LICENSE.phosphor +0 -0
/data/lib/docyard/{icons → rendering/icons}/file_types.rb +0 -0
/data/lib/docyard/{icons.rb → rendering/icons.rb} +0 -0
/data/lib/docyard/{language_mapping.rb → rendering/language_mapping.rb} +0 -0
/data/lib/docyard/{file_watcher.rb → server/file_watcher.rb} +0 -0
/data/lib/docyard/{errors.rb → utils/errors.rb} +0 -0
/data/lib/docyard/{logging.rb → utils/logging.rb} +0 -0

data/lib/docyard/templates/assets/css/components/code-block.css CHANGED Viewed

@@ -1,20 +1,29 @@
-/* Code Block Component */
 .docyard-code-block {
   position: relative;
-  margin: var(--space-6) 0;
+  margin: var(--spacing-4) 0;
+  border-radius: var(--radius-2xl);
+  overflow: hidden;
+  background-color: var(--code-block-bg);
+  border: 1px solid var(--code-block-border);
 }
-.docyard-code-block .highlight {
+.docyard-code-block .highlight,
+.dark .docyard-code-block .highlight {
   margin: 0;
+  border: none;
+  border-radius: 0;
+  background-color: transparent;
 }
-/* Titled Code Block Layout */
-.docyard-code-block--titled {
-  border: 1px solid var(--color-border);
-  border-radius: var(--radius-lg);
-  overflow: hidden;
-  background-color: var(--color-code-bg);
+.docyard-code-block .highlight pre,
+.dark .docyard-code-block .highlight pre {
+  margin: 0;
+  background-color: transparent;
+}
+.docyard-code-block .highlight pre code,
+.dark .docyard-code-block .highlight pre code {
+  background-color: transparent;
 }
 .docyard-code-block--titled .docyard-code-block__body {
@@ -25,33 +34,21 @@
   display: block;
 }
-.docyard-code-block--titled .highlight {
-  margin: 0;
-  border: none;
-  border-radius: 0;
-  box-shadow: none;
-}
-.docyard-code-block--titled .highlight pre {
-  margin: 0;
-}
 .docyard-code-block--titled .highlight pre code {
   display: block;
-  padding: var(--space-4);
+  padding: var(--spacing-4);
 }
-/* Code Block Header */
 .docyard-code-block__header {
   display: flex;
   align-items: center;
-  gap: var(--space-2);
-  padding: var(--space-3) var(--space-4);
-  background: var(--color-bg-secondary);
-  border-bottom: 1px solid var(--color-border);
-  font-size: var(--font-size-sm);
-  font-weight: var(--font-weight-semibold);
-  color: var(--color-text-secondary);
+  gap: var(--spacing-2);
+  padding: var(--spacing-2) var(--spacing-4);
+  background: var(--code-block-header-bg);
+  border-bottom: 1px solid var(--code-block-header-border);
+  font-size: var(--text-xs);
+  font-weight: var(--font-medium);
+  color: var(--muted-foreground);
 }
 .docyard-code-block__icon {
@@ -79,7 +76,6 @@
   white-space: nowrap;
 }
-/* Copy button in header */
 .docyard-code-block__header .docyard-code-block__copy {
   position: relative;
   top: auto;
@@ -87,46 +83,34 @@
   flex-shrink: 0;
 }
-/* Body wrapper for titled blocks */
 .docyard-code-block__body {
   position: relative;
 }
-/* Line Numbers Layout */
-.docyard-code-block--line-numbers {
-  border: 1px solid var(--color-border);
-  border-radius: var(--radius-lg);
-  background-color: var(--color-code-bg);
-  overflow: hidden;
-}
 .docyard-code-block--line-numbers .docyard-code-block__body {
   display: flex;
 }
 .docyard-code-block--line-numbers .highlight {
-  border: none;
-  border-radius: 0;
   flex: 1;
   min-width: 0;
 }
 .docyard-code-block__lines {
   flex-shrink: 0;
-  padding: var(--space-4) 0;
-  border-right: 1px solid var(--color-border);
+  padding: var(--spacing-4) 0;
   text-align: right;
   user-select: none;
-  color: var(--color-text-tertiary);
+  background-color: var(--code-block-gutter-bg);
+  color: oklch(from var(--muted-foreground) l c h / 60%);
   font-family: var(--font-mono);
-  font-size: var(--font-size-sm);
-  line-height: var(--line-height-relaxed);
-  background-color: var(--color-code-bg);
+  font-size: var(--text-sm);
+  line-height: var(--leading-relaxed);
 }
 .docyard-code-block__lines span {
   display: block;
-  padding: 0 var(--space-3);
+  padding: 0 var(--spacing-3);
   min-width: 2.5rem;
 }
@@ -134,144 +118,127 @@
   flex: 1;
   min-width: 0;
   overflow-x: auto;
+  overscroll-behavior-x: contain;
 }
-/* Line Highlighting */
 .docyard-code-line {
   display: block;
 }
 .docyard-code-line--highlighted {
-  background-color: rgba(var(--color-primary-rgb), 0.1);
-  border-left: 3px solid var(--color-primary);
-  margin-left: calc(-1 * var(--space-4));
-  margin-right: calc(-1 * var(--space-4));
-  padding-left: calc(var(--space-4) - 3px);
-  padding-right: var(--space-4);
+  background-color: oklch(from var(--primary) l c h / 10%);
+  border-left: 3px solid var(--primary);
+  margin-left: calc(-1 * var(--spacing-4));
+  margin-right: calc(-1 * var(--spacing-4));
+  padding-left: calc(var(--spacing-4) - 3px);
+  padding-right: var(--spacing-4);
 }
-/* Highlighted line number */
 .docyard-code-block__line--highlighted {
-  background-color: rgba(var(--color-primary-rgb), 0.15);
-  color: var(--color-primary);
+  background-color: oklch(from var(--primary) l c h / 15%);
+  color: var(--primary);
   font-weight: 500;
 }
-/* Diff line styles */
 .docyard-code-line--diff-add {
-  background-color: var(--color-diff-add-bg);
-  border-left: 3px solid var(--color-diff-add-border);
-  margin-left: calc(-1 * var(--space-4));
-  margin-right: calc(-1 * var(--space-4));
-  padding-left: calc(var(--space-4) - 3px);
-  padding-right: var(--space-4);
+  background-color: var(--diff-add-background);
+  border-left: 3px solid var(--diff-add-border);
+  margin-left: calc(-1 * var(--spacing-4));
+  margin-right: calc(-1 * var(--spacing-4));
+  padding-left: calc(var(--spacing-4) - 3px);
+  padding-right: var(--spacing-4);
 }
 .docyard-code-line--diff-remove {
-  background-color: var(--color-diff-remove-bg);
-  border-left: 3px solid var(--color-diff-remove-border);
-  margin-left: calc(-1 * var(--space-4));
-  margin-right: calc(-1 * var(--space-4));
-  padding-left: calc(var(--space-4) - 3px);
-  padding-right: var(--space-4);
+  background-color: var(--diff-remove-background);
+  border-left: 3px solid var(--diff-remove-border);
+  margin-left: calc(-1 * var(--spacing-4));
+  margin-right: calc(-1 * var(--spacing-4));
+  padding-left: calc(var(--spacing-4) - 3px);
+  padding-right: var(--spacing-4);
 }
-/* Error/Warning line styles */
 .docyard-code-line--error {
-  background-color: var(--color-code-error-bg, rgba(239, 68, 68, 0.15));
-  border-left: 3px solid var(--color-code-error-border, #ef4444);
-  margin-left: calc(-1 * var(--space-4));
-  margin-right: calc(-1 * var(--space-4));
-  padding-left: calc(var(--space-4) - 3px);
-  padding-right: var(--space-4);
+  background-color: var(--code-error-background);
+  border-left: 3px solid var(--code-error-border);
+  margin-left: calc(-1 * var(--spacing-4));
+  margin-right: calc(-1 * var(--spacing-4));
+  padding-left: calc(var(--spacing-4) - 3px);
+  padding-right: var(--spacing-4);
 }
 .docyard-code-line--warning {
-  background-color: var(--color-code-warning-bg, rgba(245, 158, 11, 0.15));
-  border-left: 3px solid var(--color-code-warning-border, #f59e0b);
-  margin-left: calc(-1 * var(--space-4));
-  margin-right: calc(-1 * var(--space-4));
-  padding-left: calc(var(--space-4) - 3px);
-  padding-right: var(--space-4);
+  background-color: var(--code-warning-background);
+  border-left: 3px solid var(--code-warning-border);
+  margin-left: calc(-1 * var(--spacing-4));
+  margin-right: calc(-1 * var(--spacing-4));
+  padding-left: calc(var(--spacing-4) - 3px);
+  padding-right: var(--spacing-4);
 }
-/* Diff gutter indicators */
 .docyard-code-block__line--diff-add {
-  background-color: var(--color-diff-add-gutter-bg);
-  color: var(--color-diff-add-indicator);
+  background-color: var(--diff-add-gutter);
+  color: var(--diff-add-indicator);
   font-weight: 500;
 }
 .docyard-code-block__line--diff-remove {
-  background-color: var(--color-diff-remove-gutter-bg);
-  color: var(--color-diff-remove-indicator);
+  background-color: var(--diff-remove-gutter);
+  color: var(--diff-remove-indicator);
   font-weight: 500;
 }
-/* Error/Warning line number indicators */
 .docyard-code-block__line--error {
-  background-color: var(--color-code-error-gutter-bg, rgba(239, 68, 68, 0.2));
-  color: var(--color-code-error-indicator, #991b1b);
+  background-color: var(--code-error-gutter);
+  color: var(--code-error-indicator);
   font-weight: 500;
 }
 .docyard-code-block__line--warning {
-  background-color: var(--color-code-warning-gutter-bg, rgba(245, 158, 11, 0.2));
-  color: var(--color-code-warning-indicator, #78350f);
+  background-color: var(--code-warning-gutter);
+  color: var(--code-warning-indicator);
   font-weight: 500;
 }
-/* Diff-only gutter */
-.docyard-code-block--diff:not(.docyard-code-block--line-numbers) {
-  border: 1px solid var(--color-border);
-  border-radius: var(--radius-lg);
-  background-color: var(--color-code-bg);
-  overflow: hidden;
-}
 .docyard-code-block--diff:not(.docyard-code-block--line-numbers) .docyard-code-block__body {
   display: flex;
 }
 .docyard-code-block--diff:not(.docyard-code-block--line-numbers) .highlight {
-  border: none;
-  border-radius: 0;
   flex: 1;
   min-width: 0;
 }
 .docyard-code-block__diff-gutter {
   flex-shrink: 0;
-  padding: var(--space-4) 0;
-  border-right: 1px solid var(--color-border);
+  padding: var(--spacing-4) 0;
   text-align: center;
   user-select: none;
-  color: var(--color-text-tertiary);
+  background-color: var(--code-block-gutter-bg);
+  color: oklch(from var(--muted-foreground) l c h / 60%);
   font-family: var(--font-mono);
-  font-size: var(--font-size-sm);
-  line-height: var(--line-height-relaxed);
-  background-color: var(--color-code-bg);
+  font-size: var(--text-sm);
+  line-height: var(--leading-relaxed);
 }
 .docyard-code-block__diff-gutter span {
   display: block;
-  padding: 0 var(--space-2);
+  padding: 0 var(--spacing-2);
   min-width: 1.5rem;
 }
 .docyard-code-block__diff-indicator--add {
-  background-color: var(--color-diff-add-gutter-bg);
-  color: var(--color-diff-add-indicator);
+  background-color: var(--diff-add-gutter);
+  color: var(--diff-add-indicator);
   font-weight: 600;
 }
 .docyard-code-block__diff-indicator--remove {
-  background-color: var(--color-diff-remove-gutter-bg);
-  color: var(--color-diff-remove-indicator);
+  background-color: var(--diff-remove-gutter);
+  color: var(--diff-remove-indicator);
   font-weight: 600;
 }
-/* With line numbers - reset margins, they extend via negative margin */
 .docyard-code-block--line-numbers .docyard-code-line {
   margin-left: 0;
   margin-right: 0;
@@ -282,11 +249,10 @@
 .docyard-code-block--line-numbers .docyard-code-line--diff-remove,
 .docyard-code-block--line-numbers .docyard-code-line--error,
 .docyard-code-block--line-numbers .docyard-code-line--warning {
-  margin-left: calc(-1 * var(--space-4));
-  margin-right: calc(-1 * var(--space-4));
+  margin-left: calc(-1 * var(--spacing-4));
+  margin-right: calc(-1 * var(--spacing-4));
 }
-/* With diff gutter - reset margins, they extend via negative margin */
 .docyard-code-block--diff:not(.docyard-code-block--line-numbers) .docyard-code-line {
   margin-left: 0;
   margin-right: 0;
@@ -294,30 +260,10 @@
 .docyard-code-block--diff:not(.docyard-code-block--line-numbers) .docyard-code-line--diff-add,
 .docyard-code-block--diff:not(.docyard-code-block--line-numbers) .docyard-code-line--diff-remove {
-  margin-left: calc(-1 * var(--space-4));
-  margin-right: calc(-1 * var(--space-4));
-}
-/* Error/Warning blocks without line numbers */
-.docyard-code-block--has-error:not(.docyard-code-block--line-numbers):not(.docyard-code-block--diff),
-.docyard-code-block--has-warning:not(.docyard-code-block--line-numbers):not(.docyard-code-block--diff) {
-  border: 1px solid var(--color-border);
-  border-radius: var(--radius-lg);
-  background-color: var(--color-code-bg);
-  overflow: hidden;
-}
-.docyard-code-block--has-error:not(.docyard-code-block--line-numbers):not(.docyard-code-block--diff) .highlight,
-.docyard-code-block--has-warning:not(.docyard-code-block--line-numbers):not(.docyard-code-block--diff) .highlight {
-  border: none;
-  border-radius: 0;
-}
-.docyard-code-block__content .highlight {
-  background-color: transparent;
+  margin-left: calc(-1 * var(--spacing-4));
+  margin-right: calc(-1 * var(--spacing-4));
 }
-/* Focus Effect */
 .docyard-code-block--has-focus .docyard-code-line {
   opacity: 0.4;
   filter: blur(0.5px);
@@ -329,47 +275,11 @@
   filter: none;
 }
-/* On hover, reveal all lines */
 .docyard-code-block--has-focus:hover .docyard-code-line {
   opacity: 1;
   filter: none;
 }
-/* Dark mode line numbers */
-.dark .docyard-code-block--line-numbers {
-  background-color: #161b22;
-}
-.dark .docyard-code-block__lines {
-  background-color: #161b22;
-  border-right-color: var(--color-border);
-}
-/* Dark mode diff */
-.dark .docyard-code-block--diff:not(.docyard-code-block--line-numbers) {
-  background-color: #161b22;
-}
-.dark .docyard-code-block__diff-gutter {
-  background-color: #161b22;
-  border-right-color: var(--color-border);
-}
-/* Dark mode titled block */
-.dark .docyard-code-block--titled {
-  background-color: #161b22;
-}
-.dark .docyard-code-block__header {
-  background-color: rgba(255, 255, 255, 0.03);
-}
-/* Titled block with line numbers */
-.docyard-code-block--titled.docyard-code-block--line-numbers {
-  display: block;
-  border: 1px solid var(--color-border);
-}
 .docyard-code-block--titled.docyard-code-block--line-numbers .docyard-code-block__body {
   display: flex;
 }
@@ -379,12 +289,6 @@
   min-width: 0;
 }
-/* Titled block with diff */
-.docyard-code-block--titled.docyard-code-block--diff:not(.docyard-code-block--line-numbers) {
-  display: block;
-  border: 1px solid var(--color-border);
-}
 .docyard-code-block--titled.docyard-code-block--diff:not(.docyard-code-block--line-numbers) .docyard-code-block__body {
   display: flex;
 }
@@ -394,27 +298,25 @@
   min-width: 0;
 }
-/* Inside tabs - with :has() support */
 @supports selector(:has(*)) {
   .docyard-tabs__panel:has(> [class*="language-"]:only-child) .docyard-code-block {
     margin: 0;
   }
   .docyard-tabs__panel:not(:has(> [class*="language-"]:only-child)) .docyard-code-block {
-    margin: var(--space-4) 0;
+    margin: var(--spacing-4) 0;
   }
 }
-/* Inside tabs - fallback for browsers without :has() */
 @supports not selector(:has(*)) {
   .docyard-tabs__panel .docyard-code-block {
-    margin: var(--space-4) 0;
+    margin: var(--spacing-4) 0;
   }
 }
-/* Inside callouts */
 .docyard-callout__body .docyard-code-block {
-  margin: var(--space-4) 0;
+  margin: var(--spacing-4) 0;
+  background-color: var(--background);
 }
 .docyard-callout__body .docyard-code-block:first-child {
@@ -427,115 +329,133 @@
 .docyard-code-block__copy {
   position: absolute;
-  top: var(--space-3);
-  right: var(--space-3);
-  display: flex;
+  top: var(--spacing-3);
+  right: var(--spacing-3);
+  display: inline-flex;
   align-items: center;
   justify-content: center;
-  width: 32px;
-  height: 32px;
-  padding: 0;
-  border: 1px solid var(--color-border);
-  border-radius: var(--radius-md);
-  background-color: var(--color-bg);
-  color: var(--color-text-secondary);
+  gap: var(--spacing-1-5);
+  height: 1.75rem;
+  padding: 0 var(--spacing-2-5);
+  border: none;
+  border-radius: 9999px;
+  background-color: var(--code-block-copy-bg);
+  color: var(--muted-foreground);
   cursor: pointer;
-  transition: background-color var(--transition-base), border-color var(--transition-base), color var(--transition-base);
+  flex-shrink: 0;
+  transition:
+    transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1),
+    background-color 0.2s ease,
+    color 0.2s ease,
+    box-shadow 0.2s ease;
+  box-shadow: var(--code-block-copy-shadow);
 }
 .docyard-code-block__copy:hover {
-  background-color: var(--color-bg-secondary);
-  border-color: var(--color-text-tertiary);
-  color: var(--color-text);
+  background-color: var(--code-block-copy-bg-hover);
+  color: var(--foreground);
+  box-shadow: var(--code-block-copy-shadow-hover);
 }
 .docyard-code-block__copy:active {
-  transform: scale(0.95);
+  transform: scale(0.92);
+  transition:
+    transform 0.1s cubic-bezier(0.4, 0, 1, 1),
+    background-color 0.1s ease,
+    box-shadow 0.1s ease;
+  box-shadow: var(--code-block-copy-shadow-active);
 }
 .docyard-code-block__copy:focus-visible {
-  outline: 2px solid var(--color-primary);
-  outline-offset: 2px;
+  outline: none;
+  box-shadow:
+    0 1px 2px oklch(from var(--foreground) l c h / 5%),
+    0 0 0 2px var(--background),
+    0 0 0 4px var(--ring);
 }
-/* Icon sizing */
-.docyard-code-block__copy svg {
-  width: 16px;
-  height: 16px;
-  transition: transform 0.2s ease, opacity 0.2s ease;
+.docyard-code-block__copy-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+.docyard-code-block__copy-icon svg {
+  width: 0.875rem;
+  height: 0.875rem;
+}
+.docyard-code-block__copy-text {
+  font-size: var(--text-xs);
+  font-weight: var(--font-medium);
+  font-family: var(--font-sans);
+  line-height: 1;
 }
-/* Success state */
 .docyard-code-block__copy.is-success {
-  opacity: 1;
-  visibility: visible;
-  background-color: var(--color-primary);
-  border-color: var(--color-primary);
+  background-color: var(--primary);
   color: white;
-  animation: success-pulse 0.4s ease;
+  box-shadow:
+    0 1px 2px oklch(from var(--primary) l c h / 20%),
+    0 0 0 1px oklch(from var(--primary) l c h / 30%);
 }
 .docyard-code-block__copy.is-success:hover {
-  background-color: var(--color-primary-hover);
-  border-color: var(--color-primary-hover);
+  background-color: oklch(from var(--primary) calc(l - 0.03) c h);
   color: white;
+  box-shadow:
+    0 2px 4px oklch(from var(--primary) l c h / 25%),
+    0 0 0 1px oklch(from var(--primary) l c h / 35%);
 }
-.docyard-code-block__copy.is-success svg {
-  animation: check-pop 0.3s ease;
-}
-/* Success animation */
-@keyframes success-pulse {
-  0% {
-    transform: scale(1);
-  }
-  50% {
-    transform: scale(1.1);
-  }
-  100% {
-    transform: scale(1);
-  }
+.docyard-code-block__copy.is-success .docyard-code-block__copy-icon svg {
+  animation: check-pop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
 }
 @keyframes check-pop {
   0% {
-    transform: scale(0) rotate(-45deg);
     opacity: 0;
+    transform: scale(0);
+  }
+  40% {
+    opacity: 1;
+    transform: scale(1.2);
   }
-  50% {
-    transform: scale(1.2) rotate(10deg);
+  70% {
+    transform: scale(0.9);
   }
   100% {
-    transform: scale(1) rotate(0deg);
     opacity: 1;
+    transform: scale(1);
   }
 }
-/* Error state */
 .docyard-code-block__copy.is-error {
   opacity: 1;
   visibility: visible;
-  background-color: #ef4444;
-  border-color: #ef4444;
+  background-color: var(--destructive);
+  border-color: var(--destructive);
   color: white;
 }
 .docyard-code-block__copy.is-error:hover {
-  background-color: #dc2626;
-  border-color: #dc2626;
+  background-color: oklch(from var(--destructive) calc(l - 0.05) c h);
+  border-color: oklch(from var(--destructive) calc(l - 0.05) c h);
   color: white;
 }
-/* Mobile responsive - header */
 @media (max-width: 640px) {
   .docyard-code-block__header {
-    padding: var(--space-2) var(--space-3);
-    gap: var(--space-2);
+    padding: var(--spacing-2) var(--spacing-3);
+    gap: var(--spacing-2);
   }
   .docyard-code-block__icon .docyard-icon {
@@ -544,47 +464,25 @@
   }
   .docyard-code-block__header .docyard-code-block__copy {
-    width: 28px;
-    height: 28px;
+    height: 1.5rem;
+    padding: 0 var(--spacing-2);
+    gap: var(--spacing-1);
   }
-  .docyard-code-block__header .docyard-code-block__copy svg {
-    width: 14px;
-    height: 14px;
+  .docyard-code-block__copy-icon svg {
+    width: 0.75rem;
+    height: 0.75rem;
   }
-}
-/* Dark mode adjustments */
-.dark .docyard-code-block__copy {
-  background-color: var(--color-bg-secondary);
-  border-color: var(--color-border);
-}
-.dark .docyard-code-block__copy:hover {
-  background-color: var(--color-bg-tertiary);
-  border-color: var(--color-text-tertiary);
-}
-/* Dark mode success state */
-.dark .docyard-code-block__copy.is-success {
-  background-color: var(--color-primary);
-  border-color: var(--color-primary);
-}
-.dark .docyard-code-block__copy.is-success:hover {
-  background-color: var(--color-primary-hover);
-  border-color: var(--color-primary-hover);
-}
-.dark .docyard-code-block__copy.is-error {
-  background-color: #ef4444;
-  border-color: #ef4444;
+  .docyard-code-block__copy-text {
+    font-size: 0.625rem;
+  }
 }
-/* Reduced motion */
 @media (prefers-reduced-motion: reduce) {
   .docyard-code-block__copy,
-  .docyard-code-block__copy svg {
+  .docyard-code-block__copy-icon svg {
     transition: none;
     animation: none;
   }