@liftkit-vue/theme-css 0.1.0

package/css/border-color.css

@@ -0,0 +1,241 @@
+@import "./liftkit-core.css";
+
+.border-color-primary {
+  border-color: var(--lk-primary);
+}
+
+.border-color-onprimary {
+  border-color: var(--lk-onprimary);
+}
+
+.border-color-primarycontainer {
+  border-color: var(--lk-primarycontainer);
+}
+
+.border-color-onprimarycontainer {
+  border-color: var(--lk-onprimarycontainer);
+}
+
+.border-color-secondary {
+  border-color: var(--lk-secondary);
+}
+
+.border-color-onsecondary {
+  border-color: var(--lk-onsecondary);
+}
+
+.border-color-secondarycontainer {
+  border-color: var(--lk-secondarycontainer);
+}
+
+.border-color-onsecondarycontainer {
+  border-color: var(--lk-onsecondarycontainer);
+}
+
+.border-color-tertiary {
+  border-color: var(--lk-tertiary);
+}
+
+.border-color-ontertiary {
+  border-color: var(--lk-ontertiary);
+}
+
+.border-color-tertiarycontainer {
+  border-color: var(--lk-tertiarycontainer);
+}
+
+.border-color-ontertiarycontainer {
+  border-color: var(--lk-ontertiarycontainer);
+}
+
+.border-color-error {
+  border-color: var(--lk-error);
+}
+
+.border-color-onerror {
+  border-color: var(--lk-onerror);
+}
+
+.border-color-errorcontainerv {
+  border-color: var(--lk-errorcontainer);
+}
+
+.border-color-onerrorcontainer {
+  border-color: var(--lk-onerrorcontainer);
+}
+
+.border-color-background {
+  border-color: var(--lk-background);
+}
+
+.border-color-onbackground {
+  border-color: var(--lk-onbackground);
+}
+
+.border-color-surface {
+  border-color: var(--lk-surface);
+}
+
+.border-color-onsurface {
+  border-color: var(--lk-onsurface);
+}
+
+.border-color-surfacevariant {
+  border-color: var(--lk-surfacevariant);
+}
+
+.border-color-onsurfacevariant {
+  border-color: var(--lk-onsurfacevariant);
+}
+
+.border-color-outline {
+  border-color: var(--lk-outline);
+}
+
+.border-color-outlinevariant {
+  border-color: var(--lk-outlinevariant);
+}
+
+.border-color-shadow {
+  border-color: var(--lk-shadow);
+}
+
+.border-color-scrim {
+  border-color: var(--lk-scrim);
+}
+
+.border-color-inversesurface {
+  border-color: var(--lk-inversesurface);
+}
+
+.border-color-inverseonsurface {
+  border-color: var(--lk-inverseonsurface);
+}
+
+.border-color-inverseprimary {
+  border-color: var(--lk-inverseprimary);
+}
+
+.border-color-success {
+  border-color: var(--lk-success);
+}
+
+.border-color-successcontainer {
+  border-color: var(--lk-successcontainer);
+}
+
+.border-color-onsuccess {
+  border-color: var(--lk-onsuccess);
+}
+
+.border-color-onsuccesscontainer {
+  border-color: var(--lk-onsuccesscontainer);
+}
+
+.border-color-warning {
+  border-color: var(--lk-warning);
+}
+
+.border-color-warningcontainer {
+  border-color: var(--lk-warningcontainer);
+}
+
+.border-color-onwarning {
+  border-color: var(--lk-onwarning);
+}
+
+.border-color-onwarningcontainer {
+  border-color: var(--lk-onwarningcontainer);
+}
+
+.border-color-info {
+  border-color: var(--lk-info);
+}
+
+.border-color-infocontainer {
+  border-color: var(--lk-infocontainer);
+}
+
+.border-color-oninfo {
+  border-color: var(--lk-oninfo);
+}
+
+.border-color-oninfocontainer {
+  border-color: var(--lk-oninfocontainer);
+}
+
+.border-color-primaryfixed {
+  border-color: var(--lk-primaryfixed);
+}
+
+.border-color-primaryfixeddim {
+  border-color: var(--lk-primaryfixeddim);
+}
+
+.border-color-onprimaryfixed {
+  border-color: var(--lk-onprimaryfixed);
+}
+
+.border-color-onprimaryfixedvariant {
+  border-color: var(--lk-onprimaryfixedvariant);
+}
+
+.border-color-secondaryfixed {
+  border-color: var(--lk-secondaryfixed);
+}
+
+.border-color-secondaryfixeddim {
+  border-color: var(--lk-secondaryfixeddim);
+}
+
+.border-color-onsecondaryfixed {
+  border-color: var(--lk-onsecondaryfixed);
+}
+
+.border-color-onsecondaryfixedvariant {
+  border-color: var(--lk-onsecondaryfixedvariant);
+}
+
+.border-color-tertiaryfixed {
+  border-color: var(--lk-tertiaryfixed);
+}
+
+.border-color-tertiaryfixeddim {
+  border-color: var(--lk-tertiaryfixeddim);
+}
+
+.border-color-ontertiaryfixed {
+  border-color: var(--lk-ontertiaryfixed);
+}
+
+.border-color-ontertiaryfixedvariant {
+  border-color: var(--lk-ontertiaryfixedvariant);
+}
+
+.border-color-surfacedim {
+  border-color: var(--lk-surfacedim);
+}
+
+.border-color-surfacebright {
+  border-color: var(--lk-surfacebright);
+}
+
+.border-color-surfacecontainerlowest {
+  border-color: var(--lk-surfacecontainerlowest);
+}
+
+.border-color-surfacecontainerlow {
+  border-color: var(--lk-surfacecontainerlow);
+}
+
+.border-color-surfacecontainer {
+  border-color: var(--lk-surfacecontainer);
+}
+
+.border-color-surfacecontainerhigh {
+  border-color: var(--lk-surfacecontainerhigh);
+}
+
+.border-color-surfacecontainerhighest {
+  border-color: var(--lk-surfacecontainerhighest);
+}

