@pandacss/studio 0.0.0-dev-20230613163214

package/styled-system/chunks/src__components__input.css

@@ -0,0 +1,68 @@
+@layer utilities {
+  .bg_transparent {
+    background: var(--colors-transparent);
+  }
+
+  .w_full {
+    width: var(--sizes-full);
+  }
+
+  .px_4 {
+    padding-inline: var(--spacing-4);
+  }
+
+  .py_2 {
+    padding-block: var(--spacing-2);
+  }
+
+  .rounded_md {
+    border-radius: var(--radii-md);
+  }
+
+  .text_neutral\.600 {
+    color: var(--colors-neutral-600);
+  }
+
+  .dark\:text_neutral\.300 {
+    &.dark,
+    .dark & {
+      color: var(--colors-neutral-300);
+    }
+  }
+
+  .shadow_sm {
+    box-shadow: var(--shadows-sm);
+  }
+
+  .border-width_1px {
+    border-width: 1px;
+  }
+
+  .border_border {
+    border-color: var(--colors-border);
+  }
+
+  .focusWithin\:outline-style_solid {
+    &:focus-within {
+      outline-style: solid;
+    }
+  }
+
+  .focusWithin\:ring_2px {
+    &:focus-within {
+      outline-width: 2px;
+    }
+  }
+
+  .focusWithin\:ring_2px {
+    &:focus-within {
+      outline-offset: 2px;
+    }
+  }
+
+  .focusWithin\:ring_neutral\.400 {
+    &:focus-within {
+      outline-color: var(--colors-neutral-400);
+    }
+  }
+}

package/styled-system/chunks/src__components__layer-styles.css

@@ -0,0 +1,66 @@
+@layer utilities {
+  .divide-y_1px {
+    & > :not([hidden]) ~ :not([hidden]) {
+      border-top-width: 1px;
+      border-bottom-width: 0px;
+    }
+  }
+
+  .divide_card {
+    & > :not([hidden]) ~ :not([hidden]) {
+      border-color: var(--colors-card);
+    }
+  }
+
+  .px_1 {
+    padding-inline: var(--spacing-1);
+  }
+
+  .py_2\.5 {
+    padding-block: var(--spacing-2\.5);
+  }
+
+  .border_card {
+    border-color: var(--colors-card);
+  }
+
+  .fs_small {
+    font-size: small;
+  }
+
+  .mt_1\.5 {
+    margin-top: var(--spacing-1\.5);
+  }
+
+  .px_4 {
+    padding-inline: var(--spacing-4);
+  }
+
+  .py_2 {
+    padding-block: var(--spacing-2);
+  }
+
+  .bg_card {
+    background: var(--colors-card);
+  }
+
+  .mt_5 {
+    margin-top: var(--spacing-5);
+  }
+
+  .flex_auto {
+    flex: 1 1 auto;
+  }
+
+  .my_3 {
+    margin-block: var(--spacing-3);
+  }
+
+  .h_20 {
+    height: var(--sizes-20);
+  }
+
+  .font_medium {
+    font-weight: var(--font-weights-medium);
+  }
+}

package/styled-system/chunks/src__components__nav-item.css

@@ -0,0 +1,73 @@
+@layer utilities {
+  .w_60 {
+    width: var(--sizes-60);
+  }
+
+  .bg_card {
+    background: var(--colors-card);
+  }
+
+  .rounded_sm {
+    border-radius: var(--radii-sm);
+  }
+
+  .p_4 {
+    padding: var(--spacing-4);
+  }
+
+  .transition_all_0\.2s_ease {
+    transition: all 0.2s ease;
+  }
+
+  .hover\:shadow_lg {
+    &:where(:hover, [data-hover]) {
+      box-shadow: var(--shadows-lg);
+    }
+  }
+
+  .\[\&_svg\]\:font_normal {
+    & svg {
+      font-weight: var(--font-weights-normal);
+    }
+  }
+
+  .\[\&_svg\]\:fs_xx-large {
+    & svg {
+      font-size: xx-large;
+    }
+  }
+
+  .\[\&_svg\]\:mb_6 {
+    & svg {
+      margin-bottom: var(--spacing-6);
+    }
+  }
+
+  .\[\&_svg\]\:h_6 {
+    & svg {
+      height: var(--sizes-6);
+    }
+  }
+
+  .\[\&_svg\]\:w_6 {
+    & svg {
+      width: var(--sizes-6);
+    }
+  }
+
+  .font_semibold {
+    font-weight: var(--font-weights-semibold);
+  }
+
+  .fs_small {
+    font-size: small;
+  }
+
+  .d_block {
+    display: block;
+  }
+
+  .mt_3 {
+    margin-top: var(--spacing-3);
+  }
+}

