From 0643214e2dcde081babb04b1167eac113ebcb8f7 Mon Sep 17 00:00:00 2001
From: veryCrunchy <me@verycrunchy.dev>
Date: Tue, 8 Oct 2024 09:27:45 +0200
Subject: [PATCH] chore: remove app + qol fixes (#1091)

* chore: rename download to get premid

* chore: remove app downloads

* chore: rename download to get premid

* chore: improve contributor roles
---
 .gitignore                                 |   3 +-
 src/components/Footer.vue                  |   2 +-
 src/components/Navigation.vue              |  26 +++---
 src/pages/contributors.vue                 |  75 +++++----------
 src/pages/downloads.vue                    | 102 +--------------------
 src/pages/index.vue                        |  12 +--
 src/stylesheets/components/container.scss  |  13 +--
 src/stylesheets/components/visibility.scss |   2 +-
 8 files changed, 60 insertions(+), 175 deletions(-)

diff --git a/.gitignore b/.gitignore
index 6ae126a2..2251b1f5 100644
--- a/.gitignore
+++ b/.gitignore
@@ -7,4 +7,5 @@ src/langs
 .nuxt
 package-lock.json
 languageUpdater.js
-.DS_Store
\ No newline at end of file
+.DS_Store
+pnpm-lock.yaml
diff --git a/src/components/Footer.vue b/src/components/Footer.vue
index 77939813..2e4e7254 100644
--- a/src/components/Footer.vue
+++ b/src/components/Footer.vue
@@ -12,7 +12,7 @@
 						class="button"
 						replace
 						to="/downloads"
-						v-text="$t(`footer.usercount.button`)"
+						v-text="$t(`home.introduction.button.getPremid`)"
 					/>
 				</div>
 			</div>
diff --git a/src/components/Navigation.vue b/src/components/Navigation.vue
index 370190d5..39a47615 100644
--- a/src/components/Navigation.vue
+++ b/src/components/Navigation.vue
@@ -14,10 +14,7 @@
 							content: $t('store.message.error')
 						}"
 					>
-						<i
-							@click="$router.push('/downloads#ext-downloads')"
-							class="fa-exclamation fas"
-						/>
+						<i @click="$router.push('/downloads')" class="fa-exclamation fas" />
 					</div>
 				</transition>
 			</div>
@@ -125,7 +122,14 @@
 				>
 					<span>
 						<i :class="'fas fa-' + category.logo"></i>
-						{{ $t(`header.${category.route}`) }}
+						{{
+							$t(
+								`header.${category.route}`.replace(
+									"header.downloads",
+									"home.introduction.button.getPremid"
+								)
+							)
+						}}
 					</span>
 				</nuxt-link>
 			</div>
@@ -410,16 +414,16 @@
 						route: "store",
 						string: "header.store"
 					},
-					{
-						logo: "download",
-						route: "downloads",
-						string: "header.downloads"
-					},
 					{
 						logo: "hands-helping",
 						route: "contributors",
 						string: "header.contributors"
-					}
+					},
+					{
+						logo: "download",
+						route: "downloads",
+						string: "home.introduction.button.getPremid"
+					},
 				]
 			};
 		},
diff --git a/src/pages/contributors.vue b/src/pages/contributors.vue
index abbb1a5b..fa3d91fa 100644
--- a/src/pages/contributors.vue
+++ b/src/pages/contributors.vue
@@ -1,4 +1,23 @@
 <script>
