diff --git a/src/newsreader/js/pages/homepage/components/PostModal.js b/src/newsreader/js/pages/homepage/components/PostModal.js index ab508ae..f9b7b5e 100644 --- a/src/newsreader/js/pages/homepage/components/PostModal.js +++ b/src/newsreader/js/pages/homepage/components/PostModal.js @@ -74,13 +74,13 @@ class PostModal extends React.Component { className={`button read-button ${readButtonDisabled && 'button--disabled'}`} onClick={() => !readButtonDisabled && this.props.markPostRead(post, token)} > - Mark as read + Mark as read
@@ -112,7 +112,7 @@ class PostModal extends React.Component { target="_blank" rel="noopener noreferrer" > - +
diff --git a/src/newsreader/js/pages/homepage/components/sidebar/CategoryItem.js b/src/newsreader/js/pages/homepage/components/sidebar/CategoryItem.js index 563f8ad..505f5d1 100644 --- a/src/newsreader/js/pages/homepage/components/sidebar/CategoryItem.js +++ b/src/newsreader/js/pages/homepage/components/sidebar/CategoryItem.js @@ -24,7 +24,7 @@ class CategoryItem extends React.Component { } render() { - const chevronClass = this.state.open ? 'gg-chevron-down' : 'gg-chevron-right'; + const chevronClass = this.state.open ? 'fas fa-chevron-down' : 'fas fa-chevron-right'; const selected = isSelected(this.props.category, this.props.selected, CATEGORY_TYPE); const className = selected ? 'category category--selected' : 'category'; diff --git a/src/newsreader/js/pages/homepage/components/sidebar/ReadButton.js b/src/newsreader/js/pages/homepage/components/sidebar/ReadButton.js index 3d33fc0..3711c85 100644 --- a/src/newsreader/js/pages/homepage/components/sidebar/ReadButton.js +++ b/src/newsreader/js/pages/homepage/components/sidebar/ReadButton.js @@ -18,7 +18,7 @@ class ReadButton extends React.Component { render() { return ( ); } diff --git a/src/newsreader/js/pages/homepage/components/sidebar/RuleItem.js b/src/newsreader/js/pages/homepage/components/sidebar/RuleItem.js index df8da94..11289c5 100644 --- a/src/newsreader/js/pages/homepage/components/sidebar/RuleItem.js +++ b/src/newsreader/js/pages/homepage/components/sidebar/RuleItem.js @@ -24,7 +24,7 @@ class RuleItem extends React.Component { if (this.props.rule.favicon) { favicon = ; } else { - favicon = ; + favicon = ; } return ( diff --git a/src/newsreader/scss/components/post/_post.scss b/src/newsreader/scss/components/post/_post.scss index c4b6039..9402f04 100644 --- a/src/newsreader/scss/components/post/_post.scss +++ b/src/newsreader/scss/components/post/_post.scss @@ -38,11 +38,8 @@ } &__link { - display: inline-flex; - padding: 0 15px; - - & img { - width: 30px; + & i { + padding: 0 0 0 7px; } } @@ -91,7 +88,12 @@ &__close-button { background-color: $blue; - color: $white; + color: var(--font-color); + + // TODO add mixin for default font awesome padding + & i { + padding: 0 7px 0 0; + } &:hover { background-color: lighten($blue, +1%); diff --git a/src/newsreader/scss/components/posts-info/_posts-info.scss b/src/newsreader/scss/components/posts-info/_posts-info.scss index c199961..58a2da4 100644 --- a/src/newsreader/scss/components/posts-info/_posts-info.scss +++ b/src/newsreader/scss/components/posts-info/_posts-info.scss @@ -9,10 +9,6 @@ align-self: center; } - &__link { - display: inline-flex; - } - & .badge { & a { color: $black; diff --git a/src/newsreader/scss/elements/button/_read-button.scss b/src/newsreader/scss/elements/button/_read-button.scss index 71e8e75..f2487eb 100644 --- a/src/newsreader/scss/elements/button/_read-button.scss +++ b/src/newsreader/scss/elements/button/_read-button.scss @@ -1,9 +1,14 @@ .read-button { @extend .button; - color: $white; + color: var(--font-color); background-color: $green; + // TODO add mixin for default font awesome padding + & i { + padding: 0 7px 0 0; + } + &:hover { background-color: darken($green, 10%); }