Minor tweaks and cleanup on group_hdri, group_texture and texture templates

src/styles/_project.sass

@@ -781,7 +781,7 @@ $node-preview-max-height-lg: 700px
 			filter: none
 
 
-section.node-row
+.node-row
 	display: flex
 	width: 100%
 	flex: row
@@ -799,19 +799,20 @@ section.node-row
 		background-color: white
 		position: relative
 
-		&:nth-child(even), &:last-child
+		&:last-child,
+		&:nth-child(even)
 			border-right: none
 
 		&:last-child
 			border-bottom: none
 
 	&.texture-info
-		padding: 10px 20px
 		color: $color-text-dark-secondary
-		position: relative
+		list-style-type: none
-		z-index: 1
+		margin: 0
+		padding: 10px 20px
 
-		span
+		li
 			&:not(:first-child)
 				padding-left: 15px
 
@@ -820,6 +821,11 @@ section.node-row
 				top: -1px
 				right: 2px
 
+			&.status
+				margin-left: auto
+
+			&.pending
+				color: $color-danger
 
 	section.node-preview.texture
 		overflow: hidden
@@ -935,26 +941,24 @@ section.node-row
 				text-transform: uppercase
 
 section.node-preview
-	overflow: hidden
-
-	iframe
-		width: 100%
-
-	min-height: 200px
-	flex: 1
-	max-height: 500px
-	background-color: black
-	display: flex
-	justify-content: center
-	align-items: center
-
-	cursor: zoom-in
-
 	+media-md
 		max-height: $node-preview-max-height-md
 	+media-lg
 		max-height: $node-preview-max-height-lg
 
+	align-items: center
+	background-color: black
+	color: $color-text-light-primary
+	display: flex
+	flex: 1
+	justify-content: center
+	max-height: 500px
+	min-height: 200px
+	overflow: hidden
+
+	iframe
+		width: 100%
+
 	img
 		display: block
 		max-height: $node-preview-max-height-lg
@@ -969,6 +973,9 @@ section.node-preview
 		+media-lg
 			max-height: $node-preview-max-height-lg
 
+	&.image
+		cursor: zoom-in
+
 	&.video
 		background-color: black
 		position: relative
@@ -1038,9 +1045,13 @@ section.node-preview
 			object-fit: cover
 			width: 100%
 
-
+section.node-preview-forbidden
-	&.image.node-preview-blur
+	align-items: center
+	background-color: $color-background-nav
+	color: $color-text-light
 	cursor: default
+	display: flex
+	justify-content: center
 	min-height: 400px
 	position: relative
 
@@ -1050,10 +1061,29 @@ section.node-preview
 		max-width: initial
 		filter: blur(30px)
 		object-fit: cover
+		opacity: .5
 		position: absolute
 		top: -60px
 		width: 130%
+		z-index: 0
 
+	> div
+		font-size: 1.4em
+		position: relative
+		z-index: 1
+
+	span
+		display: block
+
+	a
+		color: $color-text-light
+
+		&.btn
+			border-color: white
+			color: white
+
+	hr
+		opacity: .5
 
 section.node-details-container
 	background-color: white
@@ -1085,25 +1115,6 @@ section.node-preview.group
 			width: 100%
 			max-width: 100%
 
-		.node-title-details
-			margin-left: auto
-			line-height: 1em
-
-			& .date
-				display: inline-block
-				margin-right: 10px
-				color: $color-text-dark-secondary
-
-			& .status
-				display: inline-block
-				font-size: .9em
-				text-transform: capitalize
-				color: $color-text-dark-primary
-				padding: 5px 15px
-				border: thin solid $color-text-dark-hint
-				border-radius: 3px
-				cursor: default
-
 	.node-details-meta-actions
 		margin-left: auto
 
@@ -1121,170 +1132,6 @@ section.node-preview.group
 		.node-details-title
 			padding: 10px 20px 0 20px
 