package/css/border-radius.css

@@ -0,0 +1,49 @@
+@import "./liftkitvars.css";
+
+.rounded-3xs {
+  border-radius: var(--lk-size-3xs);
+}
+
+.rounded-2xs {
+  border-radius: var(--lk-size-2xs);
+}
+
+.rounded-xs {
+  border-radius: var(--lk-size-xs);
+}
+
+.rounded-sm {
+  border-radius: var(--lk-size-sm);
+}
+
+.rounded-md {
+  border-radius: var(--lk-size-md);
+}
+
+.rounded-lg {
+  border-radius: var(--lk-size-lg);
+}
+
+.rounded-xl {
+  border-radius: var(--lk-size-xl);
+}
+
+.rounded-2xl {
+  border-radius: var(--lk-size-2xl);
+}
+
+.rounded-3xl {
+  border-radius: var(--lk-size-3xl);
+}
+
+.rounded-4xl {
+  border-radius: var(--lk-size-4xl);
+}
+
+.rounded-circle {
+  border-radius: 100em;
+}
+
+.rounded-0 {
+  border-radius: 0em;
+}

package/css/border-style.css

@@ -0,0 +1,20 @@
+.border-solid {
+  border-style: solid;
+}
+
+.border-dashed {
+  border-style: dashed;
+}
+
+.border-dotted {
+  border-style: dotted;
+}
+
+.border-double {
+  border-style: double;
+}
+
+.border-hidden {
+    border-style: hidden;
+}
+

package/css/border-width.css

@@ -0,0 +1,41 @@
+@import "./liftkitvars.css";
+
+.border-width-3xs {
+  border-width: var(--lk-size-3xs);
+}
+
+.border-width-2xs {
+  border-width: var(--lk-size-2xs);
+}
+
+.border-width-xs {
+  border-width: var(--lk-size-xs);
+}
+
+.border-width-sm {
+  border-width: var(--lk-size-sm);
+}
+
+.border-width-md {
+  border-width: var(--lk-size-md);
+}
+
+.border-width-lg {
+  border-width: var(--lk-size-lg);
+}
+
+.border-width-xl {
+  border-width: var(--lk-size-xl);
+}
+
+.border-width-2xl {
+  border-width: var(--lk-size-2xl);
+}
+
+.border-width-3xl {
+  border-width: var(--lk-size-3xl);
+}
+
+.border-width-4xl {
+  border-width: var(--lk-size-4xl);
+}

package/css/borders.css

@@ -0,0 +1,33 @@
+.border {
+  border: 1px solid var(--lk-outline);
+}
+
+.border-t {
+  border-top: 1px solid var(--lk-outline);
+}
+
+.border-r {
+  border-right: 1px solid var(--lk-outline);
+}
+
+.border-l {
+  border-left: 1px solid var(--lk-outline);
+}
+
+.border-b {
+  border-bottom: 1px solid var(--lk-outline);
+}
+
+.border-x {
+  border-left: 1px solid var(--lk-outline);
+  border-right: 1px solid var(--lk-outline);
+}
+
+.border-y {
+  border-top: 1px solid var(--lk-outline);
+  border-bottom: 1px solid var(--lk-outline);
+}
+
+.border-none {
+  border: 0px;
+}

package/css/breaks.css

@@ -0,0 +1,5 @@
+.nowrap {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}

package/css/column-span.css

