@semantic-components/ui 0.57.0 → 0.61.0

package/scrollbar-styles.css

@@ -1,11 +0,0 @@
-::-webkit-scrollbar {
-  @apply w-2.5 h-2.5;
-}
-
-::-webkit-scrollbar-track {
-  @apply bg-transparent;
-}
-
-::-webkit-scrollbar-thumb {
-  @apply rounded-full bg-border border-[1px] border-transparent border-solid bg-clip-padding;
-}

package/shiki-styles.css

@@ -1,3 +0,0 @@
-pre.shiki {
-  @apply p-6 rounded-md overflow-auto border-1;
-}

package/tiptap-styles.css

@@ -1,72 +0,0 @@
-/* tiptap-styles.css */
-
-/* Base styles for the editor content */
-.ProseMirror {
-  @apply text-base text-foreground;
-}
-
-/* Placeholder */
-.ProseMirror p.is-editor-empty:first-child::before {
-  content: attr(data-placeholder);
-  @apply text-muted-foreground float-left h-0 pointer-events-none;
-}
-
-/* Headings */
-.ProseMirror h1 {
-  @apply text-3xl font-bold mt-6 mb-4;
-}
-
-.ProseMirror h2 {
-  @apply text-2xl font-bold mt-5 mb-3;
-}
-
-.ProseMirror h3 {
-  @apply text-xl font-bold mt-4 mb-2;
-}
-
-/* Paragraphs and spacing */
-.ProseMirror p {
-  @apply my-2;
-}
-
-/* Lists */
-.ProseMirror ul {
-  @apply list-disc pl-6 my-2;
-}
-
-.ProseMirror ol {
-  @apply list-decimal pl-6 my-2;
-}
-
-/* Block quotes */
-.ProseMirror blockquote {
-  @apply border-l-4 border-muted pl-4 italic my-4;
-}
-
-/* Code blocks */
-.ProseMirror pre {
-  @apply bg-muted p-2 rounded my-2 text-sm font-mono;
-}
-
-.ProseMirror code {
-  @apply bg-muted px-1 py-0.5 rounded text-sm font-mono;
-}
-
-/* Table styles */
-.ProseMirror table {
-  @apply border-collapse w-full my-4;
-}
-
-.ProseMirror th {
-  @apply border border-border bg-muted font-bold p-2;
-}
-
-.ProseMirror td {
-  @apply border border-border p-2;
-}
-
-/* Dark mode adjustments - these will be applied when dark mode is active */
-.dark .ProseMirror pre,
-.dark .ProseMirror code {
-  @apply bg-muted text-muted-foreground;
-}

package/typography-styles.css

