bge-ui 1.0.1

package/src/icons/ColorC3Deposit.vue

@@ -0,0 +1,74 @@
+<template>
+  <svg
+    class="bge-color-svg"
+    :style="`width: 1em; height: 1em;font-size: ${size}px;`"
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <rect
+      width="24"
+      height="20.6667"
+      transform="matrix(1 0 0 -1 4 28)"
+      class="bge-fill-icon-gray"
+    />
+    <path d="M26 4H4V7.33333H26V4Z" class="bge-fill-gay-dark" />
+    <path d="M26 13.3333H20V16.6667H24L26 13.3333Z" class="bge-fill-gay-dark" />
+    <path d="M10 14L18 22H2V18.6667H10V14Z" class="bge-fill-icon-theme" />
+  </svg>
+</template>
+<script lang="ts" setup>
+import { defineProps } from 'vue'
+defineProps({
+  size: {
+    default: 24,
+    type: [Number, String],
+  },
+  color: {
+    default: '',
+    type: String,
+  },
+})
+defineOptions({
+  name: 'ColorC3Deposit',
+})
+</script>
+<style lang="scss">
+.bge-color-svg {
+  --icon-theme: #fff833;
+  --icon-gray: #9baec2;
+  --icon-gay-dark: #526375;
+
+  .dark & {
+    --icon-theme: #ffff38;
+    --icon-gray: #708397;
+    --icon-gay-dark: #32404d;
+  }
+}
+
+.bge-fill-icon-theme {
+  fill: var(--icon-theme);
+}
+
+.bge-fill-icon-gray {
+  fill: var(--icon-gray);
+}
+
+.bge-fill-gay-dark {
+  fill: var(--icon-gay-dark);
+}
+
+.bge-stroke-icon-theme {
+  stroke: var(--icon-theme);
+}
+
+.bge-stroke-icon-gray {
+  stroke: var(--icon-gray);
+}
+
+.bge-stroke-gay-dark {
+  stroke: var(--icon-gay-dark);
+}
+</style>

package/src/icons/ColorC3Establish.vue

@@ -0,0 +1,78 @@
+<template>
+  <svg
+    class="bge-color-svg"
+    :style="`width: 1em; height: 1em;font-size: ${size}px;`"
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <rect
+      x="4"
+      y="32"
+      width="27"
+      height="4"
+      transform="rotate(-90 4 32)"
+      class="bge-fill-gay-dark"
+    />
+    <path d="M7 25L7 5L29 5L29 15L29 25L7 25Z" class="bge-fill-icon-gray" />
+    <path
+      d="M24 9L16.3371 21L12 18.736L18.2171 9L24 9Z"
+      class="bge-fill-icon-theme"
+    />
+  </svg>
+</template>
+<script lang="ts" setup>
+import { defineProps } from 'vue'
+defineProps({
+  size: {
+    default: 24,
+    type: [Number, String],
+  },
+  color: {
+    default: '',
+    type: String,
+  },
+})
+defineOptions({
+  name: 'ColorC3Establish',
+})
+</script>
+<style lang="scss">
+.bge-color-svg {
+  --icon-theme: #fff833;
+  --icon-gray: #9baec2;
+  --icon-gay-dark: #526375;
+
+  .dark & {
+    --icon-theme: #ffff38;
+    --icon-gray: #708397;
+    --icon-gay-dark: #32404d;
+  }
+}
+
+.bge-fill-icon-theme {
+  fill: var(--icon-theme);
+}
+
+.bge-fill-icon-gray {
+  fill: var(--icon-gray);
+}
+
+.bge-fill-gay-dark {
+  fill: var(--icon-gay-dark);
+}
+
+.bge-stroke-icon-theme {
+  stroke: var(--icon-theme);
+}
+
+.bge-stroke-icon-gray {
+  stroke: var(--icon-gray);
+}
+
+.bge-stroke-gay-dark {
+  stroke: var(--icon-gay-dark);
+}
+</style>

