Dark mode.

This commit is contained in:
Mike Cao 2020-09-20 01:33:39 -07:00
parent 4bb95cd997
commit aa265d1d42
29 changed files with 221 additions and 60 deletions

View file

@ -39,7 +39,7 @@
}
.msg {
color: var(--gray50);
color: var(--msgColor);
background: var(--red400);
font-size: var(--font-size-small);
padding: 4px 8px;

View file

@ -3,11 +3,12 @@ import { FormattedMessage } from 'react-intl';
import { useSelector } from 'react-redux';
import classNames from 'classnames';
import Link from 'components/common/Link';
import UserButton from '../common/UserButton';
import Icon from '../common/Icon';
import UserButton from 'components/common/UserButton';
import Icon from 'components/common/Icon';
import LanguageButton from 'components/settings/LanguageButton';
import ThemeButton from 'components/settings/ThemeButton';
import Logo from 'assets/logo.svg';
import styles from './Header.module.css';
import LanguageButton from '../common/LanguageButton';
export default function Header() {
const user = useSelector(state => state.user);
@ -32,10 +33,14 @@ export default function Header() {
<FormattedMessage id="label.settings" defaultMessage="Settings" />
</Link>
<LanguageButton menuAlign="right" />
<ThemeButton />
<UserButton />
</>
) : (
<LanguageButton menuAlign="right" />
<>
<LanguageButton menuAlign="right" />
<ThemeButton />
</>
)}
</div>
</div>

View file

@ -16,8 +16,8 @@ export default function Layout({ title, children, header = true, footer = true }
</Head>
{header && <Header />}
<main className="container">{children}</main>
<div id="__modals" />
{footer && <Footer />}
<div id="__modals" />
</>
);
}

View file

@ -0,0 +1,6 @@
.layout {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
}