Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Backport 2.x] [Fit & Finish] Updated Fit and Finish guidelines #258

Merged
merged 1 commit into from
Sep 17, 2024
Merged

[Backport 2.x] [Fit & Finish] Updated Fit and Finish guidelines #258

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 7 additions & 7 deletions public/components/ContentPanel/ContentPanel.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,13 +8,13 @@ import {
EuiFlexItem,
EuiHorizontalRule,
EuiPanel,
EuiTitle,
EuiText,
} from '@elastic/eui';
import React from 'react';

interface ContentPanelProps {
title?: string;
titleSize?: 'xxxs' | 'xxs' | 'xs' | 's' | 'm' | 'l';
titleSize?: 'xs' | 's' | 'm';
total?: number;
bodyStyles?: object;
panelStyles?: object;
Expand All @@ -25,7 +25,7 @@ interface ContentPanelProps {

const ContentPanel: React.SFC<ContentPanelProps> = ({
title = '',
titleSize = 'l',
titleSize = 's',
total = undefined,
bodyStyles = {},
panelStyles = {},
Expand All @@ -40,16 +40,16 @@ const ContentPanel: React.SFC<ContentPanelProps> = ({
alignItems="center"
>
<EuiFlexItem>
<EuiTitle size={titleSize}>
<h3>
<EuiText size={titleSize}>
<h2>
{title}
{total !== undefined ? (
<span
style={{ color: '#9f9f9f', fontWeight: 300 }}
>{` (${total})`}</span>
) : null}
</h3>
</EuiTitle>
</h2>
</EuiText>
</EuiFlexItem>
{actions ? (
<EuiFlexItem grow={false}>
Expand Down
20 changes: 12 additions & 8 deletions public/components/__tests__/__snapshots__/ContentPanel.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,11 +11,13 @@ exports[`<ContentPanel /> spec renders the component 1`] = `
<div
class="euiFlexItem"
>
<h3
class="euiTitle euiTitle--large"
<div
class="euiText euiText--small"
>
Testing
</h3>
<h2>
Testing
</h2>
</div>
</div>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
Expand Down Expand Up @@ -57,11 +59,13 @@ exports[`<ContentPanel /> spec renders with empty actions 1`] = `
<div
class="euiFlexItem"
>
<h3
class="euiTitle euiTitle--large"
<div
class="euiText euiText--small"
>
Testing
</h3>
<h2>
Testing
</h2>
</div>
</div>
</div>
<hr
Expand Down
9 changes: 5 additions & 4 deletions public/pages/Channels/Channels.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import {
EuiTableSortingType,
EuiTitle,
SortDirection,
EuiText,
} from '@elastic/eui';
import { Criteria } from '@elastic/eui/src/components/basic_table/basic_table';
import { Pagination } from '@elastic/eui/src/components/basic_table/pagination_bar';
Expand Down Expand Up @@ -257,8 +258,8 @@ export class Channels extends MDSEnabledComponent<ChannelsProps, ChannelsState>
isSelectable={true}
selection={selection}
noItemsMessage={<EuiEmptyPrompt
title={<h2>No channels to display</h2>}
body="To send or receive notifications, you will need to create a notification channel."
title={<EuiText size="s"><h2>No channels to display</h2></EuiText>}
body={<EuiText size="s">"To send or receive notifications, you will need to create a notification channel."</EuiText>}
actions={<EuiSmallButton href={`#${ROUTES.CREATE_CHANNEL}`}>
Create channel
</EuiSmallButton>} />}
Expand Down Expand Up @@ -309,7 +310,7 @@ export class Channels extends MDSEnabledComponent<ChannelsProps, ChannelsState>
}
bodyStyles={{ padding: 'initial' }}
title="Channels"
titleSize="m"
titleSize="s"
total={this.state.total}
>
{channelControlsComponent}
Expand All @@ -318,7 +319,7 @@ export class Channels extends MDSEnabledComponent<ChannelsProps, ChannelsState>
</ContentPanel>
)}
</>

);
}
};
Expand Down
70 changes: 42 additions & 28 deletions public/pages/Channels/__tests__/__snapshots__/ChannelDetails.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,13 @@ exports[`<ChannelDetails/> spec handles a non-existing channel 1`] = `
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<h1
class="euiTitle euiTitle--large"
<div
class="euiText euiText--small"
>
-
</h1>
<h1>
-
</h1>
</div>
</div>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
Expand Down Expand Up @@ -55,11 +57,13 @@ exports[`<ChannelDetails/> spec handles a non-existing channel 1`] = `
<div
class="euiFlexItem"
>
<h3
class="euiTitle euiTitle--small"
<div
class="euiText euiText--small"
>
Name and description
</h3>
<h2>
Name and description
</h2>
</div>
</div>
</div>
<hr
Expand Down Expand Up @@ -153,11 +157,13 @@ exports[`<ChannelDetails/> spec handles a non-existing channel 1`] = `
<div
class="euiFlexItem"
>
<h3
class="euiTitle euiTitle--small"
<div
class="euiText euiText--small"
>
Configurations
</h3>
<h2>
Configurations
</h2>
</div>
</div>
</div>
<hr
Expand Down Expand Up @@ -185,11 +191,13 @@ exports[`<ChannelDetails/> spec renders a specific channel 1`] = `
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<h1
class="euiTitle euiTitle--large"
<div
class="euiText euiText--small"
>
-
</h1>
<h1>
-
</h1>
</div>
</div>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
Expand Down Expand Up @@ -225,11 +233,13 @@ exports[`<ChannelDetails/> spec renders a specific channel 1`] = `
<div
class="euiFlexItem"
>
<h3
class="euiTitle euiTitle--small"
<div
class="euiText euiText--small"
>
Name and description
</h3>
<h2>
Name and description
</h2>
</div>
</div>
</div>
<hr
Expand Down Expand Up @@ -323,11 +333,13 @@ exports[`<ChannelDetails/> spec renders a specific channel 1`] = `
<div
class="euiFlexItem"
>
<h3
class="euiTitle euiTitle--small"
<div
class="euiText euiText--small"
>
Configurations
</h3>
<h2>
Configurations
</h2>
</div>
</div>
</div>
<hr
Expand All @@ -354,11 +366,13 @@ exports[`<ChannelDetails/> spec renders the component 1`] = `
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<h1
class="euiTitle euiTitle--large"
<div
class="euiText euiText--small"
>
-
</h1>
<h1>
-
</h1>
</div>
</div>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
Expand Down
36 changes: 22 additions & 14 deletions public/pages/Channels/__tests__/__snapshots__/Channels.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,16 +11,18 @@ exports[`<Channels/> spec renders the empty component 1`] = `
<div
class="euiFlexItem"
>
<h3
class="euiTitle euiTitle--medium"
<div
class="euiText euiText--small"
>
Channels
<span
style="color: rgb(159, 159, 159); font-weight: 300;"
>
(0)
</span>
</h3>
<h2>
Channels
<span
style="color: rgb(159, 159, 159); font-weight: 300;"
>
(0)
</span>
</h2>
</div>
</div>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
Expand Down Expand Up @@ -490,11 +492,13 @@ exports[`<Channels/> spec renders the empty component 1`] = `
<div
class="euiEmptyPrompt"
>
<h2
class="euiTitle euiTitle--medium"
<div
class="euiText euiText--small euiTitle euiTitle--medium"
>
No channels to display
</h2>
<h2>
No channels to display
</h2>
</div>
<span
class="euiTextColor euiTextColor--subdued"
>
Expand All @@ -504,7 +508,11 @@ exports[`<Channels/> spec renders the empty component 1`] = `
<div
class="euiText euiText--medium"
>
To send or receive notifications, you will need to create a notification channel.
<div
class="euiText euiText--small"
>
"To send or receive notifications, you will need to create a notification channel."
</div>
</div>
</span>
<div
Expand Down
52 changes: 46 additions & 6 deletions public/pages/Channels/__tests__/__snapshots__/DetailsListModal.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,13 @@ exports[`<DetailsListModal /> spec renders the component 1`] = `
<div
class="euiModalHeader__title"
>
test header
<div
class="euiText euiText--small"
>
<h2>
test header
</h2>
</div>
</div>
</div>
<div
Expand Down Expand Up @@ -313,7 +319,13 @@ exports[`<DetailsListModal /> spec renders the component 1`] = `
<div
class="euiModalHeader__title"
>
test header
<div
class="euiText euiText--small"
>
<h2>
test header
</h2>
</div>
</div>
</div>
<div
Expand Down Expand Up @@ -476,7 +488,13 @@ exports[`<DetailsListModal /> spec renders the component 1`] = `
<div
class="euiModalHeader__title"
>
test header
<div
class="euiText euiText--small"
>
<h2>
test header
</h2>
</div>
</div>
</div>
<div
Expand Down Expand Up @@ -639,7 +657,13 @@ exports[`<DetailsListModal /> spec renders the component 1`] = `
<div
class="euiModalHeader__title"
>
test header
<div
class="euiText euiText--small"
>
<h2>
test header
</h2>
</div>
</div>
</div>
<div
Expand Down Expand Up @@ -790,7 +814,13 @@ exports[`<DetailsListModal /> spec renders the component 1`] = `
<div
class="euiModalHeader__title"
>
test header
<div
class="euiText euiText--small"
>
<h2>
test header
</h2>
</div>
</div>
</div>
<div
Expand Down Expand Up @@ -995,7 +1025,17 @@ exports[`<DetailsListModal /> spec renders the component 1`] = `
<div
className="euiModalHeader__title"
>
test header
<EuiText
size="s"
>
<div
className="euiText euiText--small"
>
<h2>
test header
</h2>
</div>
</EuiText>
</div>
</EuiModalHeaderTitle>
</div>
Expand Down
Loading
Loading