+	const staffRoles = [
+			"673682085608816652", // Project Management
+			"1027665813525778436", // Software Engineer
+			"514546359865442304", // Discord Mod
+			"566417964820070421", // Technical Support
+			"685969048399249459", // Human Resources
+			"994342612532199525", // Community Management
+			"811262682408943616" // Localization Manager,
+		],
+		supportRoles = [
+			"1032759805732978708", //Contributor
+			"502165799172309013", //Donator
+			"515874214750715904", //Patron
+			"585532751663333383" //Booster
+		],
+		presenceDeveloperRole = "606222296016879722", //Presence Developer
+		proofreaderRole = "522755339448483840", //Proofreader
+		translatorRole = "502148045991968788", //Translator
+		roles = [...staffRoles, ...supportRoles];
 	export default {
 		name: "Contributors",
 		auth: false,
@@ -45,28 +64,11 @@
 		},
 		computed: {
 			sortedUsers() {
-				const staffRoles = [
-					"673682085608816652", // Project Management
-					"514546359865442304", // Moderator
-					"566417964820070421", // Support
-					"994342612532199525", // Community Management
-					"811262682408943616", // Localization Manager
-					"515874214750715904", //Patron
-					"585532751663333383", //Booster
-					"502165799172309013" //Donator
-				];
-
 				//* Sort by role array index
 				return this.contributors.sort((a, b) => {
-					if (
-						staffRoles.indexOf(a.user.roleId) >
-						staffRoles.indexOf(b.user.roleId)
-					)
+					if (roles.indexOf(a.user.roleId) > roles.indexOf(b.user.roleId))
 						return 1;
-					else if (
-						staffRoles.indexOf(a.user.roleId) <
-						staffRoles.indexOf(b.user.roleId)
-					)
+					else if (roles.indexOf(a.user.roleId) < roles.indexOf(b.user.roleId))
 						return -1;
 					else
 						return a.user.name
@@ -77,46 +79,23 @@
 		},
 		methods: {
 			isStaffRole(roleId) {
-				const staffRoles = [
-					"514546359865442304", // Discord Mod
-					"566417964820070421", // Technical Support
-					"673682085608816652", // Project Management
-					"685969048399249459", // Human Resources
-					"994342612532199525", // Community Management
-					"673682085608816652", // Project Management
-					"811262682408943616" // Localization Manager,
-				];
-
 				if (staffRoles.indexOf(roleId) !== -1) return true;
 				else return false;
 			},
 			isSupporterRole(roleId) {
-				const supportRoles = [
-					"1032759805732978708", //Contributor
-					"502165799172309013", //Donator
-					"515874214750715904", //Patron
-					"585532751663333383" //Booster
-				];
-
 				if (supportRoles.indexOf(roleId) !== -1) return true;
 				else return false;
 			},
 
 			isPresenceDeveloperRole(roleId) {
-				const presenceDeveloperRole = "606222296016879722"; //Presence Developer
-
 				if (presenceDeveloperRole == roleId) return true;
 				else return false;
 			},
 			isProofreaderRole(roleId) {
-				const proofreaderRole = "522755339448483840"; //Proofreader
-
 				if (proofreaderRole == roleId) return true;
 				else return false;
 			},
 			isTranslatorRole(roleId) {
-				const translatorRole = "502148045991968788"; //Translator
-
 				if (translatorRole == roleId) return true;
 				else return false;
 			},
@@ -149,11 +128,9 @@
 							v-for="contributor of sortedUsers"
 							:key="contributor.user.id + 'staff'"
 							class="contributor-card"
+							v-if="isStaffRole(contributor.user.roleId)"
 						>
-							<CreditCard
-								v-if="isStaffRole(contributor.user.roleId)"
-								:user="contributor.user"
-							/>
+							<CreditCard :user="contributor.user" />
 						</div>
 					</div>
 				</div>
@@ -168,11 +145,9 @@
 							v-for="contributor of sortedUsers"
 							:key="contributor.user.id + 'supporter'"
 							class="contributor-card"
+							v-if="isSupporterRole(contributor.user.roleId)"
 						>
-							<CreditCard
-								v-if="isSupporterRole(contributor.user.roleId)"
-								:user="contributor.user"
-							/>
+							<CreditCard :user="contributor.user" />
 						</div>
 					</div>
 				</div>
diff --git a/src/pages/downloads.vue b/src/pages/downloads.vue
index 130c3918..f7c8ec0c 100644
--- a/src/pages/downloads.vue
+++ b/src/pages/downloads.vue
@@ -6,7 +6,7 @@
 					<h1>{{ $t("downloads.header.title") }}</h1>
 					<p>{{ $t("downloads.header.subtitle") }}</p>
 				</div>
-				<div class="header__steps">
+				<!-- <div class="header__steps">
 					<h2>{{ $t("downloads.instructions.heading") }}</h2>
 					<ol>
 						<li>
@@ -39,7 +39,7 @@
 							</p>
 						</li>
 					</ol>
-				</div>
+				</div> -->
 			</div>
 
 			<div class="waves-divider waves-divider_bottom">
@@ -70,93 +70,12 @@
 
 		<transition name="card-animation" mode="out-in">
 			<div v-if="showDownloads">
-				<div
-					id="app-downloads"
-					class="dl-container__section dl-container__section_downloads waves-aligned"
-				>
-					<h1 class="section-header">
-						{{ $t("downloads.appdownloading.header") }}
-						<a
-							v-if="platform_order[1] == 'linux'"
-							href="https://github.com/PreMiD/Linux/releases"
-							target="_blank"
-							class="label label_downloads-version linux"
-							v-tippy="{
-								content: $t('downloads.warning.differentVersion2', {
-									0: appVersion
-								})
-							}"
-							v-text="linuxVersion"
-						></a>
-
-						<a
-							v-else-if="appVersion"
-							href="https://github.com/PreMiD/PreMiD/releases"
-							target="_blank"
-							class="label label_downloads-version"
-							v-text="appVersion"
-						></a>
-					</h1>
-					<div class="dl-container__cards">
-						<div v-for="(platform, index) of platform_order" :key="platform">
-							<div @click="open(platform, 'Application')">
-								<div
-									:class="{ 'current-platform': index == 1 }"
-									class="cards__card clickable"
-								>
-									<div class="card__icon">
-										<i :class="`fab fa-${platform}`"></i>
-									</div>
-									<div class="card__content">
-										<h3>
-											{{ builds[platform].os_name }}
-											<i
-												v-if="!builds[platform].has_installer"
-												v-tippy
-												class="fa-exclamation-circle fas platform-warning"
-												:content="
-													$t('downloads.tooltips.os.not.supported.part2', {
-														0: `<b>${$t(
-															'downloads.tooltips.os.not.supported.part1'
-														)}</b> `
-													})
-												"
-											></i>
-
-											<i
-												v-if="
-													platform_order[1] != 'linux' &&
-													builds[platform].os_name == 'Linux' &&
-													builds[platform].warning
-												"
-												class="fa-question-circle fas platform-warning linux"
-												v-tippy="{
-													content: $t('downloads.warning.differentVersion', {
-														0: linuxVersion
-													})
-												}"
-											></i>
-										</h3>
-									</div>
-								</div>
-							</div>
-						</div>
-					</div>
-				</div>
-
 				<div
 					id="ext-downloads"
 					class="dl-container__section dl-container__section_downloads"
 				>
 					<h1 class="section-header">
-						{{ $t("downloads.extdownloading.header") }}
-						<a
-							v-if="extVersion"
-							href="https://github.com/PreMiD/Extension"
-							target="_blank"
-							class="label label_downloads-version"
-							v-text="extVersion"
-						></a>
+						{{ $t("home.introduction.button.getPremid") }}
 					</h1>
 
 					<div class="dl-container__cards">
@@ -392,7 +311,6 @@
 					}
 
 					this.noBetas = noBetas;
-					this.extVersion = data.versions.extension;
 					this.appVersion = data.versions.app;
 					this.linuxVersion = data.versions.linux;
 					this.userAccess = userAccess;
@@ -408,9 +326,6 @@
 		data() {
 			return {
 				noBetas: false,
-				extVersion: null,
-				appVersion: null,
-				linuxVersion: null,
 				userAccess: false,
 				extraDownloads: [],
 				currentTab: null,
@@ -420,7 +335,6 @@
 				showBeta: false,
 				cardHover: false,
 				modalAvailable: false,
-				platforms: [],
 				isChrome: true,
 				browser: {
 					name: "Chrome",
@@ -431,7 +345,6 @@
 					number: null,
 					messageKey: null
 				},
-				platform_order: ["windows", "apple", "linux"],
 				builds: {
 					windows: {
 						os_name: "Windows",
@@ -517,11 +430,6 @@
 				};
 			}
 
-			let platform_temp = "linux";
-			var platform_order = this.platform_order;
-
-			if (ua.includes("OS X") || ua.includes("Mac")) platform_temp = "apple";
-			if (ua.includes("Windows")) platform_temp = "windows";
 			if (
 				/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
 					ua
@@ -531,10 +439,6 @@
 				this.showDownloads = false;
 			}
 
-			//* Centering the current platform in array. Only works if array has 3 items.
-			platform_order.splice(platform_order.indexOf(platform_temp), 1);
-			platform_order.splice(1, 0, platform_temp);
-
 			if (
 				["#app-downloads", "#ext-downloads", "#beta-downloads"].includes(
 					window.location.hash
diff --git a/src/pages/index.vue b/src/pages/index.vue
index 98e72a1a..058d5324 100644
--- a/src/pages/index.vue
+++ b/src/pages/index.vue
@@ -15,17 +15,17 @@
 						<p v-html="markdown($t('home.introduction.paragraph'))"></p>
 					</div>
 					<div class="heading__button-group">
-						<a class="button text--uppercase" href="#features">
-							<i class="fa-stream fas"></i>
-							{{ $t("home.introduction.button.features") }}
-						</a>
 						<nuxt-link
-							class="button button--black text--uppercase"
+							class="button text--uppercase"
 							to="/downloads"
 						>
 							<i class="fa-file-export fas"></i>
-							{{ $t(`home.introduction.button.downloads`) }}
+							{{ $t(`home.introduction.button.getPremid`) }}
 						</nuxt-link>
+						<a class="button button--black text--uppercase" href="#features">
+							<i class="fa-stream fas"></i>
+							{{ $t("home.introduction.button.features") }}
+						</a>
 					</div>
 				</div>
 				<div class="promo-container__presences" ref="promoPresences">
diff --git a/src/stylesheets/components/container.scss b/src/stylesheets/components/container.scss
index c5cb22f3..dec520a4 100644
--- a/src/stylesheets/components/container.scss
+++ b/src/stylesheets/components/container.scss
@@ -474,7 +474,7 @@
 
 			z-index: 1;
 
-			padding-top: 6em;
+			padding-top: 3em;
 			padding-bottom: 12em;
 		}
 
@@ -516,14 +516,15 @@
 
 	.dl-container__header {
 		display: flex;
-		max-width: 1600px;
-		margin: 0 auto;
-		justify-content: space-between;
-		align-items: flex-start;
+		justify-content: center;
 
 		.header__content {
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			flex-direction: column;
 			width: 55%;
-
+			text-align: center;
 			h1 {
 				font-weight: 800;
 				line-height: 1.1;
diff --git a/src/stylesheets/components/visibility.scss b/src/stylesheets/components/visibility.scss
index 9e317e2b..a44b3a52 100644
--- a/src/stylesheets/components/visibility.scss
+++ b/src/stylesheets/components/visibility.scss
@@ -105,7 +105,7 @@
 	}
 
 	.dl-container .dl-container__section_header {
-		padding-top: 1em;
+		padding-bottom: 3em;
 	}
 
 	.section-heading .section-heading__title {