Navigation: Increase navigation width + make icons a consistent size (#39959)

* Navigation: Increase navigation width + make icons a consistent size

* Navigation: Move style to only apply to headers

packages/grafana-data/src/themes/createComponents.ts

@@ -80,7 +80,7 @@ export function createComponents(colors: ThemeColors, shadows: ThemeShadows): Th
       background: colors.mode === 'dark' ? 'rgba(0, 0, 0, 0.45)' : 'rgba(208, 209, 211, 0.24)',
     },
     sidemenu: {
-      width: 44,
+      width: 48,
     },
   };
 }

public/app/core/components/NavBar/NavBarDropdown.tsx

@@ -75,6 +75,7 @@ const getStyles = (
 
   return {
     header: css`
+      align-items: center;
       background-color: ${theme.colors.background.secondary};
       border: none;
       color: ${theme.colors.text.primary};

public/app/core/components/NavBar/NavBarItem.tsx

@@ -152,8 +152,8 @@ const getStyles = (theme: GrafanaTheme2, isActive: Props['isActive']) => ({
 
     img {
       border-radius: 50%;
-      height: 28px;
-      width: 28px;
+      height: 24px;
+      width: 24px;
     }
   `,
 });