@rokkit/themes 1.0.0-next.124 → 1.0.0-next.127

package/src/rokkit/organisms.css

@@ -1,307 +0,0 @@
-[data-style='rokkit'] rk-list-item {
-  @apply gap-2;
-}
-/* rk-list styles */
-
-[data-style='rokkit'] rk-list {
-  @apply gap-1px bg-surface-z2;
-}
-
-[data-style='rokkit'] rk-list rk-list-item,
-[data-style='rokkit'] rk-accordion div rk-summary {
-  @apply bg-surface-z1 text-surface-800 min-h-8 px-4 leading-10;
-}
-[data-style='rokkit'] rk-accordion > div > rk-summary {
-  @apply bg-gradient from-surface-z2 to-surface-z3 rounded pr-2;
-}
-
-/* Remove default details marker from summary */
-/* [data-style="rokkit"] rk-accordion > div > rk-summary::-webkit-details-marker {
-  display: none;
-} */
-
-/* Nested rk-list and Tree styles */
-[data-style='rokkit'] :not(accordion > div) > rk-list {
-  @apply border-surface-400 overflow-y-scroll rounded border shadow;
-}
-[data-style='rokkit'] :not(accordion > div) > rk-list rk-list-item {
-  @apply first:rounded-t last:rounded-b;
-}
-
-[data-style='rokkit'] rk-accordion rk-list rk-list-item {
-  @apply gap-2 last:rounded-b;
-}
-[data-style='rokkit'] rk-accordion rk-list rk-list-item > a {
-  @apply gap-2;
-}
-[data-style='rokkit'] rk-accordion rk-list {
-  @apply rounded-b;
-}
-
-[data-style='rokkit'] rk-accordion .is-expanded rk-list {
-  @apply -mt-10 rounded-t pt-10;
-}
-/* Styles for 'tabs' class */
-[data-style='rokkit'] tabs {
-  @apply border-surface-z3 gap-1 border-b-2 px-1;
-}
-[data-style='rokkit'] tabs.is-below {
-  @apply border-b-0 border-t-2;
-}
-[data-style='rokkit'] tabs:focus-within {
-  @apply border-secondary outline-none;
-}
-[data-style='rokkit'] tabs .tab {
-  @apply bg-surface-z1 flex-shrink-0 cursor-pointer items-center gap-3 rounded-t px-3 leading-9;
-}
-[data-style='rokkit'] tabs.is-below .tab {
-  @apply rounded-b rounded-t-none;
-}
-[data-style='rokkit'] tabs.is-centered {
-  @apply justify-center;
-}
-[data-style='rokkit'] tabs .tab[aria-selected='true'] {
-  @apply bg-surface-z3;
-}
-[data-style='rokkit'] tabs:focus-within .tab[aria-selected='true'] {
-  @apply from-primary to-secondary bg-gradient-to-b text-white;
-}
-[data-style='rokkit'] tabs.is-below:focus-within .tab[aria-selected='true'] {
-  @apply bg-gradient-to-t;
-}
-
-/* Styles for 'button' and 'button-group' classes */
-[data-style='rokkit'] button,
-[data-style='rokkit'] .button {
-  @apply bg-surface-z2 text-on-surface-z2 flex min-h-9 cursor-pointer items-center gap-3 rounded-full px-6 uppercase;
-  animation: button-pop var(--animation-btn, 0.25s) ease-out;
-}
-
-[data-style='rokkit'] button.is-primary,
-[data-style='rokkit'] .button.is-primary {
-  @apply from-primary to-secondary bg-gradient-to-r px-4 text-white;
-}
-[data-style='rokkit'] a.square > rk-icon {
-  @apply text-on-surface-z2 h-full w-full;
-}
-[data-style='rokkit'] a.square {
-  @apply border-surface-z2 bg-surface-z2 flex items-center justify-center rounded-md border leading-loose;
-}
-[data-style='rokkit'] button-group {
-  @apply gap-1px m-auto flex items-center justify-center py-1;
-}
-
-[data-style='rokkit'] button-group button {
-  @apply flex rounded-none px-2 pt-0.5 uppercase focus:outline-none;
-}
-[data-style='rokkit'] button-group button:first-child {
-  @apply rounded-l-full pl-3;
-}
-[data-style='rokkit'] button-group button:last-child {
-  @apply rounded-r-full pr-3;
-}
-
-[data-style='rokkit'] button-group button.active {
-  @apply from-primary to-secondary bg-gradient-to-r text-white;
-}
-
-/* Input and Drop-down styles */
-[data-style="rokkit"] input-select,
-/* [data-style="rokkit"] select, */
-[data-style="rokkit"] drop-down > button {
-  @apply rounded;
-  /* @apply border border-surface-z3; */
-}
-
-[data-style='rokkit'] drop-down > button {
-  @apply bg-surface-z1 p-0;
-}
-[data-style='rokkit'] drop-down > button > span {
-  @apply rounded py-0;
-}
-[data-style='rokkit'] drop-down > button > span > * {
-  @apply h-full items-center;
-}
-
-[data-style='rokkit'] :not(field) > input-select {
-  @apply bg-surface-z1 border-surface-z3 p-2px border;
-}
-[data-style='rokkit'] :not(field) > input-select > selected-item {
-  @apply bg-surface-z2;
-}
-[data-style='rokkit'] :not(field) > input-select:focus-within,
-[data-style='rokkit'] :not(field) > input-select:focus-within,
-[data-style='rokkit'] drop-down:focus-within > button {
-  /* @apply p-2px; */
-  @apply border-none outline-none;
-  @apply from-primary to-secondary bg-gradient-to-r text-white;
-}
-/* [data-style="rokkit"] :not(field) > input-select:focus-within > selected-item,
-[data-style="rokkit"] drop-down:focus-within > button > span {
-  @apply bg-surface-z3 outline-none min-h-10;
-} */
-
-/* Hover and rk-icon styles */
-/* [data-style="rokkit"] input-select:hover > rk-icon,
-[data-style="rokkit"] drop-down:hover > rk-icon {
-  @apply border-surface;
-} */
-
-/* Scroll styles */
-[data-style='rokkit'] input-select scroll {
-  @apply my-1 rounded shadow-lg;
-}
-
-/* [data-style="rokkit"] input-select > selected-item > items {
-  @apply flex-grow flex-wrap gap-2;
-} */
-
-/* rk-accordion styles */
-[data-style='rokkit'] rk-accordion {
-  @apply flex-grow gap-1 overflow-y-scroll;
-}
-[data-style='rokkit'] rk-accordion > div {
-  @apply relative rounded shadow;
-}
-
-/* Nested rk-list and rk-node styles */
-[data-style='rokkit'] rk-nested-list {
-  @apply text-surface-800;
-}
-[data-style='rokkit'] rk-nested-list rk-node > div {
-  @apply h-8 px-2;
-}
-
-/* Tree styles */
-[data-style='rokkit'] tree {
-  @apply rounded;
-}
-
-/* Focus styles for Nested rk-list, Tree, and rk-accordion */
-[data-style='rokkit'] rk-nested-list,
-[data-style='rokkit'] rk-nested-list:focus-within,
-[data-style='rokkit'] rk-tree:focus-within {
-  @apply rounded outline-none;
-}
-
-[data-style='rokkit'] rk-accordion,
-[data-style='rokkit'] rk-list {
-  @apply rounded;
-}
-
-/* Remove outline from focused elements */
-[data-style='rokkit'] rk-accordion:focus-within rk-list,
-[data-style='rokkit'] drop-down:focus-within rk-list,
-[data-style='rokkit'] input-select:focus-within rk-list {
-  @apply outline-none focus:outline-none;
-}
-
-/* Focus and Hover styles for rk-list and rk-node */
-[data-style='rokkit'] rk-list:focus {
-  @apply outline-secondary outline;
-}
-[data-style='rokkit'] rk-list rk-list-item:hover,
-[data-style='rokkit'] rk-node > div:hover {
-  @apply bg-surface-z2;
-}
-
-[data-style='rokkit'] rk-list-item[aria-current='true'],
-[data-style='rokkit'] rk-node[aria-current='true'] > div {
-  @apply bg-surface-z2 text-on-surface-z2;
-}
-
-/* Selected and Hover styles for rk-list and rk-node */
-[data-style='rokkit'] rk-list rk-list-item[aria-selected='true'] > a {
-  @apply text-white;
-}
-
-/* Expanded and Selected styles for rk-accordion */
-[data-style='rokkit'] rk-accordion .is-expanded rk-summary {
-  @apply border-surface-z3 z-1 sticky top-0 rounded-b-none border-b;
-}
-
-[data-style='rokkit'] rk-accordion [aria-selected='true'] rk-summary {
-  @apply bg-surface-z2;
-}
-[data-style='rokkit'] rk-accordion:focus-within [aria-selected='true'] rk-summary {
-  @apply from-primary to-secondary bg-gradient-to-r text-white outline-none;
-}
-
-/* Border styles for rk-accordion */
-[data-style='rokkit'] rk-accordion > div {
-  @apply border-surface-z3 border;
-}
-
-/* Folder Tree styles */
-[data-style='rokkit'] .folder-tree {
-  @apply bg-surface-z0 h-full;
-}
-[data-style='rokkit'] .folder-tree rk-nested-list {
-  @apply bg-surface-z0 h-full;
-}
-[data-style='rokkit'] rk-node > div > rk-item {
-  @apply px-1;
-}
-[data-style='rokkit'] rk-node > div > span {
-  @apply flex-shrink-0;
-}
-[data-style='rokkit'] rk-node > div > span > i {
-  @apply border-surface-z3;
-}
-[data-style='rokkit'] rk-node > div > rk-icon > i {
-  @apply text-surface-z6;
-}
-
-/* Toggle Switch styles */
-[data-style='rokkit'] rk-switch {
-  @apply mx-auto min-w-12 rounded-full;
-  @apply bg-surface-z2 border-surface-z3 border;
-  @apply p-2px leading-loose;
-}
-[data-style='rokkit'] rk-switch:focus-within {
-  @apply outline-secondary outline;
-}
-[data-style='rokkit'] rk-switch rk-item {
-  @apply items-center justify-center gap-1 px-3 py-0 leading-loose;
-  @apply min-h-6 min-w-6 cursor-pointer rounded-full;
-}
-[data-style='rokkit'] rk-switch rk-item > rk-icon > i {
-  @apply text-lg;
-}
-
-[data-style='rokkit'] rk-switch rk-item[aria-selected='true'] {
-  @apply from-surface-z3 to-surface-z3 bg-gradient-to-r;
-}
-
-[data-style='rokkit'] rk-switch.compact > rk-item {
-  @apply gap-0 px-0;
-}
-
-[data-style='rokkit'] rk-switch:focus-within rk-item[aria-selected='true'],
-[data-style='rokkit'] rk-list:focus-within rk-list-item[aria-selected='true'],
-[data-style='rokkit'] rk-tree:focus-within rk-node[aria-selected='true'] > div {
-  @apply from-primary to-secondary bg-gradient-to-r text-white;
-  @apply hover:from-secondary hover:to-primary;
-}
-
-[data-style='rokkit'] rk-switch[aria-disabled='true'] {
-  @apply bg-surface-z3 text-surface-500 cursor-not-allowed;
-}
-[data-style='rokkit'] rk-input-select > rk-selected-item > rk-items {
-  @apply flex-grow flex-wrap gap-2;
-}
-
-[data-style='rokkit'] rk-container:focus-within {
-  @apply outline-none;
-}
-
-[data-style='rokkit'] rk-pill {
-  @apply bg-surface-z3 border-surface-z3 text-surface-800 rounded-full border px-4;
-}
-[data-style='rokkit'] rk-pill rk-icon {
-  @apply text-surface-700;
-}
-
-[data-style='rokkit'] rk-pill rk-icon[role='button'] {
-  @apply hover:text-primary-z6 text-surface-z6 text-sm;
-}

package/src/rokkit.css

@@ -1,11 +0,0 @@
-@import './base.css';
-
-@import './rokkit/atoms.css';
-@import './rokkit/alert.css';
-@import './rokkit/input.css';
-@import './rokkit/molecules.css';
-@import './rokkit/organisms.css';
-@import './rokkit/layout.css';
-@import './rokkit/toggle.css';
-@import './rokkit/table.css';
-@import './rokkit/carousel.css';