diff --git a/src/.vuepress/components/HelpPage.vue b/src/.vuepress/components/HelpPage.vue index 7c5dafe6..f6a525cf 100644 --- a/src/.vuepress/components/HelpPage.vue +++ b/src/.vuepress/components/HelpPage.vue @@ -4,11 +4,13 @@ import NavBar from "@theme/components/NavBar.vue"; import ClipboardListIcon from "vue-material-design-icons/ClipboardList.vue"; import ClipboardSearchIcon from "vue-material-design-icons/ClipboardSearch.vue"; import DiscordIcon from "vue-material-design-icons/Discord.vue"; +import FacebookIcon from "vue-material-design-icons/Facebook.vue"; import FaqIcon from "vue-material-design-icons/FrequentlyAskedQuestions.vue"; import GithubIcon from "vue-material-design-icons/Github.vue"; import LifebuoyIcon from "vue-material-design-icons/Lifebuoy.vue"; import RedditIcon from "vue-material-design-icons/Reddit.vue"; import SourceForkIcon from "vue-material-design-icons/SourceFork.vue"; +import TwitterIcon from "vue-material-design-icons/Twitter.vue"; export default { components: { @@ -17,6 +19,8 @@ export default { ClipboardListIcon, SourceForkIcon, DiscordIcon, + TwitterIcon, + FacebookIcon, RedditIcon, GithubIcon, LifebuoyIcon, @@ -99,6 +103,20 @@ export default { +
+ + +

{{ helpItem.title }}

+ +
+
+
+ + +

{{ helpItem.title }}

+ +
+
@@ -214,6 +232,10 @@ export default { color $accentColor &.discord-icon color $discordAccentColor + &.twitter-icon + color $twitterAccentColor + &.facebook-icon + color $facebookAccentColor &.reddit-icon color $redditAccentColor &.github-icon @@ -224,6 +246,14 @@ export default { border-bottom 2px solid $discordAccentColor h3 color $discordAccentColor + &__Twitter:hover + border-bottom 2px solid $twitterAccentColor + h3 + color $discordAccentColor + &__Facebook:hover + border-bottom 2px solid $facebookAccentColor + h3 + color $discordAccentColor &__Reddit:hover border-bottom 2px solid $redditAccentColor h3 @@ -245,7 +275,7 @@ export default { outline none .row display grid - grid-template-columns repeat(4, 1fr) + grid-template-columns repeat(5, 1fr) grid-auto-rows 1fr grid-gap 1rem &:after diff --git a/src/.vuepress/styles/palette.styl b/src/.vuepress/styles/palette.styl index 6436aa75..ae3aba7c 100644 --- a/src/.vuepress/styles/palette.styl +++ b/src/.vuepress/styles/palette.styl @@ -39,6 +39,8 @@ $ehAccentColor = $accentColor $syAccentColor = #BE0F6E // Links $discordAccentColor = #7289DA +$twitterAccentColor = #199BEE +$facebookAccentColor = #4166B2 $redditAccentColor = #FF5700 $githubAccentColor = #333333 // Element-UI diff --git a/src/help/README.md b/src/help/README.md index 74aad52a..306f8cc0 100644 --- a/src/help/README.md +++ b/src/help/README.md @@ -14,7 +14,7 @@ help: link: /help/guides/troubleshooting/ fixProblems: true - title: Guides - description: Extensive guides written for you + description: How to use the app link: /help/guides/getting-started/ guides: true extensions: true @@ -30,13 +30,21 @@ help: description: Primary communication platform linkExt: https://discord.gg/tachiyomi discord: true + - title: Twitter + description: Official Twitter account + linkExt: https://twitter.com/tachiyomiorg + twitter: true + - title: Facebook + description: Official Facebook account + linkExt: https://facebook.com/tachiyomiorg + facebook: true - title: Reddit - description: Community forums + description: Official subreddit linkExt: https://reddit.com/r/Tachiyomi reddit: true - title: GitHub - description: Repository for the app - linkExt: https://github.com/tachiyomiorg/tachiyomi + description: Code organization + linkExt: https://github.com/tachiyomiorg github: true ---