- Fixed an issue where the center of the wheel was misaligned compared to the fortune wheel (#177)

- Fixed an issue where the move up and move down buttons all had the same icon as the remove button in the wheel options section

Author: 0DarkPhoenix

src/tools/fortune-wheel/fortune-wheel.vue

@@ -332,22 +332,22 @@ function getTextPosition(index: number) {
                   :title="t('tools.fortune-wheel.texts.title-move-up')"
                   @click="moveOption(index, index - 1)"
                 >
-                  {{ t('tools.fortune-wheel.texts.tag-') }}
+                  <icon-mdi-arrow-up />
                 </c-button>
                 <c-button
                   size="small"
                   :disabled="index === wheelOptions.length - 1"
                   :title="t('tools.fortune-wheel.texts.title-move-down')"
                   @click="moveOption(index, index + 1)"
                 >
-                  {{ t('tools.fortune-wheel.texts.tag-') }}
+                  <icon-mdi-arrow-down />
                 </c-button>
                 <c-button
                   size="small"
                   :title="t('tools.fortune-wheel.texts.title-remove')"
                   @click="removeOption(option.id)"
                 >
-                  {{ t('tools.fortune-wheel.texts.tag-') }}
+                  <icon-mdi-close />
                 </c-button>
               </div>
             </div>
@@ -569,14 +569,14 @@ function getTextPosition(index: number) {
 
 .wheel-center {
   position: absolute;
-  top: 49.5%;
+  top: 50%;
   left: 50%;
   width: v-bind('`${WHEEL_CONFIG.centerSize}px`');
   height: v-bind('`${WHEEL_CONFIG.centerSize}px`');
   border-radius: 50%;
   background: #414141;
   border: 4px solid #333;
-  transform: t(-50%, -50%);
+  transform: translate(-50%, -50%);
   z-index: 10;
   display: flex;
   align-items: center;