mirror of
https://github.com/astuto/astuto.git
synced 2025-12-16 11:47:56 +01:00
Refactor CSS (#116)
Refactor CSS files and structure. Also refactors some html and React components for a smarter use of CSS classes.
This commit is contained in:
committed by
GitHub
parent
35c427d9f6
commit
8e75a85873
@@ -1,8 +1,9 @@
|
||||
import * as React from 'react';
|
||||
import I18n from 'i18n-js';
|
||||
|
||||
import Button from '../shared/Button';
|
||||
import { BoxTitleText, SmallMutedText } from '../shared/CustomTexts';
|
||||
import { SmallMutedText } from '../common/CustomTexts';
|
||||
import SidebarBox from '../common/SidebarBox';
|
||||
import Switch from '../common/Switch';
|
||||
|
||||
interface Props {
|
||||
followed: boolean;
|
||||
@@ -12,23 +13,22 @@ interface Props {
|
||||
}
|
||||
|
||||
const ActionBox = ({followed, submitFollow, isLoggedIn}: Props) => (
|
||||
<div className="actionBoxContainer">
|
||||
<div className="actionBoxFollow">
|
||||
<BoxTitleText>{I18n.t('post.action_box.title')}</BoxTitleText>
|
||||
<br />
|
||||
<Button onClick={isLoggedIn ? submitFollow : () => location.href = '/users/sign_in'} outline>
|
||||
{ followed ? I18n.t('post.action_box.unfollow_button') : I18n.t('post.action_box.follow_button') }
|
||||
</Button>
|
||||
<br />
|
||||
<SmallMutedText>
|
||||
{ followed ?
|
||||
I18n.t('post.action_box.following_description')
|
||||
:
|
||||
I18n.t('post.action_box.not_following_description')
|
||||
}
|
||||
</SmallMutedText>
|
||||
</div>
|
||||
</div>
|
||||
<SidebarBox title={I18n.t('post.action_box.title')} customClass="actionBoxContainer">
|
||||
<Switch
|
||||
onClick={isLoggedIn ? submitFollow : () => location.href = '/users/sign_in'}
|
||||
label={I18n.t('post.action_box.follow_button')}
|
||||
checked={followed}
|
||||
htmlId="followSwitch"
|
||||
/>
|
||||
|
||||
<SmallMutedText>
|
||||
{ followed ?
|
||||
I18n.t('post.action_box.following_description')
|
||||
:
|
||||
I18n.t('post.action_box.not_following_description')
|
||||
}
|
||||
</SmallMutedText>
|
||||
</SidebarBox>
|
||||
);
|
||||
|
||||
export default ActionBox;
|
||||
Reference in New Issue
Block a user