package/src/icons/ColorC3Framework.vue

@@ -0,0 +1,71 @@
+<template>
+  <svg
+    class="bge-color-svg"
+    :style="`width: 1em; height: 1em;font-size: ${size}px;`"
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <rect x="4" y="4" width="24" height="24" class="bge-fill-icon-gray" />
+    <path d="M7 14.5H19L17 17.5H7V14.5Z" class="bge-fill-icon-theme" />
+    <path
+      d="M10 10V12L7 12V7H25V25H7V20H10V22L22 22V10L10 10Z"
+      class="bge-fill-gay-dark"
+    />
+  </svg>
+</template>
+<script lang="ts" setup>
+import { defineProps } from 'vue'
+defineProps({
+  size: {
+    default: 24,
+    type: [Number, String],
+  },
+  color: {
+    default: '',
+    type: String,
+  },
+})
+defineOptions({
+  name: 'ColorC3Framework',
+})
+</script>
+<style lang="scss">
+.bge-color-svg {
+  --icon-theme: #fff833;
+  --icon-gray: #9baec2;
+  --icon-gay-dark: #526375;
+
+  .dark & {
+    --icon-theme: #ffff38;
+    --icon-gray: #708397;
+    --icon-gay-dark: #32404d;
+  }
+}
+
+.bge-fill-icon-theme {
+  fill: var(--icon-theme);
+}
+
+.bge-fill-icon-gray {
+  fill: var(--icon-gray);
+}
+
+.bge-fill-gay-dark {
+  fill: var(--icon-gay-dark);
+}
+
+.bge-stroke-icon-theme {
+  stroke: var(--icon-theme);
+}
+
+.bge-stroke-icon-gray {
+  stroke: var(--icon-gray);
+}
+
+.bge-stroke-gay-dark {
+  stroke: var(--icon-gay-dark);
+}
+</style>

package/src/icons/ColorC3Kyc.vue

@@ -0,0 +1,76 @@
+<template>
+  <svg
+    class="bge-color-svg"
+    :style="`width: 1em; height: 1em;font-size: ${size}px;`"
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <rect x="2" y="6" width="28" height="20" class="bge-fill-icon-gray" />
+    <path d="M15 11H6V14H13L15 11Z" class="bge-fill-icon-theme" />
+    <path d="M12 17H6V20H10L12 17Z" class="bge-fill-icon-theme" />
+    <path
+      d="M22 10C20.3431 10 19 11.3431 19 13V15C19 16.6569 20.3431 18 22 18H23C24.6569 18 26 16.6569 26 15V10H22Z"
+      class="bge-fill-gay-dark"
+    />
+    <path
+      d="M19 20C16.7909 20 15 21.7909 15 24V26H30V24C30 21.7909 28.2091 20 26 20H19Z"
+      class="bge-fill-gay-dark"
+    />
+  </svg>
+</template>
+<script lang="ts" setup>
+import { defineProps } from 'vue'
+defineProps({
+  size: {
+    default: 24,
+    type: [Number, String],
+  },
+  color: {
+    default: '',
+    type: String,
+  },
+})
+defineOptions({
+  name: 'ColorC3Kyc',
+})
+</script>
+<style lang="scss">
+.bge-color-svg {
+  --icon-theme: #fff833;
+  --icon-gray: #9baec2;
+  --icon-gay-dark: #526375;
+
+  .dark & {
+    --icon-theme: #ffff38;
+    --icon-gray: #708397;
+    --icon-gay-dark: #32404d;
+  }
+}
+
+.bge-fill-icon-theme {
+  fill: var(--icon-theme);
+}
+
+.bge-fill-icon-gray {
+  fill: var(--icon-gray);
+}
+
+.bge-fill-gay-dark {
+  fill: var(--icon-gay-dark);
+}
+
+.bge-stroke-icon-theme {
+  stroke: var(--icon-theme);
+}
+
+.bge-stroke-icon-gray {
+  stroke: var(--icon-gray);
+}
+
+.bge-stroke-gay-dark {
+  stroke: var(--icon-gay-dark);
+}
+</style>

