1234567891011121314151617181920212223242526272829303132333435363738394041 |
- /* eslint-disable consistent-return */
- import { createGlobalStyle, css } from 'styled-components';
- export const GlobalStyle = createGlobalStyle`
- html, body {
- margin: 0;
- background-color: #f8f8f8;
- height: 100%;
- font-size: 14px;
- & > div {
- height: 100%;
- }
- }
- div {
- box-sizing: border-box;
- }
- ${({ lang }) => {
- if (lang === 'zh-tw') return css`@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:300,400,700&display=swap');`;
- if (lang === 'zh-cn') return css`@import url('https://fonts.googleapis.com/css?family=Noto+Sans+SC:300,400,700&display=swap');`;
- if (lang === 'ja') return css`@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,700&display=swap');`;
- if (lang === 'en') return css`@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,700&display=swap');`;
- }}
-
- &:lang(en) {
- font-family: 'Open Sans', sans-serif;
- }
- &:lang(zh-tw) {
- font-family: 'Noto Sans TC', sans-serif;
- }
- &:lang(zh-cn) {
- font-family: 'Noto Sans SC', sans-serif;
- }
- &:lang(ja) {
- font-family: 'Noto Sans JP', sans-serif;
- }
- `;
- export default GlobalStyle;
|