From b4cfa527135f83b8f60fde4178db75142e9378fd Mon Sep 17 00:00:00 2001
From: Alessandro Jean <alessandrojean@gmail.com>
Date: Tue, 24 Sep 2019 18:58:13 -0300
Subject: [PATCH 1/4] Create custom theme.

---
 package-lock.json                       |  41 +++-
 src/.vuepress/theme/components/Home.vue | 254 ++++++++++++++++++++++++
 src/.vuepress/theme/index.js            |   3 +
 3 files changed, 287 insertions(+), 11 deletions(-)
 create mode 100644 src/.vuepress/theme/components/Home.vue
 create mode 100644 src/.vuepress/theme/index.js

diff --git a/package-lock.json b/package-lock.json
index 0c03c409..7675fdee 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4263,7 +4263,8 @@
         "ansi-regex": {
           "version": "2.1.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "aproba": {
           "version": "1.2.0",
@@ -4284,12 +4285,14 @@
         "balanced-match": {
           "version": "1.0.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -4304,17 +4307,20 @@
         "code-point-at": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "concat-map": {
           "version": "0.0.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "console-control-strings": {
           "version": "1.1.0",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -4431,7 +4437,8 @@
         "inherits": {
           "version": "2.0.3",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "ini": {
           "version": "1.3.5",
@@ -4443,6 +4450,7 @@
           "version": "1.0.0",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -4457,6 +4465,7 @@
           "version": "3.0.4",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
@@ -4464,12 +4473,14 @@
         "minimist": {
           "version": "0.0.8",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "minipass": {
           "version": "2.3.5",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.2",
             "yallist": "^3.0.0"
@@ -4488,6 +4499,7 @@
           "version": "0.5.1",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -4568,7 +4580,8 @@
         "number-is-nan": {
           "version": "1.0.1",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -4580,6 +4593,7 @@
           "version": "1.4.0",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -4665,7 +4679,8 @@
         "safe-buffer": {
           "version": "5.1.2",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "safer-buffer": {
           "version": "2.1.2",
@@ -4701,6 +4716,7 @@
           "version": "1.0.2",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",
@@ -4720,6 +4736,7 @@
           "version": "3.0.1",
           "bundled": true,
           "dev": true,
+          "optional": true,
           "requires": {
             "ansi-regex": "^2.0.0"
           }
@@ -4763,12 +4780,14 @@
         "wrappy": {
           "version": "1.0.2",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         },
         "yallist": {
           "version": "3.0.3",
           "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
         }
       }
     },
diff --git a/src/.vuepress/theme/components/Home.vue b/src/.vuepress/theme/components/Home.vue
new file mode 100644
index 00000000..128fba07
--- /dev/null
+++ b/src/.vuepress/theme/components/Home.vue
@@ -0,0 +1,254 @@
+<template>
+	<main class="home" aria-labelledby="main-title">
+		<header class="hero">
+			<img
+				v-if="data.heroImage"
+				:src="$withBase(data.heroImage)"
+				:alt="data.heroAlt || 'hero'"
+			>
+
+			<h1 v-if="data.heroText !== null" id="main-title">{{ data.heroText || $title || 'Hello' }}</h1>
+
+			<p class="description">
+				{{ data.tagline || $description || 'Welcome to your VuePress site' }}
+			</p>
+
+			<p
+				class="action"
+				v-if="data.actionText && data.actionLink"
+			>
+				<NavLink
+					class="action-button"
+					v-if="tagName.length"
+					:item="downloadLink"
+					download
+				/>
+				<NavLink
+					class="action-button secundary"
+					:item="actionLink"
+				/>
+			</p>
+		</header>
+
+		<div
+			class="features"
+			v-if="data.features && data.features.length"
+		>
+			<div
+				class="feature"
+				v-for="(feature, index) in data.features"
+				:key="index"
+			>
+				<h2>{{ feature.title }}</h2>
+				<p>{{ feature.details }}</p>
+			</div>
+		</div>
+
+		<Content class="theme-default-content custom"/>
+
+		<div
+			class="footer"
+			v-if="data.footer"
+		>
+			{{ data.footer }}
+		</div>
+	</main>
+</template>
+
+<script>
+import NavLink from '@parent-theme/components/NavLink.vue';
+
+import axios from 'axios';
+
+const RELEASE_URL = 'https://api.github.com/repos/inorichi/tachiyomi/releases/latest'
+
+export default {
+	components: { NavLink },
+
+	data () {
+		return {
+			tagName: '',
+			browserDownloadUrl: '',
+		}
+	},
+
+	computed: {
+		data () {
+			return this.$page.frontmatter;
+		},
+
+		actionLink () {
+			return {
+				link: this.data.actionLink,
+				text: this.data.actionText
+			};
+		},
+
+		downloadLink () {
+			return {
+				link: this.$data.browserDownloadUrl,
+				text: `Download ${this.$data.tagName}`
+			}
+		}
+	},
+
+	async beforeMount () {
+		const { data } = await axios.get(RELEASE_URL);
+		// Maybe eventually some release has more than the apk in assets.
+		const apkAsset = data.assets.find(a => a.name.includes('.apk'));
+		// Set the values.
+		this.$data.tagName = data.tag_name;
+		this.$data.browserDownloadUrl = apkAsset.browser_download_url;
+	}
+}
+</script>
+
+<style lang="stylus">
+// Use Stylus to use the layout variables.
+.home {
+	padding: $navbarHeight 2rem 0;
+	max-width: 960px;
+	margin: 0px auto;
+	display: block;
+
+	.hero {
+		text-align: center;
+
+		img {
+			max-width: 100%;
+			max-height: 280px;
+			display: block;
+			margin: 3rem auto 1.5rem;
+		}
+
+		h1 {
+			font-size: 3rem;
+		}
+
+		h1, .description, .action {
+			margin: 1.8rem auto;
+		}
+
+		.description {
+			max-width: 35rem;
+			font-size: 1.6rem;
+			line-height: 1.3;
+			color: lighten($textColor, 40%);
+		}
+
+		.action-button {
+			display: inline-block;
+			font-size: 1.2rem;
+			color: #fff;
+			background-color: $accentColor;
+			padding: 0.8rem 1.6rem;
+			border-radius: 4px;
+			transition: background-color .1s ease;
+			box-sizing: border-box;
+			border-bottom: 1px solid darken($accentColor, 10%);
+
+			&[download] svg {
+				display: none;
+			}
+
+			&:hover {
+				background-color: lighten($accentColor, 10%);
+			}
+
+			&.secundary {
+				background-color: darken($borderColor, 10%);
+				color: lighten($textColor, 15%);
+				border-bottom-color: darken($borderColor, 20%);
+
+				&:hover {
+					background-color: $borderColor;
+				}
+			}
+		}
+	}
+
+	.features {
+		border-top: 1px solid $borderColor;
+		padding: 1.2rem 0;
+		margin-top: 2.5rem;
+		display: flex;
+		flex-wrap: wrap;
+		align-items: flex-start;
+		align-content: stretch;
+		justify-content: space-between;
+	}
+
+	.feature {
+		flex-grow: 1;
+		flex-basis: 30%;
+		max-width: 30%;
+
+		h2 {
+			font-size: 1.4rem;
+			font-weight: 500;
+			border-bottom: none;
+			padding-bottom: 0;
+			color: lighten($textColor, 10%);
+		}
+
+		p {
+			color: lighten($textColor, 25%);
+		}
+	}
+
+	.footer {
+		padding: 2.5rem;
+		border-top: 1px solid $borderColor;
+		text-align: center;
+		color: lighten($textColor, 25%);
+	}
+}
+
+@media (max-width: $MQMobile) {
+	.home {
+		.features {
+			flex-direction: column;
+		}
+
+		.feature {
+			max-width: 100%;
+			padding: 0 2.5rem;
+		}
+	}
+}
+
+@media (max-width: $MQMobileNarrow) {
+	.home {
+		padding-left: 1.5rem;
+		padding-right: 1.5rem;
+
+		.hero {
+			img {
+				max-height: 210px;
+				margin: 2rem auto 1.2rem;
+			}
+
+			h1 {
+				font-size: 2rem;
+			}
+
+			h1, .description, .action {
+				margin: 1.2rem auto;
+			}
+
+			.description {
+				font-size: 1.2rem;
+			}
+
+			.action-button {
+				font-size: 1rem;
+				padding: 0.6rem 1.2rem;
+			}
+
+			.feature h2 {
+				font-size: 1.25rem;
+			}
+		}
+	}
+}
+</style>
diff --git a/src/.vuepress/theme/index.js b/src/.vuepress/theme/index.js
new file mode 100644
index 00000000..ba95b2af
--- /dev/null
+++ b/src/.vuepress/theme/index.js
@@ -0,0 +1,3 @@
+module.exports = {
+	extend: '@vuepress/theme-default'
+};

From c19cef157946bab34852f166cd9af74f9fc1d73e Mon Sep 17 00:00:00 2001
From: Alessandro Jean <alessandrojean@gmail.com>
Date: Tue, 24 Sep 2019 19:56:23 -0300
Subject: [PATCH 2/4] Add download icon and fix fetch info method.

---
 package-lock.json                          | 26 ++++++++++++++
 package.json                               |  3 ++
 src/.vuepress/components/ExtensionList.vue | 25 ++++++++++---
 src/.vuepress/enhanceApp.js                | 12 +++++--
 src/.vuepress/theme/components/Home.vue    | 42 +++++++++++-----------
 5 files changed, 81 insertions(+), 27 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 7675fdee..a9ccadfc 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -842,6 +842,32 @@
         "to-fast-properties": "^2.0.0"
       }
     },
+    "@fortawesome/fontawesome-common-types": {
+      "version": "0.2.25",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.25.tgz",
+      "integrity": "sha512-3RuZPDuuPELd7RXtUqTCfed14fcny9UiPOkdr2i+cYxBoTOfQgxcDoq77fHiiHcgWuo1LoBUpvGxFF1H/y7s3Q=="
+    },
+    "@fortawesome/fontawesome-svg-core": {
+      "version": "1.2.25",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.25.tgz",
+      "integrity": "sha512-MotKnn53JKqbkLQiwcZSBJVYtTgIKFbh7B8+kd05TSnfKYPFmjKKI59o2fpz5t0Hzl35vVGU6+N4twoOpZUrqA==",
+      "requires": {
+        "@fortawesome/fontawesome-common-types": "^0.2.25"
+      }
+    },
+    "@fortawesome/free-solid-svg-icons": {
+      "version": "5.11.2",
+      "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.11.2.tgz",
+      "integrity": "sha512-zBue4i0PAZJUXOmLBBvM7L0O7wmsDC8dFv9IhpW5QL4kT9xhhVUsYg/LX1+5KaukWq4/cbDcKT+RT1aRe543sg==",
+      "requires": {
+        "@fortawesome/fontawesome-common-types": "^0.2.25"
+      }
+    },
+    "@fortawesome/vue-fontawesome": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/@fortawesome/vue-fontawesome/-/vue-fontawesome-0.1.7.tgz",
+      "integrity": "sha512-YCw2Q2m4fxzyFsPOH3uDYMoJztTD+pT+AAyse4LFpbdrBg+r8ueaVT8BFnXEjrGwMDJJeXrwJ5AOC6q/JWBI4w=="
+    },
     "@mrmlnc/readdir-enhanced": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/@mrmlnc/readdir-enhanced/-/readdir-enhanced-2.2.1.tgz",
diff --git a/package.json b/package.json
index 02218095..6c634543 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,9 @@
 		"vuepress": "^1.1.0"
 	},
 	"dependencies": {
+		"@fortawesome/fontawesome-svg-core": "^1.2.25",
+		"@fortawesome/free-solid-svg-icons": "^5.11.2",
+		"@fortawesome/vue-fontawesome": "^0.1.7",
 		"axios": "^0.19.0",
 		"iso-639-1": "^2.1.0",
 		"lodash.groupby": "^4.6.0",
diff --git a/src/.vuepress/components/ExtensionList.vue b/src/.vuepress/components/ExtensionList.vue
index 333b65ca..da7472c5 100644
--- a/src/.vuepress/components/ExtensionList.vue
+++ b/src/.vuepress/components/ExtensionList.vue
@@ -13,7 +13,14 @@
 						{{ extension.pkg }}
 					</div>
 				</div>
-				<a :href="apkUrl(extension.apk)" class="button" download>Download</a>
+				<a
+					:href="apkUrl(extension.apk)"
+					class="button"
+					title="Download APK"
+					download>
+					<font-awesome-icon icon="download" />
+					<span>Download</span>
+				</a>
 			</div>
 		</div>
 	</div>
@@ -28,11 +35,12 @@ import ISO6391 from 'iso-639-1';
 const EXTENSION_JSON = 'https://raw.githubusercontent.com/inorichi/tachiyomi-extensions/repo/index.json';
 
 export default {
-	data: function () {
+	data () {
 		return {
 			extensions: []
 		}
 	},
+
 	methods: {
 		langName: code => code === 'all' ? 'All' : `${ISO6391.getName(code)} (${ISO6391.getNativeName(code)})`,
 		iconUrl (pkg) {
@@ -41,6 +49,7 @@ export default {
 		},
 		apkUrl: apk => `https://raw.githubusercontent.com/inorichi/tachiyomi-extensions/repo/apk/${apk}`
 	},
+
 	async beforeMount () {
 		const { data } = await axios.get(EXTENSION_JSON);
 		const values = Object.values(groupBy(data, 'lang'));
@@ -78,7 +87,7 @@ export default {
 		font-size: 0.8em;
 		color: #fff;
 		background-color: #2e84bf;
-		padding: 0.3rem;
+		padding: 0.5rem;
 		border-radius: 4px;
 		transition: background-color 0.1s ease;
 		box-sizing: border-box;
@@ -89,12 +98,18 @@ export default {
 			background-color: #3992cf;
 			text-decoration: none !important;
 		}
+
+		svg + span {
+			margin-left: 0.25rem;
+		}
 	}
 }
 
 @media (max-width: 767px) {
-	.extension .extension-text .down {
-		display: none;
+	.extension {
+		.extension-text .down, .button span {
+			display: none;
+		}
 	}
 }
 </style>
diff --git a/src/.vuepress/enhanceApp.js b/src/.vuepress/enhanceApp.js
index e620be25..6ae74df1 100644
--- a/src/.vuepress/enhanceApp.js
+++ b/src/.vuepress/enhanceApp.js
@@ -1,8 +1,16 @@
-import './styles/index.scss'
+import './styles/index.scss';
+
+import { library } from '@fortawesome/fontawesome-svg-core';
+import { faDownload } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
+
+library.add(faDownload);
 
 export default ({
 	Vue, // the version of Vue being used in the VuePress app
 	options, // the options for the root Vue instance
 	router, // the router instance for the app
 	siteData // site metadata
-}) => {}
+}) => {
+	Vue.component('font-awesome-icon', FontAwesomeIcon);
+};
diff --git a/src/.vuepress/theme/components/Home.vue b/src/.vuepress/theme/components/Home.vue
index 128fba07..03511316 100644
--- a/src/.vuepress/theme/components/Home.vue
+++ b/src/.vuepress/theme/components/Home.vue
@@ -17,12 +17,17 @@
 				class="action"
 				v-if="data.actionText && data.actionLink"
 			>
-				<NavLink
+				<a
 					class="action-button"
-					v-if="tagName.length"
-					:item="downloadLink"
+					rel="noopener noreferrer"
+					:href="browserDownloadUrl || null"
+					title="Download latest release"
 					download
-				/>
+				>
+					<font-awesome-icon icon="download" />
+					<span>Download {{ tagName || 'vX.X.X' }}</span>
+				</a>
+
 				<NavLink
 					class="action-button secundary"
 					:item="actionLink"
@@ -82,17 +87,10 @@ export default {
 				link: this.data.actionLink,
 				text: this.data.actionText
 			};
-		},
-
-		downloadLink () {
-			return {
-				link: this.$data.browserDownloadUrl,
-				text: `Download ${this.$data.tagName}`
-			}
 		}
 	},
 
-	async beforeMount () {
+	async mounted () {
 		const { data } = await axios.get(RELEASE_URL);
 		// Maybe eventually some release has more than the apk in assets.
 		const apkAsset = data.assets.find(a => a.name.includes('.apk'));
@@ -147,23 +145,27 @@ export default {
 			box-sizing: border-box;
 			border-bottom: 1px solid darken($accentColor, 10%);
 
-			&[download] svg {
-				display: none;
-			}
-
 			&:hover {
 				background-color: lighten($accentColor, 10%);
 			}
 
 			&.secundary {
-				background-color: darken($borderColor, 10%);
-				color: lighten($textColor, 15%);
-				border-bottom-color: darken($borderColor, 20%);
+				background-color: darken($borderColor, 5%);
+				color: lighten($textColor, 25%);
+				border-bottom-color: darken($borderColor, 15%);
 
 				&:hover {
-					background-color: $borderColor;
+					background-color: lighten($borderColor, 5%);
 				}
 			}
+
+			svg + span {
+				margin-left: 0.5rem;
+			}
+
+			& + .action-button {
+				margin-left: 0.5rem;
+			}
 		}
 	}
 

From 1dbcd5f9150ab3d122628b85d59f0a02ea92d46c Mon Sep 17 00:00:00 2001
From: Alessandro Jean <alessandrojean@gmail.com>
Date: Tue, 24 Sep 2019 20:15:03 -0300
Subject: [PATCH 3/4] Fix spacing in mobile.

---
 src/.vuepress/theme/components/Home.vue | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/.vuepress/theme/components/Home.vue b/src/.vuepress/theme/components/Home.vue
index 03511316..88262b27 100644
--- a/src/.vuepress/theme/components/Home.vue
+++ b/src/.vuepress/theme/components/Home.vue
@@ -216,6 +216,13 @@ export default {
 			max-width: 100%;
 			padding: 0 2.5rem;
 		}
+
+		.hero {
+			.action-button + .action-button {
+				margin-left: 0;
+				margin-top: 0.5rem;
+			}
+		}
 	}
 }
 

From e096f1f0843e5077fb250d0b3eae56e7abea81f8 Mon Sep 17 00:00:00 2001
From: Alessandro Jean <alessandrojean@gmail.com>
Date: Tue, 24 Sep 2019 20:20:21 -0300
Subject: [PATCH 4/4] Change div to footer and add semicolon.

---
 src/.vuepress/theme/components/Home.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/.vuepress/theme/components/Home.vue b/src/.vuepress/theme/components/Home.vue
index 88262b27..866d26e0 100644
--- a/src/.vuepress/theme/components/Home.vue
+++ b/src/.vuepress/theme/components/Home.vue
@@ -51,12 +51,12 @@
 
 		<Content class="theme-default-content custom"/>
 
-		<div
+		<footer
 			class="footer"
 			v-if="data.footer"
 		>
 			{{ data.footer }}
-		</div>
+		</footer>
 	</main>
 </template>
 
@@ -65,7 +65,7 @@ import NavLink from '@parent-theme/components/NavLink.vue';
 
 import axios from 'axios';
 
-const RELEASE_URL = 'https://api.github.com/repos/inorichi/tachiyomi/releases/latest'
+const RELEASE_URL = 'https://api.github.com/repos/inorichi/tachiyomi/releases/latest';
 
 export default {
 	components: { NavLink },