Firefly-Shelter/Firefly_Srtools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UPDATE: Responsive for mobile
All checks were successful
Gitea Auto Deploy / Deploy-Container (push) Successful in 1m54s
Details

Browse Source
This commit is contained in:
Azen Kain
2025-09-30 15:15:51 +07:00
parent 6908e3971f
commit 91ce8320d1
10 changed files with 437 additions and 412 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
messages/vi.json
View File

@@ -197,6 +197,7 @@
"selectPFEvent": "Chọn sự kiện PF",
"selectASEvent": "Chọn sự kiện AS",
"selectCEEvent": "Chọn sự kiện CE",
"selectPEAKEvent": "Chọn sự kiện PEAK",
"selectEvent": "Chọn sự kiện",
"selectFloor": "Chọn tầng",
"selectSide": "Chọn nửa trận",
@@ -237,10 +238,9 @@
"maxAllSuccess": "Đã thiết lập cấp độ kỹ năng tối đa thành công.",
"maxAllFailed": "Thiết lập cấp độ kỹ năng tối đa thất bại.",
"noRelicEquipped": "Không có di vật",
"anomalyArbitration": "Phán Quyết Dị Thường",
"anomalyArbitration": "Trọng tài dị tướng",
"normalMode": "Chế độ thường",
"hardMode": "Chế độ khó",
"selectPEAKEvent": "Chọn sự kiện",
"mode": "Chế độ",
"selectMode": "Chọn chế độ",
"rollBack": "Quay lại bước trước",

BIN
public/icon/ChallengePeakIcon.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.9 KiB

5
src/components/monsterBar/as.tsx
View File

@@ -146,7 +146,7 @@ export default function AsBar() {
if (!ASEvent) return null
return (
<div className="container mx-auto px-4 py-8 relative">
<div className="py-8 relative">
{/* Title Card */}
<div className="rounded-xl p-4 mb-2 border border-warning">
@@ -243,6 +243,7 @@ export default function AsBar() {
</div>
{/* Enemy Waves */}
{(as_config?.challenge_id ?? 0) !== 0 && (
<div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
{/* First Half */}
<div className="rounded-xl p-4 mt-2 border border-warning">
@@ -343,6 +344,8 @@ export default function AsBar() {
))}
</div>
</div>
)}
</div>
)
}

8
src/components/monsterBar/ce.tsx
View File

