Improved profile margins and summary editor.

pages/entities/+Page.vue

@@ -96,6 +96,7 @@ const popularNetworks = [
 	'newsensations',
 	'pervcity',
 	'pornpros',
+	'pornworld',
 	'private',
 	'realitykings',
 	'teamskeet',

pages/users/@username/+Page.vue

@@ -18,7 +18,6 @@
 			<nav
 				v-if="profile.id === user?.id"
 				class="domains"
-				@click="confirmUnsaved"
 			>
 				<a
 					:href="`/user/${profile.username}/stashes`"
@@ -33,19 +32,18 @@
 				>Alerts</a>
 
 				<a
-					:href="`/user/${profile.username}/summaries`"
+					:href="`/user/${profile.username}/templates`"
 					class="domain nolink"
-					:class="{ active: domain === 'summaries' }"
-				>Summaries</a>
+					:class="{ active: domain === 'templates' }"
+				>Templates</a>
 			</nav>
 
 			<Stashes v-if="domain === 'stashes'" />
 			<Alerts v-if="domain === 'alerts' && profile.id === user?.id" />
 
 			<Summaries
-				v-if="domain === 'summaries' && profile.id === user?.id"
+				v-if="domain === 'templates' && profile.id === user?.id"
 				:release="mockupRelease"
-				@changed="(changed) => summaryChanged = changed"
 			/>
 		</div>
 	</div>
@@ -64,8 +62,6 @@ const domain = pageContext.routeParams.domain;
 const user = pageContext.user;
 const profile = ref(pageContext.pageProps.profile);
 
-const summaryChanged = ref(false);
-
 const mockupRelease = {
 	id: 1,
 	title: 'Nut For Human Consumption',
@@ -97,12 +93,6 @@ const mockupRelease = {
 		name: 'Traxxx',
 	},
 };
-
-function confirmUnsaved(event) {
-	if (summaryChanged.value && !confirm('You have unchanged changes in your summary editor, are you sure you want to leave the page?')) { // eslint-disable-line no-restricted-globals, no-alert
-		event.preventDefault();
-	}
-}
 </script>
 
 <style>
@@ -111,7 +101,7 @@ function confirmUnsaved(event) {
 		display: flex;
 		align-items: center;
 		justify-content: space-between;
-		padding: .5rem .5rem .5rem .5rem;
+		padding: .5rem 1rem;
 
 		.button {
 			margin-left: 1rem;
@@ -125,9 +115,9 @@ function confirmUnsaved(event) {
 	}
 }
 
-@media(--small-30) {
+@media(--small-20) {
 	.profile-section .section-header {
-		padding: .5rem .5rem .5rem .5rem;
+		padding: .5rem;
 	}
 }
 </style>
@@ -145,7 +135,7 @@ function confirmUnsaved(event) {
 	flex-direction: column;
 	width: 1200px;
 	max-width: 100%;
-	margin: 0 1rem;
+	margin: 0 .5rem;
 }
 
 .profile-header {
@@ -193,6 +183,7 @@ function confirmUnsaved(event) {
 	gap: .5rem;
 	padding: .5rem 0;
 	margin-top: .25rem;
+	overflow-x: auto;
 }
 
 .domain {
@@ -209,11 +200,36 @@ function confirmUnsaved(event) {
 	}
 }
 
-@media(--small-30) {
-	.profile {
-		margin: 0 .5rem;
+@media(--compact) {
+	.domains {
+		padding: .5rem 1rem;
 	}
 
+	.profile {
+		margin: 0;
+	}
+
+	.profile-header {
+		border-radius: 0;
+	}
+}
+
+@media(--small-20) {
+	.profile-header {
+		padding: .5rem;
+	}
+
+	.domains {
+		justify-content: center;
+		padding: .5rem .5rem;
+	}
+
+	.age .icon {
+		display: none;
+	}
+}
+
+@media(--small-30) {
 	.age .icon {
 		display: none;
 	}