From 93fcc5c59131ff171e48399fc6e0c60fe144ca01 Mon Sep 17 00:00:00 2001
From: mehm8128 <mehm8128@gmail.com>
Date: Sun, 5 Nov 2023 21:03:37 +0900
Subject: [PATCH 1/5] =?UTF-8?q?formButton=E3=81=ABtertiary=E3=82=92?=
 =?UTF-8?q?=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/UI/FormButton.vue     | 24 +++++++++++++++++++++---
 src/components/UI/LoadingSpinner.vue |  6 +++++-
 2 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/src/components/UI/FormButton.vue b/src/components/UI/FormButton.vue
index e898bd278..e29a84838 100644
--- a/src/components/UI/FormButton.vue
+++ b/src/components/UI/FormButton.vue
@@ -6,19 +6,24 @@
     :data-color="color"
   >
     <div :class="$style.label">{{ label }}</div>
-    <loading-spinner v-if="loading" :class="$style.spinner" />
+    <loading-spinner
+      v-if="loading"
+      :class="$style.spinner"
+      :color="spinnerColor"
+    />
   </button>
 </template>
 
 <script lang="ts" setup>
+import { computed } from 'vue'
 import LoadingSpinner from '/@/components/UI/LoadingSpinner.vue'
 
-withDefaults(
+const props = withDefaults(
   defineProps<{
     label?: string
     loading?: boolean
     disabled?: boolean
-    color?: 'primary' | 'secondary' | 'error'
+    color?: 'primary' | 'secondary' | 'error' | 'tertiary'
   }>(),
   {
     label: '',
@@ -27,6 +32,15 @@ withDefaults(
     color: 'primary' as const
   }
 )
+
+const spinnerColor = computed(() => {
+  switch (props.color) {
+    case 'tertiary':
+      return 'accent-primary'
+    default:
+      return 'white'
+  }
+})
 </script>
 
 <style lang="scss" module>
@@ -52,6 +66,10 @@ withDefaults(
     @include color-ui-secondary;
     border-color: $theme-ui-secondary-default;
   }
+  &[data-color='tertiary'] {
+    @include color-accent-primary;
+    border-color: $theme-accent-primary-default;
+  }
   &[data-color='error'] {
     color: $theme-accent-error-default;
     border-color: $theme-accent-error-default;
diff --git a/src/components/UI/LoadingSpinner.vue b/src/components/UI/LoadingSpinner.vue
index b4cbd098b..48539e654 100644
--- a/src/components/UI/LoadingSpinner.vue
+++ b/src/components/UI/LoadingSpinner.vue
@@ -5,7 +5,7 @@
 </template>
 
 <script lang="ts" setup>
-type SpinnerColor = 'white' | 'ui-secondary'
+type SpinnerColor = 'white' | 'ui-secondary' | 'accent-primary'
 
 withDefaults(
   defineProps<{
@@ -33,6 +33,10 @@ $spinner-width: 0.35em;
     --spinner-color: #{$theme-ui-secondary-default};
     --spinner-gap-color: var(--specific-loading-spinner-gap-ui-secondary);
   }
+  &[data-color='accent-primary'] {
+    --spinner-color: #{$theme-accent-primary-default};
+    --spinner-gap-color: rgba(255, 255, 255, 0.25);
+  }
 }
 .spinner {
   position: relative;

From 434cc9bfe62c79dccc64de5e208967ba51e640f5 Mon Sep 17 00:00:00 2001
From: mehm8128 <mehm8128@gmail.com>
Date: Sun, 5 Nov 2023 21:17:19 +0900
Subject: [PATCH 2/5] =?UTF-8?q?loading=E3=81=AE=E8=89=B2=E7=9B=B4=E3=81=97?=
 =?UTF-8?q?=E3=81=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/UI/LoadingSpinner.vue          | 2 +-
 src/composables/document/useThemeVariables.ts | 2 ++
 src/lib/theme/resolve/index.ts                | 5 +++++
 tests/unit/lib/theme/resolve/index.spec.ts    | 1 +
 4 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/UI/LoadingSpinner.vue b/src/components/UI/LoadingSpinner.vue
index 48539e654..87933fe92 100644
--- a/src/components/UI/LoadingSpinner.vue
+++ b/src/components/UI/LoadingSpinner.vue
@@ -35,7 +35,7 @@ $spinner-width: 0.35em;
   }
   &[data-color='accent-primary'] {
     --spinner-color: #{$theme-accent-primary-default};
-    --spinner-gap-color: rgba(255, 255, 255, 0.25);
+    --spinner-gap-color: var(--specific-loading-spinner-gap-accent-primary);
   }
 }
 .spinner {
diff --git a/src/composables/document/useThemeVariables.ts b/src/composables/document/useThemeVariables.ts
index cebcf3d19..9ea2515ec 100644
--- a/src/composables/document/useThemeVariables.ts
+++ b/src/composables/document/useThemeVariables.ts
@@ -63,6 +63,8 @@ export const useThemeVariables = (): ComputedRef<
         theme.specific.stampPickerOpenerBorder,
       '--specific-loading-spinner-gap-ui-secondary':
         theme.specific.loadingSpinnerGapUiSecondary,
+      '--specific-loading-spinner-gap-accent-primary':
+        theme.specific.loadingSpinnerGapAccentPrimary,
       '--specific-slider-background': theme.specific.sliderBackground,
 
       '--color-scheme': theme.browser.colorScheme,
diff --git a/src/lib/theme/resolve/index.ts b/src/lib/theme/resolve/index.ts
index e704c7e03..c8556cb95 100644
--- a/src/lib/theme/resolve/index.ts
+++ b/src/lib/theme/resolve/index.ts
@@ -25,6 +25,7 @@ type ResolvedSpecificTheme = SpecificTheme & {
   stampCountText: CSSColorType
   stampPickerOpenerBorder: CSSColorType
   loadingSpinnerGapUiSecondary: CSSColorType
+  loadingSpinnerGapAccentPrimary: CSSColorType
   sliderBackground: CSSColorType
 }
 
@@ -92,6 +93,10 @@ const resolveSpecificTheme = (
     basic.ui.secondary.fallback,
     0.5
   ),
+  loadingSpinnerGapAccentPrimary: transparentizeWithFallback(
+    basic.accent.primary.fallback,
+    0.5
+  ),
   sliderBackground: transparentizeWithFallback(basic.ui.secondary.fallback, 0.5)
 })
 
diff --git a/tests/unit/lib/theme/resolve/index.spec.ts b/tests/unit/lib/theme/resolve/index.spec.ts
index a62cee5f2..063f6e42d 100644
--- a/tests/unit/lib/theme/resolve/index.spec.ts
+++ b/tests/unit/lib/theme/resolve/index.spec.ts
@@ -42,6 +42,7 @@ describe('resolveTheme', () => {
       channelHashOpened: '#F0F2F5',
       channelUnreadBadgeText: '#F0F2F5',
       loadingSpinnerGapUiSecondary: 'rgba(107, 125, 138, 0.5)',
+      loadingSpinnerGapAccentPrimary: 'rgba(0, 91, 172, 0.5)',
       messageHoverBackground: 'rgba(240, 242, 245, 0.5)',
       sliderBackground: 'rgba(107, 125, 138, 0.5)',
       stampCountText: 'rgba(73, 83, 91, 0.6)',

From 432c36ad62faced198eb53d7b23f7f070a521b4a Mon Sep 17 00:00:00 2001
From: mehm8128 <mehm8128@gmail.com>
Date: Sun, 5 Nov 2023 21:23:47 +0900
Subject: [PATCH 3/5] =?UTF-8?q?Revert=20"loading=E3=81=AE=E8=89=B2?=
 =?UTF-8?q?=E7=9B=B4=E3=81=97=E3=81=9F"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This reverts commit 434cc9bfe62c79dccc64de5e208967ba51e640f5.
---
 src/components/UI/LoadingSpinner.vue          | 2 +-
 src/composables/document/useThemeVariables.ts | 2 --
 src/lib/theme/resolve/index.ts                | 5 -----
 tests/unit/lib/theme/resolve/index.spec.ts    | 1 -
 4 files changed, 1 insertion(+), 9 deletions(-)

diff --git a/src/components/UI/LoadingSpinner.vue b/src/components/UI/LoadingSpinner.vue
index 87933fe92..48539e654 100644
--- a/src/components/UI/LoadingSpinner.vue
+++ b/src/components/UI/LoadingSpinner.vue
@@ -35,7 +35,7 @@ $spinner-width: 0.35em;
   }
   &[data-color='accent-primary'] {
     --spinner-color: #{$theme-accent-primary-default};
-    --spinner-gap-color: var(--specific-loading-spinner-gap-accent-primary);
+    --spinner-gap-color: rgba(255, 255, 255, 0.25);
   }
 }
 .spinner {
diff --git a/src/composables/document/useThemeVariables.ts b/src/composables/document/useThemeVariables.ts
index 9ea2515ec..cebcf3d19 100644
--- a/src/composables/document/useThemeVariables.ts
+++ b/src/composables/document/useThemeVariables.ts
@@ -63,8 +63,6 @@ export const useThemeVariables = (): ComputedRef<
         theme.specific.stampPickerOpenerBorder,
       '--specific-loading-spinner-gap-ui-secondary':
         theme.specific.loadingSpinnerGapUiSecondary,
-      '--specific-loading-spinner-gap-accent-primary':
-        theme.specific.loadingSpinnerGapAccentPrimary,
       '--specific-slider-background': theme.specific.sliderBackground,
 
       '--color-scheme': theme.browser.colorScheme,
diff --git a/src/lib/theme/resolve/index.ts b/src/lib/theme/resolve/index.ts
index c8556cb95..e704c7e03 100644
--- a/src/lib/theme/resolve/index.ts
+++ b/src/lib/theme/resolve/index.ts
@@ -25,7 +25,6 @@ type ResolvedSpecificTheme = SpecificTheme & {
   stampCountText: CSSColorType
   stampPickerOpenerBorder: CSSColorType
   loadingSpinnerGapUiSecondary: CSSColorType
-  loadingSpinnerGapAccentPrimary: CSSColorType
   sliderBackground: CSSColorType
 }
 
@@ -93,10 +92,6 @@ const resolveSpecificTheme = (
     basic.ui.secondary.fallback,
     0.5
   ),
-  loadingSpinnerGapAccentPrimary: transparentizeWithFallback(
-    basic.accent.primary.fallback,
-    0.5
-  ),
   sliderBackground: transparentizeWithFallback(basic.ui.secondary.fallback, 0.5)
 })
 
