1.167.8

assets/components/actors/tile.vue

@@ -286,4 +286,10 @@ export default {
 .age-then {
     color: var(--lighten);
 }
+
+@media(max-width: $breakpoint) {
+	.name {
+		font-size: .9rem;
+	}
+}
 </style>

assets/components/releases/details.vue

@@ -154,6 +154,7 @@ export default {
 .site {
     display: inline-flex;
     align-items: center;
+	max-width: 50%;
     padding: .25rem 0;
     font-size: 0;
 }
@@ -167,7 +168,7 @@ export default {
 }
 
 .logo-site {
-    height: 2.5rem;
+    height: 2.25rem;
     max-width: 15rem;
 	margin: .25rem 0;
     object-fit: contain;
@@ -205,6 +206,10 @@ export default {
         display: none;
     }
 
+	.logo-site {
+		height: 1.5rem;
+	}
+
 	.logo-site {
 		width: 100%;
 	}

assets/components/releases/release.vue

@@ -51,11 +51,6 @@
 				</h2>
 			</div>
 
-			<Tags
-				v-if="release.tags.length > 0"
-				:tags="release.tags"
-			/>
-
 			<div class="row associations">
 				<ul class="actors nolist">
 					<li
@@ -67,6 +62,11 @@
 				</ul>
 			</div>
 
+			<Tags
+				v-if="release.tags.length > 0"
+				:tags="release.tags"
+			/>
+
 			<div
 				v-if="release.movies && release.movies.length > 0"
 				class="row"
@@ -457,7 +457,7 @@ export default {
 	}
 
     .actors {
-        grid-template-columns: repeat(auto-fill, minmax(8rem, 1fr));
+        grid-template-columns: repeat(auto-fill, minmax(7rem, 1fr));
     }
 }
 </style>

assets/components/releases/tags.vue

@@ -24,25 +24,29 @@
 			v-if="overflowing && !expanded"
 			class="tags-more"
 			@click="expanded = true"
-		>More tags</button>
+		>more tags</button>
 
 		<button
 			v-if="expanded"
 			class="tags-more"
 			@click="expanded = false"
-		>Fewer tags</button>
+		>fewer tags</button>
 	</div>
 </template>
 
 <script>
+import { nextTick } from 'vue';
+
 function updateOverflowing() {
-	const containerBoundaries = this.$refs.tags.getBoundingClientRect();
+	nextTick(() => {
-	const containerBottom = containerBoundaries.top + containerBoundaries.height;
+		const containerBoundaries = this.$refs.tags.getBoundingClientRect();
+		const containerBottom = containerBoundaries.top + containerBoundaries.height;
 
-	this.overflowing = Array.from(this.$refs.tags.querySelectorAll('.tag')).some((tag) => {
+		this.overflowing = Array.from(this.$refs.tags.querySelectorAll('.tag')).some((tag) => {
-		const tagBoundaries = tag.getBoundingClientRect();
+			const tagBoundaries = tag.getBoundingClientRect();
 
-		return tagBoundaries.top > containerBottom;
+			return tagBoundaries.top > containerBottom;
+		});
 	});
 }
 
@@ -68,6 +72,9 @@ export default {
 			expanded: false,
 		};
 	},
+	watch: {
+		expanded: updateOverflowing,
+	},
 	mounted,
 	beforeUnmount,
 	methods: {
@@ -88,6 +95,7 @@ export default {
 .tags {
 	max-height: 4.6rem;
 	padding: 2px 1rem 0 1rem;
+	text-align: left;
 	overflow: hidden;
 
 	&.expanded {
@@ -111,19 +119,18 @@ export default {
 }
 
 .tags-more {
-	width: 100%;
+	background: var(--shadow-touch);
-	background: none;
 	padding: .5rem 1rem;
-	border: solid 1px var(--shadow-hint);
+	border: none;
-	border-left: none;
+	margin: .25rem 0 .5rem 1rem;
-	border-right: none;
-	margin: .25rem 0 .5rem 0;
 	color: var(--shadow);
-	font-size: .9rem;
+	font-size: .8rem;
+	font-weight: bold;
 
 	&:hover {
-		cursor: pointer;
+		background: var(--shadow-hint);
 		color: var(--shadow-strong);
+		cursor: pointer;
 	}
 }
 </style>

assets/css/_theme.scss

@@ -61,6 +61,7 @@ $breakpoint4: 1500px;
     --shadow-modest: rgba(0, 0, 0, .3);
     --shadow-weak: rgba(0, 0, 0, .2);
     --shadow-hint: rgba(0, 0, 0, .1);
+    --shadow-touch: rgba(0, 0, 0, .05);
 
     --highlight: rgba(255, 255, 255, .5);
     --highlight-extreme: rgba(255, 255, 255, .9);
@@ -92,6 +93,7 @@ $breakpoint4: 1500px;
     --shadow-modest: rgba(255, 255, 255, .3);
     --shadow-weak: rgba(255, 255, 255, .2);
     --shadow-hint: rgba(255, 255, 255, .075);
+    --shadow-touch: rgba(255, 255, 255, .05);
 
     --highlight: rgba(0, 0, 0, .5);
     --highlight-extreme: rgba(0, 0, 0, .9);

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "traxxx",
-    "version": "1.167.7",
+    "version": "1.167.8",
     "lockfileVersion": 1,
     "requires": true,
     "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
     "name": "traxxx",
-    "version": "1.167.7",
+    "version": "1.167.8",
     "description": "All the latest porn releases in one place",
     "main": "src/app.js",
     "scripts": {