ZELLYY/zellyy-finance
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Center align app version info

Browse Source 
Center align the app version and description text in the settings page.
This commit is contained in:
gpt-engineer-app[bot]
2025-03-21 13:17:30 +00:00
parent e7352123c4
commit 51bcdf2d05
3 changed files with 12 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/AppVersionInfo.tsx
View File

@@ -1,3 +1,4 @@
import React, { useCallback, useEffect, useState, useRef } from 'react'; import React, { useCallback, useEffect, useState, useRef } from 'react';
import { getAppVersionInfo, isAndroidPlatform } from '@/utils/platform'; import { getAppVersionInfo, isAndroidPlatform } from '@/utils/platform';
import { Label } from '@/components/ui/label'; import { Label } from '@/components/ui/label';
@@ -105,15 +106,15 @@ const AppVersionInfo: React.FC<AppVersionInfoProps> = ({
return <div className={className}> return <div className={className}>
<div className="space-y-3"> <div className="space-y-3">
<div> <div>
<Label htmlFor="versionName" className="text-gray-600">앱 버전</Label> <Label htmlFor="versionName" className="text-gray-600 text-center block">앱 버전</Label>
<div className="p-2 text-base mt-1 py-0"> <div className="p-2 text-base mt-1 py-0 text-center">
{editableVersionName} (build {editableBuildNumber}) {editableVersionName} (build {editableBuildNumber})
</div> </div>
</div> </div>
<div> <div>
<Label htmlFor="notes" className="text-gray-600">세부 설명</Label> <Label htmlFor="notes" className="text-gray-600 text-center block">세부 설명</Label>
<div className="p-2 text-base mt-1 py-0">The first build</div> <div className="p-2 text-base mt-1 py-0 text-center">The first build</div>
</div> </div>
<div className="mt-[70px] text-center"> <div className="mt-[70px] text-center">
@@ -136,4 +137,4 @@ const AppVersionInfo: React.FC<AppVersionInfoProps> = ({
</div>} </div>}
</div>; </div>;
}; };
export default AppVersionInfo; export default AppVersionInfo;

10
src/pages/Settings.tsx
View File

@@ -1,3 +1,4 @@
import React from 'react'; import React from 'react';
import { useNavigate } from 'react-router-dom'; import { useNavigate } from 'react-router-dom';
import NavBar from '@/components/NavBar'; import NavBar from '@/components/NavBar';
@@ -104,10 +105,9 @@ const Settings = () => {
<SettingsOption icon={LogOut} label={user ? "로그아웃" : "로그인"} color="text-neuro-expense" onClick={user ? handleLogout : () => navigate('/login')} /> <SettingsOption icon={LogOut} label={user ? "로그아웃" : "로그인"} color="text-neuro-expense" onClick={user ? handleLogout : () => navigate('/login')} />
</div> </div>
<div className="mt-10 border-t border-gray-200 pt-4"> <div className="mt-10 border-t border-gray-200 pt-4 text-center">
<div> <div className="flex justify-center">
<AppVersionInfo showDevInfo={true} editable={true} className="w-full" />
<AppVersionInfo showDevInfo={true} editable={true} />
</div> </div>
{/* 앱 버전 카드 아래 추가 공간 */} {/* 앱 버전 카드 아래 추가 공간 */}
@@ -118,4 +118,4 @@ const Settings = () => {
<NavBar /> <NavBar />
</div>; </div>;
}; };
export default Settings; export default Settings;

2
src/utils/platform.ts
View File

@@ -42,7 +42,7 @@ export const getAppVersionInfo = async () => {
if (Capacitor.isPluginAvailable('BuildInfo')) { if (Capacitor.isPluginAvailable('BuildInfo')) {
// Capacitor.Plugins 대신에 직접 window 객체에서 접근 // Capacitor.Plugins 대신에 직접 window 객체에서 접근
// @ts-ignore - 플러그인이 런타임에 등록되므로 타입 체크를 무시 // @ts-ignore - 플러그인이 런타임에 등록되므로 타입 체크를 무시
const buildInfo = await Capacitor.Plugins.BuildInfo?.getBuildInfo(); const buildInfo = await Capacitor.Plugins?.BuildInfo?.getBuildInfo();
return { return {
versionName: buildInfo?.versionName || '1.0.1', versionName: buildInfo?.versionName || '1.0.1',
buildNumber: buildInfo?.buildNumber ? parseInt(buildInfo.buildNumber, 10) : 2, buildNumber: buildInfo?.buildNumber ? parseInt(buildInfo.buildNumber, 10) : 2,