package/styled-system/chunks/src__components__overview.css

@@ -0,0 +1,125 @@
+@layer utilities {
+  .bg_\#646cff {
+    background: #646cff;
+  }
+
+  .text_white {
+    color: var(--colors-white);
+  }
+
+  .w_fit-content {
+    width: fit-content;
+  }
+
+  .fs_small {
+    font-size: small;
+  }
+
+  .px_6 {
+    padding-inline: var(--spacing-6);
+  }
+
+  .py_1 {
+    padding-block: var(--spacing-1);
+  }
+
+  .rounded_sm {
+    border-radius: var(--radii-sm);
+  }
+
+  .mt_6 {
+    margin-top: var(--spacing-6);
+  }
+
+  .transition_all_0\.2s_ease {
+    transition: all 0.2s ease;
+  }
+
+  .flex_column {
+    flex-direction: column;
+  }
+
+  .py_24 {
+    padding-block: var(--spacing-24);
+  }
+
+  .mb_10 {
+    margin-bottom: var(--spacing-10);
+  }
+
+  .bg_card {
+    background: var(--colors-card);
+  }
+
+  .font_bold {
+    font-weight: var(--font-weights-bold);
+  }
+
+  .fs_2xl {
+    font-size: var(--font-sizes-2xl);
+  }
+
+  .px_8 {
+    padding-inline: var(--spacing-8);
+  }
+
+  .py_4 {
+    padding-block: var(--spacing-4);
+  }
+
+  .gap_2 {
+    gap: var(--spacing-2);
+  }
+
+  .fs_3xl {
+    font-size: var(--font-sizes-3xl);
+  }
+
+  .font_semibold {
+    font-weight: var(--font-weights-semibold);
+  }
+
+  .mb_6 {
+    margin-bottom: var(--spacing-6);
+  }
+
+  .d_block {
+    display: block;
+  }
+
+  .p_8 {
+    padding: var(--spacing-8);
+  }
+
+  .d_flex {
+    display: flex;
+  }
+
+  .flex-wrap_wrap {
+    flex-wrap: wrap;
+  }
+
+  .gap_6 {
+    gap: var(--spacing-6);
+  }
+
+  .my_2 {
+    margin-block: var(--spacing-2);
+  }
+
+  .p_0 {
+    padding: 0;
+  }
+
+  .\[\&\:hover\]\:bg_\#4049f0 {
+    &:hover {
+      background: #4049f0;
+    }
+  }
+
+  .\[\&\:hover\]\:shadow_lg {
+    &:hover {
+      box-shadow: var(--shadows-lg);
+    }
+  }
+}

package/styled-system/chunks/src__components__radii.css

@@ -0,0 +1,49 @@
+@layer utilities {
+  .w_80px {
+    width: 80px;
+  }
+
+  .h_80px {
+    height: 80px;
+  }
+
+  .bg_rgba\(255\,_192\,_203\,_0\.5\) {
+    background: rgba(255, 192, 203, 0.5);
+  }
+
+  .opacity_0\.7 {
+    opacity: 0.7;
+  }
+
+  .d_grid {
+    display: grid;
+  }
+
+  .grid-cols_repeat\(auto-fit\,_minmax\(10rem\,_1fr\)\) {
+    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
+  }
+
+  .gap_10 {
+    gap: var(--spacing-10);
+  }
+
+  .gap_10px {
+    gap: 10px;
+  }
+
+  .d_flex {
+    display: flex;
+  }
+
+  .flex_column {
+    flex-direction: column;
+  }
+
+  .items_center {
+    align-items: center;
+  }
+
+  .gap_1 {
+    gap: var(--spacing-1);
+  }
+}

package/styled-system/chunks/src__components__semantic-color.css

@@ -0,0 +1,45 @@
+@layer utilities {
+  .h_12 {
+    height: var(--sizes-12);
+  }
+
+  .font_medium {
+    font-weight: var(--font-weights-medium);
+  }
+
+  .fs_sm {
+    font-size: var(--font-sizes-sm);
+  }
+
+  .min-w_5 {
+    min-width: var(--sizes-5);
+  }
+
+  .bg_neutral\.800 {
+    background: var(--colors-neutral-800);
+  }
+
+  .px_1 {
+    padding-inline: var(--spacing-1);
+  }
+
+  .py_1 {
+    padding-block: var(--spacing-1);
+  }
+
+  .text_white {
+    color: var(--colors-white);
+  }
+
+  .rounded-br_sm {
+    border-bottom-right-radius: var(--radii-sm);
+  }
+
+  .border-width_1px {
+    border-width: 1px;
+  }
+
+  .border_neutral\.700 {
+    border-color: var(--colors-neutral-700);
+  }
+}

