Porning/app
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Modified float to not be dependant on the padding of the parent

Browse Source
This commit is contained in:
AINDUSTRIES
2026-09-12 00:56:22 +02:00
parent dc9b69b42d
commit 8cc913f083
1 changed files with 9 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
app/components/float.tsx
View File

@@ -1,9 +1,15 @@
export function Float({ float }: { float: number }) { export function Float({ float }: { float: number }) {
return ( return (
<> <>
<div className="w-full flex justify-center"> <div className="w-full flex justify-center relative">
<div className="absolute mx-2 h-4 w-1 mt-1 rounded-xl bg-white" style={{left: `calc(${float}*100% - var(--spacing))`}}></div> <div
<div className="w-full h-2 flex my-2 px-2"> className="absolute mx-1 h-4 w-1 mt-1 rounded-xl bg-white"
style={{
left: `calc(${float}*100% - var(--spacing))`,
transform: "translateX(-50%)",
}}
></div>
<div className="w-full h-2 flex my-2">
<div className="w-7/100 h-full rounded-l-xl bg-green-800"></div> <div className="w-7/100 h-full rounded-l-xl bg-green-800"></div>
<div className="w-8/100 h-full bg-green-500"></div> <div className="w-8/100 h-full bg-green-500"></div>
<div className="w-23/100 h-full bg-lime-400"></div> <div className="w-23/100 h-full bg-lime-400"></div>