Use prettier-plugin-tailwindcss (#11373)

* use prettier-plugin-tailwindcss to keep class names organized

* use prettierrc file to ensure formatting on save works with vscode

* classname reorder with prettier-plugin-tailwindcss
This commit is contained in:
Josh Hawkins
2024-05-14 09:06:44 -06:00
committed by GitHub
parent b10ae68c1f
commit 1757f4cb04
80 changed files with 682 additions and 597 deletions
@@ -23,7 +23,7 @@ export default function BirdseyeLivePlayer({
if (liveMode == "webrtc") {
player = (
<WebRtcPlayer
className={`rounded-lg md:rounded-2xl size-full`}
className={`size-full rounded-lg md:rounded-2xl`}
camera="birdseye"
/>
);
@@ -31,7 +31,7 @@ export default function BirdseyeLivePlayer({
if ("MediaSource" in window || "ManagedMediaSource" in window) {
player = (
<MSEPlayer
className={`rounded-lg md:rounded-2xl size-full`}
className={`size-full rounded-lg md:rounded-2xl`}
camera="birdseye"
/>
);
@@ -46,7 +46,7 @@ export default function BirdseyeLivePlayer({
} else if (liveMode == "jsmpeg") {
player = (
<JSMpegPlayer
className="size-full flex justify-center rounded-lg md:rounded-2xl overflow-hidden"
className="flex size-full justify-center overflow-hidden rounded-lg md:rounded-2xl"
camera="birdseye"
width={birdseyeConfig.width}
height={birdseyeConfig.height}
@@ -59,13 +59,13 @@ export default function BirdseyeLivePlayer({
return (
<div
className={cn(
"relative flex justify-center w-full cursor-pointer",
"relative flex w-full cursor-pointer justify-center",
className,
)}
onClick={onClick}
>
<div className="absolute top-0 inset-x-0 rounded-lg md:rounded-2xl z-10 w-full h-[30%] bg-gradient-to-b from-black/20 to-transparent pointer-events-none"></div>
<div className="absolute bottom-0 inset-x-0 rounded-lg md:rounded-2xl z-10 w-full h-[10%] bg-gradient-to-t from-black/20 to-transparent pointer-events-none"></div>
<div className="pointer-events-none absolute inset-x-0 top-0 z-10 h-[30%] w-full rounded-lg bg-gradient-to-b from-black/20 to-transparent md:rounded-2xl"></div>
<div className="pointer-events-none absolute inset-x-0 bottom-0 z-10 h-[10%] w-full rounded-lg bg-gradient-to-t from-black/20 to-transparent md:rounded-2xl"></div>
<div className="size-full">{player}</div>
</div>
);