Skip to content

Commit

Permalink
Revert fit and finish changes from 2.17 (#283)
Browse files Browse the repository at this point in the history
* Revert "[Backport 2.17] Fit and Finish UX Fixes Pt 2. (#275)"

This reverts commit 5ac0919.

Signed-off-by: Joanne Wang <[email protected]>

* Revert "Fit and Finish UX Fixes (#263) (#269)"

This reverts commit b3dd31c.

Signed-off-by: Joanne Wang <[email protected]>

* Revert "Use TopNavControlButtonData for channel test button (#243) (#268)"

This reverts commit 127eae4.

Signed-off-by: Joanne Wang <[email protected]>

* Revert "[Fit & Finish] Updated Fit and Finish guidelines (#256) (#259)"

This reverts commit fb48dbc.

Signed-off-by: Joanne Wang <[email protected]>

---------

Signed-off-by: Joanne Wang <[email protected]>
  • Loading branch information
jowg-amazon authored Sep 24, 2024
1 parent 5ac0919 commit 184340b
Show file tree
Hide file tree
Showing 45 changed files with 265 additions and 545 deletions.
10 changes: 5 additions & 5 deletions public/components/ContentPanel/ContentPanel.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ import React from 'react';

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

const ContentPanel: React.SFC<ContentPanelProps> = ({
title = '',
titleSize = 's',
titleSize = 'l',
total = undefined,
bodyStyles = {},
panelStyles = {},
Expand All @@ -41,14 +41,14 @@ const ContentPanel: React.SFC<ContentPanelProps> = ({
>
<EuiFlexItem>
<EuiTitle size={titleSize}>
<h2>
<h3>
{title}
{total !== undefined ? (
<span
style={{ color: '#9f9f9f', fontWeight: 300 }}
>{` (${total})`}</span>
) : null}
</h2>
</h3>
</EuiTitle>
</EuiFlexItem>
{actions ? (
Expand All @@ -70,7 +70,7 @@ const ContentPanel: React.SFC<ContentPanelProps> = ({

<EuiHorizontalRule margin="s" className={horizontalRuleClassName} />

<div style={{ padding: '0px', ...bodyStyles }}>{children}</div>
<div style={{ padding: '0px 10px', ...bodyStyles }}>{children}</div>
</EuiPanel>
);

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,11 +11,11 @@ exports[`<ContentPanel /> spec renders the component 1`] = `
<div
class="euiFlexItem"
>
<h2
class="euiTitle euiTitle--small"
<h3
class="euiTitle euiTitle--large"
>
Testing
</h2>
</h3>
</div>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
Expand All @@ -37,7 +37,7 @@ exports[`<ContentPanel /> spec renders the component 1`] = `
class="euiHorizontalRule euiHorizontalRule--full euiHorizontalRule--marginSmall"
/>
<div
style="padding: 0px;"
style="padding: 0px 10px;"
>
<div>
Testing ContentPanel
Expand All @@ -57,18 +57,18 @@ exports[`<ContentPanel /> spec renders with empty actions 1`] = `
<div
class="euiFlexItem"
>
<h2
class="euiTitle euiTitle--small"
<h3
class="euiTitle euiTitle--large"
>
Testing
</h2>
</h3>
</div>
</div>
<hr
class="euiHorizontalRule euiHorizontalRule--full euiHorizontalRule--marginSmall"
/>
<div
style="padding: 0px;"
style="padding: 0px 10px;"
>
<div>
Testing ContentPanel
Expand Down
13 changes: 6 additions & 7 deletions public/pages/Channels/Channels.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@ 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 @@ -258,8 +257,8 @@ export class Channels extends MDSEnabledComponent<ChannelsProps, ChannelsState>
isSelectable={true}
selection={selection}
noItemsMessage={<EuiEmptyPrompt
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>}
title={<h2>No channels to display</h2>}
body="To send or receive notifications, you will need to create a notification channel."
actions={<EuiSmallButton href={`#${ROUTES.CREATE_CHANNEL}`}>
Create channel
</EuiSmallButton>} />}
Expand All @@ -277,11 +276,11 @@ export class Channels extends MDSEnabledComponent<ChannelsProps, ChannelsState>
appRightControls={headerControls}
appLeftControls={[{ renderComponent: totalChannels }]}
/>
<ContentPanel panelStyles={{ padding: this.state.total < 1? '16px 16px 0px' : '16px' }}>
<ContentPanel>
<div style={{ marginBottom: '10px' }}>
<div style={{ display: 'flex', alignItems: 'center' }}>
{channelControlsComponent}
<div style={{ marginLeft: '16px' }}>
<div style={{ marginLeft: '10px' }}>
{channelActionsComponent}
</div>
</div>
Expand Down Expand Up @@ -310,7 +309,7 @@ export class Channels extends MDSEnabledComponent<ChannelsProps, ChannelsState>
}
bodyStyles={{ padding: 'initial' }}
title="Channels"
titleSize="s"
titleSize="m"
total={this.state.total}
>
{channelControlsComponent}
Expand All @@ -319,7 +318,7 @@ export class Channels extends MDSEnabledComponent<ChannelsProps, ChannelsState>
</ContentPanel>
)}
</>

);
}
};
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

