stack.vertical -> stack.horizontal

app/components/FormWithConfirm.tsx

@@ -32,7 +32,7 @@ export function FormWithConfirm({
       <Dialog isOpen={dialogOpen} close={closeDialog} className="text-center">
         <div className="stack md">
           <h2 className="text-sm">{dialogHeading}</h2>
-          <div className="stack vertical md justify-center">
+          <div className="stack horizontal md justify-center">
             <Button
               form={id}
               variant="destructive"

app/routes/admin.tsx

@@ -100,7 +100,7 @@ function Impersonate() {
           }
         />
       </div>
-      <div className="stack vertical md">
+      <div className="stack horizontal md">
         <Button type="submit" disabled={!userId}>
           Go
         </Button>
@@ -129,7 +129,7 @@ function MigrateUser() {
   return (
     <Form className="stack md" method="post">
       <h2>Migrate user data</h2>
-      <div className="stack vertical md">
+      <div className="stack horizontal md">
         <div>
           <label>Old user</label>
           <UserCombobox
@@ -149,7 +149,7 @@ function MigrateUser() {
           />
         </div>
       </div>
-      <div className="stack vertical md">
+      <div className="stack horizontal md">
         <Button
           type="submit"
           disabled={!oldUserId || !newUserId || transition.state !== "idle"}

app/routes/plus/suggestions.tsx

@@ -299,7 +299,7 @@ function SuggestedForInfo({ hideText = false }: { hideText?: boolean }) {
         </div>
       ) : null}
       {canDeleteSuggestionOfThemselves() ? (
-        <div className="stack vertical md">
+        <div className="stack horizontal md">
           {data.suggestedForTiers.map((tier) => (
             <FormWithConfirm
               key={tier}
@@ -409,7 +409,7 @@ export function PlusSuggestionComments({
             <fieldset key={suggestion.id} className="plus__comment">
               <legend>{discordFullName(suggestion.author)}</legend>
               {suggestion.text}
-              <div className="stack vertical xs items-center">
+              <div className="stack horizontal xs items-center">
                 <span className="plus__comment-time">
                   <RelativeTime
                     timestamp={databaseTimestampToDate(

app/routes/plus/voting/index.tsx

@@ -262,7 +262,7 @@ function Voting(data: Extract<PlusVotingLoaderData, { type: "voting" }>) {
             size="lg"
           />
           <h2>{discordFullName(currentUser.user)}</h2>
-          <div className="stack vertical md">
+          <div className="stack horizontal md">
             <Button
               className="plus-voting__vote-button downvote"
               variant="outlined"

app/styles/common.css

@@ -135,7 +135,7 @@
   gap: var(--s-8);
 }
 
-.stack.vertical {
+.stack.horizontal {
   flex-direction: row;
 }