diff --git a/client/src/components/job-detail-cards/job-detail-cards.component.jsx b/client/src/components/job-detail-cards/job-detail-cards.component.jsx
index 801b0b6e2..cfe42fa67 100644
--- a/client/src/components/job-detail-cards/job-detail-cards.component.jsx
+++ b/client/src/components/job-detail-cards/job-detail-cards.component.jsx
@@ -93,7 +93,7 @@ export function JobDetailCards({ bodyshop, setPrintCenterContext, insertAuditTra
   };
 
   return (
-    <Drawer open={!!selected} destroyOnHidden width={drawerPercentage} placement="right" onClose={handleDrawerClose}>
+    <Drawer open={!!selected} destroyOnHidden size={drawerPercentage} placement="right" onClose={handleDrawerClose}>
       {loading ? <LoadingSpinner /> : null}
       {error ? <AlertComponent title={error.message} type="error" /> : null}
       {data ? (
diff --git a/client/src/components/parts-queue-card/parts-queue-card.component.jsx b/client/src/components/parts-queue-card/parts-queue-card.component.jsx
index 6b5e18751..65cbb62d1 100644
--- a/client/src/components/parts-queue-card/parts-queue-card.component.jsx
+++ b/client/src/components/parts-queue-card/parts-queue-card.component.jsx
@@ -48,7 +48,7 @@ export default function PartsQueueDetailCard() {
   };
 
   return (
-    <Drawer open={!!selected} destroyOnHidden width={drawerPercentage} placement="right" onClose={handleDrawerClose}>
+    <Drawer open={!!selected} destroyOnHidden size={drawerPercentage} placement="right" onClose={handleDrawerClose}>
       {loading ? <LoadingSpinner /> : null}
       {error ? <AlertComponent title={error.message} type="error" /> : null}
       {data ? (
diff --git a/client/src/components/shop-templates-list/shop-templates-list.container.jsx b/client/src/components/shop-templates-list/shop-templates-list.container.jsx
index fb53168d2..8bca731ea 100644
--- a/client/src/components/shop-templates-list/shop-templates-list.container.jsx
+++ b/client/src/components/shop-templates-list/shop-templates-list.container.jsx
@@ -34,7 +34,7 @@ export default function ShopTemplatesListContainer({ openState }) {
   };
 
   return (
-    <Drawer placement="left" width="25%" open={open} onClose={() => setOpen(false)}>
+    <Drawer placement="left" size="25%" open={open} onClose={() => setOpen(false)}>
       <div>
         <div>{t("bodyshop.labels.customtemplates")}</div>
         <ShopTemplateAdd shopTemplateList={data ? data.templates : []} refetch={refetch} />
diff --git a/client/src/components/tech-lookup-jobs-drawer/tech-lookup-jobs-drawer.component.jsx b/client/src/components/tech-lookup-jobs-drawer/tech-lookup-jobs-drawer.component.jsx
index d0e1dfc0b..12d001198 100644
--- a/client/src/components/tech-lookup-jobs-drawer/tech-lookup-jobs-drawer.component.jsx
+++ b/client/src/components/tech-lookup-jobs-drawer/tech-lookup-jobs-drawer.component.jsx
@@ -69,7 +69,7 @@ export function TechLookupJobsDrawer({ bodyshop, setPrintCenterContext }) {
   };
 
   return (
-    <Drawer open={!!selected} destroyOnHidden width={drawerPercentage} placement="right" onClose={handleDrawerClose}>
+    <Drawer open={!!selected} destroyOnHidden size={drawerPercentage} placement="right" onClose={handleDrawerClose}>
       {loading ? <LoadingSpinner /> : null}
       {error ? <AlertComponent title={error.message} type="error" /> : null}
       {data ? (
diff --git a/client/src/pages/phonebook/phonebook.page.container.jsx b/client/src/pages/phonebook/phonebook.page.container.jsx
index 6fdb996d0..3a2fd2917 100644
--- a/client/src/pages/phonebook/phonebook.page.container.jsx
+++ b/client/src/pages/phonebook/phonebook.page.container.jsx
@@ -57,7 +57,7 @@ export function PhonebookContainer({ setBreadcrumbs, setSelectedHeader }) {
     <RbacWrapper action="phonebook:view">
       <PhonebookPage />
       <Drawer
-        width={drawerPercentage}
+        size={drawerPercentage}
         onClose={() => {
           delete search.phonebookentry;
           navigate({ search: queryString.stringify(search) });
diff --git a/client/src/pages/shop-vendor/shop-vendor.page.component.jsx b/client/src/pages/shop-vendor/shop-vendor.page.component.jsx
index 278266eb6..3ba7cebf0 100644
--- a/client/src/pages/shop-vendor/shop-vendor.page.component.jsx
+++ b/client/src/pages/shop-vendor/shop-vendor.page.component.jsx
@@ -26,7 +26,7 @@ export default function ShopVendorPageComponent() {
     <div>
       <VendorsListContainer />
       <Drawer
-        width={drawerPercentage}
+        size={drawerPercentage}
         onClose={() => {
           searchParams.delete("selectedvendor");
           navigate({ search: searchParams.toString() });