exports[`<ChannelControls /> spec renders the component 1`] = `
<div
class="euiFlexGroup euiFlexGroup--gutterMedium euiFlexGroup--directionRow euiFlexGroup--responsive"
class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive"
>
<div
class="euiFlexItem"
Expand Down Expand Up @@ -91,14 +91,6 @@ exports[`<ChannelControls /> spec renders the component 1`] = `
</button>
</div>
</div>
</div>
</div>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<div
class="euiFilterGroup"
>
<div
class="euiPopover euiPopover--anchorDownCenter"
>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,33 +4,31 @@ exports[`<ChannelDetails/> spec handles a non-existing channel 1`] = `
<div>
<div
class="euiFlexGroup euiFlexGroup--gutterMedium euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
style="padding: 0px 8px 0px 0px;"
style="max-width: 1316px;"
>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<div
class="euiFlexGroup euiFlexGroup--gutterMedium euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
class="euiFlexGroup euiFlexGroup--gutterMedium euiFlexGroup--alignItemsFlexEnd euiFlexGroup--directionRow euiFlexGroup--responsive"
>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<div
class="euiText euiText--small"
<h1
class="euiTitle euiTitle--large"
>
<h1>
-
</h1>
</div>
-
</h1>
</div>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
style="padding-top: 5px;"
style="padding-bottom: 5px;"
/>
</div>
</div>
<div
class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
class="euiFlexGroup euiFlexGroup--gutterMedium euiFlexGroup--alignItemsFlexEnd euiFlexGroup--directionRow euiFlexGroup--responsive"
>
<div
class="euiFlexItem"
Expand All @@ -48,6 +46,7 @@ exports[`<ChannelDetails/> spec handles a non-existing channel 1`] = `
/>
<div
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow"
style="max-width: 1300px;"
>
<div
class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--justifyContentSpaceBetween euiFlexGroup--directionRow euiFlexGroup--responsive"
Expand All @@ -56,11 +55,11 @@ exports[`<ChannelDetails/> spec handles a non-existing channel 1`] = `
<div
class="euiFlexItem"
>
<h2
<h3
class="euiTitle euiTitle--small"
>
Name and description
</h2>
</h3>
</div>
</div>
<hr
Expand Down Expand Up @@ -145,6 +144,7 @@ exports[`<ChannelDetails/> spec handles a non-existing channel 1`] = `
/>
<div
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow"
style="max-width: 1300px;"
>
<div
class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--justifyContentSpaceBetween euiFlexGroup--directionRow euiFlexGroup--responsive"
Expand All @@ -153,11 +153,11 @@ exports[`<ChannelDetails/> spec handles a non-existing channel 1`] = `
<div
class="euiFlexItem"
>
<h2
<h3
class="euiTitle euiTitle--small"
>
Configurations
</h2>
</h3>
</div>
</div>
<hr
Expand All @@ -174,33 +174,31 @@ exports[`<ChannelDetails/> spec renders a specific channel 1`] = `
<div>
<div
class="euiFlexGroup euiFlexGroup--gutterMedium euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
style="padding: 0px 8px 0px 0px;"
style="max-width: 1316px;"
>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<div
class="euiFlexGroup euiFlexGroup--gutterMedium euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
class="euiFlexGroup euiFlexGroup--gutterMedium euiFlexGroup--alignItemsFlexEnd euiFlexGroup--directionRow euiFlexGroup--responsive"
>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<div
class="euiText euiText--small"
<h1
class="euiTitle euiTitle--large"
>
<h1>
-
</h1>
</div>
-
</h1>
</div>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
style="padding-top: 5px;"
style="padding-bottom: 5px;"
/>
</div>
</div>
<div
class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
class="euiFlexGroup euiFlexGroup--gutterMedium euiFlexGroup--alignItemsFlexEnd euiFlexGroup--directionRow euiFlexGroup--responsive"
>
<div
class="euiFlexItem"
Expand All @@ -218,6 +216,7 @@ exports[`<ChannelDetails/> spec renders a specific channel 1`] = `
/>
<div
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow"
style="max-width: 1300px;"
>
<div
class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--justifyContentSpaceBetween euiFlexGroup--directionRow euiFlexGroup--responsive"
Expand All @@ -226,11 +225,11 @@ exports[`<ChannelDetails/> spec renders a specific channel 1`] = `
<div
class="euiFlexItem"
>
<h2
<h3
class="euiTitle euiTitle--small"
>
Name and description
</h2>
</h3>
</div>
</div>
<hr
Expand Down Expand Up @@ -315,6 +314,7 @@ exports[`<ChannelDetails/> spec renders a specific channel 1`] = `
/>
<div
class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow"
style="max-width: 1300px;"
>
<div
class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsCenter euiFlexGroup--justifyContentSpaceBetween euiFlexGroup--directionRow euiFlexGroup--responsive"
Expand All @@ -323,11 +323,11 @@ exports[`<ChannelDetails/> spec renders a specific channel 1`] = `
<div
class="euiFlexItem"
>
<h2
<h3
class="euiTitle euiTitle--small"
>
Configurations
</h2>
</h3>
</div>
</div>
<hr
Expand All @@ -343,33 +343,31 @@ exports[`<ChannelDetails/> spec renders a specific channel 1`] = `
exports[`<ChannelDetails/> spec renders the component 1`] = `
<div
class="euiFlexGroup euiFlexGroup--gutterMedium euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
style="padding: 0px 8px 0px 0px;"
style="max-width: 1316px;"
>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<div
class="euiFlexGroup euiFlexGroup--gutterMedium euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
class="euiFlexGroup euiFlexGroup--gutterMedium euiFlexGroup--alignItemsFlexEnd euiFlexGroup--directionRow euiFlexGroup--responsive"
>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
>
<div
class="euiText euiText--small"
<h1
class="euiTitle euiTitle--large"
>
<h1>
-
</h1>
</div>
-
</h1>
</div>
<div
class="euiFlexItem euiFlexItem--flexGrowZero"
style="padding-top: 5px;"
style="padding-bottom: 5px;"
/>
</div>
</div>
<div
class="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--alignItemsCenter euiFlexGroup--directionRow euiFlexGroup--responsive"
class="euiFlexGroup euiFlexGroup--gutterMedium euiFlexGroup--alignItemsFlexEnd euiFlexGroup--directionRow euiFlexGroup--responsive"
>
<div
class="euiFlexItem"
Expand Down
Loading

0 comments on commit 184340b

Please sign in to comment.