@@ -111,7 +111,7 @@ export default function CeBar() {
}, [stageSearchTerm])
return (
<div className="p-6 z-4 h-full w-full" onClick={() => {
<div className="z-4 py-8 h-full w-full" onClick={() => {
setShowSearchWaveId(null)
setShowSearchStage(false)
@@ -217,7 +217,7 @@ export default function CeBar() {
{ce_config.monsters.map((wave, waveIndex) => (
<div key={waveIndex} className="card border border-slate-700/50 ">
<div className="card-body p-6">
<div className="flex items-center justify-between mb-4">
<div className="flex items-center flex-wrap justify-between mb-4">
<h2 className="text-xl font-bold text-white">{transI18n("wave")} {waveIndex + 1}</h2>
<div className="flex gap-2">
<button
@@ -286,7 +286,7 @@ export default function CeBar() {
<div className="card border hover:border-slate-500 transition-colors w-full h-full">
<div className="card-body p-4">
<button
className="btn btn-xs btn-success absolute -top-2 right-5 opacity-50 group-hover:opacity-100 transition-opacity"
className="btn btn-xs btn-success absolute -top-2 right-12 opacity-50 group-hover:opacity-100 transition-opacity"
onClick={() => {
const newCeConfig = cloneDeep(ce_config)
@@ -301,7 +301,7 @@ export default function CeBar() {
<CopyPlus className="w-3 h-3" />
</button>
<button
className="btn btn-xs btn-error absolute -top-2 -right-4 opacity-50 group-hover:opacity-100 transition-opacity"
className="btn btn-xs btn-error absolute -top-2 right-2 opacity-50 group-hover:opacity-100 transition-opacity"
onClick={() => {
const newCeConfig = cloneDeep(ce_config)
newCeConfig.monsters[waveIndex].splice(memberIndex, 1)

46
src/components/monsterBar/index.tsx
View File

@@ -15,20 +15,35 @@ export default function MonsterBar() {
{ name: transI18n("memoryOfChaos"), icon: 'AbyssIcon01', value: 'MOC' },
{ name: transI18n("pureFiction"), icon: 'ChallengeStory', value: 'PF' },
{ name: transI18n("apocalypticShadow"), icon: 'ChallengeBoss', value: 'AS' },
{ name: transI18n("anomalyArbitration"), icon: 'AbyssIcon02', value: 'PEAK' },
{ name: transI18n("anomalyArbitration"), icon: 'ChallengePeakIcon', value: 'PEAK' },
{ name: transI18n("customEnemy"), icon: 'MonsterIcon', value: 'CE' },
{ name: transI18n("simulatedUniverse"), icon: 'SimulatedUniverse', value: 'SU' },
];
return (
<div className="min-h-screen">
{/* Header Navigation */}
<nav className="border-b border-warning/30 relative">
<div className="container mx-auto px-4">
<nav className="border-b border-warning/30 relative pb-2">
<div className="flex items-center justify-center">
{/* Navigation Tabs */}
<div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-1">
{/* Mobile Select */}
<div className="block md:hidden w-full">
<select
className="select select-bordered w-full"
value={battle_type.toUpperCase()}
onChange={(e) => setBattleType(e.target.value.toUpperCase())}
>
{navItems.map((item) => (
<option key={item.name} value={item.value.toUpperCase()}>
{item.name}
</option>
))}
</select>
</div>
{/* Desktop Tabs */}
<div className="hidden md:grid grid-cols-3 lg:grid-cols-6 gap-1">
{navItems.map((item) => (
<button
key={item.name}
@@ -48,25 +63,18 @@ export default function MonsterBar() {
: undefined
}
>
<Image src={`/icon/${item.icon}.webp`} alt={item.name} width={24} height={24} />
</span>
<span
style={
battle_type.toUpperCase() === item.value.toUpperCase()
? {
filter:
'brightness(0) saturate(100%) invert(63%) sepia(78%) saturate(643%) hue-rotate(1deg) brightness(93%) contrast(89%)',
}
: undefined
}
>
<span className="font-medium">{item.name}</span>
<Image
src={`/icon/${item.icon}.webp`}
alt={item.name}
width={24}
height={24}
/>
</span>
<span>{item.name}</span>
</button>
))}
</div>
</div>
</div>
</nav>
{(battle_type.toUpperCase() === "DEFAULT" || battle_type.toUpperCase() === "") && (

5
src/components/monsterBar/moc.tsx
View File

@@ -113,7 +113,7 @@ export default function MocBar() {
])
if (!MOCEvent) return null
return (
<div className="container mx-auto px-4 py-8 relative">
<div className="py-8 relative">
{/* Title Card */}
<div className="rounded-xl p-4 mb-2 border border-warning">
@@ -223,6 +223,7 @@ export default function MocBar() {
</div>
{/* Enemy Waves */}
{(moc_config?.challenge_id ?? 0) !== 0 && (
<div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
{/* First Half */}
<div className="rounded-xl p-4 mt-2 border border-warning">
@@ -323,6 +324,8 @@ export default function MocBar() {
))}
</div>
</div>
)}
</div>
)
}

8
src/components/monsterBar/peak.tsx
View File

@@ -101,7 +101,7 @@ export default function PeakBar() {
if (!PEAKEvent) return null
return (
<div className="container mx-auto px-4 py-8 relative">
<div className="py-8 relative">
{/* Title Card */}
<div className="rounded-xl p-4 mb-2 border border-warning">
@@ -113,7 +113,7 @@ export default function PeakBar() {
}))}
excludeSet={[]}
selectedCustomSet={peak_config.event_id.toString()}
placeholder={transI18n("selectASEvent")}
placeholder={transI18n("selectPEAKEvent")}
setSelectedCustomSet={(id) => setPeakConfig({ ...peak_config, event_id: Number(id), challenge_id: 0, buff_id: 0 })}
/>
</div>
@@ -216,6 +216,8 @@ export default function PeakBar() {
</div>
{/* Enemy Waves */}
{(peak_config?.challenge_id ?? 0) !== 0 && (
<div className="grid grid-cols-1 gap-4">
<div className="rounded-xl p-4 mt-2 border border-warning">
@@ -267,6 +269,8 @@ export default function PeakBar() {
))}
</div>
</div>
)}
</div>
)
}

9
src/components/monsterBar/pf.tsx
View File

@@ -120,7 +120,7 @@ export default function PfBar() {
if (!PFEvent) return null
return (
<div className="container mx-auto px-4 py-8 relative">
<div className="py-8 relative">
{/* Title Card */}
<div className="rounded-xl p-4 mb-2 border border-warning">
@@ -138,7 +138,8 @@ export default function PfBar() {
...pf_config,
event_id: Number(id),
challenge_id: mapPFInfo[Number(id)]?.Level.slice(-1)[0]?.Id || 0,
buff_id: 0 })}
buff_id: 0
})}
/>
</div>
{/* Settings */}
@@ -229,6 +230,8 @@ export default function PfBar() {
</div>
{/* Enemy Waves */}
{(pf_config?.challenge_id ?? 0) !== 0 && (
<div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
{/* First Half */}
<div className="rounded-xl p-4 mt-2 border border-warning">
@@ -330,6 +333,8 @@ export default function PfBar() {
))}
</div>
</div>
)}
</div>
)
}

1
src/components/relicsInfo/index.tsx
View File

@@ -174,6 +174,7 @@ export default function RelicsInfo() {
} else {
setSelectedRelicSlot(item)
}
handlerChangeRelic(item)
}}
className="cursor-pointer"
>

5
src/components/skillsInfo/index.tsx
View File

@@ -189,8 +189,9 @@ export default function SkillsInfo() {
setSkillSelected(btn.id === skillSelected ? null : btn.id)
}}
style={{
left: `calc(${btn.left} - var(--size-${btn.size}) / 2)`,
top: `calc(${btn.top} - var(--size-${btn.size}) / 2)`,
left: btn.left,
top: btn.top,
transform: "translate(-50%, -50%)",
}}
>
<Image