fix: 관리자 콘솔 모바일 UI 개선
- 화이트리스트 추가 버튼 레이아웃 수정 (shrink-0, items-center) - 콘솔 로그 줄바꿈 추가 (break-all) - 맨 아래로 스크롤 버튼 위치/스타일 개선 (녹색 그림자) - 바텀 네비게이션 배경 불투명으로 변경
This commit is contained in:
parent
119988f764
commit
03bf32a7d2
1 changed files with 15 additions and 16 deletions
|
|
@ -1222,7 +1222,7 @@ export default function Admin({ isMobile = false }) {
|
||||||
{logs.map((log, index) => (
|
{logs.map((log, index) => (
|
||||||
<div
|
<div
|
||||||
key={index}
|
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)}` }}
|
style={{ borderLeft: `3px solid ${getLogColorHex(log.type)}` }}
|
||||||
>
|
>
|
||||||
<span className={getLogColor(log.type)}>[{log.time}]</span>{' '}
|
<span className={getLogColor(log.type)}>[{log.time}]</span>{' '}
|
||||||
|
|
@ -1239,17 +1239,16 @@ export default function Admin({ isMobile = false }) {
|
||||||
{/* 맨 아래로 스크롤 버튼 */}
|
{/* 맨 아래로 스크롤 버튼 */}
|
||||||
<AnimatePresence>
|
<AnimatePresence>
|
||||||
{!isAtBottom && logs.length > 0 && (
|
{!isAtBottom && logs.length > 0 && (
|
||||||
<Tooltip content="맨 아래로 이동">
|
|
||||||
<motion.button
|
<motion.button
|
||||||
initial={{ opacity: 0, scale: 0.8 }}
|
initial={{ opacity: 0, scale: 0.8 }}
|
||||||
animate={{ opacity: 1, scale: 1 }}
|
animate={{ opacity: 1, scale: 1 }}
|
||||||
exit={{ opacity: 0, scale: 0.8 }}
|
exit={{ opacity: 0, scale: 0.8 }}
|
||||||
onClick={scrollToBottom}
|
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"
|
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} />
|
<ArrowDown size={20} />
|
||||||
</motion.button>
|
</motion.button>
|
||||||
</Tooltip>
|
|
||||||
)}
|
)}
|
||||||
</AnimatePresence>
|
</AnimatePresence>
|
||||||
|
|
||||||
|
|
@ -1515,7 +1514,7 @@ export default function Admin({ isMobile = false }) {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* 플레이어 추가 */}
|
{/* 플레이어 추가 */}
|
||||||
<div className="flex gap-2 mb-4">
|
<div className="flex items-center gap-2 mb-4">
|
||||||
<input
|
<input
|
||||||
type="text"
|
type="text"
|
||||||
value={newWhitelistPlayer}
|
value={newWhitelistPlayer}
|
||||||
|
|
@ -1526,11 +1525,11 @@ export default function Admin({ isMobile = false }) {
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
placeholder="플레이어 이름 입력..."
|
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
|
<button
|
||||||
onClick={() => addWhitelistPlayer(newWhitelistPlayer)}
|
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>
|
</button>
|
||||||
|
|
@ -2149,7 +2148,7 @@ export default function Admin({ isMobile = false }) {
|
||||||
|
|
||||||
{/* 모바일 바텀 네비게이션 */}
|
{/* 모바일 바텀 네비게이션 */}
|
||||||
{isMobile && (
|
{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">
|
<div className="flex">
|
||||||
{tabs.map(tab => (
|
{tabs.map(tab => (
|
||||||
<button
|
<button
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue