ref: Change name to success

src/components/Block/CreationConfirmation.vue

@@ -140,7 +140,7 @@ onMounted(() => deploy());
     <div class="flex flex-col mt-4">
       <div v-for="(step, i) in steps" :key="step.id" class="flex items-center gap-4 mb-3 last:mb-0">
         <div>
-          <IH-check v-if="i < currentStep" class="text-skin-positive" />
+          <IH-check v-if="i < currentStep" class="text-skin-success" />
           <IH-clock v-else-if="i > currentStep" />
           <template v-else>
             <UiLoading v-if="!failed" />

src/components/Block/ExecutionEditable.vue

@@ -156,7 +156,7 @@ watch(model.value, () => {
           v-if="simulationState === 'SIMULATION_SUCCEDED'"
           title="Execution simulation succeeded"
         >
-          <IH-shield-check class="text-skin-positive" />
+          <IH-shield-check class="text-skin-success" />
         </UiTooltip>
         <UiTooltip
           v-if="simulationState === 'SIMULATION_FAILED'"

src/components/Proposal.vue

@@ -83,7 +83,7 @@ async function handleVoteClick(choice: Choice) {
           <div class="flex space-x-2 py-2">
             <UiTooltip title="For">
               <UiButton
-                class="w-[40px] !text-skin-positive !border-skin-positive !h-[40px] !px-0"
+                class="w-[40px] !text-skin-success !border-skin-success !h-[40px] !px-0"
                 :loading="sendingType === 'for'"
                 @click="handleVoteClick('for')"
               >

src/components/ProposalStatus.vue

@@ -16,7 +16,7 @@ defineProps<{ state: ProposalState }>();
   <div
     :class="{
       'bg-gray-400': state === 'pending',
-      'bg-skin-positive': state === 'active',
+      'bg-skin-success': state === 'active',
       'bg-skin-link': state === 'passed',
       'bg-purple-500': state === 'executed',
       'bg-skin-danger': state === 'rejected',

src/components/ProposalStatusIcon.vue

@@ -30,7 +30,7 @@ const style = computed(() => ({
 <template>
   <UiTooltip :title="titles[state]">
     <IS-clock v-if="state === 'pending'" class="text-gray-400" :style="style" />
-    <IS-status-online v-else-if="state === 'active'" class="text-skin-positive" :style="style" />
+    <IS-status-online v-else-if="state === 'active'" class="text-skin-success" :style="style" />
     <IS-check-circle v-else-if="state === 'passed'" class="text-skin-link" :style="style" />
     <IS-play v-else-if="state === 'executed'" class="text-purple-500" :style="style" />
     <IS-x-circle v-else-if="state === 'rejected'" class="text-skin-danger" :style="style" />

src/style.scss

@@ -22,16 +22,16 @@
   --primary: 17, 17, 17;
   --accent-foreground: 251, 251, 251;
   --danger: 235, 76, 91;
-  --positive: 87, 179, 117;
+  --success: 87, 179, 117;
 
   --accent-hover: rgba(250, 249, 252, 0.12);
   --accent-active: rgba(250, 249, 252, 0.32);
   --danger-border: rgba(235, 76, 91, 0.4);
   --danger-hover: rgba(235, 76, 91, 0.04);
   --danger-active: rgba(235, 76, 91, 0.12);
-  --positive-border: rgba(87, 179, 117, 0.4);
-  --positive-hover: rgba(87, 179, 117, 0.04);
-  --positive-active: rgba(87, 179, 117, 0.12);
+  --success-border: rgba(87, 179, 117, 0.4);
+  --success-hover: rgba(87, 179, 117, 0.04);
+  --success-active: rgba(87, 179, 117, 0.12);
 }
 
 .dark {
@@ -55,16 +55,16 @@
   --primary: 251, 251, 251;
   --accent-foreground: 17, 17, 17;
   --danger: 235, 76, 91;
-  --positive: 87, 179, 117;
+  --success: 87, 179, 117;
 
   --accent-hover: rgba(28, 27, 32, 0.12);
   --accent-active: rgba(28, 27, 32, 0.32);
   --danger-border: rgba(235, 76, 91, 0.4);
   --danger-hover: rgba(235, 76, 91, 0.04);
   --danger-active: rgba(235, 76, 91, 0.12);
-  --positive-border: rgba(87, 179, 117, 0.4);
-  --positive-hover: rgba(87, 179, 117, 0.04);
-  --positive-active: rgba(87, 179, 117, 0.12);
+  --success-border: rgba(87, 179, 117, 0.4);
+  --success-hover: rgba(87, 179, 117, 0.04);
+  --success-active: rgba(87, 179, 117, 0.12);
 }
 
 @font-face {
@@ -156,7 +156,7 @@ a,
 
 .choice-bg {
   &._1 {
-    @apply bg-skin-positive;
+    @apply bg-skin-success;
   }
   &._2 {
     @apply bg-skin-danger;
@@ -171,7 +171,7 @@ a,
 
 .choice-text {
   &._1 {
-    @apply text-skin-positive;
+    @apply text-skin-success;
   }
   &._2 {
     @apply text-skin-danger;

src/views/Proposal.vue

@@ -170,7 +170,7 @@ watchEffect(() => {
             <div class="flex space-x-2 py-2">
               <UiTooltip title="For">
                 <UiButton
-                  class="!text-skin-positive !border-skin-positive !w-[48px] !h-[48px] !px-0"
+                  class="!text-skin-success !border-skin-success !w-[48px] !h-[48px] !px-0"
                   :loading="sendingType === 'for'"
                   @click="handleVoteClick('for')"
                 >

src/views/Proposal/Votes.vue

@@ -126,7 +126,7 @@ watch([sortBy, choiceFilter], () => {
             placement="left"
             :items="[
               { key: 'any', label: 'Any' },
-              { key: 'for', label: 'For', indicator: 'bg-skin-positive' },
+              { key: 'for', label: 'For', indicator: 'bg-skin-success' },
               { key: 'against', label: 'Against', indicator: 'bg-skin-danger' },
               { key: 'abstain', label: 'Abstain', indicator: 'bg-skin-text' }
             ]"
@@ -217,7 +217,7 @@ watch([sortBy, choiceFilter], () => {
                 v-else
                 class="!w-[40px] !h-[40px] !px-0 cursor-default bg-transparent"
                 :class="{
-                  '!text-skin-positive !border-skin-positive': vote.choice === 1,
+                  '!text-skin-success !border-skin-success': vote.choice === 1,
                   '!text-skin-danger !border-skin-danger': vote.choice === 2,
                   '!text-gray-500 !border-gray-500': vote.choice === 3
                 }"

src/views/Space/Treasury.vue

@@ -210,7 +210,7 @@ watchEffect(() => setTitle(`Treasury - ${props.space.name}`));
               <div v-if="asset.change" class="text-sm">
                 <div
                   v-if="asset.change > 0"
-                  class="text-skin-positive"
+                  class="text-skin-success"
                   v-text="`+${_n(asset.change, 'standard', { maximumFractionDigits: 2 })}%`"
                 />
                 <div

tailwind.config.js

@@ -35,16 +35,16 @@ module.exports = {
         'skin-primary': 'rgba(var(--primary), <alpha-value>)',
         'skin-accent-foreground': 'rgba(var(--accent-foreground), <alpha-value>)',
         'skin-danger': 'rgba(var(--danger), <alpha-value>)',
-        'skin-positive': 'rgba(var(--positive), <alpha-value>)',
+        'skin-success': 'rgba(var(--success), <alpha-value>)',
 
         'skin-accent-hover': 'var(--accent-hover)',
         'skin-accent-active': 'var(--accent-active)',
         'skin-danger-border': 'var(--danger-border)',
         'skin-danger-hover': 'var(--danger-hover)',
         'skin-danger-active': 'var(--danger-active)',
-        'skin-positive-border': 'var(--positive-border)',
-        'skin-positive-hover': 'var(--positive-hover)',
-        'skin-positive-active': 'var(--positive-active)'
+        'skin-success-border': 'var(--success-border)',
+        'skin-success-hover': 'var(--success-hover)',
+        'skin-success-active': 'var(--success-active)'
       },
       animation: {
         'pulse-fast': 'pulse 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite'