Update code to reflect 'read more' btn name change

2 files changed, 10 insertions, 10 deletions

diff --git a/assets/css/default.css b/assets/css/default.css
index 919f13ec..b6f2d9cc 100644
--- a/assets/css/default.css
+++ b/assets/css/default.css
@@ -670,27 +670,27 @@ hr {
   margin: auto 0 auto 0;
 }
 
-/* Description Expandsion Styling*/
+/* Description Expansion Styling*/
 #description-box {
   display: flex;
   flex-direction: column;
 }
 
-#readmorebutton {
+#descexpansionbutton {
   display: none
 }
 
-#readmorebutton ~ div {
+#descexpansionbutton ~ div {
   overflow: hidden;
   height: 8.3em;
 }
 
-#readmorebutton:checked ~ div {
+#descexpansionbutton:checked ~ div {
   overflow: unset;
   height: 100%;
 }
 
-#readmorebutton + label {
+#descexpansionbutton + label {
   order: 1;
   margin-top: 20px;
 }
diff --git a/src/invidious/views/watch.ecr b/src/invidious/views/watch.ecr
index f9df159e..08f23876 100644
--- a/src/invidious/views/watch.ecr
+++ b/src/invidious/views/watch.ecr
@@ -26,15 +26,15 @@
 <%= rendered "components/player_sources" %>
 <title><%= HTML.escape(video.title) %> - Invidious</title>
 
-<!-- Description expandsion also updates the Read More button to Read Less so
+<!-- Description expansion also updates the 'Show more' button to 'Show less' so
 we're going to need to do it here in order to allow for translations.
  -->
 <style>
-#readmorebutton + label > a::after {
+#descexpansionbutton + label > a::after {
     content: "<%= translate(locale, "Show more") %>"
 }
 
-#readmorebutton:checked + label > a::after {
+#descexpansionbutton:checked + label > a::after {
     content: "<%= translate(locale, "Show less") %>"
 }
 </style>
@@ -244,8 +244,8 @@ we're going to need to do it here in order to allow for translations.
                 <% if video.description.size < 200 || params.extend_desc %>
                     <%= video.description_html %>
                 <% else %>
-                    <input id="readmorebutton" type="checkbox"/>
-                    <label for="readmorebutton" style="order: 1;" class="simulated_a">
+                    <input id="descexpansionbutton" type="checkbox"/>
+                    <label for="descexpansionbutton" style="order: 1;" class="simulated_a">
                         <a></a>
                     </label>
                     <div id="descriptionWrapper">