diff --git a/web/packages/design/src/Mark/Mark.story.tsx b/web/packages/design/src/Mark/Mark.story.tsx
index 9cae48b6ccd50..596190e6bd69d 100644
--- a/web/packages/design/src/Mark/Mark.story.tsx
+++ b/web/packages/design/src/Mark/Mark.story.tsx
@@ -19,7 +19,7 @@
import Box from 'design/Box';
import { IconTooltip } from 'design/Tooltip';
-import { Mark as M, MarkForToolTip } from './Mark';
+import { Mark as M, MarkInverse } from './Mark';
export default {
title: 'Design/Mark',
@@ -39,8 +39,6 @@ export const SampleText = () => {
necessitatibus
{' '}
obcaecati asperiores neque.
-
-
);
};
@@ -48,8 +46,8 @@ export const SampleText = () => {
export const MarkInsideTooltip = () => {
return (
- Example of MarkForToolTip. Note the{' '}
- inversed background and text color.
+ Example of MarkForToolTip. Note the{' '}
+ inversed background and text color.
);
};
diff --git a/web/packages/design/src/Mark/Mark.tsx b/web/packages/design/src/Mark/Mark.tsx
index 1331d3923b0d4..07e11f360bd6b 100644
--- a/web/packages/design/src/Mark/Mark.tsx
+++ b/web/packages/design/src/Mark/Mark.tsx
@@ -27,7 +27,7 @@ export const Mark = styled.mark`
color: inherit;
`;
-export const MarkForToolTip = styled(Mark)`
+export const MarkInverse = styled(Mark)`
background-color: ${p => p.theme.colors.tooltip.inverseBackground};
color: ${p => p.theme.colors.text.main};
`;
diff --git a/web/packages/design/src/Mark/index.ts b/web/packages/design/src/Mark/index.ts
index 27c066fb26cfa..8ff108e93731d 100644
--- a/web/packages/design/src/Mark/index.ts
+++ b/web/packages/design/src/Mark/index.ts
@@ -16,4 +16,4 @@
* along with this program. If not, see .
*/
-export { Mark, MarkForToolTip } from './Mark';
+export { Mark, MarkInverse } from './Mark';
diff --git a/web/packages/teleport/src/Discover/Shared/ResourceLabelTooltip/ResourceLabelTooltip.tsx b/web/packages/teleport/src/Discover/Shared/ResourceLabelTooltip/ResourceLabelTooltip.tsx
index 8215987e8b1d0..78627abfb0947 100644
--- a/web/packages/teleport/src/Discover/Shared/ResourceLabelTooltip/ResourceLabelTooltip.tsx
+++ b/web/packages/teleport/src/Discover/Shared/ResourceLabelTooltip/ResourceLabelTooltip.tsx
@@ -17,7 +17,7 @@
*/
import Link from 'design/Link';
-import { MarkForToolTip } from 'design/Mark';
+import { MarkInverse } from 'design/Mark';
import { Position } from 'design/Popover/Popover';
import { IconTooltip } from 'design/Tooltip';
import styled from 'styled-components';
@@ -48,8 +48,8 @@ export function ResourceLabelTooltip({
>
Teleport RBAC
- . Only roles with node_labels{' '}
- that match these labels will be allowed to access this server.
+ . Only roles with node_labels that
+ match these labels will be allowed to access this server.
>
@@ -74,9 +74,9 @@ export function ResourceLabelTooltip({
>
Teleport RBAC
- . Only roles with{' '}
- kubernetes_labels that match
- these labels will be allowed to access this Kubernetes cluster.
+ . Only roles with kubernetes_labels{' '}
+ that match these labels will be allowed to access this Kubernetes
+ cluster.
{resourceKind === 'eks' && (
@@ -106,8 +106,8 @@ export function ResourceLabelTooltip({
>
Teleport RBAC
- . Only roles with db_labels that
- match these labels will be allowed to access this database.
+ . Only roles with db_labels that match
+ these labels will be allowed to access this database.
{resourceKind === 'rds' && (