diff --git a/webclient/public/index.html b/webclient/public/index.html index d741d72..a903fb4 100644 --- a/webclient/public/index.html +++ b/webclient/public/index.html @@ -2,7 +2,7 @@ - + + + ); diff --git a/webclient/src/Comments.js b/webclient/src/Comments.js index 3910f28..f54ceb6 100644 --- a/webclient/src/Comments.js +++ b/webclient/src/Comments.js @@ -42,7 +42,7 @@ class Article extends React.Component {
- {level < 6 ? + {level < 5 ? c.comments.map(i => this.displayComment(story, i, level + 1)) :

[replies snipped]

diff --git a/webclient/src/Feed.js b/webclient/src/Feed.js index 776a13d..43846a7 100644 --- a/webclient/src/Feed.js +++ b/webclient/src/Feed.js @@ -5,7 +5,6 @@ import { clearStorage } from './utils.js'; const apiUrl = 'http://news-api.dns.t0.vc/'; - class Feed extends React.Component { constructor(props) { super(props); diff --git a/webclient/src/ScrollToTop.js b/webclient/src/ScrollToTop.js new file mode 100644 index 0000000..5773541 --- /dev/null +++ b/webclient/src/ScrollToTop.js @@ -0,0 +1,16 @@ +import React from 'react'; +import { BrowserRouter as Router, Route, Link, withRouter } from 'react-router-dom'; + +class ScrollToTop extends React.Component { + componentDidUpdate(prevProps) { + if (this.props.location.pathname !== prevProps.location.pathname) { + window.scrollTo(0, 0); + } + } + + render() { + return null; + } +} + +export default withRouter(ScrollToTop); diff --git a/webclient/src/Style-dark.css b/webclient/src/Style-dark.css index 60fb00e..6dc3901 100644 --- a/webclient/src/Style-dark.css +++ b/webclient/src/Style-dark.css @@ -25,11 +25,7 @@ color: #cccccc; } -.dark .story-text a { - color: #ddd; -} - -.dark .story-text a::after { +.dark .article a { border-bottom: 1px solid #aaaaaa; } @@ -42,13 +38,10 @@ } .dark .article .info a { + border-bottom: none; color: #828282; } -.dark .comments a { - border-bottom: 1px solid #aaaaaa; -} - .dark .comment.lined { border-left: 1px solid #444444; } diff --git a/webclient/src/Style-light.css b/webclient/src/Style-light.css index b5ab58a..402e3e9 100644 --- a/webclient/src/Style-light.css +++ b/webclient/src/Style-light.css @@ -74,6 +74,10 @@ span.source { max-width: 38rem; } +.article a { + border-bottom: 1px solid #222222; +} + .article h1 { font-size: 1.6rem; } @@ -107,6 +111,7 @@ span.source { } .article .info a { + border-bottom: none; color: #828282; } .article .info a:hover { @@ -114,38 +119,16 @@ span.source { } .story-text { - font: 1.2rem/1.5 'CharisSILW', sans-serif; - letter-spacing: 0.004rem; -} - -.story-text a { - color: #000000; - text-decoration: none; - display: inline-block; - position: relative; -} - -.story-text a::after { - content: ''; - position: absolute; - left: 0; - display: inline-block; - height: 1em; - width: 100%; - border-bottom: 1px solid #222222; - margin-top: 0.55rem; + font: 1.2rem/1.5 'Apparatus SIL', sans-serif; + margin-top: 1em; } .comments { - margin-left: -1rem; -} - -.comments a { - border-bottom: 1px solid #222222; + margin-left: -1.25rem; } .comment { - padding-left: 1rem; + padding-left: 1.25rem; } .comment.lined { @@ -159,7 +142,7 @@ span.source { .toggleDot { position: fixed; bottom: 1rem; - right: 1rem; + left: 1rem; height: 3rem; width: 3rem; background-color: #828282; diff --git a/webclient/src/fonts/AppSILB.ttf b/webclient/src/fonts/AppSILB.ttf new file mode 100644 index 0000000..4292079 Binary files /dev/null and b/webclient/src/fonts/AppSILB.ttf differ diff --git a/webclient/src/fonts/AppSILBI.ttf b/webclient/src/fonts/AppSILBI.ttf new file mode 100644 index 0000000..4cef9db Binary files /dev/null and b/webclient/src/fonts/AppSILBI.ttf differ diff --git a/webclient/src/fonts/AppSILI.ttf b/webclient/src/fonts/AppSILI.ttf new file mode 100644 index 0000000..cba464c Binary files /dev/null and b/webclient/src/fonts/AppSILI.ttf differ diff --git a/webclient/src/fonts/AppSILR.ttf b/webclient/src/fonts/AppSILR.ttf new file mode 100644 index 0000000..25ba316 Binary files /dev/null and b/webclient/src/fonts/AppSILR.ttf differ diff --git a/webclient/src/fonts/CharisSIL-B.woff b/webclient/src/fonts/CharisSIL-B.woff deleted file mode 100644 index 73841b9..0000000 Binary files a/webclient/src/fonts/CharisSIL-B.woff and /dev/null differ diff --git a/webclient/src/fonts/CharisSIL-BI.woff b/webclient/src/fonts/CharisSIL-BI.woff deleted file mode 100644 index 4c877a4..0000000 Binary files a/webclient/src/fonts/CharisSIL-BI.woff and /dev/null differ diff --git a/webclient/src/fonts/CharisSIL-I.woff b/webclient/src/fonts/CharisSIL-I.woff deleted file mode 100644 index e06ee04..0000000 Binary files a/webclient/src/fonts/CharisSIL-I.woff and /dev/null differ diff --git a/webclient/src/fonts/CharisSIL-R.woff b/webclient/src/fonts/CharisSIL-R.woff deleted file mode 100644 index 1109655..0000000 Binary files a/webclient/src/fonts/CharisSIL-R.woff and /dev/null differ diff --git a/webclient/src/fonts/Fonts.css b/webclient/src/fonts/Fonts.css index efe545a..02e387e 100644 --- a/webclient/src/fonts/Fonts.css +++ b/webclient/src/fonts/Fonts.css @@ -1,24 +1,23 @@ @font-face { - font-family: CharisSILW; - src: url(CharisSIL-R.woff); + font-family: 'Apparatus SIL'; + src: url('AppSILR.ttf') format('truetype'); } @font-face { - font-family: CharisSILW; + font-family: 'Apparatus SIL'; font-style: italic; - src: url(CharisSIL-I.woff); + src: url('AppSILI.ttf') format('truetype'); } @font-face { - font-family: CharisSILW; + font-family: 'Apparatus SIL'; font-weight: bold; - src: url(CharisSIL-B.woff); + src: url('AppSILB.ttf') format('truetype'); } @font-face { - font-family: CharisSILW; + font-family: 'Apparatus SIL'; font-weight: bold; font-style: italic; - src: url(CharisSIL-BI.woff); + src: url('AppSILBI.ttf') format('truetype'); } - diff --git a/webclient/src/utils.js b/webclient/src/utils.js index 917dd34..8bab265 100644 --- a/webclient/src/utils.js +++ b/webclient/src/utils.js @@ -30,16 +30,13 @@ export const clearStorage = () => { }; export class ToggleDot extends React.Component { - scrollTop() { - window.scrollTo(0, 0); - } render() { const id = this.props.id; const article = this.props.article; return (
- +