Change description-box from flex to block

I also make minor changes to the surroundings so that the same layout
and functionality as before is preserved.
This commit is contained in:
Cadence Ember 2021-06-24 21:05:06 +12:00 committed by Mostafa Ahangarha
parent 4a4867deeb
commit 7ec93825b6
2 changed files with 6 additions and 11 deletions

View File

@ -492,11 +492,6 @@ hr {
} }
/* Description Expansion Styling*/ /* Description Expansion Styling*/
#description-box {
display: flex;
flex-direction: column;
}
#descexpansionbutton { #descexpansionbutton {
display: none display: none
} }
@ -511,7 +506,7 @@ hr {
height: 100%; height: 100%;
} }
#descexpansionbutton + label { #descexpansionbutton ~ label {
order: 1; order: 1;
margin-top: 20px; margin-top: 20px;
} }

View File

@ -30,11 +30,11 @@
we're going to need to do it here in order to allow for translations. we're going to need to do it here in order to allow for translations.
--> -->
<style> <style>
#descexpansionbutton + label > a::after { #descexpansionbutton ~ label > a::after {
content: "<%= translate(locale, "Show more") %>" content: "<%= translate(locale, "Show more") %>"
} }
#descexpansionbutton:checked + label > a::after { #descexpansionbutton:checked ~ label > a::after {
content: "<%= translate(locale, "Show less") %>" content: "<%= translate(locale, "Show less") %>"
} }
</style> </style>
@ -249,12 +249,12 @@ we're going to need to do it here in order to allow for translations.
<%= video.description_html %> <%= video.description_html %>
<% else %> <% else %>
<input id="descexpansionbutton" type="checkbox"/> <input id="descexpansionbutton" type="checkbox"/>
<label for="descexpansionbutton" style="order: 1;">
<a></a>
</label>
<div id="descriptionWrapper"> <div id="descriptionWrapper">
<%= video.description_html %> <%= video.description_html %>
</div> </div>
<label for="descexpansionbutton">
<a></a>
</label>
<% end %> <% end %>
</div> </div>