import React from 'react'; import { BrowserRouter as Router, Route, Link, Switch } from 'react-router-dom'; import localForage from 'localforage'; import './Style-light.css'; import './Style-dark.css'; import './fonts/Fonts.css'; import { ForwardDot } from './utils.js'; import Feed from './Feed.js'; import Article from './Article.js'; import Comments from './Comments.js'; import Search from './Search.js'; import Submit from './Submit.js'; import Results from './Results.js'; import ScrollToTop from './ScrollToTop.js'; class App extends React.Component { constructor(props) { super(props); this.state = { theme: localStorage.getItem('theme') || '', }; this.cache = {}; } updateCache = (key, value) => { this.cache[key] = value; } light() { this.setState({ theme: '' }); localStorage.setItem('theme', ''); } dark() { this.setState({ theme: 'dark' }); localStorage.setItem('theme', 'dark'); } componentDidMount() { if (!this.cache.length) { localForage.iterate((value, key) => { this.updateCache(key, value); }); console.log('loaded cache from localforage'); } } render() { const theme = this.state.theme; document.body.style.backgroundColor = theme === 'dark' ? '#000' : '#eeeeee'; return (

QotNews - Feed Theme: this.light()}>Light - this.dark()}>Dark
Reddit, Hacker News, and Tildes combined, then pre-rendered in reader mode.

} />
} /> } />
); } } export default App;