improve videos

files/assets/css/main.css

@@ -5369,12 +5369,6 @@ textarea {
 	margin-bottom: 0.5rem !important;
 	cursor: pointer;
 }
-video {
-	max-height: 50vh !important;
-	max-width: 100% !important;
-	margin-top: 0.5rem !important;
-	margin-bottom: 0.5rem !important;
-}
 .spotify {
 	max-height: 80px !important;
 	max-width: 100% !important;
@@ -5658,12 +5652,10 @@ lite-youtube {
 	background-size: cover;
 	cursor: pointer;
 	margin-bottom: 1.3rem !important;
-
 	display: inline-block;
-	resize: both;
-	overflow: auto;
+	overflow: hidden;
 	max-height: 70vh !important;
-	max-width: 100vw !important;
+	max-width: 90vw !important;
 	width: min(100%, 500px);
 }
 
@@ -7075,15 +7067,19 @@ div.markdown {
 .resizable {
 	resize: both;
 	display: inline-block;
-	overflow: auto;
-	max-width: 100vw !important;
-}
-.resizable > video {
-	height: 99% !important;
-	width: 99% !important;
+	overflow: hidden;
 	max-height: 70vh !important;
-	max-width: 100vw !important;
+	max-width: 90vw !important;
+}
+.resizable.yt {
+	display: block;
+}
+.resizable > * {
+	height: 95% !important;
+	width: 95% !important;
 	margin: 0 !important;
+	max-height: 65vh !important;
+	max-width: 85vw !important;
 }
 
 .user-signature video {

files/helpers/sanitize.py

@@ -95,7 +95,7 @@ def allowed_attributes(tag, name, value):
 		if name == 'preload' and value == 'none': return True
 
 	if tag == 'p':
-		if name == 'class' and value in {'mb-0','resizable','text-center'}: return True
+		if name == 'class' and value in {'mb-0','resizable','yt','text-center'}: return True
 
 	if tag == 'span':
 		if name == 'data-bs-toggle' and value == 'tooltip': return True
@@ -650,6 +650,8 @@ def sanitize(sanitized, golden=True, limit_pings=0, showmore=False, count_emojis
 
 		html = handle_youtube_links(i.group(1))
 		if html:
+			if not chat:
+				html = f'<p class="resizable yt">{html}</p>'
 			sanitized = sanitized.replace(i.group(0), html)
 
 	if '<pre>' not in sanitized and blackjack != "rules":

files/templates/default.html

@@ -74,12 +74,6 @@
 {% block mobileUserBanner %}{% endblock %}
 <div class="container">
 	<div class="row justify-content-around" id="main-content-row">
-		{% block sidebar %}
-			{% if has_sidebar and (home or p) %}
-				{% set sidebar = "sidebar_" ~ SITE_NAME ~ ".html" %}
-				{% include sidebar %}
-			{% endif %}
-		{% endblock %}
 		<div class="order-first col h-100 {% block customPadding %}{% if request.path.startswith('/@') %}user-gutters{% else %}custom-gutters{% endif %}{% endblock %}" id="main-content-col">
 			{% block desktopUserBanner %}{% endblock %}
 			{% block desktopBanner %}{% endblock %}
@@ -88,6 +82,12 @@
 			{% block content %}{% endblock %}
 			{% block pagenav %}{% endblock %}
 		</div>
+		{% block sidebar %}
+			{% if has_sidebar and (home or p) %}
+				{% set sidebar = "sidebar_" ~ SITE_NAME ~ ".html" %}
+				{% include sidebar %}
+			{% endif %}
+		{% endblock %}
 	</div>
 </div>
 {% block mobilenavbar %}{% include "mobile_navigation_bar.html" %}{% endblock %}

files/templates/post.html

@@ -110,7 +110,9 @@
 									<script defer src="{{'js/vendor/twitter.js' | asset}}"></script>
 								{% endif %}
 							{% elif p.domain in ['youtu.be','youtube.com'] and p.embed and p.embed.startswith('<lite-youtube') %}
-								{{p.embed | safe}}
+								<p class="resizable yt">
+									{{p.embed | safe}}
+								</p>
 							{% endif %}
 						{% endif %}
 

files/templates/post_listing.html

@@ -224,7 +224,7 @@
 			<audio id="video2-{{p.id}}" controls preload="none" src="{{p.realurl(v)}}"></audio>
 		</div>
 	{% elif p.is_youtube %}
-		<div id="video-{{p.id}}" class="d-none ml-md-5 mt-4">
+		<div id="video-{{p.id}}" class="d-none ml-md-5 mt-4 resizable">
 			{{p.embed | safe}}
 		</div>
 	{% endif %}