@splitin/verification-react 0.1.0-beta.0

package/src/styles.css

@@ -0,0 +1,71 @@
+.siv {
+  color: var(--siv-fg, #111827);
+  background: var(--siv-bg, #ffffff);
+  font-family: var(--siv-font, system-ui, sans-serif);
+  border-radius: var(--siv-radius, 16px);
+}
+
+.siv-dialog {
+  max-width: min(760px, calc(100% - 32px));
+  border: 1px solid var(--siv-border, #e5e7eb);
+  padding: var(--siv-space, 16px);
+}
+
+.siv-dialog[data-reduced-motion='true'] * {
+  animation: none !important;
+  transition: none !important;
+}
+
+.siv-header, .siv-footer {
+  display: flex;
+  gap: 12px;
+  align-items: flex-start;
+  justify-content: space-between;
+}
+
+.siv-title { margin: 0 0 4px; font-size: 1.125rem; }
+.siv-copy { margin: 0; color: var(--siv-muted, #4b5563); }
+.siv-alert { border: 1px solid var(--siv-border, #e5e7eb); border-radius: var(--siv-radius, 16px); padding: 12px; }
+.siv-live { min-height: 1.25rem; }
+.siv-actions { display: flex; flex-wrap: wrap; gap: 8px; }
+.siv-button, .siv-link {
+  min-height: 44px;
+  border-radius: 999px;
+  border: 1px solid var(--siv-border, #d1d5db);
+  background: var(--siv-bg, #fff);
+  color: inherit;
+  padding: 0 16px;
+  font: inherit;
+  cursor: pointer;
+}
+.siv-button[data-variant="primary"] {
+  background: var(--siv-accent, #1d4ed8);
+  color: #fff;
+  border-color: transparent;
+}
+.siv-button[data-variant="danger"] { color: var(--siv-danger, #b91c1c); }
+.siv-button:disabled { opacity: 0.55; cursor: not-allowed; }
+.siv-button:focus-visible, .siv-link:focus-visible, .siv-input:focus-visible, .siv-select:focus-visible {
+  outline: 2px solid var(--siv-accent, #1d4ed8);
+  outline-offset: 2px;
+}
+.siv-disclosure { text-align: center; font-size: 0.75rem; color: var(--siv-muted, #6b7280); }
+.siv-input, .siv-select, .siv-textarea {
+  min-height: 44px;
+  width: 100%;
+  border-radius: 12px;
+  border: 1px solid var(--siv-border, #d1d5db);
+  padding: 8px 12px;
+  font: inherit;
+}
+.siv-field { display: grid; gap: 6px; }
+.siv-grid { display: grid; gap: 12px; }
+.siv-spinner { width: 1rem; height: 1rem; border-radius: 999px; border: 2px solid currentColor; border-right-color: transparent; animation: siv-spin 0.8s linear infinite; }
+@media (prefers-reduced-motion: reduce) {
+  .siv-spinner { animation: none; }
+}
+@keyframes siv-spin { to { transform: rotate(360deg); } }
+.siv-tabs { display: flex; gap: 4px; overflow-x: auto; }
+.siv-tab[aria-selected="true"] { background: var(--siv-accent, #1d4ed8); color: #fff; }
+.siv-metric { border: 1px solid var(--siv-border, #e5e7eb); border-radius: var(--siv-radius, 16px); padding: 16px; }
+.siv-record { border: 1px solid var(--siv-border, #e5e7eb); border-radius: var(--siv-radius, 16px); padding: 12px; }