feat(credits): add in both nds and repo

app/components/Credits/TopScreen.vue

@@ -0,0 +1,67 @@
+<script setup lang="ts">
+const { onRender } = useScreen();
+const store = useCreditsStore();
+
+onMounted(() => {
+  store.$reset();
+  store.animateIntro(CREDITS.length);
+});
+
+onRender((ctx) => {
+  ctx.fillStyle = "#000000";
+  ctx.fillRect(0, 0, LOGICAL_WIDTH, LOGICAL_HEIGHT);
+
+  ctx.globalAlpha = store.isIntro
+    ? store.intro.stage1Opacity
+    : store.isOutro
+      ? store.outro.stage2Opacity
+      : 1;
+  ctx.fillStyle = "#ffffff";
+  ctx.textBaseline = "top";
+
+  // title
+  ctx.font = "10px NDS10";
+  fillTextHCentered(
+    ctx,
+    $t("creditsScreen.title"),
+    0,
+    CREDITS_HEADER_Y,
+    LOGICAL_WIDTH,
+  );
+
+  // credits list (top screen entries only)
+  ctx.globalAlpha = store.isIntro
+    ? store.intro.stage1Opacity
+    : store.isOutro
+      ? store.outro.stage1Opacity
+      : 1;
+
+  for (let i = CREDITS_TOP_SCREEN_COUNT - 1; i >= 0; i--) {
+    const id = CREDITS[i]!;
+    const offset = store.getItemOffset(i);
+    if (offset === -CREDITS_LINE_HEIGHT) continue;
+
+    const baseY = CREDITS_LIST_START_Y + i * CREDITS_ENTRY_HEIGHT;
+    const y = baseY + offset;
+
+    ctx.fillStyle = "#000000";
+    ctx.fillRect(0, y, LOGICAL_WIDTH, CREDITS_LINE_HEIGHT * 3);
+
+    ctx.fillStyle = "#aaaaaa";
+    ctx.font = "7px NDS7";
+    fillTextHCentered(ctx, $t(`creditsScreen.${id}.label`), 0, y, LOGICAL_WIDTH);
+
+    ctx.fillStyle = "#ffffff";
+    ctx.font = "10px NDS10";
+    fillTextHCentered(ctx, $t(`creditsScreen.${id}.author`), 0, y + CREDITS_LINE_HEIGHT, LOGICAL_WIDTH);
+
+    ctx.fillStyle = "#888888";
+    ctx.font = "7px NDS7";
+    fillTextHCentered(ctx, $t(`creditsScreen.${id}.url`), 0, y + CREDITS_LINE_HEIGHT * 2, LOGICAL_WIDTH);
+  }
+});
+
+defineOptions({
+  render: () => null,
+});
+</script>