package/src/icons/ColorC3Licensing.vue

@@ -0,0 +1,71 @@
+<template>
+  <svg
+    class="bge-color-svg"
+    :style="`width: 1em; height: 1em;font-size: ${size}px;`"
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <rect x="3" y="3" width="26" height="4" class="bge-fill-gay-dark" />
+    <path d="M6 5H26V24L16 29.5L6 24V5Z" class="bge-fill-icon-gray" />
+    <path
+      d="M16 10L17.6223 13.7671L21.7063 14.1459L18.6249 16.8529L19.5267 20.8541L16 18.76L12.4733 20.8541L13.3751 16.8529L10.2937 14.1459L14.3777 13.7671L16 10Z"
+      class="bge-fill-icon-theme"
+    />
+  </svg>
+</template>
+<script lang="ts" setup>
+import { defineProps } from 'vue'
+defineProps({
+  size: {
+    default: 24,
+    type: [Number, String],
+  },
+  color: {
+    default: '',
+    type: String,
+  },
+})
+defineOptions({
+  name: 'ColorC3Licensing',
+})
+</script>
+<style lang="scss">
+.bge-color-svg {
+  --icon-theme: #fff833;
+  --icon-gray: #9baec2;
+  --icon-gay-dark: #526375;
+
+  .dark & {
+    --icon-theme: #ffff38;
+    --icon-gray: #708397;
+    --icon-gay-dark: #32404d;
+  }
+}
+
+.bge-fill-icon-theme {
+  fill: var(--icon-theme);
+}
+
+.bge-fill-icon-gray {
+  fill: var(--icon-gray);
+}
+
+.bge-fill-gay-dark {
+  fill: var(--icon-gay-dark);
+}
+
+.bge-stroke-icon-theme {
+  stroke: var(--icon-theme);
+}
+
+.bge-stroke-icon-gray {
+  stroke: var(--icon-gray);
+}
+
+.bge-stroke-gay-dark {
+  stroke: var(--icon-gay-dark);
+}
+</style>

package/src/icons/ColorC3NotPassed.vue

@@ -0,0 +1,76 @@
+<template>
+  <svg
+    class="bge-color-svg"
+    :style="`width: 1em; height: 1em;font-size: ${size}px;`"
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M2.5 3.5L24 3.5V24L24 28.5H21H2.5L2.5 3.5Z"
+      class="bge-fill-icon-gray"
+    />
+    <path d="M7 16H15L13 19H7V16Z" class="bge-fill-gay-dark" />
+    <path d="M7 10H18.5L16.5 13H7V10Z" class="bge-fill-gay-dark" />
+    <circle cx="24" cy="21.5" r="7" class="bge-fill-icon-theme" />
+    <path
+      d="M25.4141 21.4997L27.5352 19.3786L26.121 17.9644L23.9999 20.0855L21.879 17.9645L20.4648 19.3788L22.5857 21.4997L20.4642 23.6212L21.8784 25.0355L23.9999 22.9139L26.1216 25.0356L27.5358 23.6214L25.4141 21.4997Z"
+      class="bge-fill-gay-dark"
+    />
+  </svg>
+</template>
+<script lang="ts" setup>
+import { defineProps } from 'vue'
+defineProps({
+  size: {
+    default: 24,
+    type: [Number, String],
+  },
+  color: {
+    default: '',
+    type: String,
+  },
+})
+defineOptions({
+  name: 'ColorC3NotPassed',
+})
+</script>
+<style lang="scss">
+.bge-color-svg {
+  --icon-theme: #fff833;
+  --icon-gray: #9baec2;
+  --icon-gay-dark: #526375;
+
+  .dark & {
+    --icon-theme: #ffff38;
+    --icon-gray: #708397;
+    --icon-gay-dark: #32404d;
+  }
+}
+
+.bge-fill-icon-theme {
+  fill: var(--icon-theme);
+}
+
+.bge-fill-icon-gray {
+  fill: var(--icon-gray);
+}
+
+.bge-fill-gay-dark {
+  fill: var(--icon-gay-dark);
+}
+
+.bge-stroke-icon-theme {
+  stroke: var(--icon-theme);
+}
+
+.bge-stroke-icon-gray {
+  stroke: var(--icon-gray);
+}
+
+.bge-stroke-gay-dark {
+  stroke: var(--icon-gay-dark);
+}
+</style>

