sacdeq
/
trackerdeq
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix css for CEF 103

This commit is contained in:
sacdeq 2025-04-25 14:21:14 +02:00
parent c6548d0b63
commit 4f5f5e71c7
4 changed files with 42 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/app/components/Lobby.tsx
View File

@ -72,7 +72,7 @@ export default function Lobby ( { player }: { player: string } )
return (
<div key={ i } className={ playerClass }>
<div
className="champion w-11 h-11 scale-125 bg-center bg-no-repeat bg-[length:120%] rounded-br-xl rounded-tr-xl"
className="champion w-11 h-11 scaler-125 bg-center bg-no-repeat bg-[length:120%] rounded-br-xl rounded-tr-xl"
style={ {
backgroundImage: `url(${ player.championImage })`,
} }
@ -85,13 +85,13 @@ export default function Lobby ( { player }: { player: string } )
<div className="flex flex-row gap-1">
<div
className="country w-8 h-6 scale-75 bg-center bg-contain bg-no-repeat"
className="country w-8 h-6 scaler-75 bg-center bg-contain bg-no-repeat"
style={ {
backgroundImage: `url(${ player.countryFlag })`,
} }
></div>
<div
className="position w-6 h-6 scale-105 bg-center bg-contain bg-no-repeat"
className="position w-6 h-6 scaler-105 bg-center bg-contain bg-no-repeat"
style={ {
backgroundImage: `url(${ player.positionIcon })`,
} }
@ -104,7 +104,7 @@ export default function Lobby ( { player }: { player: string } )
{ player.logo && (
<div
className="logo w-10 h-10 scale-90 mr-1 -ml-1 my-1 bg-center bg-contain bg-no-repeat rounded-lg"
className="logo w-10 h-10 scaler-90 mr-1 -ml-1 my-1 bg-center bg-contain bg-no-repeat rounded-lg"
style={ { backgroundImage: `url(${ player.logo })` } }
></div>
) }

2
src/app/components/Ranked.tsx
View File

@ -87,7 +87,7 @@ export default function Ranked ( { name, tag }: { name: string; tag: string } )
}` }
>
<div
className={ `champion bg-center aspect-square scale-90 rounded-full drop-shadow-lg bg-no-repeat bg-[length:110%] ${ match.win ? "" : "lose"
className={ `champion bg-center aspect-square scaler-90 rounded-full drop-shadow-lg bg-no-repeat bg-[length:110%] ${ match.win ? "" : "lose"
}` }
style={ { backgroundImage: `url('${ match.championImg }')` } }
/>

6
src/app/components/Session.tsx
View File

@ -43,16 +43,16 @@ export default function Session ( { name, tag }: { name: string; tag: string } )
return (
<div className="font-sans font-bold tracking-wide">
<div className="profile scale-50 mx-[17rem] -mb-12 relative">
<div className="profile scaler-50 mx-[17rem] -mb-12 relative">
<div className="profile-picture w-64 h-64 floating-box relative">
<img
className="absolute inset-0 w-full h-full object-cover rounded-full scale-75 mt-16"
className="absolute inset-0 w-full h-full object-cover rounded-full scaler-75 mt-16"
src={ data.profileIcon }
alt="Summoner Icon"
/>
{ data.rankedIcon && (
<img
className="absolute inset-0 w-full h-full object-cover scale-200"
className="absolute inset-0 w-full h-full object-cover scaler-200"
src={ data.rankedIcon }
alt="Ranked Icon"
/>

34
src/app/globals.css
View File

@ -18,6 +18,15 @@ body {
font-family: Arial, Helvetica, sans-serif;
}
@theme {
--color-red-600: #e7000b;
--color-red-800: #9f0712;
--color-sky-600: #0084d1;
--color-sky-800: #00598a;
--color-gray-200: #e5e7eb;
--color-gray-300: #d1d5dc;
}
@keyframes slideInOut {
0% {
transform: translateX(-100%);
@ -36,6 +45,31 @@ body {
}
}
.scaler-200 {
transform: scale(2);
}
.scaler-125 {
transform: scale(1.25);
}
.scaler-105 {
transform: scale(1.05);
}
.scaler-90 {
transform: scale(0.9);
}
.scaler-75 {
transform: scale(0.75);
}
.scaler-50 {
transform: scale(0.5);
}
.slide-animation {
animation: slideInOut 30s ease-in-out forwards;
}