SingleTopNav: Use original kiosk mode icon (#95332)

change kiosk mode icon, put profile icon back in corner

public/app/core/components/AppChrome/TopBar/SignInLink.tsx

@@ -2,6 +2,7 @@ import { css } from '@emotion/css';
 import { useLocation } from 'react-router-dom-v5-compat';
 
 import { GrafanaTheme2, locationUtil, textUtil } from '@grafana/data';
+import { config } from '@grafana/runtime';
 import { useStyles2 } from '@grafana/ui';
 
 export function SignInLink() {
@@ -22,13 +23,19 @@ export function SignInLink() {
 }
 
 const getStyles = (theme: GrafanaTheme2) => {
+  const isSingleTopNav = config.featureToggles.singleTopNav;
   return {
-    link: css({
+    link: css(
-      paddingRight: theme.spacing(1),
+      {
-      whiteSpace: 'nowrap',
+        paddingRight: theme.spacing(1),
-      '&:hover': {
+        whiteSpace: 'nowrap',
-        textDecoration: 'underline',
+        '&:hover': {
+          textDecoration: 'underline',
+        },
       },
-    }),
+      isSingleTopNav && {
+        paddingLeft: theme.spacing(1),
+      }
+    ),
   };
 };

public/app/core/components/AppChrome/TopBar/SingleTopBar.tsx

@@ -78,6 +78,12 @@ export const SingleTopBar = memo(function SingleTopBar({
           </Dropdown>
         )}
         {config.newsFeedEnabled && <NewsContainer />}
+        <ToolbarButton
+          icon="monitor"
+          className={styles.kioskToggle}
+          onClick={onToggleKioskMode}
+          tooltip="Enable kiosk mode"
+        />
         {!contextSrv.user.isSignedIn && <SignInLink />}
         {profileNode && (
           <Dropdown overlay={() => <TopNavBarMenu node={profileNode} />} placement="bottom-end">
@@ -89,9 +95,6 @@ export const SingleTopBar = memo(function SingleTopBar({
             />
           </Dropdown>
         )}
-        <ToolbarButton className={styles.kioskToggle} onClick={onToggleKioskMode} narrow aria-label="Enable kiosk mode">
-          <Icon name="angle-up" size="xl" />
-        </ToolbarButton>
       </Stack>
     </div>
   );
@@ -128,7 +131,7 @@ const getStyles = (theme: GrafanaTheme2, menuDockedAndOpen: boolean) => ({
     width: theme.spacing(3),
   }),
   profileButton: css({
-    padding: theme.spacing(0, 0.25),
+    padding: theme.spacing(0, 0.5),
     img: {
       borderRadius: theme.shape.radius.circle,
       height: '24px',