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

refactor: improve accessibility and localization in AvatarBar component
Gitea Auto Deploy / Deploy-Container (push) Successful in 32s
Details

Browse Source
This commit is contained in:
Kain344
2026-08-27 08:47:24 +07:00
parent 2a36904b43
commit ec57123982
2 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/actionBar/index.tsx
+4 -4
View File
@@ -457,9 +457,9 @@ export default function ActionBar() {
</div> </div>
</div> </div>
{/* Navigation Tabs Row (>= 640px) */} {/* Navigation Tabs (>= 640px) - Responsive Wrap (2 rows on medium/smaller tablet/laptop screens, 1 row on wide screens) */}
<div className="hidden sm:block w-full bg-base-200/80 border border-base-content/10 rounded-xl p-1 shadow-xs overflow-x-auto scrollbar-none"> <div className="hidden sm:block w-full bg-base-200/80 border border-base-content/10 rounded-xl p-1 shadow-xs">
<div className="flex sm:grid sm:grid-cols-5 w-full min-w-max gap-1"> <div className="flex flex-wrap gap-1 w-full">
{navTabs.map((tab) => { {navTabs.map((tab) => {
const isActive = currentActivePath === tab.path; const isActive = currentActivePath === tab.path;
const Icon = tab.icon; const Icon = tab.icon;
@@ -467,7 +467,7 @@ export default function ActionBar() {
<button <button
key={tab.path} key={tab.path}
onClick={() => actionMove(tab.path)} onClick={() => actionMove(tab.path)}
className={`flex items-center justify-center gap-2 py-2 px-3 rounded-lg text-xs font-bold transition-all duration-200 whitespace-nowrap active-press ${ className={`flex-1 min-w-32.5 md:min-w-35 flex items-center justify-center gap-1.5 sm:gap-2 py-2 px-3 rounded-lg text-xs font-bold transition-all duration-200 whitespace-nowrap active-press ${
isActive isActive
? "bg-primary text-primary-content shadow-xs" ? "bg-primary text-primary-content shadow-xs"
: "text-base-content/75 hover:text-base-content hover:bg-base-100" : "text-base-content/75 hover:text-base-content hover:bg-base-100"
src/components/avatarBar/index.tsx
+2 -2
View File
@@ -115,7 +115,7 @@ export default function AvatarBar({ onClose }: { onClose?: () => void }) {
? "bg-primary/20 text-primary ring-1.5 ring-primary scale-105 z-10 shadow-xs" ? "bg-primary/20 text-primary ring-1.5 ring-primary scale-105 z-10 shadow-xs"
: "hover:bg-base-100 opacity-90 hover:opacity-100" : "hover:bg-base-100 opacity-90 hover:opacity-100"
}`} }`}
title={value.DamageTypeName || key} title={(locale && value.Name?.[locale]) || key}
> >
<Image <Image
src={`${process.env.CDN_URL}/${value.Icon}`} src={`${process.env.CDN_URL}/${value.Icon}`}
@@ -147,7 +147,7 @@ export default function AvatarBar({ onClose }: { onClose?: () => void }) {
? "bg-primary/20 ring-1.5 ring-primary scale-105 z-10 shadow-xs" ? "bg-primary/20 ring-1.5 ring-primary scale-105 z-10 shadow-xs"
: "hover:bg-base-100 opacity-90 hover:opacity-100" : "hover:bg-base-100 opacity-90 hover:opacity-100"
}`} }`}
title={value.BaseTypeName || key} title={(locale && value.Text?.[locale]) || key}
> >
<Image <Image
src={`${process.env.CDN_URL}/${value.Icon}`} src={`${process.env.CDN_URL}/${value.Icon}`}