From 71e7d654dea1b11f271900feda1f04072fa925c2 Mon Sep 17 00:00:00 2001
From: Joao Silva <100691367+JoaoSilvaGrafana@users.noreply.github.com>
Date: Mon, 12 Feb 2024 13:07:40 +0000
Subject: [PATCH] Card: Revert adding overline component (#82308)

---
 .../grafana-ui/src/components/Card/Card.mdx   | 18 -------------
 .../src/components/Card/Card.story.tsx        | 14 -----------
 .../grafana-ui/src/components/Card/Card.tsx   | 25 -------------------
 .../src/components/Card/CardContainer.tsx     |  3 +--
 4 files changed, 1 insertion(+), 59 deletions(-)

diff --git a/packages/grafana-ui/src/components/Card/Card.mdx b/packages/grafana-ui/src/components/Card/Card.mdx
index b6b1445de7f..2e604d527f7 100644
--- a/packages/grafana-ui/src/components/Card/Card.mdx
+++ b/packages/grafana-ui/src/components/Card/Card.mdx
@@ -445,24 +445,6 @@ Card can have a disabled state, effectively making it and its actions non-clicka
   </Card>
 </Preview>
 
-### With overline
-
-```jsx
-<Card>
-  <Card.Overline>Filter option</Card.Overline>
-  <Card.Heading>Filter by name</Card.Heading>
-  <Card.Description>Filter data by query.</Card.Description>
-</Card>
-```
-
-<Preview>
-  <Card>
-    <Card.Overline>Filter option</Card.Overline>
-    <Card.Heading>Filter by name</Card.Heading>
-    <Card.Description>Filter data by query.</Card.Description>
-  </Card>
-</Preview>
-
 ### Props
 
 <ArgTypes of={Card} />
diff --git a/packages/grafana-ui/src/components/Card/Card.story.tsx b/packages/grafana-ui/src/components/Card/Card.story.tsx
index 4d4f8367b17..e54bed30b77 100644
--- a/packages/grafana-ui/src/components/Card/Card.story.tsx
+++ b/packages/grafana-ui/src/components/Card/Card.story.tsx
@@ -179,18 +179,4 @@ export const NotSelected: StoryFn<typeof Card> = () => {
   );
 };
 
-export const WithOverline: StoryFn<typeof Card> = (args) => {
-  return (
-    <Card {...args}>
-      <Card.Overline>Overline text above the title</Card.Overline>
-      <Card.Heading>Card title</Card.Heading>
-      <Card.Description>
-        Description, body text. Greetings! Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
-        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
-        laboris nisi ut aliquip ex ea commodo consequat.
-      </Card.Description>
-    </Card>
-  );
-};
-
 export default meta;
diff --git a/packages/grafana-ui/src/components/Card/Card.tsx b/packages/grafana-ui/src/components/Card/Card.tsx
index be178a25c29..08f363dda25 100644
--- a/packages/grafana-ui/src/components/Card/Card.tsx
+++ b/packages/grafana-ui/src/components/Card/Card.tsx
@@ -5,7 +5,6 @@ import { GrafanaTheme2 } from '@grafana/data';
 
 import { useStyles2 } from '../../themes';
 import { getFocusStyles } from '../../themes/mixins';
-import { Text } from '../Text/Text';
 
 import { CardContainer, CardContainerProps, getCardContainerStyles } from './CardContainer';
 
@@ -29,7 +28,6 @@ export interface Props extends Omit<CardContainerProps, 'disableEvents' | 'disab
 }
 
 export interface CardInterface extends FC<Props> {
-  Overline: typeof Overline;
   Heading: typeof Heading;
   Tags: typeof Tags;
   Figure: typeof Figure;
@@ -166,28 +164,6 @@ const getHeadingStyles = (theme: GrafanaTheme2) => ({
   }),
 });
 
-/** Card text to be displayed above title */
-const Overline = ({ children, className }: ChildProps) => {
-  const styles = useStyles2(getOverlineStyles);
-  return (
-    <div className={cx(styles.overline, className)}>
-      {children && (
-        <Text color="info" weight="medium" variant="bodySmall">
-          {children}
-        </Text>
-      )}
-    </div>
-  );
-};
-Overline.displayName = 'Overline';
-
-const getOverlineStyles = (theme: GrafanaTheme2) => ({
-  overline: css({
-    gridArea: 'Overline',
-    marginBottom: theme.spacing(0.5),
-  }),
-});
-
 const Tags = ({ children, className }: ChildProps) => {
   const styles = useStyles2(getTagStyles);
   return <div className={cx(styles.tagList, className)}>{children}</div>;
@@ -384,7 +360,6 @@ export const getCardStyles = (theme: GrafanaTheme2) => {
   };
 };
 
-Card.Overline = Overline;
 Card.Heading = Heading;
 Card.Tags = Tags;
 Card.Figure = Figure;
diff --git a/packages/grafana-ui/src/components/Card/CardContainer.tsx b/packages/grafana-ui/src/components/Card/CardContainer.tsx
index 430634f9ba7..8879a87ed4f 100644
--- a/packages/grafana-ui/src/components/Card/CardContainer.tsx
+++ b/packages/grafana-ui/src/components/Card/CardContainer.tsx
@@ -80,11 +80,10 @@ export const getCardContainerStyles = (
       display: 'grid',
       position: 'relative',
       gridTemplateColumns: 'auto 1fr auto',
-      gridTemplateRows: 'auto 1fr auto auto auto',
+      gridTemplateRows: '1fr auto auto auto',
       gridAutoColumns: '1fr',
       gridAutoFlow: 'row',
       gridTemplateAreas: `
-        "Figure Overline Tags"
         "Figure Heading Tags"
         "Figure Meta Tags"
         "Figure Description Tags"