mirror of
https://github.com/elyby/accounts-frontend.git
synced 2025-05-31 14:11:58 +05:30
Change prettier rules
This commit is contained in:
@@ -3,18 +3,17 @@ import { storiesOf } from '@storybook/react';
|
||||
|
||||
import FooterMenu from './FooterMenu';
|
||||
|
||||
const PreviewWrapper: ComponentType<{ style?: CSSProperties }> = ({
|
||||
style,
|
||||
children,
|
||||
}) => <div style={{ padding: '25px', ...style }}>{children}</div>;
|
||||
const PreviewWrapper: ComponentType<{ style?: CSSProperties }> = ({ style, children }) => (
|
||||
<div style={{ padding: '25px', ...style }}>{children}</div>
|
||||
);
|
||||
|
||||
storiesOf('Components', module).add('FooterMenu', () => (
|
||||
<div style={{ display: 'flex' }}>
|
||||
<PreviewWrapper>
|
||||
<FooterMenu />
|
||||
</PreviewWrapper>
|
||||
<PreviewWrapper style={{ backgroundColor: '#232323' }}>
|
||||
<FooterMenu />
|
||||
</PreviewWrapper>
|
||||
</div>
|
||||
<div style={{ display: 'flex' }}>
|
||||
<PreviewWrapper>
|
||||
<FooterMenu />
|
||||
</PreviewWrapper>
|
||||
<PreviewWrapper style={{ backgroundColor: '#232323' }}>
|
||||
<FooterMenu />
|
||||
</PreviewWrapper>
|
||||
</div>
|
||||
));
|
||||
|
@@ -10,41 +10,35 @@ import styles from './footerMenu.scss';
|
||||
import messages from './footerMenu.intl.json';
|
||||
|
||||
const FooterMenu: ComponentType = () => {
|
||||
const dispatch = useDispatch();
|
||||
const onLanguageSwitcherClick = useCallback<
|
||||
MouseEventHandler<HTMLAnchorElement>
|
||||
>(
|
||||
(event) => {
|
||||
event.preventDefault();
|
||||
dispatch(createPopup({ Popup: LanguageSwitcher }));
|
||||
},
|
||||
[dispatch],
|
||||
);
|
||||
const dispatch = useDispatch();
|
||||
const onLanguageSwitcherClick = useCallback<MouseEventHandler<HTMLAnchorElement>>(
|
||||
(event) => {
|
||||
event.preventDefault();
|
||||
dispatch(createPopup({ Popup: LanguageSwitcher }));
|
||||
},
|
||||
[dispatch],
|
||||
);
|
||||
|
||||
return (
|
||||
<div className={styles.footerMenu} data-testid="footer">
|
||||
<Link to="/rules" className={styles.footerItem}>
|
||||
<Message {...messages.rules} />
|
||||
</Link>
|
||||
<ContactLink className={styles.footerItem}>
|
||||
<Message {...messages.contactUs} />
|
||||
</ContactLink>
|
||||
<Link to="/dev" className={styles.footerItem}>
|
||||
<Message {...messages.forDevelopers} />
|
||||
</Link>
|
||||
return (
|
||||
<div className={styles.footerMenu} data-testid="footer">
|
||||
<Link to="/rules" className={styles.footerItem}>
|
||||
<Message {...messages.rules} />
|
||||
</Link>
|
||||
<ContactLink className={styles.footerItem}>
|
||||
<Message {...messages.contactUs} />
|
||||
</ContactLink>
|
||||
<Link to="/dev" className={styles.footerItem}>
|
||||
<Message {...messages.forDevelopers} />
|
||||
</Link>
|
||||
|
||||
<div className={styles.langTriggerContainer}>
|
||||
<a
|
||||
href="#"
|
||||
className={styles.langTrigger}
|
||||
onClick={onLanguageSwitcherClick}
|
||||
>
|
||||
<span className={styles.langTriggerIcon} />
|
||||
<Message {...messages.siteLanguage} />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
<div className={styles.langTriggerContainer}>
|
||||
<a href="#" className={styles.langTrigger} onClick={onLanguageSwitcherClick}>
|
||||
<span className={styles.langTriggerIcon} />
|
||||
<Message {...messages.siteLanguage} />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default FooterMenu;
|
||||
|
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"rules": "Rules",
|
||||
"contactUs": "Contact Us",
|
||||
"siteLanguage": "Site language",
|
||||
"forDevelopers": "For developers"
|
||||
"rules": "Rules",
|
||||
"contactUs": "Contact Us",
|
||||
"siteLanguage": "Site language",
|
||||
"forDevelopers": "For developers"
|
||||
}
|
||||
|
@@ -1,36 +1,36 @@
|
||||
.footerMenu {
|
||||
padding: 0 25px;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
// Set line-height the same as the font-size value to keep the border-bottom
|
||||
// close to the text when the inline-block is turned on .footerItem
|
||||
line-height: 12px;
|
||||
padding: 0 25px;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
// Set line-height the same as the font-size value to keep the border-bottom
|
||||
// close to the text when the inline-block is turned on .footerItem
|
||||
line-height: 12px;
|
||||
}
|
||||
|
||||
.footerItem {
|
||||
display: inline-block;
|
||||
margin: 2px 5px 2px 0;
|
||||
color: #666;
|
||||
border-bottom-color: #666;
|
||||
display: inline-block;
|
||||
margin: 2px 5px 2px 0;
|
||||
color: #666;
|
||||
border-bottom-color: #666;
|
||||
|
||||
&:last-of-type {
|
||||
margin-right: 0;
|
||||
}
|
||||
&:last-of-type {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.langTriggerContainer {
|
||||
margin-top: 1px;
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
.langTrigger {
|
||||
composes: footerItem;
|
||||
composes: footerItem;
|
||||
}
|
||||
|
||||
.langTriggerIcon {
|
||||
composes: globe from '~app/components/ui/icons.scss';
|
||||
composes: globe from '~app/components/ui/icons.scss';
|
||||
|
||||
position: relative;
|
||||
bottom: 1px;
|
||||
font-size: 11px;
|
||||
margin-right: 3px;
|
||||
position: relative;
|
||||
bottom: 1px;
|
||||
font-size: 11px;
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
Reference in New Issue
Block a user