@db-ux/core-foundations 1.0.0-test-13b991d

package/build/styles/absolute.scss

@@ -0,0 +1,3 @@
+@use "absolute.assets-paths";
+
+@forward "./index";

package/build/styles/animation/_animations.scss

@@ -0,0 +1,109 @@
+@keyframes show-right-to-left {
+	from {
+		transform: translateX(110%);
+	}
+
+	to {
+		transform: translateX(0%);
+	}
+}
+
+@keyframes hide-right-to-left {
+	from {
+		transform: translateX(0%);
+	}
+
+	to {
+		transform: translateX(110%);
+	}
+}
+
+@keyframes show-left-to-right {
+	from {
+		transform: translateX(-110%);
+	}
+
+	to {
+		transform: translateX(0%);
+	}
+}
+
+@keyframes hide-left-to-right {
+	from {
+		transform: translateX(0%);
+	}
+
+	to {
+		transform: translateX(-110%);
+	}
+}
+
+@keyframes show-bottom-to-top {
+	from {
+		transform: translateY(110%);
+	}
+
+	to {
+		transform: translateY(0%);
+	}
+}
+
+@keyframes hide-bottom-to-top {
+	from {
+		transform: translateY(0%);
+	}
+
+	to {
+		transform: translateY(110%);
+	}
+}
+
+@keyframes show-top-to-bottom {
+	from {
+		transform: translateY(-110%);
+	}
+
+	to {
+		transform: translateY(0%);
+	}
+}
+
+@keyframes hide-top-to-bottom {
+	from {
+		transform: translateY(0%);
+	}
+
+	to {
+		transform: translateY(-110%);
+	}
+}
+
+@keyframes accordion-open {
+	0% {
+		opacity: 0;
+		transform: translateY(-10%);
+	}
+
+	100% {
+		opacity: 1;
+		transform: translateY(0%);
+	}
+}
+
+@keyframes popover-animation {
+	0% {
+		opacity: 0;
+		transform: translate(
+			var(--db-popover-center-x, var(--db-popover-translate-x, 0%)),
+			var(--db-popover-center-y, var(--db-popover-translate-y, 0%))
+		);
+	}
+
+	100% {
+		opacity: 1;
+		transform: translate(
+			var(--db-popover-center-x, 0%),
+			var(--db-popover-center-y, 0%)
+		);
+	}
+}

package/build/styles/animation/_index.scss

@@ -0,0 +1,2 @@
+@forward "transitions";
+@forward "animations";

package/build/styles/animation/_transitions.scss

@@ -0,0 +1,14 @@
+@use "../variables";
+
+%default-transition {
+	transition:
+		outline #{variables.$db-transition-duration-extra-fast},
+		border-color #{variables.$db-transition-straight-emotional},
+		background-color #{variables.$db-transition-straight-emotional};
+}
+
+%default-fg-transition {
+	transition:
+		outline #{variables.$db-transition-duration-extra-fast},
+		color #{variables.$db-transition-straight-emotional};
+}