Fixed pagination and scene poster overflowing page on small screens. Fixed back reload interfering with tag page hashes.

components/header/header.vue

@@ -80,7 +80,10 @@
 				:triggers="['click']"
 				:prevent-overflow="true"
 			>
-				<div class="userpanel">
+				<div
+					class="userpanel"
+					:class="{ searching: searchFocused }"
+				>
 					<img
 						:src="user.avatar"
 						class="avatar"
@@ -130,6 +133,7 @@
 			<div
 				v-else-if="allowLogin"
 				class="userpanel"
+				:class="{ searching: searchFocused }"
 			>
 				<a
 					:href="`/login?r=${encodeURIComponent(currentPath)}`"
@@ -224,6 +228,7 @@ async function logout() {
 	height: 100%;
 	display: flex;
 	align-items: center;
+	margin-left: .5rem;
 }
 
 .search {
@@ -353,16 +358,6 @@ async function logout() {
 }
 
 @media(--small) {
-	.search .input {
-		width: 12rem;
-	}
-}
-
-@media(--small-10) {
-	.nav-list {
-		display: none;
-	}
-
 	.header-section {
 		flex-grow: 1;
 	}
@@ -376,12 +371,9 @@ async function logout() {
 		flex-grow: 1;
 	}
 
-	.logo {
-		margin-right: .75rem;
-	}
-
-	.userpanel {
-		padding-left: 1rem;
+	.userpanel.searching {
+		padding: 0 0 0 1rem;
+		width: 0;
 	}
 
 	.login-text {
@@ -392,4 +384,18 @@ async function logout() {
 		display: block;
 	}
 }
+
+@media(--small-10) {
+	.nav-list {
+		display: none;
+	}
+
+	.logo {
+		margin-right: .75rem;
+	}
+
+	.userpanel {
+		padding-left: 1rem;
+	}
+}
 </style>