Fix leading spaces being collapsed in descriptions

Fixes #1954

7 files changed, 11 insertions, 16 deletions

diff --git a/assets/css/default.css b/assets/css/default.css
index 2cda980c..8b2b3578 100644
--- a/assets/css/default.css
+++ b/assets/css/default.css
@@ -540,7 +540,8 @@ p,
 }
 
 #descriptionWrapper {
-       max-width: 600px;
+	max-width: 600px;
+	white-space: pre-wrap;
 }
 
 /* Center the "invidious" logo on the search page */
diff --git a/src/invidious/channels/about.cr b/src/invidious/channels/about.cr
index c87c53e0..d93ee681 100644
--- a/src/invidious/channels/about.cr
+++ b/src/invidious/channels/about.cr
@@ -59,7 +59,7 @@ def get_about_info(ucid, locale)
     banner = banners.try &.[-1]?.try &.["url"].as_s?
 
     description = initdata["header"]["interactiveTabbedHeaderRenderer"]["description"]["simpleText"].as_s
-    description_html = HTML.escape(description).gsub("\n", "<br>")
+    description_html = HTML.escape(description)
 
     is_family_friendly = initdata["microformat"]["microformatDataRenderer"]["familySafe"].as_bool
     allowed_regions = initdata["microformat"]["microformatDataRenderer"]["availableCountries"].as_a.map(&.as_s)
@@ -81,7 +81,7 @@ def get_about_info(ucid, locale)
     # end
 
     description = initdata["metadata"]["channelMetadataRenderer"]?.try &.["description"]?.try &.as_s? || ""
-    description_html = HTML.escape(description).gsub("\n", "<br>")
+    description_html = HTML.escape(description)
 
     is_family_friendly = initdata["microformat"]["microformatDataRenderer"]["familySafe"].as_bool
     allowed_regions = initdata["microformat"]["microformatDataRenderer"]["availableCountries"].as_a.map(&.as_s)
diff --git a/src/invidious/comments.cr b/src/invidious/comments.cr
index 12a80bc4..5b7d63e0 100644
--- a/src/invidious/comments.cr
+++ b/src/invidious/comments.cr
@@ -550,12 +550,12 @@ end
 
 def parse_content(content : JSON::Any) : String
   content["simpleText"]?.try &.as_s.rchop('\ufeff').try { |b| HTML.escape(b) }.to_s ||
-    content["runs"]?.try &.as_a.try { |r| content_to_comment_html(r).try &.to_s } || ""
+    content["runs"]?.try &.as_a.try { |r| content_to_comment_html(r).try &.to_s.gsub("\n", "<br>") } || ""
 end
 
 def content_to_comment_html(content)
   comment_html = content.map do |run|
-    text = HTML.escape(run["text"].as_s).gsub("\n", "<br>")
+    text = HTML.escape(run["text"].as_s)
 
     if run["bold"]?
       text = "<b>#{text}</b>"
diff --git a/src/invidious/playlists.cr b/src/invidious/playlists.cr
index f37667b5..fc41ecd2 100644
--- a/src/invidious/playlists.cr
+++ b/src/invidious/playlists.cr
@@ -242,7 +242,7 @@ struct InvidiousPlaylist
   end
 
   def description_html
-    HTML.escape(self.description).gsub("\n", "<br>")
+    HTML.escape(self.description)
   end
 end
 
diff --git a/src/invidious/videos.cr b/src/invidious/videos.cr
index d4ef0900..b1c60947 100644
--- a/src/invidious/videos.cr
+++ b/src/invidious/videos.cr
@@ -945,7 +945,7 @@ def extract_video_info(video_id : String, proxy_region : String? = nil, context_
   # Description
 
   description_html = video_secondary_renderer.try &.dig?("description", "runs")
-    .try &.as_a.try { |t| content_to_comment_html(t).gsub("\n", "<br/>") }
+    .try &.as_a.try { |t| content_to_comment_html(t) }
 
   params["descriptionHtml"] = JSON::Any.new(description_html || "<p></p>")
 
diff --git a/src/invidious/views/playlist.ecr b/src/invidious/views/playlist.ecr
index 136981da..dd918404 100644
--- a/src/invidious/views/playlist.ecr
+++ b/src/invidious/views/playlist.ecr
@@ -74,9 +74,7 @@
 </div>
 
 <div class="h-box">
-    <div id="descriptionWrapper">
-        <p><%= playlist.description_html %></p>
-    </div>
+    <div id="descriptionWrapper"><%= playlist.description_html %></div>
 </div>
 
 <% if playlist.is_a?(InvidiousPlaylist) && playlist.author == user.try &.email %>
diff --git a/src/invidious/views/watch.ecr b/src/invidious/views/watch.ecr
index 52262df7..11e738ab 100644
--- a/src/invidious/views/watch.ecr
+++ b/src/invidious/views/watch.ecr
@@ -257,14 +257,10 @@ we're going to need to do it here in order to allow for translations.
 
             <div id="description-box"> <!-- Description -->
                 <% if video.description.size < 200 || params.extend_desc %>
-                    <div id="descriptionWrapper">
-                        <%= video.description_html %>
-                    </div>
+                    <div id="descriptionWrapper"><%= video.description_html %></div>
                 <% else %>
                     <input id="descexpansionbutton" type="checkbox"/>
-                    <div id="descriptionWrapper">
-                        <%= video.description_html %>
-                    </div>
+                    <div id="descriptionWrapper"><%= video.description_html %></div>
                     <label for="descexpansionbutton">
                         <a></a>
                     </label>