From 2b1a352917e8107905adac9a609b90233f4e8a53 Mon Sep 17 00:00:00 2001
From: Tanner Collin <git@tannercollin.com>
Date: Sun, 25 Aug 2019 01:25:28 +0000
Subject: [PATCH] Clear localstorage cache and add slogan

---
 webclient/src/App.js          | 2 ++
 webclient/src/Feed.js         | 2 ++
 webclient/src/Style-dark.css  | 2 +-
 webclient/src/Style-light.css | 4 ++++
 webclient/src/utils.js        | 6 ++++++
 5 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/webclient/src/App.js b/webclient/src/App.js
index f5a5341..5ee1bb5 100644
--- a/webclient/src/App.js
+++ b/webclient/src/App.js
@@ -35,6 +35,8 @@ class App extends React.Component {
 						<p>
 							<Link to='/'>QNN - Home</Link>
 							<span className='theme'>Theme: <a href='#' onClick={() => this.light()}>Light</a> - <a href='#' onClick={() => this.dark()}>Dark</a></span>
+							<br />
+							<span className='slogan'>Reddit, Hacker News, and Tildes combined, then pre-rendered in reader mode.</span>
 						</p>
 					</div>
 					<Route path='/' exact component={Feed} />
diff --git a/webclient/src/Feed.js b/webclient/src/Feed.js
index afb69c1..776a13d 100644
--- a/webclient/src/Feed.js
+++ b/webclient/src/Feed.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import { Link } from 'react-router-dom';
 import { sourceLink, infoLine } from './utils.js';
+import { clearStorage } from './utils.js';
 
 const apiUrl = 'http://news-api.dns.t0.vc/';
 
@@ -21,6 +22,7 @@ class Feed extends React.Component {
             .then(
                 (result) => {
                     this.setState({ stories: result.stories });
+					clearStorage();
                     localStorage.setItem('stories', JSON.stringify(result.stories));
 					result.stories.slice(0, 25).forEach(x => {
 						fetch(apiUrl + x.id)
diff --git a/webclient/src/Style-dark.css b/webclient/src/Style-dark.css
index 60a3d49..9ebddce 100644
--- a/webclient/src/Style-dark.css
+++ b/webclient/src/Style-dark.css
@@ -26,7 +26,7 @@
 }
 
 .dark .item .info a.hot {
-	color: #CCCCCC;
+	color: #cccccc;
 }
 
 .dark .article a {
diff --git a/webclient/src/Style-light.css b/webclient/src/Style-light.css
index dfee5a4..aaf7cf6 100644
--- a/webclient/src/Style-light.css
+++ b/webclient/src/Style-light.css
@@ -20,6 +20,10 @@ a {
 	padding: 0 1rem;
 }
 
+.slogan {
+	color: #828282;
+}
+
 .theme {
 	float: right;
 }
diff --git a/webclient/src/utils.js b/webclient/src/utils.js
index 5fa59fc..08327e5 100644
--- a/webclient/src/utils.js
+++ b/webclient/src/utils.js
@@ -20,3 +20,9 @@ export const infoLine = (story) =>
 		</Link>
 	</div>
 ;
+
+export const clearStorage = () => {
+	const themeSetting = localStorage.getItem('theme');
+	localStorage.clear();
+	localStorage.setItem('theme', themeSetting);
+};