boltdocs 1.10.2 → 1.11.0

package/src/client/theme/components/mdx/mdx-components.css

@@ -1,764 +0,0 @@
-/* ═══════════════════════════════════════════════════════════
-   MDX UI COMPONENTS
-   All variables use --ld-ui-* to avoid conflicts with
-   layout elements (sidebar, TOC, navbar).
-   ═══════════════════════════════════════════════════════════ */
-
-/* ─── Button ──────────────────────────────────────────────── */
-.ld-btn {
-  /* Total Reset */
-  all: unset;
-  box-sizing: border-box !important;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  gap: 0.5rem;
-
-  /* Typography */
-  font-family: var(--ld-font-sans);
-  font-weight: 600;
-  font-size: 0.9375rem;
-  line-height: normal; /* Essential for flex centering */
-  letter-spacing: -0.01em;
-  text-align: center;
-  text-decoration: none !important;
-  white-space: nowrap;
-
-  /* Appearance */
-  border-radius: var(--ld-radius-md);
-  cursor: pointer;
-  transition: all 250ms cubic-bezier(0.4, 0, 0.2, 1);
-  border: 1px solid transparent;
-  user-select: none;
-  position: relative;
-}
-
-.ld-btn:hover {
-  transform: translateY(-1px);
-}
-
-.ld-btn:active {
-  transform: translateY(0) scale(0.98);
-}
-
-/* sizes */
-.ld-btn--sm {
-  min-height: 2rem;
-  padding: 0 1rem;
-  font-size: 0.8125rem;
-  border-radius: var(--ld-radius-md);
-}
-.ld-btn--md {
-  min-height: 2.625rem;
-  padding: 0 1.6rem;
-  font-size: 0.9375rem;
-}
-.ld-btn--lg {
-  min-height: 3.25rem;
-  padding: 0 2.2rem;
-  font-size: 1.05rem;
-}
-
-/* variants */
-.ld-btn--primary {
-  background-color: var(
-    --ld-ui-btn-primary-bg,
-    var(--ld-btn-primary-bg)
-  ) !important;
-  color: var(--ld-ui-btn-primary-text, var(--ld-btn-primary-text)) !important;
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
-}
-.ld-btn--primary:hover {
-  filter: brightness(1.1);
-}
-
-.ld-btn--secondary {
-  background-color: var(
-    --ld-ui-btn-secondary-bg,
-    var(--ld-btn-secondary-bg)
-  ) !important;
-  color: var(
-    --ld-ui-btn-secondary-text,
-    var(--ld-btn-secondary-text)
-  ) !important;
-  border-color: var(--ld-border-subtle);
-}
-.ld-btn--secondary:hover {
-  background-color: var(--ld-bg-mute);
-  border-color: var(--ld-border-strong);
-}
-
-.ld-btn--outline {
-  background: transparent !important;
-  color: var(--ld-text-main) !important;
-  border-color: var(--ld-border-strong);
-}
-.ld-btn--outline:hover {
-  background-color: var(--ld-bg-soft);
-  border-color: var(--ld-color-primary);
-}
-
-.ld-btn--ghost {
-  background: transparent !important;
-  color: var(--ld-text-muted) !important;
-}
-.ld-btn--ghost:hover {
-  background-color: var(--ld-bg-soft);
-  color: var(--ld-text-main) !important;
-}
-
-/* ─── Badge ───────────────────────────────────────────────── */
-.ld-badge {
-  display: inline-flex;
-  align-items: center;
-  padding: 0.3rem 0.85rem;
-  font-size: 0.75rem;
-  font-weight: 600;
-  border-radius: var(--ld-radius-full);
-  line-height: 1.4;
-  white-space: nowrap;
-  letter-spacing: 0.01em;
-}
-
-.ld-badge--default {
-  background: var(--ld-bg-mute);
-  color: var(--ld-text-main);
-  border: 1px solid var(--ld-border-subtle);
-}
-.ld-badge--primary {
-  background: var(--ld-color-primary-muted);
-  color: var(--ld-color-primary);
-  border: 1px solid rgba(127, 19, 236, 0.2);
-}
-.ld-badge--success {
-  background: var(--ld-ui-success-bg);
-  color: var(--ld-ui-success-text);
-  border: 1px solid var(--ld-ui-success-border);
-}
-.ld-badge--warning {
-  background: var(--ld-ui-warning-bg);
-  color: var(--ld-ui-warning-text);
-  border: 1px solid var(--ld-ui-warning-border);
-}
-.ld-badge--danger {
-  background: var(--ld-ui-danger-bg);
-  color: var(--ld-ui-danger-text);
-  border: 1px solid var(--ld-ui-danger-border);
-}
-.ld-badge--info {
-  background: var(--ld-ui-info-bg);
-  color: var(--ld-ui-info-text);
-  border: 1px solid var(--ld-ui-info-border);
-}
-
-/* ─── Cards ───────────────────────────────────────────────── */
-.ld-cards {
-  display: grid;
-  gap: 1rem;
-  margin: 1.5rem 0;
-}
-.ld-cards--1 {
-  grid-template-columns: 1fr;
-}
-.ld-cards--2 {
-  grid-template-columns: repeat(2, 1fr);
-}
-.ld-cards--3 {
-  grid-template-columns: repeat(3, 1fr);
-}
-.ld-cards--4 {
-  grid-template-columns: repeat(4, 1fr);
-}
-
-@media (max-width: 768px) {
-  .ld-cards--2,
-  .ld-cards--3,
-  .ld-cards--4 {
-    grid-template-columns: 1fr;
-  }
-}
-
-.ld-card {
-  position: relative;
-  padding: 1.35rem 1.5rem;
-  border-radius: var(--ld-radius-lg);
-  border: 1px solid var(--ld-border-subtle);
-  background: var(--ld-bg-soft);
-  transition: all 300ms cubic-bezier(0.16, 1, 0.3, 1);
-  text-decoration: none !important;
-  backdrop-filter: blur(var(--ld-navbar-blur));
-  -webkit-backdrop-filter: blur(var(--ld-navbar-blur));
-  color: inherit;
-  overflow: hidden;
-}
-
-/* Subtle inner glow on top edge */
-.ld-card::before {
-  content: "";
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  height: 1px;
-  background: linear-gradient(
-    90deg,
-    transparent,
-    var(--ld-border-strong),
-    transparent
-  );
-  opacity: 0;
-  transition: opacity 0.3s ease;
-}
-
-.ld-card:hover {
-  border-color: var(--ld-color-primary);
-  transform: translateY(-3px);
-}
-.ld-card:hover::before {
-  opacity: 1;
-  background: linear-gradient(
-    90deg,
-    transparent,
-    var(--ld-color-primary),
-    transparent
-  );
-}
-
-.ld-card--link {
-  cursor: pointer;
-}
-.ld-card--link:hover {
-  text-decoration: none !important;
-}
-
-.ld-card__icon {
-  font-size: 1.6rem;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 2.5rem;
-  height: 2.5rem;
-  margin-bottom: 0.85rem;
-}
-.ld-card__title {
-  font-size: 0.95rem;
-  font-weight: 700;
-  margin: 0 0 0.4rem;
-  color: var(--ld-text-main);
-  letter-spacing: -0.01em;
-}
-.ld-card__body {
-  font-size: 0.85rem;
-  color: var(--ld-text-muted);
-  line-height: 1.55;
-  margin: 0;
-}
-.ld-card__body p {
-  margin: 0;
-}
-
-/* ─── Tabs ────────────────────────────────────────────────── */
-.ld-tabs {
-  margin: 1.5rem 0;
-  border: 1px solid var(--ld-border-subtle);
-  border-radius: var(--ld-radius-lg);
-  overflow: hidden;
-  background: var(--ld-bg-soft);
-}
-
-.ld-tabs__bar {
-  display: flex;
-  gap: 0;
-  background-color: var(--ld-bg-mute);
-  border-bottom: 1px solid var(--ld-border-subtle);
-  overflow-x: auto;
-}
-
-.ld-tabs__trigger {
-  position: relative;
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  padding: 0.65rem 1.25rem;
-  background: none;
-  border: none;
-  border-bottom: 2px solid transparent;
-  color: var(--ld-text-dim);
-  font-family: var(--ld-font-sans);
-  font-size: 0.8125rem;
-  font-weight: 500;
-  cursor: pointer;
-  transition: all 0.2s ease;
-  white-space: nowrap;
-}
-
-.ld-tabs__trigger svg {
-  width: 1rem;
-  height: 1rem;
-}
-.ld-tabs__trigger:hover {
-  color: var(--ld-text-main);
-  background-color: rgba(255, 255, 255, 0.03);
-}
-.ld-tabs__trigger--active {
-  color: var(--ld-color-primary);
-  border-bottom-color: var(--ld-color-primary);
-  background-color: transparent;
-}
-
-.ld-tabs__content {
-  padding: 1.25rem;
-}
-
-.ld-tab-panel {
-  font-size: 0.9rem;
-  line-height: 1.7;
-  color: var(--ld-text-muted);
-}
-
-/* ─── Admonition ──────────────────────────────────────────── */
-.ld-admonition {
-  margin: 1.5rem 0;
-  border-radius: var(--ld-radius-lg);
-  border: 1px solid;
-  overflow: hidden;
-}
-
-.ld-admonition__header {
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  padding: 0.6rem 1.1rem;
-  font-weight: 600;
-  font-size: 0.8rem;
-  text-transform: uppercase;
-  letter-spacing: 0.04em;
-}
-
-.ld-admonition__icon {
-  display: inline-flex;
-  align-items: center;
-}
-
-.ld-admonition__body {
-  padding: 0.6rem 1.1rem 1rem;
-  font-size: 0.875rem;
-  line-height: 1.7;
-  color: var(--ld-text-muted);
-}
-.ld-admonition__body p {
-  margin: 0 0 0.5rem;
-}
-.ld-admonition__body p:last-child {
-  margin-bottom: 0;
-}
-
-/* Admonition — Note (blue) */
-.ld-admonition--note {
-  border-color: var(--ld-ui-note-border);
-  background-color: var(--ld-ui-note-bg);
-}
-.ld-admonition--note .ld-admonition__header {
-  color: var(--ld-ui-note-text);
-}
-
-/* Admonition — Tip (green) */
-.ld-admonition--tip {
-  border-color: var(--ld-ui-tip-border);
-  background-color: var(--ld-ui-tip-bg);
-}
-.ld-admonition--tip .ld-admonition__header {
-  color: var(--ld-ui-tip-text);
-}
-
-/* Admonition — Info (blue) */
-.ld-admonition--info {
-  border-color: var(--ld-ui-info-border);
-  background-color: var(--ld-ui-info-bg);
-}
-.ld-admonition--info .ld-admonition__header {
-  color: var(--ld-ui-info-text);
-}
-
-/* Admonition — Warning (amber) */
-.ld-admonition--warning {
-  border-color: var(--ld-ui-warning-border);
-  background-color: var(--ld-ui-warning-bg);
-}
-.ld-admonition--warning .ld-admonition__header {
-  color: var(--ld-ui-warning-text);
-}
-
-/* Admonition — Danger (red) */
-.ld-admonition--danger {
-  border-color: var(--ld-ui-danger-border);
-  background-color: var(--ld-ui-danger-bg);
-}
-.ld-admonition--danger .ld-admonition__header {
-  color: var(--ld-ui-danger-text);
-}
-
-/* ─── List ────────────────────────────────────────────────── */
-.ld-list {
-  margin: 1rem 0;
-  padding-left: 0;
-  list-style: none;
-}
-.ld-list--checked,
-.ld-list--arrow {
-  padding-left: 0;
-}
-
-.ld-list__item {
-  display: flex;
-  align-items: flex-start;
-  gap: 0.6rem;
-  padding: 0.35rem 0;
-  color: var(--ld-text-muted);
-  font-size: 0.9rem;
-  line-height: 1.6;
-}
-
-.ld-list__icon {
-  flex-shrink: 0;
-  margin-top: 0.25rem;
-}
-
-.ld-list--checked .ld-list__icon {
-  color: var(--ld-ui-success-text);
-}
-.ld-list--arrow .ld-list__icon {
-  color: var(--ld-color-primary);
-}
-
-/* ─── FileTree ────────────────────────────────────────────── */
-.ld-file-tree {
-  margin: 1.5rem 0;
-  padding: 1rem;
-  border-radius: var(--ld-radius-lg);
-  border: 1px solid var(--ld-border-subtle);
-  background: var(--ld-bg-soft);
-  font-family: var(--ld-font-mono);
-  font-size: 0.875rem;
-  overflow-x: auto;
-}
-
-.ld-file-tree__list {
-  list-style: none !important;
-  margin: 0 !important;
-  padding: 0;
-  position: relative;
-}
-
-.ld-file-tree__list:not(.ld-file-tree__list--root) {
-  padding-left: 1.25rem;
-  margin-top: 0.25rem !important;
-  position: relative;
-}
-
-/* Vertical line for nested folders */
-.ld-file-tree__list:not(.ld-file-tree__list--root)::before {
-  content: "";
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0.45rem; /* align with folder icon */
-  width: 1px;
-  background-color: var(--ld-border-subtle);
-  z-index: 0;
-}
-
-.ld-file-tree__item {
-  position: relative;
-  margin: 0.2rem 0 !important;
-  padding: 0 !important;
-  display: block !important;
-}
-
-.ld-file-tree__label {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.5rem;
-  color: var(--ld-text-muted);
-  user-select: none;
-  border-radius: var(--ld-radius-sm);
-  padding: 0.25rem 0.6rem 0.25rem 0.4rem;
-  transition: all 0.2s ease;
-  position: relative;
-  z-index: 1;
-}
-
-.ld-file-tree__label:hover {
-  background: var(--ld-bg-mute);
-  color: var(--ld-text-main);
-}
-
-.ld-file-tree__label--folder {
-  color: var(--ld-text-main);
-  font-weight: 500;
-}
-
-.ld-file-tree__icon {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  opacity: 0.8;
-  flex-shrink: 0;
-}
-
-.ld-file-tree__icon-folder {
-  color: var(--ld-color-primary);
-}
-
-.ld-file-tree__name {
-  white-space: nowrap;
-}
-
-.ld-file-tree__icon--chevron {
-  width: 14px;
-  height: 14px;
-  opacity: 0.5;
-  transition: opacity 0.2s ease;
-  display: flex !important;
-  align-items: center;
-  justify-content: center;
-}
-
-.ld-file-tree__label:hover .ld-file-tree__icon--chevron {
-  opacity: 1;
-}
-
-.ld-file-tree__chevron {
-  transition: transform 0.2s ease;
-}
-
-.ld-file-tree__chevron--open {
-  transform: rotate(90deg);
-}
-
-.ld-file-tree__icon--spacer {
-  width: 14px;
-}
-
-/* ─── Table ───────────────────────────────────────────────── */
-.ld-table-container {
-  margin: 1.5rem 0;
-  border: 1px solid var(--ld-border-subtle);
-  border-radius: var(--ld-radius-lg);
-  overflow: hidden;
-  background: var(--ld-bg-soft);
-  display: flex;
-  flex-direction: column;
-}
-
-.ld-table-wrapper {
-  overflow-x: auto;
-  scrollbar-width: thin;
-}
-
-.ld-table {
-  width: 100%;
-  border-collapse: collapse;
-  text-align: left;
-  font-size: 0.875rem;
-  line-height: 1.5;
-}
-
-.ld-table thead {
-  background: var(--ld-bg-mute);
-  border-bottom: 1px solid var(--ld-border-subtle);
-}
-
-.ld-table th {
-  padding: 0.75rem 1rem;
-  font-weight: 600;
-  color: var(--ld-text-main);
-  font-size: 0.8125rem;
-  text-transform: uppercase;
-  letter-spacing: 0.04em;
-  white-space: nowrap;
-}
-
-.ld-table-header--sortable {
-  cursor: pointer;
-  transition: background-color 0.2s;
-}
-
-.ld-table-header--sortable:hover {
-  background-color: var(--ld-bg-soft);
-}
-
-.ld-table-header-content {
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-}
-
-.ld-table-sort-icon {
-  opacity: 0.8;
-  color: var(--ld-color-primary);
-  transition: opacity 0.2s;
-}
-
-.ld-table-sort-icon--hidden {
-  opacity: 0;
-}
-
-.ld-table-header--sortable:hover .ld-table-sort-icon--hidden {
-  opacity: 0.3;
-}
-
-.ld-table td {
-  padding: 0.875rem 1rem;
-  color: var(--ld-text-muted);
-  border-bottom: 1px solid var(--ld-border-subtle);
-}
-
-.ld-table tr:last-child td {
-  border-bottom: none;
-}
-
-.ld-table code {
-  font-size: 0.8rem;
-  padding: 0.2rem 0.4rem;
-  background: rgba(255, 255, 255, 0.05);
-  border-radius: 4px;
-}
-
-/* Pagination */
-.ld-table-pagination {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 0.75rem 1rem;
-  background: var(--ld-bg-mute);
-  border-top: 1px solid var(--ld-border-subtle);
-  font-size: 0.75rem;
-  color: var(--ld-text-dim);
-}
-
-.ld-table-pagination-controls {
-  display: flex;
-  align-items: center;
-  gap: 0.25rem;
-}
-
-.ld-table-pagination-btn {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 1.75rem;
-  height: 1.75rem;
-  border-radius: var(--ld-radius-md);
-  border: 1px solid var(--ld-border-subtle);
-  background: var(--ld-bg-soft);
-  color: var(--ld-text-muted);
-  cursor: pointer;
-  transition: all 0.2s;
-}
-
-.ld-table-pagination-btn:hover:not(:disabled) {
-  background: var(--ld-bg-mute);
-  color: var(--ld-text-main);
-  border-color: var(--ld-border-strong);
-}
-
-.ld-table-pagination-btn:disabled {
-  opacity: 0.4;
-  cursor: not-allowed;
-}
-/* ─── Field ───────────────────────────────────────────────── */
-.ld-field {
-  margin: 1.5rem 0;
-  padding: 1.25rem;
-  border-radius: var(--ld-radius-lg);
-  border: 1px solid var(--ld-border-subtle);
-  background: var(--ld-bg-soft);
-  position: relative;
-  transition: border-color 0.2s ease, box-shadow 0.2s ease;
-}
-
-.ld-field:hover {
-  border-color: var(--ld-color-primary);
-  box-shadow: 0 4px 20px -8px rgba(127, 19, 236, 0.15);
-}
-
-.ld-field__header {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  justify-content: space-between;
-  gap: 1rem;
-  margin-bottom: 0.85rem;
-  padding-bottom: 0.85rem;
-  border-bottom: 1px solid var(--ld-border-subtle);
-}
-
-.ld-field__signature {
-  display: flex;
-  align-items: center;
-  gap: 0.75rem;
-}
-
-.ld-field__name {
-  font-family: var(--ld-font-mono);
-  font-size: 0.95rem;
-  font-weight: 700;
-  color: var(--ld-text-main);
-  background: rgba(127, 19, 236, 0.08);
-  padding: 0.2rem 0.6rem;
-  border-radius: var(--ld-radius-sm);
-  letter-spacing: -0.01em;
-}
-
-.ld-field__type-badge {
-  font-family: var(--ld-font-mono);
-  font-size: 0.75rem;
-  font-weight: 500;
-  color: var(--ld-color-primary);
-  background: var(--ld-color-primary-muted);
-  padding: 0.15rem 0.5rem;
-  border-radius: var(--ld-radius-full);
-  border: 1px solid rgba(127, 19, 236, 0.2);
-}
-
-.ld-field__required-badge {
-  font-size: 0.7rem;
-  font-weight: 700;
-  text-transform: uppercase;
-  color: var(--ld-ui-danger-text);
-  background: var(--ld-ui-danger-bg);
-  padding: 0.1rem 0.4rem;
-  border-radius: var(--ld-radius-sm);
-  letter-spacing: 0.05em;
-}
-
-.ld-field__default {
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  font-size: 0.8rem;
-}
-
-.ld-field__default-label {
-  color: var(--ld-text-dim);
-  font-weight: 500;
-}
-
-.ld-field__default-value {
-  font-family: var(--ld-font-mono);
-  color: var(--ld-text-main);
-  background: var(--ld-bg-mute);
-  padding: 0.15rem 0.4rem;
-  border-radius: var(--ld-radius-sm);
-}
-
-.ld-field__content {
-  font-size: 0.875rem;
-  line-height: 1.6;
-  color: var(--ld-text-muted);
-}
-
-.ld-field__content p {
-  margin: 0;
-}