ahmed/portfolio-2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases Activity

Fix broken PC UI on iOS
All checks were successful
Publish Docker Image / Publish Docker Image (push) Successful in 5s
Details

Browse Source
This commit is contained in:
Ahmed Al-Taiar
2025-05-02 22:44:35 -04:00
parent 01ac4d61cf
commit 2a1258a820
2 changed files with 15 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/scene/Scene.tsx
View File

@@ -244,7 +244,7 @@ export function Scene(props: JSX.IntrinsicElements["group"]) {
currentView === View.PCView ? "auto" : "none"
}
occlude="blending"
className="w-[1452px] h-[810px] bg-neutral-400"
className="w-[1452px] h-[810px] bg-[#0e1838]"
scale={10}
position={[0, 170, 0.25]}
raycast={
@@ -253,12 +253,8 @@ export function Scene(props: JSX.IntrinsicElements["group"]) {
: undefined
}
distanceFactor={10}
style={{
backgroundImage: "url(/assets/pc-bg.webp)",
backgroundColor: "#111535",
}}
>
<div className="w-full h-full backdrop-blur-md">
<div className="size-full">
<PCUI />
</div>
</Html>

26
src/components/ui/PCUI.tsx
View File

@@ -308,11 +308,11 @@ const Window: FC<HTMLAttributes<HTMLDivElement>> = ({ children, ...props }) => {
<div className="flex h-full space-x-1">
<Icon
path={mdiFolder}
className="text-neutral-400 h-full w-fit rounded-tl-lg rounded-br-lg transition-all hover:bg-blue-800 hover:ring-blue-500 hover:ring-1 p-1.5"
className="text-neutral-400 size-8 rounded-tl-lg rounded-br-lg transition-all hover:bg-blue-800 hover:ring-blue-500 hover:ring-1 p-1.5"
/>
<Icon
path={mdiPin}
className="text-neutral-400 h-full w-fit rounded-b-lg transition-all hover:bg-blue-800 hover:ring-blue-500 hover:ring-1 p-1.5"
className="text-neutral-400 size-8 rounded-b-lg transition-all hover:bg-blue-800 hover:ring-blue-500 hover:ring-1 p-1.5"
/>
</div>
<p className="absolute left-1/2 transform -translate-x-1/2 text-white">
@@ -321,21 +321,21 @@ const Window: FC<HTMLAttributes<HTMLDivElement>> = ({ children, ...props }) => {
<div className="flex h-full space-x-1 ml-auto justify-end">
<Icon
path={mdiWindowMinimize}
className="text-neutral-100 h-full w-fit rounded-b-lg transition-all hover:bg-amber-800 hover:ring-amber-500 hover:ring-1 p-1.5"
className="text-neutral-100 size-8 rounded-b-lg transition-all hover:bg-amber-800 hover:ring-amber-500 hover:ring-1 p-1.5"
/>
<Icon
path={mdiWindowRestore}
className="text-neutral-100 h-full w-fit rounded-b-lg transition-all hover:bg-green-800 hover:ring-green-500 hover:ring-1 p-1.5"
className="text-neutral-100 size-8 rounded-b-lg transition-all hover:bg-green-800 hover:ring-green-500 hover:ring-1 p-1.5"
/>
<Icon
path={mdiWindowClose}
className="text-neutral-100 h-full w-fit rounded-tr-lg rounded-bl-lg transition-all hover:bg-red-800 hover:ring-red-500 hover:ring-1 p-1.5"
className="text-neutral-100 size-8 rounded-tr-lg rounded-bl-lg transition-all hover:bg-red-800 hover:ring-red-500 hover:ring-1 p-1.5"
/>
</div>
</div>
<div className="flex bg-neutral-950 size-full rounded-b-lg text-white">
<div className="h-full w-fit bg-neutral-950 flex flex-col rounded-bl-lg">
<div className="h-14 p-2 pr-1 flex justify-center w-fit space-x-1">
<div className="h-14 p-2 pr-1 flex justify-center w-36 space-x-1">
<Icon
path={mdiArrowLeft}
className="text-neutral-100 h-full w-fit rounded-md transition-all hover:ring-neutral-500 hover:ring-1 p-2"
@@ -402,7 +402,7 @@ const Window: FC<HTMLAttributes<HTMLDivElement>> = ({ children, ...props }) => {
>
<Icon
path={mdiHelp}
className="text-neutral-100 h-full w-fit rounded-md transition-all hover:ring-neutral-500 hover:ring-1 p-2"
className="text-neutral-100 size-11 rounded-md transition-all hover:ring-neutral-500 hover:ring-1 p-2"
/>
</button>
</div>
@@ -417,7 +417,7 @@ const Window: FC<HTMLAttributes<HTMLDivElement>> = ({ children, ...props }) => {
defaultValue="/home/ahmed/Desktop/projects"
/>
</div>
<div className="flex justify-center h-full w-fit space-x-1">
<div className="flex justify-center h-full w-36 space-x-1">
<Icon
path={mdiBackspace}
className="text-neutral-100 h-full w-fit rounded-md transition-all hover:ring-neutral-500 hover:ring-1 p-2"
@@ -446,7 +446,7 @@ const Taskbar = () => {
<div className="flex space-x-4 h-full w-fit items-center">
<SiArchlinux
color={SiArchlinuxHex}
className="h-full w-fit transition-transform hover:scale-110"
className="size-10 transition-transform hover:scale-110"
/>
<div className="w-8 h-full">
<div className="w-full h-1/2 bg-blue-900 outline-1 outline-blue-600 transition-all hover:bg-blue-700 hover:outline-blue-400" />
@@ -454,19 +454,19 @@ const Taskbar = () => {
</div>
<Icon
path={mdiFolder}
className="text-blue-500 h-full w-fit transition-transform hover:scale-110 border-b-2"
className="text-blue-500 size-10 transition-transform hover:scale-110 border-b-2"
/>
<SiVscodium
color={SiVscodiumHex}
className="h-full w-fit transition-transform hover:scale-110"
className="size-10 transition-transform hover:scale-110"
/>
<Icon
path={mdiConsole}
className="text-neutral-400 h-full w-fit transition-transform hover:scale-110"
className="text-neutral-400 size-10 transition-transform hover:scale-110"
/>
<SiFirefoxbrowser
color={SiFirefoxbrowserHex}
className="h-full w-fit transition-transform hover:scale-110"
className="size-10 transition-transform hover:scale-110"
/>
</div>
<div className="flex space-x-2 h-full w-fit items-center">