feat: update file-view ui

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2025 devproje
+Copyright (c) 2025 Project_IO
 
 Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
 

src/App.scss

@@ -88,5 +88,9 @@
 		align-items: flex-end;
 		flex-direction: column;
 		justify-content: center;
+
+		* {
+			text-align: end;
+		}
 	}
 }

src/App.tsx

@@ -130,8 +130,12 @@ function Footer() {
 			) : <></> : <></>}
 			
 			<div className="footer">
-				<span>&copy; 2020-2025 Project_IO. All rights reserved.</span>
+				<p>
-				<span>Powered by WSERVER.</span>
+					&copy; 2020-2025 <a href="https://git.wh64.net/devproje">Project_IO</a>. All rights reserved for images.
+					<br />
+					Code licensed under the <a href="https://git.wh64.net/devproje/kuma-archive/src/branch/master/LICENSE">MIT License</a>.
+				</p>
+				<span> Powered by WSERVER</span>
 			</div>
 		</footer>
 	);

src/components/directory/directory.scss

@@ -45,10 +45,5 @@
 }
 
 .ka-readme {
-	padding: 1rem 1rem 0 1rem;
+	padding-top: 1rem;
-
-	h1, h2 {
-		width: 100%;
-		border-bottom: 1px solid var(--foreground);
-	}
 }

src/components/directory/index.tsx

@@ -84,7 +84,10 @@ function Readme() {
 	useEffect(() => {
 		async function refresh() {
 			const pathname = location.pathname;
-			const res = await fetch(`/api/raw/${pathname}${pathname.endsWith("/") ? "" : "/"}README.md`);
+			const res = await fetch(`/api/raw/${pathname}${pathname.endsWith("/") ? "" : "/"}README.md`, {
+				cache: "no-cache"
+			});
+
 			if (res.status !== 200)
 				return;
 

src/components/file-view/fview.scss

@@ -3,27 +3,26 @@
 	display: flex;
 	margin: 1rem 0;
 	min-height: 300px;
-	border-radius: 15px;
 	flex-direction: column;
-	background-color: var(--nav-color);
+	border-top: 1px solid var(--foreground);
-	border: 1px solid var(--foreground);
+	border-bottom: 1px solid var(--foreground);
 
 	.title {
 		width: 100%;
 		display: flex;
-		padding: 5px 10px;
 		align-items: center;
 		flex-direction: row;
-		border-radius: 15px 15px 0 0;
+		padding: 0.25rem 10px;
 		justify-content: space-between;
-		background-color: var(--nav-hover);
+		background-color: var(--nav-color);
 		border-bottom: 1px solid var(--foreground);
 
 		.name {
-			width: fit-content;
 			display: flex;
+			width: fit-content;
+			align-items: center;
 
-			span {
+			b {
 				margin: 0 5px;
 			}
 		}

src/components/file-view/index.tsx

@@ -22,13 +22,13 @@ function FileView() {
 			<span className="title">
 				<div className="name">
 					<a className="link" href={location.pathname.endsWith("/") ? location.pathname + ".." : location.pathname + "/.."}>
-						<DynamicIcon name="chevron-left" />
+						<DynamicIcon name="chevron-left" size={21} />
 					</a>
-					<span>{location.pathname}</span>
+					<b>{location.pathname}</b>
 				</div>
 				<div className="action-row">
 					<a className="btn link" href={`/api/raw${location.pathname}`}>
-						<DynamicIcon name="file" />
+						<DynamicIcon name="file" size={21} />
 					</a>
 					<a className="btn link" onClick={ev => {
 						ev.preventDefault();
@@ -49,7 +49,7 @@ function FileView() {
 							})
 							.catch(error => console.error("Download failed:", error));
 					}}>
-						<DynamicIcon name="download" />
+						<DynamicIcon name="download" size={21} />
 					</a>
 				</div>
 			</span>

src/index.scss

@@ -63,11 +63,11 @@ html, body {
 }
 
 h1 {
-	font-size: 32pt;
+	font-size: 24pt;
 }
 
 h2 {
-	font-size: 24pt;
+	font-size: 20pt;
 }
 
 h3 {