LegacyConsoleArchive/LCE-Hub-LCE_Emerald_Launcher
1
0
Fork 0
mirror of https://github.com/LCE-Hub/LCE-Emerald-Launcher.git synced 2026-09-24 17:11:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: minor ui improvements

Browse Source
This commit is contained in:
neoapps-dev
2026-08-30 23:21:22 +03:00
parent effc859146
commit 7c566e3ff0
6 changed files with 38 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/images/goldmapper.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.9 KiB

src/components/layout/AppHeader.tsx
+5 -2
View File
@@ -9,7 +9,10 @@ interface AppHeaderProps {
uiFade: Record<string, unknown>;
}
export const AppHeader = memo(function AppHeader({ playPressSound, uiFade }: AppHeaderProps) {
export const AppHeader = memo(function AppHeader({
playPressSound,
uiFade,
}: AppHeaderProps) {
return (
<motion.div
key="header"
@@ -26,7 +29,7 @@ export const AppHeader = memo(function AppHeader({ playPressSound, uiFade }: App
className="w-4 h-4 object-contain block pointer-events-none"
style={{ imageRendering: "pixelated" }}
/>
<span className="text-xs text-gray-300 mc-text-shadow opacity-90 tracking-wide leading-none block pt-[1px] pointer-events-none">
<span className="text-xs text-gray-30 mc-text-shadow block pt-[1px] pointer-events-none">
Emerald Legacy Launcher
</span>
</div>
src/components/views/GoldMapperView.tsx
+11 -24
View File
@@ -5,9 +5,6 @@ import {
type GoldMapperMapping,
} from "../../services/TauriService";
import { useUI, useConfig, useAudio } from "../../context/LauncherContext";
const EMERALD_ICON = "/images/emerald_0.png";
const KEY_FALLBACK = [
"KEY_A",
"KEY_D",
@@ -21,7 +18,6 @@ const KEY_FALLBACK = [
];
const MOUSE_IDS = ["MOUSE_LEFT", "MOUSE_MIDDLE", "MOUSE_RIGHT"];
const MOUSE_LABELS: Record<string, string> = {
MOUSE_LEFT: "Left Click",
MOUSE_MIDDLE: "Middle Click",
@@ -81,7 +77,6 @@ const GoldMapperView = memo(function GoldMapperView() {
const [keyInputError, setKeyInputError] = useState<string | null>(null);
const [focusIndex, setFocusIndex] = useState<number | null>(null);
const containerRef = useRef<HTMLDivElement>(null);
useEffect(() => {
TauriService.goldMapperGetDefaults()
.then((defaults) => {
@@ -112,11 +107,7 @@ const GoldMapperView = memo(function GoldMapperView() {
.catch(console.error);
}, []);
const getTo = useCallback(
(id: string) => binds[id] ?? id,
[binds],
);
const getTo = useCallback((id: string) => binds[id] ?? id, [binds]);
const buildPayload = useCallback(
(nextBinds: Record<string, string>): GoldMapperMapping[] => {
const rows: GoldMapperMapping[] = [];
@@ -154,9 +145,7 @@ const GoldMapperView = memo(function GoldMapperView() {
playPressSound();
setEditing(id);
setModalFocusIndex(0);
setKeyInput(
/^KEY_/.test(getTo(id)) ? displayName(getTo(id)) : "",
);
setKeyInput(/^KEY_/.test(getTo(id)) ? displayName(getTo(id)) : "");
setKeyInputError(null);
},
[playPressSound, getTo],
@@ -202,7 +191,11 @@ const GoldMapperView = memo(function GoldMapperView() {
const rows: Row[] = useMemo(() => {
const list: Row[] = [{ kind: "reset", key: "reset" }];
list.push({ kind: "enable", key: "enable" });
list.push({ kind: "header", key: "controller_header", label: "Controller" });
list.push({
kind: "header",
key: "controller_header",
label: "Controller",
});
for (const id of controllerIds) {
list.push({
kind: "bind",
@@ -341,7 +334,6 @@ const GoldMapperView = memo(function GoldMapperView() {
const isEnable = row.kind === "enable";
const focusIdx = nextFocusIndex();
const focused = focusIndex === focusIdx;
return (
<button
key={row.key}
@@ -397,16 +389,14 @@ const GoldMapperView = memo(function GoldMapperView() {
? "Enable GoldMapper"
: row.label}
</span>
{!isReset &&
!isEnable &&
row.kind === "bind" && (
{!isReset && !isEnable && row.kind === "bind" && (
<span className="tracking-widest text-base opacity-70 ml-3 shrink-0">
{displayName(getTo(row.id))}
</span>
)}
{isEnable && (
<img
src={EMERALD_ICON}
src="/images/goldmapper.png"
alt=""
className="w-6 h-6 object-contain shrink-0 ml-3"
style={{ imageRendering: "pixelated" }}
@@ -470,9 +460,7 @@ const GoldMapperView = memo(function GoldMapperView() {
onMouseEnter={() => setModalFocusIndex(i)}
onClick={() => pickTarget(editing, id)}
className={`h-10 px-2 flex items-center justify-center text-sm tracking-widest outline-none border-none cursor-pointer transition-colors ${
getTo(editing) === id
? "text-[#ffff00]"
: "text-white"
getTo(editing) === id ? "text-[#ffff00]" : "text-white"
}`}
style={stoneButtonStyle(modalFocusIndex === i)}
>
@@ -556,8 +544,7 @@ const GoldMapperView = memo(function GoldMapperView() {
}
onClick={closeModal}
className={`w-full h-12 flex items-center justify-center text-xl mc-text-shadow transition-colors outline-none border-none cursor-pointer ${
modalFocusIndex ===
MOUSE_IDS.length + controllerIds.length + 1
modalFocusIndex === MOUSE_IDS.length + controllerIds.length + 1
? "text-[#ffff00]"
: "text-white"
}`}
src/components/views/HomeView.tsx
+1 -1
View File
@@ -162,7 +162,7 @@ const HomeView = memo(function HomeView() {
}
}}
disabled={btn.disabled}
className={`w-full h-12 flex items-center justify-between px-6 text-2xl mc-text-shadow transition-colors outline-none border-none ${btn.disabled ? "text-gray-400 cursor-not-allowed" : menuFocus === i ? (btn.isDanger ? "text-red-400" : "text-[#FFFF55]") : btn.isDanger ? "text-red-500" : "text-white"}`}
className={`w-full h-12 flex items-center justify-between px-6 text-xl mc-text-shadow transition-colors outline-none border-none ${btn.disabled ? "text-gray-400 cursor-not-allowed" : menuFocus === i ? (btn.isDanger ? "text-red-400" : "text-[#FFFF55]") : btn.isDanger ? "text-red-500" : "text-white"}`}
style={{
backgroundImage: btn.disabled
? "url('/images/Button_Background.png')"
src/components/views/SettingsView.tsx
+10 -20
View File
@@ -249,8 +249,12 @@ const SettingsView = memo(function SettingsView() {
const fullPath = tracks[currentTrack];
if (fullPath) {
trackName =
fullPath.split("/").pop()?.replace(".ogg", "").replace(".wav", "") ||
"Unknown";
fullPath
.split("/")
.pop()
?.replace(".ogg", "")
.replace(".wav", "")
.replace(".opus", "") || "Unknown";
}
}
@@ -778,20 +782,6 @@ const SettingsView = memo(function SettingsView() {
transition={{ duration: animationsEnabled ? 0.3 : 0 }}
className="flex flex-col items-center w-full max-w-5xl outline-none"
>
<h2 className="text-2xl text-white mc-text-shadow mt-2 mb-4 border-b-2 border-[#373737] pb-2 w-[40%] max-w-[200px] text-center tracking-widest uppercase opacity-80 whitespace-nowrap px-4">
{currentSubMenu === "main"
? "Settings"
: currentSubMenu === "audio"
? "Audio"
: currentSubMenu === "video"
? "Video"
: currentSubMenu === "game"
? "Game"
: currentSubMenu === "plugins"
? "Plugins"
: "Launcher"}
</h2>
{currentSubMenu === "main" ? (
<div className="w-full max-w-[680px] space-y-2 mb-4 p-6 flex flex-col items-center overflow-y-auto max-h-[55vh] settings-scrollbar">
{settingsItems.map((item, index) => {
@@ -821,7 +811,7 @@ const SettingsView = memo(function SettingsView() {
value={item.value}
onChange={(e) => item.onChange(parseInt(e.target.value))}
onMouseUp={playPressSound}
className="mc-slider-custom w-[calc(100%+16px)] h-full opacity-100 cursor-pointer z-20 outline-none m-0"
className="mc-slider-custom w-[calc(100%+16px)] h-full opacity-100 cursor-pointer z-0 outline-none m-0"
/>
</div>
</div>
@@ -851,7 +841,7 @@ const SettingsView = memo(function SettingsView() {
style={getItemStyle(index)}
>
<span
className={`mc-text-shadow tracking-widest uppercase ${isSmall ? "text-xs" : item.label.length > 20 ? "text-lg" : "text-xl"} truncate w-full text-center`}
className={`mc-text-shadow ${isSmall ? "text-xs" : item.label.length > 20 ? "text-lg" : "text-xl"} truncate w-full text-center`}
>
{item.label}
</span>
@@ -943,7 +933,7 @@ const SettingsView = memo(function SettingsView() {
style={getSliderStyle(index)}
>
<span
className={`absolute z-10 text-xl pointer-events-none transition-colors tracking-widest ${focusIndex === index ? "text-[#ffff00]" : item.id === "music" || item.id === "sfx" ? "text-white" : "text-[#2a2a2a]"}`}
className={`absolute z-30 text-xl mc-text-shadow pointer-events-none transition-colors tracking-widest ${focusIndex === index ? "text-[#ffff00]" : item.id === "music" || item.id === "sfx" ? "text-white" : "text-[#2a2a2a]"}`}
>
{item.label}
</span>
@@ -958,7 +948,7 @@ const SettingsView = memo(function SettingsView() {
item.onChange(parseInt(e.target.value))
}
onMouseUp={playPressSound}
className="mc-slider-custom w-[calc(100%+16px)] h-full opacity-100 cursor-pointer z-20 outline-none m-0"
className="mc-slider-custom w-[calc(100%+16px)] h-full opacity-100 cursor-pointer z-10 outline-none m-0"
/>
</div>
</div>
src/css/App.css
+7 -3
View File
@@ -19,16 +19,20 @@
padding: 0;
}
.mc-slider-custom::-webkit-slider-runnable-track {
height: 100%;
}
.mc-slider-custom::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
width: 14px;
height: 44px;
width: 20px;
height: 100%;
background: url('/images/Slider_Handle.png') no-repeat center;
background-size: 100% 100%;
cursor: pointer;
position: relative;
z-index: 30;
z-index: 1;
}
*:focus {