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 10:06:44 -05:00
committed by GitHub
parent b10ae68c1f
commit 1757f4cb04
80 changed files with 682 additions and 597 deletions

View File

@@ -1,12 +1,12 @@
function CameraActivityIndicator() {
return (
<div className="flex items-center justify-center relative z-20">
<div className="relative z-20 flex items-center justify-center">
<div className="flex">
<div className="absolute size-[5px] inset-0 bg-severity_alert-dimmed rounded-full shadow-[0px_0px_10px_0px_#00000024,0px_0px_15px_0px_#00000024] z-20 animate-move"></div>
<div className="flex-1 size-[5px] mr-[2px] bg-severity_alert rounded-full animate-scale1"></div>
<div className="flex-1 size-[5px] mr-[2px] bg-severity_alert rounded-full animate-scale2"></div>
<div className="flex-1 size-[5px] mr-[2px] bg-severity_alert rounded-full animate-scale3"></div>
<div className="flex-1 size-[5px] mr-[2px] bg-severity_alert rounded-full animate-scale4"></div>
<div className="absolute inset-0 z-20 size-[5px] animate-move rounded-full bg-severity_alert-dimmed shadow-[0px_0px_10px_0px_#00000024,0px_0px_15px_0px_#00000024]"></div>
<div className="mr-[2px] size-[5px] flex-1 animate-scale1 rounded-full bg-severity_alert"></div>
<div className="mr-[2px] size-[5px] flex-1 animate-scale2 rounded-full bg-severity_alert"></div>
<div className="mr-[2px] size-[5px] flex-1 animate-scale3 rounded-full bg-severity_alert"></div>
<div className="mr-[2px] size-[5px] flex-1 animate-scale4 rounded-full bg-severity_alert"></div>
</div>
<svg className="hidden" xmlns="http://www.w3.org/2000/svg" version="1.1">
<defs>

View File

@@ -34,7 +34,7 @@ export default function Chip({
<div
ref={nodeRef}
className={cn(
"flex px-2 py-1.5 rounded-2xl items-center z-10",
"z-10 flex items-center rounded-2xl px-2 py-1.5",
className,
)}
onClick={onClick}
@@ -63,7 +63,7 @@ export function LogChip({ severity, onClickSeverity }: LogChipProps) {
return (
<div
className={`py-[1px] px-1 capitalize text-xs rounded-md ${onClickSeverity ? "cursor-pointer" : ""} ${severityClassName}`}
className={`rounded-md px-1 py-[1px] text-xs capitalize ${onClickSeverity ? "cursor-pointer" : ""} ${severityClassName}`}
onClick={(e) => {
e.stopPropagation();

View File

@@ -14,7 +14,7 @@ export default function ImageLoadingIndicator({
}
return isSafari ? (
<div className={cn("bg-gray-300 pointer-events-none", className)} />
<div className={cn("pointer-events-none bg-gray-300", className)} />
) : (
<Skeleton className={cn("pointer-events-none", className)} />
);