Improve responsive layout of missions with long mission or world names

This commit is contained in:
Björn Dahlgren 2021-10-29 19:24:33 +02:00
parent 7b6d0c6425
commit 280283c6d5
5 changed files with 10 additions and 8 deletions

View File

@ -2,7 +2,7 @@
<thead>
<tr>
<th>Mission</th>
<th>World</th>
<th class="hidden-xs hidden-sm">World</th>
<th>Size</th>
<th>Updated</th>
<th></th>

View File

@ -1,7 +1,8 @@
<td style="width: 100%;">
<td style="width: 100%; word-break: break-all;">
<a href='/api/missions/<%-encodeURI(name)%>'><%-missionName%></a>
<span class="visible-xs visible-sm"><%-worldName%></span>
</td>
<td><%-worldName%></td>
<td class="hidden-xs hidden-sm"><%-worldName%></td>
<td class="text-nowrap"><%-sizeFormatted%></td>
<td class="text-nowrap"><%-dateModified.substring(0, 10)%></td>
<td>

View File

@ -4,7 +4,7 @@
<input type="number" class="form-control workshop" name="workshop" id="workshop">
<span class="help-block">
ID can be found in the URL of Workshop i.e.
<i>https://steamcommunity.com/workshop/filedetails/?id=$id</i>
<i style="word-break: break-all;">https://steamcommunity.com/workshop/filedetails/?id=$id</i>
</span>
</div>
<button type="submit" class="btn btn-primary ladda-button" data-style="expand-left">

View File

@ -3,7 +3,7 @@
<thead>
<tr>
<th>Mission</th>
<th>World</th>
<th class="hidden-xs hidden-sm">World</th>
<th>&nbsp;</th>
</tr>
</thead>

View File

@ -1,7 +1,8 @@
<td>
<%-missionName%>
<td style="width: 100%; word-break: break-all;">
<span><%-missionName%></span>
<span class="visible-xs visible-sm"><%-worldName%></span>
</td>
<td>
<td class="hidden-xs hidden-sm">
<%-worldName%>
</td>
<td>