fix preview badge styles

openshift · Aug 6, 2020 · 59a0c79 · 59a0c79
1 parent d09a574
commit 59a0c79
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 8 deletions.
diff --git a/frontend/packages/console-shared/src/components/badges/Badge.scss b/frontend/packages/console-shared/src/components/badges/Badge.scss
@@ -5,7 +5,7 @@
   }
 }
 
-.tech-preview {
+.preview-badge {
   .pf-c-label__content {
     color: var(--pf-global--Color--light-100);
   }

diff --git a/frontend/packages/console-shared/src/components/badges/DevPreviewBadge.tsx b/frontend/packages/console-shared/src/components/badges/DevPreviewBadge.tsx
@@ -1,8 +1,14 @@
 import * as React from 'react';
 import { Label } from '@patternfly/react-core';
+import './Badge.scss';
 
 const DevPreviewBadge: React.FC = () => (
-  <Label style={{ backgroundColor: '#D93F00' }}>Dev Preview</Label>
+  <Label
+    className="preview-badge"
+    style={{ backgroundColor: '#D93F00', borderRadius: 'var(--pf-global--BorderRadius--sm)' }}
+  >
+    Dev Preview
+  </Label>
 );
 
 export default DevPreviewBadge;
diff --git a/frontend/packages/console-shared/src/components/badges/TechPreviewBadge.tsx b/frontend/packages/console-shared/src/components/badges/TechPreviewBadge.tsx
@@ -1,14 +1,11 @@
 import * as React from 'react';
 import { Label } from '@patternfly/react-core';
+import './Badge.scss';
 
 const TechPreviewBadge: React.FC = () => (
   <Label
-    className="tech-preview"
-    style={{
-      backgroundColor: '#D93F00',
-      height: '100%',
-      borderRadius: 'var(--pf-global--BorderRadius--sm)',
-    }}
+    className="preview-badge"
+    style={{ backgroundColor: '#D93F00', borderRadius: 'var(--pf-global--BorderRadius--sm)' }}
   >
     Tech Preview
   </Label>