diff --git a/apps/NwaifuWeb/src/app/app.component.ts b/apps/NwaifuWeb/src/app/app.component.ts
index 5a7b3b7..bfb2baf 100644
--- a/apps/NwaifuWeb/src/app/app.component.ts
+++ b/apps/NwaifuWeb/src/app/app.component.ts
@@ -1,5 +1,5 @@
import { Component } from "@angular/core";
-import { RouterModule } from '@angular/router';
+import { RouterModule } from "@angular/router";
import { PanelComponent } from "./modules/panel/panel.component";
@Component({
diff --git a/apps/NwaifuWeb/src/app/pages/nitroplus-translator/components/text_list/text_list.component.scss b/apps/NwaifuWeb/src/app/pages/nitroplus-translator/components/text_list/text_list.component.scss
index 4ec5585..8b146cd 100644
--- a/apps/NwaifuWeb/src/app/pages/nitroplus-translator/components/text_list/text_list.component.scss
+++ b/apps/NwaifuWeb/src/app/pages/nitroplus-translator/components/text_list/text_list.component.scss
@@ -6,7 +6,7 @@
margin-inline: 2rem;
}
-h1 {
+h1, h2 {
color: #efdee0;
text-align: center;
margin: 1rem 2rem;
diff --git a/apps/NwaifuWeb/src/app/pages/nitroplus-translator/nitroplus-translator.component.html b/apps/NwaifuWeb/src/app/pages/nitroplus-translator/nitroplus-translator.component.html
index c6fa9ed..bad6c92 100644
--- a/apps/NwaifuWeb/src/app/pages/nitroplus-translator/nitroplus-translator.component.html
+++ b/apps/NwaifuWeb/src/app/pages/nitroplus-translator/nitroplus-translator.component.html
@@ -28,3 +28,6 @@
+
diff --git a/apps/NwaifuWeb/src/app/pages/nitroplus-translator/nitroplus-translator.component.less b/apps/NwaifuWeb/src/app/pages/nitroplus-translator/nitroplus-translator.component.less
index 54114f0..05cfacf 100644
--- a/apps/NwaifuWeb/src/app/pages/nitroplus-translator/nitroplus-translator.component.less
+++ b/apps/NwaifuWeb/src/app/pages/nitroplus-translator/nitroplus-translator.component.less
@@ -45,3 +45,14 @@
min-height: calc(100vh - 2rem);
scrollbar-color: #413738;
}
+.to-top-btn {
+ position: fixed;
+ width: 2rem;
+ left: 2rem;
+ bottom: -5rem;
+ transition: bottom 0.3s ease-in-out;
+
+ &.active {
+ bottom: 1rem;
+ }
+}
diff --git a/apps/NwaifuWeb/src/app/pages/nitroplus-translator/nitroplus-translator.component.ts b/apps/NwaifuWeb/src/app/pages/nitroplus-translator/nitroplus-translator.component.ts
index 186dff7..5522b61 100644
--- a/apps/NwaifuWeb/src/app/pages/nitroplus-translator/nitroplus-translator.component.ts
+++ b/apps/NwaifuWeb/src/app/pages/nitroplus-translator/nitroplus-translator.component.ts
@@ -1,7 +1,8 @@
import { CommonModule } from "@angular/common";
-import { Component, OnInit, ViewChild } from "@angular/core";
+import { AfterViewInit, Component, OnInit, ViewChild } from "@angular/core";
import { Router } from "@angular/router";
import { NWUIButtonComponent } from "@nwaifu-ui";
+import { fromEvent, map } from "rxjs";
import { TextListComponent } from "./components/text_list/text_list.component";
import { LocalStorageKeys } from "./consts";
import { NpsFile, TranslateData } from "./dto/translate_data.dto";
@@ -14,7 +15,7 @@ import { parse } from "./lib/parser";
templateUrl: "./nitroplus-translator.component.html",
styleUrl: "./nitroplus-translator.component.less",
})
-export class NitroplusComponent implements OnInit {
+export class NitroplusComponent implements OnInit, AfterViewInit {
title = "NitroPlusTranslator";
elements: TranslateData[] = [];
@ViewChild("fileInput") fileInput: HTMLInputElement | null = null;
@@ -36,6 +37,25 @@ export class NitroplusComponent implements OnInit {
}
}
+ ngAfterViewInit(): void {
+ const container = document.querySelector("main");
+ if (container) {
+ fromEvent(container, "scroll")
+ .pipe(map(() => container.scrollTop > 100))
+ .subscribe((val) => {
+ if (val) document.querySelector(".to-top-btn")?.classList.add("active");
+ else document.querySelector(".to-top-btn")?.classList.remove("active");
+ });
+ }
+ }
+
+ scrollToTop() {
+ const container = document.querySelector("main");
+ if (container) {
+ container.scrollTo({ top: 0, behavior: "smooth" });
+ }
+ }
+
submitFile($event: Event) {
const target = $event.target as HTMLInputElement;
if (target.files) {