Replace style override fix with a Classes prop override instead (#16621)

* replace style override fix

Signed-off-by: Avantika Iyer <avantika.hiyer@gmail.com>

* Update clean-lemons-jump.md

Signed-off-by: Avantika Iyer <avantika.hiyer@gmail.com>

* Update clean-lemons-jump.md

Signed-off-by: Avantika Iyer <avantika.hiyer@gmail.com>

* Update .changeset/clean-lemons-jump.md

Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>

---------

Signed-off-by: Avantika Iyer <avantika.hiyer@gmail.com>
Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
Co-authored-by: Patrik Oldsberg <poldsberg@gmail.com>

.changeset/clean-lemons-jump.md

@@ -0,0 +1,7 @@
+---
+'@backstage/core-components': patch
+---
+
+Button labels in the sidebar (previously displayed in uppercase) will be displayed in the case that is provided without any transformations.
+For example, a sidebar button with the label "Search" will appear as Search, "search" will appear as search, "SEARCH" will appear as SEARCH etc.
+This can potentially affect any overriding styles previously applied to change the appearance of Button labels in the Sidebar.

packages/core-components/src/layout/Sidebar/Bar.tsx

@@ -63,9 +63,6 @@ const useStyles = makeStyles<BackstageTheme, { sidebarConfig: SidebarConfig }>(
       '&::-webkit-scrollbar': {
         display: 'none',
       },
-      '& .MuiButtonBase-root': {
-        textTransform: 'none',
-      },
     }),
     drawerOpen: props => ({
       width: props.sidebarConfig.drawerWidthOpen,

packages/core-components/src/layout/Sidebar/Items.tsx

@@ -103,6 +103,7 @@ const makeSidebarStyles = (sidebarConfig: SidebarConfig) =>
         padding: 0,
         textAlign: 'inherit',
         font: 'inherit',
+        textTransform: 'none',
       },
       closed: {
         width: sidebarConfig.drawerWidthClosed,