Merge branch 'main' into neoloading-tailwindcss

kodadot · Dec 5, 2023 · 5c309ca · 5c309ca
2 parents 681f47c + 7e01215
commit 5c309ca
Show file tree

Hide file tree

Showing 12 changed files with 75 additions and 115 deletions.
diff --git a/composables/transaction/transactionBurn.ts b/composables/transaction/transactionBurn.ts
@@ -191,13 +191,12 @@ export async function execBurnCollection(
     if (params.urlPrefix === 'ksm') {
       executeTransaction({
         cb: api.tx.system.remark,
-        arg: [collectionId, {}],
-        // arg: [
-        //   createNewInteraction({
-        //     action: NewInteraction.DESTROY,
-        //     payload: { id: collectionId },
-        //   }),
-        // ],
+        arg: [
+          createNewInteraction({
+            action: NewInteraction.DESTROY,
+            payload: { id: collectionId },
+          }),
+        ],
       })
     }
 

diff --git a/libs/ui/src/components/NeoAvatar/NeoAvatar.scss b/libs/ui/src/components/NeoAvatar/NeoAvatar.scss
diff --git a/libs/ui/src/components/NeoAvatar/NeoAvatar.vue b/libs/ui/src/components/NeoAvatar/NeoAvatar.vue
@@ -10,7 +10,9 @@
     }"
     :src="avatar"
     :alt="name"
-    class="border neo-avatar"
+    class="border-default border-border-color max-w-none object-cover"
+    :width="size"
+    :height="size"
     :style="customStyle"
     :original="true" />
   <img
@@ -20,7 +22,7 @@
     :width="size"
     :height="size"
     :style="customStyle"
-    class="border neo-avatar" />
+    :class="className" />
 </template>
 
 <script setup lang="ts">
@@ -41,7 +43,3 @@ const customStyle = computed(() => ({
   height: `${props.size}px`,
 }))
 </script>
-
-<style lang="scss">
-@import './NeoAvatar.scss';
-</style>
diff --git a/libs/ui/src/components/NeoCheckbox/NeoCheckbox.story.vue b/libs/ui/src/components/NeoCheckbox/NeoCheckbox.story.vue
@@ -1,8 +1,14 @@
 <template>
-  <Story title="NeoButton" :layout="{ type: 'grid', width: '200px' }">
-    <Variant title="small neo button">
+  <Story title="NeoCheckbox" :layout="{ type: 'grid', width: '200px' }">
+    <Variant title="Small NeoCheckbox">
+      <NeoCheckbox size="small"> {{ label }} </NeoCheckbox>
+    </Variant>
+    <Variant title="Default NeoCheckbox">
       <NeoCheckbox> {{ label }} </NeoCheckbox>
     </Variant>
+    <Variant title="Large NeoCheckbox">
+      <NeoCheckbox size="large"> {{ label }} </NeoCheckbox>
+    </Variant>
   </Story>
 </template>
 

diff --git a/libs/ui/src/components/NeoCheckbox/NeoCheckbox.vue b/libs/ui/src/components/NeoCheckbox/NeoCheckbox.vue
@@ -5,6 +5,7 @@
     :native-value="checkboxValue"
     :disabled="disabled"
     :label-class="labelClass"
+    :size="size"
     @update:modelValue="updateValue">
     <slot />
   </o-checkbox>
@@ -17,6 +18,7 @@ const props = defineProps<{
   disabled?: boolean
   modelValue: boolean
   labelClass?: string
+  size?: string
 }>()
 
 const emit = defineEmits(['update:modelValue'])

diff --git a/libs/ui/src/components/NeoDropdown/NeoDropdown.scss b/libs/ui/src/components/NeoDropdown/NeoDropdown.scss
@@ -2,55 +2,41 @@
 @import '@oruga-ui/oruga-next/src/scss/utilities/_variables.scss';
 @import '@oruga-ui/oruga-next/src/scss/utilities/_animations.scss';
 @import '@oruga-ui/oruga-next/src/scss/utilities/_helpers.scss';
-@import '../../scss/variable.scss';
 
 $dropdown-menu-padding: 0;
 $dropdown-menu-margin: 1rem 0;
 $dropdown-menu-border-radius: 0;
 
-$dropdown-menu-box-shadow: 4px 4px hsl(0deg, 0%, 4%);
-$dropdown-item-hover-color: #1f1f1f;
-$dropdown-item-hover-background-color: #ffe5f3;
+$dropdown-menu-box-shadow: var(--primary-shadow);
+$dropdown-menu-background: var(--background-color);
+$dropdown-item-color: var(--text-color);
+$dropdown-item-hover-color: var(--text-color);
+$dropdown-item-hover-background-color: var(--k-accent-hover);
 
 @import '@oruga-ui/oruga-next/src/scss/components/_dropdown.scss';
 
 .o-drop__item {
-  @include ktheme() {
-    border-bottom: 1px solid theme('border-color');
-    color: theme('text-color')!important;
-  }
-
-  &:hover {
-    @include ktheme() {
-      background: theme('k-accentHover');
-    }
-  }
+  @apply border-b border-b-border-color;
 
   &.is-active,
   &--active,
   &[active='true'] {
-    @include ktheme() {
-      color: theme('text-color-inverse') !important;
-      background: theme('background-color-inverse') !important;
+    @apply text-text-color-inverse bg-background-color-inverse;
+
+    &:hover {
+      @apply text-text-color-inverse bg-background-color-inverse;
     }
   }
 
   .o-tip {
-    width: 100%;
+    @apply w-full;
   }
 }
 
 .o-drop__menu {
-  @include ktheme() {
-    box-shadow: theme('primary-shadow');
-    border: 1px solid theme('border-color');
-    color: theme('text-color');
-    background: theme('background-color');
-  }
+  @apply border-default border-border-color text-text-color;
 
   &.no-shadow {
-    box-shadow: none !important;
+    @apply shadow-none;
   }
-
 }
-
diff --git a/libs/ui/src/components/NeoDropdown/NeoDropdownItem.vue b/libs/ui/src/components/NeoDropdown/NeoDropdownItem.vue
@@ -12,10 +12,6 @@ export default {
           [this.computedClass('itemDisabledClass', 'o-drop__item--disabled')]:
             this.parent.disabled || this.disabled,
         },
-        // {
-        //   [this.computedClass('itemActiveClass', 'o-drop__item--active')]:
-        //     this.isActive,
-        // },
       ]
     },
   },

