Implemented negative filters in back-end, added basic fixed filters settings dialog.

pages/scene/+Page.vue

@@ -24,11 +24,7 @@
 						v-else-if="scene.poster"
 						class="poster-container"
 					>
-						<a
-							:href="getPath(scene.poster)"
-							target="_blank"
-							class="poster-link"
-						>
+						<div class="poster-link">
 							<img
 								:src="getPath(scene.poster, 'thumbnail')"
 								:style="{ 'background-image': getPath(scene.poster, 'lazy') }"
@@ -36,7 +32,7 @@
 								:height="scene.poster.height"
 								class="poster"
 							>
-						</a>
+						</div>
 					</div>
 
 					<div
@@ -49,11 +45,7 @@
 							:key="`photo-${photo.id}`"
 							class="photo-container"
 						>
-							<a
-								:href="getPath(photo)"
-								target="_blank"
-								class="photo-link"
-							>
+							<div class="photo-link">
 								<img
 									:src="getPath(photo, 'thumbnail')"
 									:style="{ 'background-image': getPath(photo, 'lazy') }"
@@ -61,7 +53,7 @@
 									:height="photo.height"
 									class="photo"
 								>
-							</a>
+							</div>
 						</div>
 					</div>
 				</div>
@@ -99,10 +91,21 @@
 					</span>
 				</div>
 
-				<time
-					:datetime="scene.effectiveDate.toISOString()"
-					class="date ellipsis"
-				>{{ formatDate(scene.effectiveDate, 'MMMM d, y') }}</time>
+				<Link
+					:href="scene.url"
+					target="_blank"
+					class="date nolink"
+				>
+					<time
+						:datetime="scene.effectiveDate.toISOString()"
+						class="ellipsis compact-hide"
+					>{{ formatDate(scene.effectiveDate, 'MMMM d, y') }}</time>
+
+					<time
+						:datetime="scene.effectiveDate.toISOString()"
+						class="ellipsis compact-show"
+					>{{ formatDate(scene.effectiveDate, 'MMM d, y') }}</time>
+				</Link>
 			</div>
 
 			<div class="header">
@@ -526,6 +529,10 @@ const poster = computed(() => {
 	margin-left: .25rem;
 }
 
+.compact-show {
+	display: none;
+}
+
 @media(--small) {
 	.content {
 		margin: 0;
@@ -606,6 +613,20 @@ const poster = computed(() => {
 	}
 }
 
+@media(--small-50) {
+	.compact-show {
+		display: flex;
+	}
+
+	.compact-hide {
+		display: none;
+	}
+
+	.date {
+		font-size: .9rem;
+	}
+}
+
 @media(--small-60) {
 	.actors {
 		grid-template-columns: repeat(auto-fill, minmax(6.5rem, 1fr));