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

web/src/components/camera/DebugCameraImage.tsx

@@ -56,7 +56,7 @@ export default function DebugCameraImage({
         cameraClasses="relative w-full h-full flex justify-center"
       />
       <Button onClick={handleToggleSettings} variant="link" size="sm">
-        <span className="w-5 h-5">
+        <span className="h-5 w-5">
           <LuSettings />
         </span>{" "}
         <span>{showSettings ? "Hide" : "Show"} Options</span>
@@ -85,7 +85,7 @@ type DebugSettingsProps = {
 
 function DebugSettings({ handleSetOption, options }: DebugSettingsProps) {
   return (
-    <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
+    <div className="grid grid-cols-2 gap-4 md:grid-cols-3 lg:grid-cols-4">
       <div className="flex items-center space-x-2">
         <Switch
           id="bbox"