Fixed NATS URL composition.

components/campaigns/campaign.vue

@@ -60,6 +60,7 @@ const bannerSrc = (() => {
 	height: 100%;
 	display: flex;
 	justify-content: center;
+	/* align-items: center; */
 }
 
 .frame {

components/filters/toggle.vue

@@ -0,0 +1,50 @@
+<template>
+	<div
+		class="filters-toggle open"
+		@click.stop="emit('toggle')"
+	><Icon icon="filter" /></div>
+</template>
+
+<script setup>
+const emit = defineEmits(['toggle']);
+</script>
+
+<style scoped>
+.filters-toggle {
+	min-width: 2.75rem;
+	height: 3rem;
+	justify-content: center;
+	align-items: center;
+	padding: 0 .25rem;
+	border-radius: 0 .5rem .5rem 0;
+	background: var(--background);
+	color: var(--glass);
+	font-weight: bold;
+	box-shadow: inset 0 0 3px var(--shadow-weak-30);
+
+	&.open {
+		left: 0;
+		right: auto;
+	}
+
+	&.show-full {
+		display: flex;
+	}
+
+	&.close .cross {
+		display: none;
+	}
+
+	.icon {
+		fill: var(--glass);
+	}
+
+	&:hover {
+		cursor: pointer;
+
+		.icon {
+			fill: var(--primary);
+		}
+	}
+}
+</style>

components/scenes/tile.vue

@@ -213,7 +213,7 @@ const favorited = ref(props.scene.stashes.some((sceneStash) => sceneStash.id ===
 .title {
 	display: block;
 	margin-top: .5rem;
-	margin-bottom: .4rem;
+	margin-bottom: .3rem;
 	overflow: hidden;
 	white-space: nowrap;
 	text-overflow: ellipsis;
@@ -239,7 +239,7 @@ const favorited = ref(props.scene.stashes.some((sceneStash) => sceneStash.id ===
 
 .actors {
 	height: 1.15rem;
-	margin-bottom: .1rem;
+	margin-bottom: .15rem;
 	overflow: hidden;
 	white-space: pre-wrap;
 }
@@ -302,12 +302,12 @@ const favorited = ref(props.scene.stashes.some((sceneStash) => sceneStash.id ===
 		}
 
 		.row {
-			margin: 0 .5rem .5rem .5rem;
+			margin: 0 .5rem .45rem .5rem;
 		}
 
 		.title {
 			margin-top: .6rem;
-			margin-bottom: .6rem;
+			margin-bottom: .5rem;
 		}
 	}
 }