@orion-studios/payload-studio 0.6.0-beta.28 → 0.6.0-beta.29

package/dist/admin-app/styles.css

@@ -1674,8 +1674,11 @@
   display: inline-flex;
   flex: 0 0 auto;
   font-size: 0.78rem;
+  font-variant-numeric: tabular-nums;
   font-weight: 900;
   justify-content: center;
+  line-height: 1;
+  text-align: center;
 }
 
 .orion-admin-workflow-node-number {
@@ -1729,6 +1732,30 @@
   position: relative;
 }
 
+.orion-admin-step-editor {
+  background:
+    linear-gradient(180deg, color-mix(in srgb, var(--orion-admin-card-bg) 97%, white), var(--orion-admin-card-bg));
+  box-shadow:
+    0 1px 0 color-mix(in srgb, var(--orion-admin-card-bg) 88%, white) inset,
+    0 10px 24px color-mix(in srgb, var(--orion-admin-text) 5%, transparent);
+}
+
+.orion-admin-step-editor[open] {
+  background:
+    linear-gradient(180deg, color-mix(in srgb, var(--orion-admin-accent-subtle) 38%, var(--orion-admin-card-bg)), var(--orion-admin-card-bg));
+  border-color: color-mix(in srgb, var(--orion-admin-accent) 34%, var(--orion-admin-card-border));
+}
+
+.orion-admin-step-editor[open]::before {
+  background: linear-gradient(180deg, var(--orion-admin-accent), color-mix(in srgb, var(--orion-admin-accent) 46%, var(--brand-secondary)));
+  bottom: 0;
+  content: '';
+  left: 0;
+  position: absolute;
+  top: 0;
+  width: 4px;
+}
+
 .orion-admin-step-editor-summary,
 .orion-admin-field-editor-summary {
   align-items: center;
@@ -1741,6 +1768,10 @@
   padding: 0.75rem 0.9rem;
 }
 
+.orion-admin-step-editor-summary {
+  padding-left: 1rem;
+}
+
 .orion-admin-step-editor-summary::-webkit-details-marker,
 .orion-admin-field-editor-summary::-webkit-details-marker {
   display: none;
@@ -1779,6 +1810,11 @@
   padding: 0.95rem;
 }
 
+.orion-admin-step-editor-body {
+  background: color-mix(in srgb, var(--orion-admin-card-bg) 86%, var(--orion-admin-main-bg));
+  padding-left: 1.15rem;
+}
+
 .orion-admin-step-editor-actions {
   display: flex;
   flex-wrap: wrap;
@@ -1792,7 +1828,10 @@
 }
 
 .orion-admin-field-editor {
+  background: color-mix(in srgb, var(--orion-admin-main-bg) 72%, var(--orion-admin-card-bg));
+  border-color: color-mix(in srgb, var(--brand-secondary) 22%, var(--orion-admin-card-border));
   border-radius: var(--orion-admin-radius-sm);
+  box-shadow: none;
 }
 
 .orion-admin-field-editor-summary {
@@ -1800,6 +1839,29 @@
   padding: 0.68rem 0.75rem;
 }
 
+.orion-admin-field-editor-list {
+  background:
+    linear-gradient(180deg, color-mix(in srgb, var(--orion-admin-main-bg) 74%, var(--orion-admin-card-bg)), color-mix(in srgb, var(--orion-admin-main-bg) 88%, white));
+  border: 1px solid color-mix(in srgb, var(--brand-secondary) 18%, var(--orion-admin-card-border));
+  border-radius: var(--orion-admin-radius-md);
+  padding: 0.7rem;
+}
+
+.orion-admin-field-order {
+  background: color-mix(in srgb, var(--brand-secondary) 10%, var(--orion-admin-card-bg));
+  border-color: color-mix(in srgb, var(--brand-secondary) 32%, var(--orion-admin-card-border));
+  color: color-mix(in srgb, var(--brand-secondary) 74%, var(--orion-admin-text));
+}
+
+.orion-admin-field-editor-meta {
+  background: color-mix(in srgb, var(--brand-secondary) 8%, var(--orion-admin-card-bg));
+  border: 1px solid color-mix(in srgb, var(--brand-secondary) 18%, transparent);
+  border-radius: var(--orion-admin-radius-pill);
+  font-weight: 800;
+  justify-self: end;
+  padding: 0.28rem 0.55rem;
+}
+
 .orion-admin-response-stack.is-scrollable {
   mask-image: linear-gradient(180deg, #000 0%, #000 92%, transparent 100%);
   max-height: 34rem;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orion-studios/payload-studio",
-  "version": "0.6.0-beta.28",
+  "version": "0.6.0-beta.29",
   "description": "Base CMS, builder, and custom admin toolkit for Orion Studios websites",
   "types": "./dist/index.d.ts",
   "main": "./dist/index.js",