diff --git a/tests/unit/lib/theme/resolve/index.spec.ts b/tests/unit/lib/theme/resolve/index.spec.ts
index 063f6e42d..a62cee5f2 100644
--- a/tests/unit/lib/theme/resolve/index.spec.ts
+++ b/tests/unit/lib/theme/resolve/index.spec.ts
@@ -42,7 +42,6 @@ describe('resolveTheme', () => {
       channelHashOpened: '#F0F2F5',
       channelUnreadBadgeText: '#F0F2F5',
       loadingSpinnerGapUiSecondary: 'rgba(107, 125, 138, 0.5)',
-      loadingSpinnerGapAccentPrimary: 'rgba(0, 91, 172, 0.5)',
       messageHoverBackground: 'rgba(240, 242, 245, 0.5)',
       sliderBackground: 'rgba(107, 125, 138, 0.5)',
       stampCountText: 'rgba(73, 83, 91, 0.6)',

From c1cd788250bb8970d9776da29fbe501de02097d3 Mon Sep 17 00:00:00 2001
From: mehm8128 <mehm8128@gmail.com>
Date: Sun, 5 Nov 2023 21:24:33 +0900
Subject: [PATCH 4/5] =?UTF-8?q?loading=E3=81=AE=E8=89=B2=E7=9B=B4=E3=81=97?=
 =?UTF-8?q?=E3=81=9F=E3=81=AE=E3=82=92=E7=9B=B4=E3=81=97=E3=81=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/UI/LoadingSpinner.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/UI/LoadingSpinner.vue b/src/components/UI/LoadingSpinner.vue
index 48539e654..d7f4626cb 100644
--- a/src/components/UI/LoadingSpinner.vue
+++ b/src/components/UI/LoadingSpinner.vue
@@ -35,7 +35,7 @@ $spinner-width: 0.35em;
   }
   &[data-color='accent-primary'] {
     --spinner-color: #{$theme-accent-primary-default};
-    --spinner-gap-color: rgba(255, 255, 255, 0.25);
+    --spinner-gap-color: rgba(255, 255, 255, 0);
   }
 }
 .spinner {

From fc57879df2b68086fc8a1ed2f47af25fb4fc3fb6 Mon Sep 17 00:00:00 2001
From: mehm8128 <mehm8128@gmail.com>
Date: Sun, 5 Nov 2023 21:27:47 +0900
Subject: [PATCH 5/5] =?UTF-8?q?transparent=E3=81=A7=E3=82=88=E3=81=8B?=
 =?UTF-8?q?=E3=81=A3=E3=81=9F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/UI/LoadingSpinner.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/UI/LoadingSpinner.vue b/src/components/UI/LoadingSpinner.vue
index d7f4626cb..cde9dbf11 100644
--- a/src/components/UI/LoadingSpinner.vue
+++ b/src/components/UI/LoadingSpinner.vue
@@ -35,7 +35,7 @@ $spinner-width: 0.35em;
   }
   &[data-color='accent-primary'] {
     --spinner-color: #{$theme-accent-primary-default};
-    --spinner-gap-color: rgba(255, 255, 255, 0);
+    --spinner-gap-color: transparent;
   }
 }
 .spinner {