Skip to content
Snippets Groups Projects

Add basic theming support.

Merged Sivert Kronen Hatteberg requested to merge GREG-40-theming into master
11 files
+ 156
72
Compare changes
  • Side-by-side
  • Inline
Files
11
+ 34
42
import React, { useState, Suspense } from 'react'
import React, { useState } from 'react'
import { useTranslation } from 'react-i18next'
import './App.css'
import './i18n'
import { Button } from './components/button'
import { appTimezone, appVersion, appTheme } from './appConfig'
@@ -31,48 +30,41 @@ const App = () => {
}
return (
<Suspense fallback="loading">
<div className="App">
<header className="App-header">
<Button href="https://example.com" target="_blank" rel="noopener">
Knapp
</Button>
<Button
href="https://example.com"
target="_blank"
rel="noopener"
pink
>
Rosa knapp
</Button>
<div className="App">
<header className="App-header">
<Button href="https://example.com" target="_blank" rel="noopener">
Knapp
</Button>
<Button href="https://example.com" target="_blank" rel="noopener">
Rosa knapp
</Button>
<p>{t('common:test')}</p>
<p>{t('common:nested.test')}</p>
<p>{t('footer:footerInfo')}</p>
<p>{t('common:test')}</p>
<p>{t('common:nested.test')}</p>
<p>{t('footer:footerInfo')}</p>
<Button
onClick={() =>
i18n.language === 'en'
? i18n.changeLanguage('nb')
: i18n.changeLanguage('en')
}
>
{t('common:language.change', {
lang: i18n.language === 'en' ? 'Norsk' : 'Engelsk',
})}
</Button>
<p>
Version {appVersion}
<br />
Timezone {appTimezone}
<br />
Theme {appTheme}
<br />
API reachable? {apiHealth}
</p>
</header>
</div>
</Suspense>
<Button
onClick={() =>
i18n.language === 'en'
? i18n.changeLanguage('nb')
: i18n.changeLanguage('en')
}
>
{t('common:language.change', {
lang: i18n.language === 'en' ? 'Norsk' : 'Engelsk',
})}
</Button>
<p>
Version {appVersion}
<br />
Timezone {appTimezone}
<br />
Theme {appTheme}
<br />
API reachable? {apiHealth}
</p>
</header>
</div>
)
}
Loading