package/src/icons/ColorC3Pass.vue

@@ -0,0 +1,78 @@
+<template>
+  <svg
+    class="bge-color-svg"
+    :style="`width: 1em; height: 1em;font-size: ${size}px;`"
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M2.5 3.5L24 3.5V24L24 28.5H21H2.5L2.5 3.5Z"
+      class="bge-fill-icon-gray"
+    />
+    <path d="M7 16H15L13 19H7V16Z" class="bge-fill-gay-dark" />
+    <path d="M7 10H18.5L16.5 13H7V10Z" class="bge-fill-gay-dark" />
+    <circle cx="24" cy="21.5" r="7" class="bge-fill-icon-theme" />
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M28.7332 19.7513L23.1466 25.0204L19.5053 21.5174L20.8919 20.0761L23.1603 22.2583L27.3609 18.2963L28.7332 19.7513Z"
+      class="bge-fill-gay-dark"
+    />
+  </svg>
+</template>
+<script lang="ts" setup>
+import { defineProps } from 'vue'
+defineProps({
+  size: {
+    default: 24,
+    type: [Number, String],
+  },
+  color: {
+    default: '',
+    type: String,
+  },
+})
+defineOptions({
+  name: 'ColorC3Pass',
+})
+</script>
+<style lang="scss">
+.bge-color-svg {
+  --icon-theme: #fff833;
+  --icon-gray: #9baec2;
+  --icon-gay-dark: #526375;
+
+  .dark & {
+    --icon-theme: #ffff38;
+    --icon-gray: #708397;
+    --icon-gay-dark: #32404d;
+  }
+}
+
+.bge-fill-icon-theme {
+  fill: var(--icon-theme);
+}
+
+.bge-fill-icon-gray {
+  fill: var(--icon-gray);
+}
+
+.bge-fill-gay-dark {
+  fill: var(--icon-gay-dark);
+}
+
+.bge-stroke-icon-theme {
+  stroke: var(--icon-theme);
+}
+
+.bge-stroke-icon-gray {
+  stroke: var(--icon-gray);
+}
+
+.bge-stroke-gay-dark {
+  stroke: var(--icon-gay-dark);
+}
+</style>

package/src/icons/ColorC3Safes.vue