diff --git a/libs/ui/src/components/NeoInput/NeoField.scss b/libs/ui/src/components/NeoInput/NeoField.scss
@@ -1,5 +1,3 @@
-@import '../../scss/variable.scss';
-@import '../../scss/theme.scss';
 @import '@oruga-ui/oruga-next/src/scss/utilities/expressions.scss';
 @import '@oruga-ui/oruga-next/src/scss/utilities/variables.scss';
 @import '@oruga-ui/oruga-next/src/scss/utilities/animations.scss';
@@ -12,39 +10,30 @@ $field-label-font-weight: 700;
 
 .o-field {
   &--error .o-input {
-    @include ktheme() {
-      border-color: theme('k-red') !important;
-    }
+    @apply border-k-red;
+
     &::placeholder {
-      @include ktheme() {
-        color: theme('k-red') !important;
-      }
+      @apply text-k-red;
     }
   }
 
   .o-field__label {
-    margin-bottom: 0.75rem;
-    @include ktheme() {
-      color: theme('text-color');
-    }
+    @apply mb-3 text-text-color;
   }
 
   &.o-field--focused {
     input,
     textarea {
-      outline: none;
+      @apply outline-none;
     }
   }
 
   .o-field__message-danger {
-    @include ktheme() {
-      color: theme('k-red');
-    }
+    @apply text-k-red;
   }
 
   .o-field--addons > :not(:first-child):not(:last-child) button,
   .o-field--addons > button:not(:first-child):not(:last-child) {
-    border-right: 0;
-    border-left: 0;
+    @apply border-l-0 border-r-0;
   }
 }
diff --git a/libs/ui/src/components/NeoInput/NeoInput.scss b/libs/ui/src/components/NeoInput/NeoInput.scss
@@ -1,5 +1,3 @@
-@import '../../scss/variable.scss';
-@import '../../scss/theme.scss';
 @import '@oruga-ui/oruga-next/src/scss/utilities/expressions.scss';
 @import '@oruga-ui/oruga-next/src/scss/utilities/variables.scss';
 @import '@oruga-ui/oruga-next/src/scss/utilities/animations.scss';
@@ -14,25 +12,17 @@ $input-textarea-padding: 0.75rem 1rem;
 
 .neo-input {
   .o-input {
-    outline: none;
-    box-shadow: none;
-    @include ktheme() {
-      border: 1px solid theme('k-grey-fix');
-      background-color: theme('background-color');
-      color: theme('text-color');
+    @apply outline-none shadow-none border-default border-k-grey-fix bg-background-color text-text-color;
 
-      &:focus {
-        border: 1px solid theme('text-color');
-      }
+    &:focus {
+      @apply border-default border-text-color;
     }
 
     &--danger {
-      @include ktheme() {
-        border: 1px solid theme('k-red');
+      @apply border-default border-k-red;
 
-        &:focus {
-          border: 1px solid theme('k-red');
-        }
+      &:focus {
+        @apply border-default border-k-red;
       }
     }
   }

diff --git a/libs/ui/src/components/NeoInputitems/NeoInputitems.scss b/libs/ui/src/components/NeoInputitems/NeoInputitems.scss
@@ -13,38 +13,24 @@ $autocomplete-menu-border-radius: 0;
 @import '@oruga-ui/oruga-next/src/scss/components/inputitems.scss';
 
 .o-inputit__container {
-  padding-top: 0;
-  @include ktheme() {
-    background-color: theme('background-color');
-  }
+  @apply pt-0 bg-background-color;
+
   .o-input.neo-input {
-    outline: none;
-    box-shadow: none;
-    @include ktheme() {
-      border: 1px solid theme('k-grey-fix');
-      background-color: theme('background-color');
-      color: theme('text-color');
-
-      &:focus {
-        border: 1px solid theme('text-color');
-      }
+    @apply outline-none shadow-none border-default border-k-grey-fix bg-background-color text-text-color;
+
+    &:focus {
+      @apply border-text-color;
     }
   }
 
   .o-acp__menu {
-    width: 100% !important;
-    @include ktheme() {
-      box-shadow: theme('primary-shadow');
-      border: 1px solid theme('border-color');
-      background: theme('background-color');
-    }
+    @apply w-full shadow-primary border-default border-border-color bg-background-color;
 
     .o-acp__item {
-      color: inherit;
+      @apply text-inherit;
+
       &:hover {
-        @include ktheme() {
-          color: theme('k-hovergrey');
-        }
+        @apply text-k-hover-grey;
       }
     }
   }

diff --git a/package.json b/package.json
@@ -63,7 +63,7 @@
     "@fortawesome/fontawesome-svg-core": "^6.4.2",
     "@fortawesome/vue-fontawesome": "^3.0.5",
     "@kodadot1/brick": "workspace:*",
-    "@kodadot1/minimark": "^0.1.10",
+    "@kodadot1/minimark": "^0.1.13",
     "@kodadot1/minipfs": "0.4.1-rc.0",
     "@kodadot1/static": "workspace:*",
     "@kodadot1/sub-api": "0.2.0-rc.0",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml