@cesdk/cesdk-js 1.26.0 → 1.27.0

package/assets/ui/stylesheets/cesdk.css

@@ -1752,12 +1752,14 @@
 /* esbuild-sass-plugin:css-chunk:../../packages/ubq-uikit-web/src/components/Card/Card.module.scss */
 .UBQ_Card-module__block--Zs4rt {
   --ubq_internal-backgroundGradient: var(--ubq-static-card-background);
+  border: none;
+  border-radius: var(--ubq-border_radius-m);
+  outline: none;
   position: relative;
   width: 100%;
   padding: var(--ubq-margin-s);
-  border: none;
-  border-radius: var(--ubq-border_radius-s);
-  outline: none;
+  display: grid;
+  place-content: stretch;
   overflow: hidden;
   color: var(--ubq-foreground-default);
   cursor: pointer;
@@ -1771,28 +1773,27 @@
 .UBQ_Card-module__block--Zs4rt.UBQ_Card-module__extraShortHeight--xZVB- {
   height: calc(var(--ubq-scale-base) * 12);
 }
-.UBQ_Card-module__block--Zs4rt.UBQ_Card-module__autoHeight--yuOcz {
-  height: 100%;
-}
-.UBQ_Card-module__block--Zs4rt.UBQ_Card-module__noPadding--V91Yq {
-  padding: 0;
+.UBQ_Card-module__block--Zs4rt.UBQ_Card-module__extraShortHeight--xZVB- .UBQ_Card-module__stateRepresentation--HIjTB {
+  border-radius: var(--ubq-border_radius-m);
 }
-.UBQ_Card-module__block--Zs4rt.UBQ_Card-module__noPadding--V91Yq .UBQ_Card-module__backgroundImage--fXz-k {
-  width: 100%;
+.UBQ_Card-module__block--Zs4rt.UBQ_Card-module__autoHeight--yuOcz {
   height: 100%;
-  inset: 0;
 }
 .UBQ_Card-module__block--Zs4rt .UBQ_Card-module__backgroundImage--fXz-k {
   position: absolute;
   object-position: center;
 }
-.UBQ_Card-module__block--Zs4rt .UBQ_Card-module__backgroundImage--fXz-k.UBQ_Card-module__backgroundImageCover--Qu3aI {
+.UBQ_Card-module__block--Zs4rt.UBQ_Card-module__cover--I9azZ .UBQ_Card-module__backgroundImage--fXz-k {
   object-fit: cover;
   width: 100%;
   height: 100%;
   inset: 0;
+  border-radius: var(--ubq-border_radius-m);
 }
-.UBQ_Card-module__block--Zs4rt .UBQ_Card-module__backgroundImage--fXz-k.UBQ_Card-module__backgroundImageContain--GoJYo {
+.UBQ_Card-module__block--Zs4rt.UBQ_Card-module__contain--ToAWK > * {
+  transition: transform 0.15s cubic-bezier(0.2, 0, 0, 1);
+}
+.UBQ_Card-module__block--Zs4rt.UBQ_Card-module__contain--ToAWK .UBQ_Card-module__backgroundImage--fXz-k {
   object-fit: contain;
   width: calc(100% - 2 * var(--ubq-margin-s));
   height: calc(100% - 2 * var(--ubq-margin-s));
@@ -1806,30 +1807,68 @@
   align-items: center;
   justify-content: center;
 }
-.UBQ_Card-module__block--Zs4rt:hover {
-  --ubq_internal-backgroundGradient: var(--ubq-interactive-hover);
-  box-shadow: inset 0 0 0 2px var(--ubq-stroke-contrast-1);
+.UBQ_Card-module__block--Zs4rt:hover.UBQ_Card-module__cover--I9azZ .UBQ_Card-module__backgroundImage--fXz-k,
+.UBQ_Card-module__block--Zs4rt:active.UBQ_Card-module__cover--I9azZ .UBQ_Card-module__backgroundImage--fXz-k,
+.UBQ_Card-module__block--Zs4rt[data-active=true].UBQ_Card-module__cover--I9azZ .UBQ_Card-module__backgroundImage--fXz-k {
+  border-radius: calc(var(--ubq-border_radius-m) + 2px);
+}
+.UBQ_Card-module__block--Zs4rt .UBQ_Card-module__stateRepresentation--HIjTB {
+  position: absolute;
+  inset: 0;
+  border-radius: var(--ubq-border_radius-m);
+  box-shadow: inset 0 0 0 0 transparent, inset 0 0 0 0 transparent;
+  transition: box-shadow 0.15s cubic-bezier(0.2, 0, 0, 1);
+}
+.UBQ_Card-module__block--Zs4rt[data-active=true] > .UBQ_Card-module__stateRepresentation--HIjTB {
+  box-shadow: inset 0 0 0 calc(var(--ubq-scale-base) / 2) var(--ubq-foreground-active), inset 0 0 0 var(--ubq-scale-base) var(--ubq-interactive-default);
+}
+.UBQ_Card-module__block--Zs4rt:hover,
+.UBQ_Card-module__block--Zs4rt:focus-visible {
+  box-shadow: inset 0 0 0 1px var(--ubq-interactive-hover);
+}
+.UBQ_Card-module__block--Zs4rt:hover.UBQ_Card-module__contain--ToAWK,
+.UBQ_Card-module__block--Zs4rt:focus-visible.UBQ_Card-module__contain--ToAWK {
+  background: var(--ubq-interactive-hover);
+}
+.UBQ_Card-module__block--Zs4rt:hover.UBQ_Card-module__contain--ToAWK > *:not(.UBQ_Card-module__stateRepresentation--HIjTB),
+.UBQ_Card-module__block--Zs4rt:focus-visible.UBQ_Card-module__contain--ToAWK > *:not(.UBQ_Card-module__stateRepresentation--HIjTB) {
+  transform: scale(1.1);
+}
+.UBQ_Card-module__block--Zs4rt:hover > .UBQ_Card-module__stateRepresentation--HIjTB,
+.UBQ_Card-module__block--Zs4rt:focus-visible > .UBQ_Card-module__stateRepresentation--HIjTB {
+  box-shadow: inset 0 0 0 1px var(--ubq-stroke-contrast-2), inset 0 0 0 var(--ubq-scale-base) var(--ubq-interactive-hover);
+}
+.UBQ_Card-module__block--Zs4rt:hover[data-active=true] > .UBQ_Card-module__stateRepresentation--HIjTB,
+.UBQ_Card-module__block--Zs4rt:focus-visible[data-active=true] > .UBQ_Card-module__stateRepresentation--HIjTB {
+  box-shadow: inset 0 0 0 calc(var(--ubq-scale-base) / 4) var(--ubq-foreground-active), inset 0 0 0 var(--ubq-scale-base) var(--ubq-interactive-hover);
 }
 .UBQ_Card-module__block--Zs4rt:active {
-  --ubq_internal-backgroundGradient: var(--ubq-interactive-pressed);
+  box-shadow: inset 0 0 0 1px var(--ubq-interactive-pressed);
+}
+.UBQ_Card-module__block--Zs4rt:active.UBQ_Card-module__contain--ToAWK {
+  background: var(--ubq-interactive-pressed);
+}
+.UBQ_Card-module__block--Zs4rt:active.UBQ_Card-module__contain--ToAWK > *:not(.UBQ_Card-module__stateRepresentation--HIjTB) {
+  transform: scale(1.1);
+}
+.UBQ_Card-module__block--Zs4rt:active > .UBQ_Card-module__stateRepresentation--HIjTB {
+  box-shadow: inset 0 0 0 1px var(--ubq-stroke-contrast-2), inset 0 0 0 var(--ubq-scale-base) var(--ubq-interactive-pressed);
+}
+.UBQ_Card-module__block--Zs4rt:active[data-active=true] > .UBQ_Card-module__stateRepresentation--HIjTB {
+  box-shadow: inset 0 0 0 calc(var(--ubq-scale-base) / 4) var(--ubq-foreground-active), inset 0 0 0 var(--ubq-scale-base) var(--ubq-interactive-pressed);
 }
 @supports not (contain: none) {
   .UBQ_Card-module__block--Zs4rt:focus {
-    --ubq_internal-backgroundGradient: var(--ubq-interactive-hover);
     box-shadow: var(--ubq-effect-focus);
   }
 }
 .UBQ_Card-module__block--Zs4rt:focus-visible {
-  --ubq_internal-backgroundGradient: var(--ubq-interactive-hover);
   box-shadow: var(--ubq-effect-focus);
 }
 .UBQ_Card-module__block--Zs4rt:disabled {
   opacity: 0.55;
   pointer-events: none;
 }
-.UBQ_Card-module__block--Zs4rt[data-active=true] {
-  outline: 2px solid var(--ubq-stroke-contrast-3);
-}
 
 /* esbuild-sass-plugin:css-chunk:../../packages/ubq-uikit-web/src/components/Slider/Slider.module.scss */
 .UBQ_Slider-module__block--dDuSa {
@@ -3212,7 +3251,7 @@
 
 /* esbuild-sass-plugin:css-chunk:../../packages/ubq-uikit-web/src/components/TimelineRuler/TimelineRuler.module.scss */
 .UBQ_TimelineRuler-module__block--X0-ri {
-  height: calc(var(--ubq-scale-base) * 5.5);
+  height: calc(var(--ubq-scale-base) * 6);
   overflow: hidden;
 }
 .UBQ_TimelineRuler-module__second--cW0FV {
@@ -3221,7 +3260,7 @@
   grid-auto-columns: 1fr;
   position: absolute;
   top: 0;
-  height: calc(var(--ubq-scale-base) * 5.5);
+  height: calc(var(--ubq-scale-base) * 6);
   background-color: var(--ubq-elevation-3);
 }
 .UBQ_TimelineRuler-module__second--cW0FV::before {
@@ -3233,7 +3272,7 @@
   content: attr(data-second);
   position: absolute;
   left: 0;
-  top: 50%;
+  top: 60%;
   transform: translate(-50%, -50%);
   color: var(--ubq-foreground-info);
 }
@@ -3243,7 +3282,7 @@
 .UBQ_TimelineRuler-module__tick--AT9Vn:not(:last-child)::after {
   content: "";
   position: absolute;
-  top: 55%;
+  top: 60%;
   right: calc(var(--ubq-scale-base) * -0.5);
   width: calc(var(--ubq-scale-base) * 0.25);
   height: calc(var(--ubq-scale-base) * 0.5);
@@ -3252,7 +3291,7 @@
 .UBQ_TimelineRuler-module__tickOverlay--gaGr4 {
   position: absolute;
   top: 0;
-  height: calc(var(--ubq-scale-base) * 5.5);
+  height: calc(var(--ubq-scale-base) * 6);
   background: var(--ubq-overlay);
   opacity: 0.75;
 }
@@ -3260,7 +3299,7 @@
   position: absolute;
   top: 0;
   width: calc(var(--ubq-scale-base) * 0.25);
-  height: calc(var(--ubq-scale-base) * 5.5);
+  height: calc(var(--ubq-scale-base) * 6);
   border-right: 1px dashed var(--ubq-notice-error);
 }
 .UBQ_TimelineRuler-module__minDuration--83TZp::before {
@@ -4523,6 +4562,8 @@ input[type=range].UBQ_ColorSelection-module__opacitySlider--PI-Wu::-ms-thumb {
   display: flex;
   justify-content: center;
   align-items: center;
+  background-size: 100%;
+  transition: background-size 0.15s cubic-bezier(0.2, 0, 0, 1);
 }
 .UBQ_AssetLibraryCard-module__block--z689o.UBQ_AssetLibraryCard-module__containsLabel--tsqhH {
   flex-direction: column-reverse;
@@ -4552,6 +4593,10 @@ input[type=range].UBQ_ColorSelection-module__opacitySlider--PI-Wu::-ms-thumb {
   text-shadow: 0 0 2px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.6);
   text-align: left;
 }
+.UBQ_AssetLibraryCard-module__block--z689o:hover,
+.UBQ_AssetLibraryCard-module__block--z689o:active {
+  background-size: calc(100% - var(--ubq-margin-xs));
+}
 .UBQ_AssetLibraryCard-module__dragPreview--OmKMq {
   overflow: hidden;
   border-radius: var(--ubq-border-radius-l);
@@ -4599,6 +4644,15 @@ input[type=range].UBQ_ColorSelection-module__opacitySlider--PI-Wu::-ms-thumb {
 .UBQ_AssetLibraryCard-module__border--QhSq0 {
   box-shadow: inset 0 0 0 1px var(--ubq-stroke-contrast-2);
 }
+.UBQ_AssetLibraryCard-module__spotColorIndicator--7iifr {
+  border-radius: var(--ubq-border_radius-m);
+  position: absolute;
+  inset: 0;
+  background-size: calc(4.5 * var(--ubq-scale-base));
+  background-position: top right;
+  background-repeat: no-repeat;
+  pointer-events: none;
+}
 
 /* esbuild-sass-plugin:css-chunk:packages/ui/components/assets/AssetMediaPlayer.module.scss */
 .UBQ_AssetMediaPlayer-module__block--2enRm {
@@ -5187,6 +5241,11 @@ footer {
   flex-grow: 1;
   overflow: hidden;
 }
+.UBQ_AssetLibraryContent-module__block--SroUk hr {
+  margin-top: var(--ubq-margin-xs);
+  margin-bottom: 0;
+  width: 100%;
+}
 .UBQ_AssetLibraryContent-module__motionWrapper--Bxmsh {
   display: flex;
   flex-direction: column;
@@ -5807,7 +5866,9 @@ footer {
   color: var(--ubq-foreground-default);
   display: flex;
   align-items: baseline;
+  gap: var(--ubq-margin-xs);
   padding-inline-end: var(--ubq-margin-xs);
+  font-variant-numeric: tabular-nums;
 }
 .UBQ_VideoTimelineControls-module__zoomControls--sMM4p {
   display: flex;
@@ -5943,7 +6004,8 @@ footer {
 }
 .UBQ_VideoTimeline-module__timeRuler--jUJdX {
   position: sticky;
-  top: 0;
+  border-top: 1px solid var(--ubq-elevation-1);
+  top: -1px;
   z-index: 1;
 }
 
@@ -6480,17 +6542,26 @@ footer {
 }
 .UBQ_Editor-module__body--Pwi6o {
   position: relative;
-  display: flex;
+  width: 100%;
   flex: 1 1 100%;
+  display: grid;
+  grid-template-columns: max-content 1fr;
+  grid-template-rows: 1fr max-content;
+  grid-template-areas: "dock canvas" "dock timeline";
   overflow: hidden;
 }
 .UBQ_Editor-module__verticalBodyLayout--0bAJc {
-  flex-direction: column-reverse;
+  grid-template-columns: 1fr;
+  grid-template-rows: 1fr max-content max-content;
+  grid-template-areas: "canvas" "timeline" "dock";
+}
+.UBQ_Editor-module__dock--DOhMf {
+  grid-area: dock;
 }
 .UBQ_Editor-module__canvasViewport--URkpK {
+  grid-area: canvas;
   position: relative;
   display: flex;
-  flex: 1 1 100%;
   overflow: hidden;
 }
 .UBQ_Editor-module__canvasContainer--oG4y4 {
@@ -6500,6 +6571,10 @@ footer {
   flex-direction: column;
   overflow: hidden;
 }
+.UBQ_Editor-module__videoTimeline--CUN-C {
+  grid-area: timeline;
+  overflow: hidden;
+}
 .UBQ_Editor-module__dialog--kJqRj {
   width: calc(var(--ubq-scale-base) * 100);
 }