@@ -0,0 +1,83 @@
+<template>
+  <svg
+    class="bge-color-svg"
+    :style="`width: 1em; height: 1em;font-size: ${size}px;`"
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <rect x="4" y="4" width="24" height="24" class="bge-fill-icon-gray" />
+    <circle cx="16" cy="16" r="6" class="bge-fill-gay-dark" />
+    <path
+      d="M8.5 10C9.32843 10 10 9.32843 10 8.5C10 7.67157 9.32843 7 8.5 7C7.67157 7 7 7.67157 7 8.5C7 9.32843 7.67157 10 8.5 10Z"
+      class="bge-fill-icon-theme"
+    />
+    <path
+      d="M23.5 10C24.3284 10 25 9.32843 25 8.5C25 7.67157 24.3284 7 23.5 7C22.6716 7 22 7.67157 22 8.5C22 9.32843 22.6716 10 23.5 10Z"
+      class="bge-fill-icon-theme"
+    />
+    <path
+      d="M10 23.5C10 24.3284 9.32843 25 8.5 25C7.67157 25 7 24.3284 7 23.5C7 22.6716 7.67157 22 8.5 22C9.32843 22 10 22.6716 10 23.5Z"
+      class="bge-fill-icon-theme"
+    />
+    <path
+      d="M23.5 25C24.3284 25 25 24.3284 25 23.5C25 22.6716 24.3284 22 23.5 22C22.6716 22 22 22.6716 22 23.5C22 24.3284 22.6716 25 23.5 25Z"
+      class="bge-fill-icon-theme"
+    />
+  </svg>
+</template>
+<script lang="ts" setup>
+import { defineProps } from 'vue'
+defineProps({
+  size: {
+    default: 24,
+    type: [Number, String],
+  },
+  color: {
+    default: '',
+    type: String,
+  },
+})
+defineOptions({
+  name: 'ColorC3Safes',
+})
+</script>
+<style lang="scss">
+.bge-color-svg {
+  --icon-theme: #fff833;
+  --icon-gray: #9baec2;
+  --icon-gay-dark: #526375;
+
+  .dark & {
+    --icon-theme: #ffff38;
+    --icon-gray: #708397;
+    --icon-gay-dark: #32404d;
+  }
+}
+
+.bge-fill-icon-theme {
+  fill: var(--icon-theme);
+}
+
+.bge-fill-icon-gray {
+  fill: var(--icon-gray);
+}
+
+.bge-fill-gay-dark {
+  fill: var(--icon-gay-dark);
+}
+
+.bge-stroke-icon-theme {
+  stroke: var(--icon-theme);
+}
+
+.bge-stroke-icon-gray {
+  stroke: var(--icon-gray);
+}
+
+.bge-stroke-gay-dark {
+  stroke: var(--icon-gay-dark);
+}
+</style>

package/src/icons/ColorC3Trading.vue

@@ -0,0 +1,78 @@
+<template>
+  <svg
+    class="bge-color-svg"
+    :style="`width: 1em; height: 1em;font-size: ${size}px;`"
+    width="32"
+    height="32"
+    viewBox="0 0 32 32"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <rect x="4" y="4" width="24" height="24" class="bge-fill-icon-gray" />
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M11.643 16L7.48816 11.8452L9.84518 9.48816L16.357 16L9.84518 22.5118L7.48816 20.1548L11.643 16Z"
+      class="bge-fill-gay-dark"
+    />
+    <path
+      fill-rule="evenodd"
+      clip-rule="evenodd"
+      d="M20.357 16L24.5118 11.8452L22.1548 9.48816L15.643 16L22.1548 22.5118L24.5118 20.1548L20.357 16Z"
+      class="bge-fill-icon-theme"
+    />
+  </svg>
+</template>
+<script lang="ts" setup>
+import { defineProps } from 'vue'
+defineProps({
+  size: {
+    default: 24,
+    type: [Number, String],
+  },
+  color: {
+    default: '',
+    type: String,
+  },
+})
+defineOptions({
+  name: 'ColorC3Trading',
+})
+</script>
+<style lang="scss">
+.bge-color-svg {
+  --icon-theme: #fff833;
+  --icon-gray: #9baec2;
+  --icon-gay-dark: #526375;
+
+  .dark & {
+    --icon-theme: #ffff38;
+    --icon-gray: #708397;
+    --icon-gay-dark: #32404d;
+  }
+}
+
+.bge-fill-icon-theme {
+  fill: var(--icon-theme);
+}
+
+.bge-fill-icon-gray {
+  fill: var(--icon-gray);
+}
+
+.bge-fill-gay-dark {
+  fill: var(--icon-gay-dark);
+}
+
+.bge-stroke-icon-theme {
+  stroke: var(--icon-theme);
+}
+
+.bge-stroke-icon-gray {
+  stroke: var(--icon-gray);
+}
+
+.bge-stroke-gay-dark {
+  stroke: var(--icon-gay-dark);
+}
+</style>