image expand changes

gulp/res/css/style.css

@@ -433,7 +433,7 @@ td, th {
 
 .post-files {
 	float: left;
-	margin-right: 1.5em;
+	margin: 0 .5em .5em .5em;
 	display: flex;
 	flex-flow: row wrap;
 	align-items: start;
@@ -447,15 +447,10 @@ a, video, img, input, summary {
 	overflow: hidden;
 }
 
-.post-file:nth-child(1) {
-	margin-left: 4px;
-}
-
 .post-file {
 	display: flex;
 	flex-direction: column;
-	padding: 2px 0;
-	margin-right: 10px;
+	padding: .5em .5em 0 0;
 	align-items: center;
 }
 
@@ -478,6 +473,10 @@ a, video, img, input, summary {
 	max-width: 100%;
 }
 
+video, img {
+    max-height: 90vw;
+}
+
 .post-file-src {
 	justify-content: center;
 	display: flex;
@@ -591,10 +590,6 @@ textarea {
 	display:block;
 }
 
-.post-info a {
-	
-}
-
 .post-container.op .post-info {
 	background: none;
 	border: none;
@@ -728,6 +723,10 @@ hr {
 	color: var(--hr);
 }
 
+hr + .thread {
+	margin-top: -5px;
+}
+
 @media only screen and (max-width: 600px) {
 
 	.close {

gulp/res/js/expand.js

@@ -4,7 +4,7 @@ window.addEventListener('DOMContentLoaded', (event) => {
 	var thumbs = document.getElementsByClassName('post-file-src');
 
 	var toggle = function(thumb, exp) {
-		const close = exp.nextSibling;
+		const close = exp.previousSibling.innerText === 'Close video' ? exp.previousSibling : null;
 		if (thumb.style.display === 'none') {
 			thumb.style.display = '';
 			exp.style.display = 'none';
@@ -26,9 +26,17 @@ window.addEventListener('DOMContentLoaded', (event) => {
 		e.preventDefault();
 		const fileLink = this.firstChild;
 		const fileSrc = fileLink.href;
-		const type = this.previousSibling.lastChild.innerText.replace(/[\(\)]/g, '').split(', ')[0].trim();
+		const type = this.dataset.type;
 		const thumbElement = fileLink.firstChild;
-		let expandedElement = thumbElement.nextSibling;
+		const next = thumbElement.nextSibling;
+		let expandedElement;
+		if (next) {
+			if (next.innerText === 'Close video') {
+				expandedElement = next.nextSibling;
+			} else {
+				expandedElement = next;
+			}
+		}
 		if (!expandedElement && thumbElement.style.opacity !== '0.5') {
 			fileLink.style.minWidth = fileLink.offsetWidth+'px';
 			fileLink.style.minHeight = fileLink.offsetHeight+'px';
@@ -57,7 +65,7 @@ window.addEventListener('DOMContentLoaded', (event) => {
 					source = document.createElement('source');
 					expandedElement.appendChild(source);
 					fileLink.appendChild(expandedElement);
-					fileLink.appendChild(close);
+					fileLink.insertBefore(close, expandedElement);
 					toggle(thumbElement, expandedElement);
 					break;
 				deault: