@casoon/dragonfly/ui/components/code.css

Modular, lightweight CSS framework and design system for modern web projects. Optimized for Astro JS, LightningCSS and Container Queries with @layer-based architecture and comprehensive accessibility.

/**
 * Code-Element Styles
 */

@layer elements {
  /* Code */
  code {
    background-color: var(--color-background-alt, #f9fafb);
    border-radius: 3px;
    padding: 01.2em 0.4em;
  }

  pre {
    background-color: var(--color-background-alt, #f9fafb);
    border-radius: 4px;
    margin: 1rem 0;
    overflow-x: auto;
    padding: 1rem;
  }

  pre code {
    background-color: transparent;
    padding: 0;
  }
}