fix(storybook): Fix styles of SearcBar Paper in StoryBook
Signed-off-by: Carlos Esteban Lopez <lcarlosesteb@vmware.com>
This commit is contained in:
committed by
Carlos Lopez
parent
718ef60638
commit
b9db68aba2
@@ -44,7 +44,7 @@ export default {
|
||||
|
||||
export const Default = () => {
|
||||
return (
|
||||
<Paper style={{ padding: '8px 0' }}>
|
||||
<Paper style={{ padding: '8px' }}>
|
||||
<SearchBar />
|
||||
</Paper>
|
||||
);
|
||||
@@ -52,15 +52,23 @@ export const Default = () => {
|
||||
|
||||
export const CustomPlaceholder = () => {
|
||||
return (
|
||||
<Paper style={{ padding: '8px 0' }}>
|
||||
<Paper style={{ padding: '8px' }}>
|
||||
<SearchBar placeholder="This is a custom placeholder" />
|
||||
</Paper>
|
||||
);
|
||||
};
|
||||
|
||||
export const CustomLabel = () => {
|
||||
return (
|
||||
<Paper style={{ padding: '8px' }}>
|
||||
<SearchBar label="This is a custom label" />
|
||||
</Paper>
|
||||
);
|
||||
};
|
||||
|
||||
export const Focused = () => {
|
||||
return (
|
||||
<Paper style={{ padding: '8px 0' }}>
|
||||
<Paper style={{ padding: '8px' }}>
|
||||
{/* decision up to adopter, read https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/master/docs/rules/no-autofocus.md#no-autofocus */}
|
||||
{/* eslint-disable-next-line jsx-a11y/no-autofocus */}
|
||||
<SearchBar autoFocus />
|
||||
@@ -70,7 +78,7 @@ export const Focused = () => {
|
||||
|
||||
export const WithoutClearButton = () => {
|
||||
return (
|
||||
<Paper style={{ padding: '8px 0' }}>
|
||||
<Paper style={{ padding: '8px' }}>
|
||||
<SearchBar clearButton={false} />
|
||||
</Paper>
|
||||
);
|
||||
@@ -80,7 +88,7 @@ const useStyles = makeStyles({
|
||||
search: {
|
||||
display: 'flex',
|
||||
justifyContent: 'space-between',
|
||||
padding: '8px 0',
|
||||
padding: '8px 16px',
|
||||
borderRadius: '50px',
|
||||
margin: 'auto',
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user