package/styled-system/chunks/src__components__side-nav-item.css

@@ -0,0 +1,33 @@
+@layer utilities {
+  .d_block {
+    display: block;
+  }
+
+  .py_1\.5 {
+    padding-block: var(--spacing-1\.5);
+  }
+
+  .cursor_pointer {
+    cursor: pointer;
+  }
+
+  .fs_md {
+    font-size: var(--font-sizes-md);
+  }
+
+  .font_medium {
+    font-weight: var(--font-weights-medium);
+  }
+
+  .hover\:text_yellow\.300 {
+    &:where(:hover, [data-hover]) {
+      color: var(--colors-yellow-300);
+    }
+  }
+
+  .currentPage\:text_yellow\.300 {
+    &[aria-current='page'] {
+      color: var(--colors-yellow-300);
+    }
+  }
+}

package/styled-system/chunks/src__components__side-nav.css

@@ -0,0 +1,49 @@
+@layer utilities {
+  .mt_8 {
+    margin-top: var(--spacing-8);
+  }
+
+  .font_bold {
+    font-weight: var(--font-weights-bold);
+  }
+
+  .fs_small {
+    font-size: small;
+  }
+
+  .opacity_0\.7 {
+    opacity: 0.7;
+  }
+
+  .mb_8 {
+    margin-bottom: var(--spacing-8);
+  }
+
+  .list_none {
+    list-style-type: none;
+  }
+
+  .p_0 {
+    padding: 0;
+  }
+
+  .my_2 {
+    margin-block: var(--spacing-2);
+  }
+
+  .mx_0 {
+    margin-inline: 0;
+  }
+
+  .d_flex {
+    display: flex;
+  }
+
+  .flex_column {
+    flex-direction: column;
+  }
+
+  .gap_10 {
+    gap: var(--spacing-10);
+  }
+}

package/styled-system/chunks/src__components__sizes.css

@@ -0,0 +1,41 @@
+@layer utilities {
+  .font_semibold {
+    font-weight: var(--font-weights-semibold);
+  }
+
+  .col-span_span_3_\/_span_3 {
+    grid-column: span 3 / span 3;
+  }
+
+  .h_5 {
+    height: var(--sizes-5);
+  }
+
+  .bg_rgba\(255\,_192\,_203\,_0\.5\) {
+    background: rgba(255, 192, 203, 0.5);
+  }
+
+  .col-span_span_2_\/_span_2 {
+    grid-column: span 2 / span 2;
+  }
+
+  .col-span_span_5_\/_span_5 {
+    grid-column: span 5 / span 5;
+  }
+
+  .d_grid {
+    display: grid;
+  }
+
+  .grid-cols_repeat\(5\,_minmax\(0\,_1fr\)\) {
+    grid-template-columns: repeat(5, minmax(0, 1fr));
+  }
+
+  .gap-y_10 {
+    column-gap: var(--spacing-10);
+  }
+
+  .gap-x_2\.5 {
+    row-gap: var(--spacing-2\.5);
+  }
+}

package/styled-system/chunks/src__components__text-styles.css

@@ -0,0 +1,31 @@
+@layer utilities {
+  .px_1 {
+    padding-inline: var(--spacing-1);
+  }
+
+  .py_2\.5 {
+    padding-block: var(--spacing-2\.5);
+  }
+
+  .border_card {
+    border-color: var(--colors-card);
+  }
+
+  .flex_auto {
+    flex: 1 1 auto;
+  }
+
+  .my_3 {
+    margin-block: var(--spacing-3);
+  }
+
+  .truncate_true {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .font_medium {
+    font-weight: var(--font-weights-medium);
+  }
+}

package/styled-system/chunks/src__components__theme-toggle.css

@@ -0,0 +1,63 @@
+@layer utilities {
+  .cursor_pointer {
+    cursor: pointer;
+  }
+
+  .\[\&\.active\]\:text_yellow\.300 {
+    &.active {
+      color: var(--colors-yellow-300);
+    }
+  }
+
+  .sr_true {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border-width: 0;
+  }
+
+  .d_flex {
+    display: flex;
+  }
+
+  .items_center {
+    align-items: center;
+  }
+
+  .gap_3 {
+    gap: var(--spacing-3);
+  }
+
+  .flex_row {
+    flex-direction: row;
+  }
+
+  .rounded_md {
+    border-radius: var(--radii-md);
+  }
+
+  .px_2 {
+    padding-inline: var(--spacing-2);
+  }
+
+  .py_2 {
+    padding-block: var(--spacing-2);
+  }
+
+  .border-width_1px {
+    border-width: 1px;
+  }
+
+  .self_flex-start {
+    align-self: flex-start;
+  }
+
+  .text_inherit {
+    color: inherit;
+  }
+}