From bc1e7cb7e6725c4d9bcdf276e2366f54f73931ff Mon Sep 17 00:00:00 2001
From: Freeplay <freeplay@duck.com>
Date: Wed, 14 Jun 2023 14:52:21 -0400
Subject: [PATCH] a

---
 .../src/components/global/MkPageHeader.vue    | 11 ++++-
 .../client/src/pages/welcome.entrance.a.vue   | 11 ++++-
 packages/client/src/style.scss                |  4 +-
 packages/client/src/ui/universal.vue          |  1 +
 packages/client/src/ui/visitor/kanban.vue     | 41 ++++++++++++++-----
 5 files changed, 52 insertions(+), 16 deletions(-)

diff --git a/packages/client/src/components/global/MkPageHeader.vue b/packages/client/src/components/global/MkPageHeader.vue
index bc53784cef..56e2d59e88 100644
--- a/packages/client/src/components/global/MkPageHeader.vue
+++ b/packages/client/src/components/global/MkPageHeader.vue
@@ -9,8 +9,15 @@
 	>
 		<div class="left">
 			<div class="buttons">
+				<MkA
+					v-if="!$i"
+					class="_buttonIcon button icon backButton"
+					:to="'/'"
+				>
+					<i class="ph-list ph-bold ph-lg"></i>
+				</MkA>
 				<button
-					v-if="displayBackButton"
+					v-else-if="displayBackButton"
 					class="_buttonIcon button icon backButton"
 					@click.stop="goBack()"
 					@touchstart="preventDrag"
@@ -91,7 +98,7 @@
 			</nav>
 		</template>
 		<div class="buttons right">
-			<template v-if="metadata.avatar">
+			<template v-if="metadata.avatar && $i">
 				<MkFollowButton
 					v-if="narrow"
 					:user="metadata.avatar"
diff --git a/packages/client/src/pages/welcome.entrance.a.vue b/packages/client/src/pages/welcome.entrance.a.vue
index 65f89f782e..79b50100ad 100644
--- a/packages/client/src/pages/welcome.entrance.a.vue
+++ b/packages/client/src/pages/welcome.entrance.a.vue
@@ -7,7 +7,7 @@
 				:tabs="headerTabs"
 				:noTabCollapse="true"
 		/></template>
-		<div class="lznhrdub">
+		<div id="visitor-view">
 			<swiper
 				:round-lengths="true"
 				:touch-angle="25"
@@ -110,7 +110,7 @@
 
 <script lang="ts" setup>
 import { computed, watch, onMounted } from "vue";
-import { Virtual } from "swiper";
+import * as os from "@/os";
 import { Swiper, SwiperSlide } from "swiper/vue";
 import XNotes from "@/components/MkNotes.vue";
 import XUsers from "./explore.users.vue";
@@ -122,6 +122,7 @@ import { definePageMetadata } from "@/scripts/page-metadata";
 import { deviceKind } from "@/scripts/device-kind";
 import { i18n } from "@/i18n";
 import { defaultStore } from "@/store";
+import { DetailedInstanceMetadata } from "calckey-js/built/entities";
 import "swiper/scss";
 import "swiper/scss/virtual";
 
@@ -197,6 +198,12 @@ onMounted(() => {
 	syncSlide(tabs.indexOf(swiperRef.activeIndex));
 });
 
+let meta = $ref<DetailedInstanceMetadata>();
+
+os.api("meta", { detail: true }).then((res) => {
+	meta = res;
+});
+
 
 const paginationForLocal = {
 	endpoint: "notes/featured" as const,
diff --git a/packages/client/src/style.scss b/packages/client/src/style.scss
index 9e94cc553f..312ed6d2aa 100644
--- a/packages/client/src/style.scss
+++ b/packages/client/src/style.scss
@@ -577,8 +577,8 @@ hr {
 }
 
 ._caption {
-	font-size: 0.8em;
-	opacity: 0.7;
+	font-size: 0.9em;
+	opacity: 0.8;
 }
 
 ._monospace {
diff --git a/packages/client/src/ui/universal.vue b/packages/client/src/ui/universal.vue
index 563523dbda..7f5d0583c6 100644
--- a/packages/client/src/ui/universal.vue
+++ b/packages/client/src/ui/universal.vue
@@ -564,6 +564,7 @@ console.log(mainRouter.currentRoute.value.name);
 	> .contents {
 		min-width: 0;
 		flex-grow: 1;
+		flex-basis: 900px;
 		$widgets-hide-threshold: 1090px;
 		@media (max-width: $widgets-hide-threshold) {
 			padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 96px);
diff --git a/packages/client/src/ui/visitor/kanban.vue b/packages/client/src/ui/visitor/kanban.vue
index 69a20300be..f66e8e486f 100644
--- a/packages/client/src/ui/visitor/kanban.vue
+++ b/packages/client/src/ui/visitor/kanban.vue
@@ -1,21 +1,32 @@
 <template>
-	<div class="instance-info-container">
+	<div class="instance-info-container" :class="expanded">
 		<header
 			id="instance-info"
 		>
-			<img class="banner" :src="meta?.backgroundImageUrl" />
-			<div class="content">
-				<header>
+			<div class="ticker" v-if="!expanded">
+				<img 
+					class="logo"
+					:src="meta.logoImageUrl"
+				/>
+				<h1>
+					<MkA
+						to="/" class="link"
+					>{{ instanceName }}</MkA>
+				</h1>
+			</div>
+			<img class="banner" :src="meta.backgroundImageUrl" />
+			<div class="content" v-if="expanded">
+				<div class="header">
 					<img 
 						class="logo"
-						:src="meta?.logoImageUrl"
+						:src="meta.logoImageUrl"
 					/>
 					<h1>
 						<MkA
 							to="/" class="link"
 						>{{ instanceName }}</MkA>
 					</h1>
-				</header>
+				</div>
 				<div v-if="meta" class="about">
 					<Mfm
 						class="desc"
@@ -65,6 +76,10 @@
 					</div>
 				</section>
 
+				<p class="_caption">
+					Powered by Calckey, part of an interconnected network of communities in the Fediverse
+				</p>
+
 				<FormSection>
 					<div class="_formLinksGrid">
 						<MkKeyValue :text="meta.maintainerName">
@@ -94,13 +109,13 @@
 								></i></template
 							>{{ i18n.ts.tos }}
 						</FormLink>
-						<FormLink v-if="meta?.tosUrl" :to="meta.tosUrl"
+						<!-- <FormLink v-if="meta?.tosUrl" :to="meta.tosUrl"
 							><template #icon
 								><i
 									class="ph-prohibit ph-bold ph-lg"
 								></i></template
 							>Blocked servers
-						</FormLink>
+						</FormLink> -->
 					</div>
 				</FormSection>
 
@@ -162,6 +177,14 @@ import XSignupDialog from "@/components/MkSignupDialog.vue";
 import MkKeyValue from "@/components/MkKeyValue.vue";
 import MkMention from "@/components/MkMention.vue";
 
+let expanded = $ref(false);
+
+matchMedia("(max-width: 1000px)").onchange = (mql) => {
+	console.log("ran");
+	expanded = !mql.matches;
+};
+
+expanded = true;
 
 defineProps<{
 	poweredBy?: boolean,
@@ -202,8 +225,6 @@ function signup() {
 		"closed"
 	);
 };
-
-
 </script>
 
 <style lang="scss" scoped>