fix: Ask component's Home button causes header height unconformity vs…

… ProfileExplorer
project-codeflare · Nov 13, 2022 · fdf9b5e · fdf9b5e
1 parent 86bb5ad
commit fdf9b5e
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 2 deletions.
diff --git a/plugins/plugin-codeflare/src/components/Ask.tsx b/plugins/plugin-codeflare/src/components/Ask.tsx
@@ -109,9 +109,9 @@ export default class AskUI extends React.PureComponent<Props, State> {
   /** content to show in the upper right */
   private actions() {
     return (
-      <ActionGroup>
+      <ActionGroup className="kui--guide-actions">
         <Tooltip markdown={`### Home\n#### Jump back to the beginning\n\n⌘ or Alt-click to open a new window`}>
-          <Button variant="link" icon={<HomeIcon className="larger-text" />} onClick={this._home} />
+          <Button variant="link" icon={<HomeIcon />} onClick={this._home} />
         </Tooltip>
       </ActionGroup>
     )

diff --git a/plugins/plugin-codeflare/web/scss/components/Ask.scss b/plugins/plugin-codeflare/web/scss/components/Ask.scss
@@ -46,3 +46,18 @@
     }
   }
 }
+
+@include Ask {
+  .pf-c-card__actions {
+    align-self: unset;
+  }
+  @include AskActions {
+    button {
+      padding-top: 0;
+      padding-bottom: 0;
+      svg {
+        font-size: 1.25rem;
+      }
+    }
+  }
+}
diff --git a/plugins/plugin-codeflare/web/scss/components/_mixins.scss b/plugins/plugin-codeflare/web/scss/components/_mixins.scss
@@ -19,3 +19,9 @@
     @content;
   }
 }
+
+@mixin AskActions {
+  .kui--guide-actions {
+    @content;
+  }
+}