-		ul.node-details-meta-list
-			display: flex
-			align-items: center
-
-			list-style-type: none
-			margin: 0
-			padding: 0
-
-			+media-xs
-				font-size: .9em
-				width: 100%
-				max-width: 100%
-
-			> li
-				margin: 0
-				padding: 0
-				line-height: 1em
-				float: left
-
-				& a.btn
-					padding: 4px 12px 5px 12px
-					margin: 0
-
-				&.date
-					color: $color-text-dark-secondary
-					padding-left: 5px
-					margin-left: 5px
-
-					&:before
-						color: $color-text-dark-secondary
-						position: relative
-						content: '·'
-						left: -10px
-						font-weight: 500
-
-					span /* (updated x mins ago) */
-						color: $color-text-dark-hint
-						margin-left: 3px
-						font-size: .9em
-						text-transform: lowercase
-
-				&.author
-					color: $color-text-dark-primary
-
-				&.status
-					margin-right: 10px
-					font-size: .9em
-					text-transform: capitalize
-					color: $color-text-dark-secondary
-					font-weight: 300
-					padding: 5px 15px
-					border: thin solid $color-text-dark-hint
-					border-radius: 3px
-					cursor: default
-
-				&.access
-					color: $color-text-dark-primary
-					cursor: default
-					opacity: .5
-					white-space: nowrap
-
-					&:hover
-						opacity: 1
-
-					&.public
-						border-color: $color-success
-						color: $color-success
-						padding: 0
-						i
-							font-size: 1.2em
-							position: relative
-							top: 1px
-
-						span
-							display: inline-block
-
-				&.type
-					text-transform: uppercase
-					padding: 0 5px 0 15px
-					cursor: default
-					font-weight: 400
-					color: $color-text-dark-hint
-
-					+media-xs
-						display: none
-
-					/* .blend files are special snowflakes */
-					span.blend
-						display: inline-block
-						padding: 0 35px 0 0
-						font-size: 1.2em
-						color: $color-text-dark-secondary
-
-				&.access+li.node-details-meta-list-item.video.download,
-				&.access+.tooltip+li.node-details-meta-list-item.video.download
-					margin-left: 10px
-
-				&.length
-					padding: 0 5px 0 15px
-					cursor: default
-					font-weight: 400
-					color: $color-text-dark-hint
-					white-space: nowrap
-
-				&.license
-					color: $color-text-dark-secondary
-
-					i
-						color: $color-text-dark-primary
-						font-size: 1.4em
-						position: relative
-						bottom: -2px
-						left: -5px
-
-				/* Download button */
-				&.download
-					align-self: flex-end
-					padding: 0 0 0 10px
-
-					/* Actual button */
-					button
-						+button($color-primary, 3px)
-						position: relative
-
-						padding:
-							left: 20px
-							right: 20px
-
-						font-size: .9em
-
-						i
-							margin-right: 0
-
-						/* Tweaks for specific icons */
-						i.icon-dropdown-menu
-							padding-left: 10px
-
-						&.disabled
-							border-color: $color-text-dark-hint
-							color: $color-text-dark-hint
-							+stripes(rgba($color-text-dark-hint, .1), rgba($color-text-dark-hint, .2), -45deg, 28px)
-
-					/* Videos have dropdown caret, so paddit 5px less */
-					&.video.download
-						button
-							padding-right: 10px
-
-					&.file.download
-						button
-							+button($color-primary, 3px, true)
-							padding:
-								left: 15px
-								right: 15px
-
-							i
-								margin-right: 0
-
-					&.texture.download
-						width: 100%
-
-					&.open
-						button
-							box-shadow: none
-
 .node-details-description
 	+node-details-description
 	padding-left: 20px

src/templates/nodes/custom/group_hdri/view_embed.pug

@@ -4,11 +4,6 @@
 	.texture-title#node-title
 		| {{node.name}}
 
-	| {% if node.picture %}
-	.texture-backdrop(
-		style="background-image: url({{ node.picture.thumbnail('m', api=api) }})")
-	| {% endif %}
-
 	| {% if node.description %}
 	section.node-row
 		.node-details-description

src/templates/nodes/custom/group_texture/view_embed.pug

@@ -4,11 +4,6 @@
 	.texture-title#node-title
 		| {{node.name}}
 
-	| {% if node.picture %}
-	.texture-backdrop(
-		style="background-image: url({{ node.picture.thumbnail('m', api=api) }})")
-	| {% endif %}
-
 	| {% if node.description %}
 	section.node-row
 		.node-details-description

src/templates/nodes/custom/texture/view_embed.pug

@@ -33,24 +33,23 @@
 		span Public
 	| {% endif %}
 
-	section.node-row.texture-info
+	ul.node-row.texture-info
 		| {% if node.properties.files %}
-		span.texture-info-files
+		li
 			i.pi-texture
 			| {{ node.properties.files|length }} map{% if node.properties.files|length != 1 %}s{% endif %}
 		| {% endif %}
-		span.texture-info-seamless
+
+		li
 			i.pi-puzzle
 			| {% if not node.properties.is_tileable %}Not {% endif %}Seamless
-		| {% if node.has_method('PUT') %}
+
 		| {# Display publishing status only to editors #}
-		span.texture-info-status
+		| {% if node.has_method('PUT') %}
-			| {% if node.properties.status == 'published' %}
+		li.status(
-			i.pi-laugh
+			class="{{ node.properties.status }}",
-			| {% else %}
+			title="Status")
-			i.pi-displeased
+			| Status: #[strong {{ node.properties.status | undertitle }}]
-			| {% endif %}
-			| {{ node.properties.status }}
 		| {% endif %}
 
 	| {% for f in node.properties.files %}