@@ -0,0 +1,47 @@
+.colspan-1 {
+  grid-column: span 1;
+}
+
+.colspan-2 {
+  grid-column: span 2;
+}
+
+.colspan-3 {
+  grid-column: span 3;
+}
+
+.colspan-4 {
+  grid-column: span 4;
+}
+
+.colspan-5 {
+  grid-column: span 5;
+}
+
+.colspan-6 {
+  grid-column: span 6;
+}
+
+.colspan-7 {
+  grid-column: span 7;
+}
+
+.colspan-8 {
+  grid-column: span 8;
+}
+
+.colspan-9 {
+  grid-column: span 9;
+}
+
+.colspan-10 {
+  grid-column: span 10;
+}
+
+.colspan-11 {
+  grid-column: span 11;
+}
+
+.colspan-12 {
+  grid-column: span 12;
+}

package/css/cursor.css

@@ -0,0 +1,3 @@
+.cursor-pointer {
+  cursor: pointer;
+}

package/css/display.css

@@ -0,0 +1,21 @@
+.display-block {
+  display: block;
+}
+
+.display-flex {
+  display: flex;
+}
+
+.display-grid {
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
+  grid-template-rows: repeat(2, auto);
+}
+
+.display-inline-block {
+  display: inline-block;
+}
+
+.display-none {
+  display: none;
+}

package/css/flexboxes.css

@@ -0,0 +1,128 @@
+/* Set display to flex */
+
+.flex-row {
+  flex-direction: row;
+}
+
+.flex-row-reverse {
+  flex-direction: row-reverse;
+}
+
+.flex-col {
+  flex-direction: column;
+}
+
+.flex-col-reverse {
+  flex-direction: column-reverse;
+}
+
+.flex-h {
+  display: flex;
+}
+
+.flex-v {
+  display: flex;
+  flex-direction: column;
+}
+
+.flex-nowrap {
+  flex-wrap: nowrap;
+}
+
+.flex-wrap {
+  flex-wrap: wrap;
+}
+
+.flex-wrap-reverse {
+  flex-wrap: wrap-reverse;
+}
+
+.flex-grow {
+  flex-grow: 1;
+}
+
+.flex-shrink {
+  flex-shrink: 1;
+}
+
+.flex-auto {
+  flex: 1 1 auto;
+}
+
+.flex-initial {
+  flex: 0 1 auto;
+}
+
+.flex-none {
+  flex: none;
+}
+
+/* shorthands */
+
+.flex-h-start {
+  display: flex;
+  align-items: flex-start;
+  justify-content: flex-start;
+}
+
+.flex-h-center {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.flex-h-end {
+  display: flex;
+  justify-content: flex-end;
+}
+
+.flex-v-start {
+  display: flex;
+  flex-flow: column nowrap;
+  align-items: flex-start;
+}
+
+.flex-v-center {
+  display: flex;
+  flex-flow: column nowrap;
+  align-items: center;
+  justify-content: center;
+}
+
+.flex-v-end {
+  display: flex;
+  flex-flow: column nowrap;
+  align-items: flex-end;
+}
+
+.flex-grow {
+  flex-grow: 1;
+}
+
+/* card-header */
+.flex-wrap-children {
+  display: flex;
+  flex-wrap: wrap;
+  column-gap: var(--lk-size-sm);
+  row-gap: var(--lk-size-sm);
+}
+
+.fill-container {
+  flex: 1 0 0;
+  flex-basis: 0;
+}
+
+.hug-contents {
+  flex: 1 0 auto;
+}
+
+.scrollable-flex-child {
+  flex: 1 0 0;
+  flex-basis: 0;
+  overflow: auto;
+  scrollbar-width: none;
+}
+
+.flex-basis-auto {
+  flex-basis: auto;
+}

package/css/gaps.css

@@ -0,0 +1,42 @@
+/* Gaps */
+@import "./liftkitvars.css";
+
+.gap-3xs {
+  gap: var(--lk-size-3xs);
+} 
+
+.gap-2xs {
+  gap: var(--lk-size-2xs);
+}
+
+.gap-xs {
+  gap: var(--lk-size-xs);
+}
+
+.gap-sm {
+  gap: var(--lk-size-sm);
+}
+
+.gap-md {
+  gap: var(--lk-size-md);
+}
+
+.gap-lg {
+  gap: var(--lk-size-lg);
+}
+
+.gap-xl {
+  gap: var(--lk-size-xl);
+}
+
+.gap-2xl {
+  gap: var(--lk-size-2xl);
+}
+
+.gap-3xl {
+  gap: var(--lk-size-3xl);
+}
+
+.gap-4xl {
+  gap: var(--lk-size-4xl);
+}

package/css/height.css

@@ -0,0 +1,27 @@
+.h-fullscreen {
+  height: 100vh;
+}
+
+.h-full {
+  height: 100%;
+}
+
+.h-xl {
+  height: var(--lk-size-xl);
+}
+
+.h-2xl {
+  height: var(--lk-size-2xl);
+}
+
+.h-4xl {
+  height: 27.2%;
+}
+
+.max-h-4xl {
+  max-height: var(--lk-size-4xl);
+}
+
+.min-h-4xl {
+  min-height: var(--lk-size-4xl);
+}