feat(settings/options/renderingMode): startUp -> renderingMode

app/components/Settings/BottomScreen/Menus/Menus.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import OptionsMenu from "./Options/Menu.vue";
-import OptionsStartUp from "./Options/StartUp.vue";
+import OptionsRenderingMode from "./Options/RenderingMode.vue";
 import OptionsLanguage from "./Options/Language.vue";
 import Options2048 from "./Options/2048.vue";
 
@@ -42,7 +42,7 @@ const { select, selected, selectorPosition } = useButtonNavigation({
     options: [31, 119, 49, 49],
     optionsLanguage: [31, 71, 49, 49],
     options2048: [79, 71, 49, 49],
-    optionsStartUp: [31, 23, 49, 49],
+    optionsRenderingMode: [31, 23, 49, 49],
 
     clock: [79, 119, 49, 49],
     clockAchievements: [79, 71, 49, 49],
@@ -76,15 +76,15 @@ const { select, selected, selectorPosition } = useButtonNavigation({
     },
     optionsLanguage: {
       down: "options",
-      up: "optionsStartUp",
+      up: "optionsRenderingMode",
       right: "options2048",
     },
     options2048: {
       down: ["options", false],
       left: "optionsLanguage",
-      up: ["optionsStartUp", false],
+      up: ["optionsRenderingMode", false],
     },
-    optionsStartUp: {
+    optionsRenderingMode: {
       right: ["options2048", false],
       down: "optionsLanguage",
     },
@@ -190,7 +190,7 @@ watch(
 );
 
 const viewComponents: Record<string, Component> = {
-  optionsStartUp: OptionsStartUp,
+  optionsRenderingMode: OptionsRenderingMode,
   optionsLanguage: OptionsLanguage,
   options2048: Options2048,
 

app/components/Settings/BottomScreen/Menus/Options/Menu.vue

@@ -38,7 +38,7 @@ onRender((ctx) => {
       48 - animation.stage2Offset,
       -48 + animation.stage1Offset,
     );
-    assets.images.settings.topScreen.options.startUp.draw(
+    assets.images.settings.topScreen.options.renderingMode.draw(
       ctx,
       0,
       -96 + animation.stage2Offset + animation.stage1Offset,

app/components/Settings/BottomScreen/Menus/Options/RenderingMode.vue

@@ -96,8 +96,8 @@ const handleConfirm = () => {
     confirmationModal.open({
       text:
         mode === "3d"
-          ? $t("settings.options.startUp.confirmation3d")
-          : $t("settings.options.startUp.confirmation2d"),
+          ? $t("settings.options.renderingMode.confirmation3d")
+          : $t("settings.options.renderingMode.confirmation2d"),
       onClosed: async () => {
         await animateOutro();
         store.closeSubMenu();
@@ -141,7 +141,7 @@ onRender((ctx) => {
 
     bodyImg.draw(ctx, 0, HEADER_HEIGHT - 2, colorOpts);
     ctx.fillStyle = "#282828";
-    const text = $t("settings.options.startUp.autoStart");
+    const text = $t("settings.options.renderingMode.autoStart");
     fillTextHCenteredMultiline(ctx, text, 0, y, buttonWidth, 15);
 
     ctx.translate(0, animation[key].headerOffsetY);
@@ -155,14 +155,14 @@ onRender((ctx) => {
   };
 
   drawButton(
-    $t("settings.options.startUp.3dMode"),
+    $t("settings.options.renderingMode.3dMode"),
     renderingModeAssets._3dMode,
     32,
     selected.value === "_3dMode",
     "_3dMode",
   );
   drawButton(
-    $t("settings.options.startUp.2dMode"),
+    $t("settings.options.renderingMode.2dMode"),
     renderingModeAssets._2dMode,
     96,
     selected.value === "_2dMode",

app/components/Settings/TopScreen/Notifications.vue

@@ -45,7 +45,7 @@ const mainNotification = computed(() => ({
 
 const IMAGES_MAP: Record<string, AtlasImage> = {
   options: assets.images.settings.topScreen.options.options,
-  optionsStartUp: assets.images.settings.topScreen.options.startUp,
+  optionsRenderingMode: assets.images.settings.topScreen.options.renderingMode,
   optionsLanguage: assets.images.settings.topScreen.options.language,
   options2048: assets.images.settings.topScreen.options._2048,
 

app/stores/settings.ts

@@ -10,7 +10,7 @@ export const SETTINGS_MENUS = [
 export const SETTINGS_SUB_MENUS = [
   "optionsLanguage",
   "options2048",
-  "optionsStartUp",
+  "optionsRenderingMode",
   "clockAchievements",
   "clockTime",
   "clockDate",