@@ -1,304 +0,0 @@
-.prose {
-  --prose-color: var(--color-gray-700);
-  --prose-heading-color: var(--color-gray-950);
-  --prose-strong-color: var(--color-gray-950);
-  --prose-link-color: var(--color-gray-950);
-  --prose-code-color: var(--color-gray-950);
-  --prose-marker-color: color-mix(in oklab, var(--color-gray-700) 25%, transparent);
-  --prose-link-underline-color: var(--color-sky-400);
-  --prose-th-borders: var(--color-gray-300);
-  --prose-td-borders: var(--color-gray-200);
-  --prose-hr-color: color-mix(in oklab, var(--color-gray-950) 5%, transparent);
-  --prose-blockquote-border-color: var(--color-gray-300);
-
-  &:where(.dark, .dark *) {
-    --prose-color: var(--color-gray-300);
-    --prose-heading-color: var(--color-white);
-    --prose-strong-color: var(--color-white);
-    --prose-link-color: var(--color-white);
-    --prose-code-color: var(--color-white);
-    --prose-marker-color: color-mix(in oklab, var(--color-gray-300) 35%, transparent);
-    --prose-link-underline-color: var(--color-sky-400);
-    --prose-th-borders: var(--color-gray-600);
-    --prose-td-borders: var(--color-gray-700);
-    --prose-hr-color: color-mix(in oklab, var(--color-white) 10%, transparent);
-    --prose-blockquote-border-color: var(--color-gray-600);
-  }
-  @media (prefers-color-scheme: dark) {
-    &:where(.system, .system *) {
-      --prose-color: var(--color-gray-300);
-      --prose-heading-color: var(--color-white);
-      --prose-strong-color: var(--color-white);
-      --prose-link-color: var(--color-white);
-      --prose-code-color: var(--color-white);
-      --prose-marker-color: color-mix(in oklab, var(--color-gray-300) 35%, transparent);
-      --prose-link-underline-color: var(--color-sky-400);
-      --prose-th-borders: var(--color-gray-600);
-      --prose-td-borders: var(--color-gray-700);
-      --prose-hr-color: color-mix(in oklab, var(--color-white) 10%, transparent);
-      --prose-blockquote-border-color: var(--color-gray-600);
-    }
-  }
-
-  color: var(--prose-color);
-  font-size: var(--text-sm);
-  line-height: 2;
-
-  *:where(:not(.not-prose, .not-prose *)) + *:where(:not(.not-prose, .not-prose *)) {
-    margin-top: calc(var(--spacing) * 6);
-  }
-
-  h2:where(:not(.not-prose, .not-prose *)) {
-    font-size: var(--text-lg);
-    line-height: calc(28 / 18);
-    letter-spacing: -0.025em;
-    color: var(--prose-code-color);
-    font-weight: var(--font-weight-semibold);
-    margin-top: calc(var(--spacing) * 20);
-  }
-
-  h2:has(+ h3):where(:not(.not-prose, .not-prose *)) {
-    font-size: var(--text-xs);
-    line-height: 2;
-    font-weight: var(--font-weight-medium);
-    font-family: var(--font-mono);
-    font-variant-ligatures: none;
-    letter-spacing: 0.1em;
-    color: var(--prose-color);
-    text-transform: uppercase;
-  }
-
-  h3:where(:not(.not-prose, .not-prose *)) {
-    font-size: var(--text-base);
-    line-height: calc(28 / 18);
-    color: var(--prose-heading-color);
-    font-weight: var(--font-weight-semibold);
-    margin-top: calc(var(--spacing) * 16);
-  }
-
-  h2 + h3:where(:not(.not-prose, .not-prose *)) {
-    margin-top: calc(var(--spacing) * 6);
-  }
-
-  h4:where(:not(.not-prose, .not-prose *)) {
-    font-size: var(--text-sm);
-    line-height: calc(28 / 14);
-    color: var(--prose-heading-color);
-    font-weight: var(--font-weight-semibold);
-    margin-top: calc(var(--spacing) * 12);
-  }
-
-  :is(h2, h3, h4):where(:not(.not-prose, .not-prose *)) {
-    scroll-margin-top: calc(var(--spacing) * 32);
-    @variant lg {
-      scroll-margin-top: calc(var(--spacing) * 18);
-    }
-  }
-
-  ul:where(:not(.not-prose, .not-prose *)) {
-    padding-left: calc(var(--spacing) * 6);
-    list-style-type: square;
-  }
-
-  ul li:where(:not(.not-prose, .not-prose *)) {
-    padding-left: calc(var(--spacing) * 3);
-  }
-
-  ul li + li:where(:not(.not-prose, .not-prose *)) {
-    margin-top: calc(var(--spacing) * 4);
-  }
-
-  ul li:where(:not(.not-prose, .not-prose *))::marker {
-    color: var(--prose-marker-color);
-  }
-
-  a:not(:where(:is(h2, h3, h4) *)):where(:not(.not-prose, .not-prose *)) {
-    color: var(--prose-link-color);
-    font-weight: var(--font-weight-semibold);
-    text-decoration: underline;
-    text-underline-offset: 3px;
-    text-decoration-color: var(--prose-link-underline-color);
-    text-decoration-thickness: 1px;
-    & code {
-      font-weight: var(--font-weight-semibold);
-    }
-  }
-
-  a:hover:where(:not(.not-prose, .not-prose *)) {
-    text-decoration-thickness: 2px;
-  }
-
-  strong:where(:not(.not-prose, .not-prose *)) {
-    color: var(--prose-strong-color);
-    font-weight: var(--font-weight-semibold);
-  }
-
-  code:where(:not(.not-prose, .not-prose *)) {
-    font-variant-ligatures: none;
-    font-family: var(--font-mono);
-    font-weight: var(--font-weight-medium);
-    color: var(--prose-code-color);
-  }
-
-  :where(h2, h3, h4) code:where(:not(.not-prose, .not-prose *)) {
-    font-weight: var(--font-weight-semibold);
-  }
-
-  code:where(:not(.not-prose, .not-prose *))::before,
-  code:where(:not(.not-prose, .not-prose *))::after {
-    display: inline;
-    content: '`';
-  }
-
-  pre:where(:not(.not-prose, .not-prose *)) {
-    margin-top: calc(var(--spacing) * 4);
-    margin-bottom: calc(var(--spacing) * 10);
-  }
-
-  pre code * + *:where(:not(.not-prose, .not-prose *)) {
-    margin-top: 0;
-  }
-
-  pre code:where(:not(.not-prose, .not-prose *))::before,
-  pre code:where(:not(.not-prose, .not-prose *))::after {
-    content: none;
-  }
-
-  pre code:where(:not(.not-prose, .not-prose *)) {
-    font-variant-ligatures: none;
-    font-family: var(--font-mono);
-    font-size: var(--text-sm);
-    line-height: 2;
-  }
-
-  table:where(:not(.not-prose, .not-prose *)) {
-    width: 100%;
-    table-layout: auto;
-    margin-top: 2em;
-    margin-bottom: 2em;
-    font-size: var(--text-sm);
-    line-height: 1.4;
-  }
-
-  thead:where(:not(.not-prose, .not-prose *)) {
-    border-bottom-width: 1px;
-    border-bottom-color: var(--prose-th-borders);
-  }
-
-  thead th:where(:not(.not-prose, .not-prose *)) {
-    color: var(--prose-heading-color);
-    font-weight: 600;
-    vertical-align: bottom;
-    padding-inline-end: 0.6em;
-    padding-bottom: 0.8em;
-    padding-inline-start: 0.6em;
-  }
-
-  thead th:first-child:where(:not(.not-prose, .not-prose *)) {
-    padding-inline-start: 0;
-  }
-
-  thead th:last-child:where(:not(.not-prose, .not-prose *)) {
-    padding-inline-end: 0;
-  }
-
-  tbody tr:where(:not(.not-prose, .not-prose *)) {
-    border-bottom-width: 1px;
-    border-bottom-color: var(--prose-td-borders);
-  }
-
-  tbody tr:last-child:where(:not(.not-prose, .not-prose *)) {
-    border-bottom-width: 0;
-  }
-
-  tbody td:where(:not(.not-prose, .not-prose *)) {
-    vertical-align: baseline;
-  }
-
-  tfoot:where(:not(.not-prose, .not-prose *)) {
-    border-top-width: 1px;
-    border-top-color: var(--prose-th-borders);
-  }
-
-  tfoot td:where(:not(.not-prose, .not-prose *)) {
-    vertical-align: top;
-  }
-
-  tbody td:where(:not(.not-prose, .not-prose *)),
-  tfoot td:where(:not(.not-prose, .not-prose *)) {
-    padding-top: 0.8em;
-    padding-inline-end: 0.6em;
-    padding-bottom: 0.8em;
-    padding-inline-start: 0.6em;
-  }
-
-  tbody td:first-child:where(:not(.not-prose, .not-prose *)),
-  tfoot td:first-child:where(:not(.not-prose, .not-prose *)) {
-    padding-inline-start: 0;
-  }
-
-  tbody td:last-child:where(:not(.not-prose, .not-prose *)),
-  tfoot td:last-child:where(:not(.not-prose, .not-prose *)) {
-    padding-inline-end: 0;
-  }
-
-  th:where(:not(.not-prose, .not-prose *)),
-  td:where(:not(.not-prose, .not-prose *)) {
-    text-align: start;
-  }
-
-  td code:where(:not(.not-prose, .not-prose *)) {
-    font-size: 0.8125rem;
-  }
-
-  hr:where(:not(.not-prose, .not-prose *)) {
-    border-color: var(--prose-hr-color);
-    margin-block: --spacing(16);
-    & + h2 {
-      margin-top: --spacing(16);
-    }
-  }
-
-  blockquote {
-    font-style: italic;
-    border-inline-start-width: 0.25rem;
-    border-inline-start-color: var(--prose-blockquote-border-color);
-    padding-inline-start: calc(var(--spacing) * 4);
-  }
-
-  blockquote p:first-of-type::before {
-    content: open-quote;
-  }
-
-  blockquote p:last-of-type::after {
-    content: close-quote;
-  }
-
-  figure:where(:not(.not-prose, .not-prose *)) {
-    figcaption:where(:not(.not-prose, .not-prose *)) {
-      margin-top: calc(var(--spacing) * 3);
-      text-align: center;
-      font-size: var(--text-sm);
-      line-height: var(--text-sm--line-height);
-      font-style: italic;
-      color: color-mix(in oklab, var(--prose-color) 75%, transparent);
-    }
-  }
-
-  :first-child:where(:not(.not-prose, .not-prose *)) {
-    margin-top: 0;
-  }
-
-  :last-child:where(:not(.not-prose, .not-prose *)) {
-    margin-bottom: 0;
-  }
-}
-
-.prose-blog {
-  img:where(:not(.not-prose, .not-prose *)) {
-    @media (max-width: theme(--breakpoint-sm)) {
-      margin-inline: calc(var(--spacing) * -4);
-      max-width: calc(100% + calc(var(--spacing) * 8));
-    }
-  }
-}