caadiq/minecraft-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: 관리자 콘솔 모바일 UI 개선

Browse source 
- 화이트리스트 추가 버튼 레이아웃 수정 (shrink-0, items-center)
- 콘솔 로그 줄바꿈 추가 (break-all)
- 맨 아래로 스크롤 버튼 위치/스타일 개선 (녹색 그림자)
- 바텀 네비게이션 배경 불투명으로 변경
This commit is contained in:
caadiq 2025-12-24 19:20:01 +09:00
parent 119988f764
commit 03bf32a7d2
1 changed files with 15 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

31
frontend/src/pages/Admin.jsx
View file

@ -1222,7 +1222,7 @@ export default function Admin({ isMobile = false }) {
{logs.map((log, index) => (
<div
key={index}
className="leading-relaxed py-1 pl-3 mb-1"
className="leading-relaxed py-1 pl-3 mb-1 break-all"
style={{ borderLeft: `3px solid ${getLogColorHex(log.type)}` }}
>
<span className={getLogColor(log.type)}>[{log.time}]</span>{' '}
@ -1239,17 +1239,16 @@ export default function Admin({ isMobile = false }) {
{/* 맨 아래로 스크롤 버튼 */}
<AnimatePresence>
{!isAtBottom && logs.length > 0 && (
<Tooltip content="맨 아래로 이동">
<motion.button
initial={{ opacity: 0, scale: 0.8 }}
animate={{ opacity: 1, scale: 1 }}
exit={{ opacity: 0, scale: 0.8 }}
onClick={scrollToBottom}
className="absolute bottom-[88px] right-4 p-3 bg-mc-green hover:bg-mc-green/80 text-white rounded-full shadow-xl shadow-black/50 transition-colors z-10"
>
<ArrowDown size={20} />
</motion.button>
</Tooltip>
<motion.button
initial={{ opacity: 0, scale: 0.8 }}
animate={{ opacity: 1, scale: 1 }}
exit={{ opacity: 0, scale: 0.8 }}
onClick={scrollToBottom}
className="absolute bottom-[88px] right-4 p-3 bg-mc-green hover:bg-mc-green text-white rounded-full transition-colors z-10"
style={{ boxShadow: '0 0 16px rgba(76, 175, 80, 0.5)' }}
>
<ArrowDown size={20} />
</motion.button>
)}
</AnimatePresence>
@ -1515,7 +1514,7 @@ export default function Admin({ isMobile = false }) {
</div>
{/* 플레이어 추가 */}
<div className="flex gap-2 mb-4">
<div className="flex items-center gap-2 mb-4">
<input
type="text"
value={newWhitelistPlayer}
@ -1526,11 +1525,11 @@ export default function Admin({ isMobile = false }) {
}
}}
placeholder="플레이어 이름 입력..."
className="flex-1 bg-zinc-800 border border-zinc-700 rounded-lg px-3 py-2 text-white text-sm placeholder-zinc-500 focus:outline-none focus:border-mc-green/50"
className="flex-1 min-w-0 bg-zinc-800 border border-zinc-700 rounded-lg px-3 py-2 text-white text-sm placeholder-zinc-500 focus:outline-none focus:border-mc-green/50"
/>
<button
onClick={() => addWhitelistPlayer(newWhitelistPlayer)}
className="px-4 py-2 bg-mc-green text-white rounded-lg font-medium hover:bg-mc-green/80 transition-colors text-sm"
className="px-4 py-2 bg-mc-green text-white rounded-lg font-medium hover:bg-mc-green/80 transition-colors text-sm shrink-0 whitespace-nowrap"
>
추가
</button>
@ -2149,7 +2148,7 @@ export default function Admin({ isMobile = false }) {
{/* 모바일 바텀 네비게이션 */}
{isMobile && (
<div className="fixed bottom-0 left-0 right-0 bg-zinc-900/95 backdrop-blur-lg border-t border-zinc-800 px-2 pb-safe z-50">
<div className="fixed bottom-0 left-0 right-0 bg-zinc-900 border-t border-zinc-800 px-2 pb-safe z-50">
<div className="flex">
{tabs.map(tab => (
<button