Make the "Details" screen fit better on mobile screens.

This commit is contained in:
Pēteris Caune 2019-11-05 09:53:22 +02:00
parent 7904908625
commit 05855c1c69
No known key found for this signature in database
GPG Key ID: E28D7679E9A9EDE2
3 changed files with 11 additions and 6 deletions

View File

@ -34,6 +34,10 @@
display: inline;
}
#how-to-ping code {
overflow-wrap: break-word;
}
#details-schedule th {
padding-top: 4px;
}
@ -82,7 +86,7 @@
}
#downtimes table {
width: 350px;
max-width: 350px;
}
#downtimes tr:first-child td, #downtimes tr:first-child th {
@ -104,7 +108,6 @@
padding: 32px;
}
ul.checkmarks {
padding-left: 20px;
list-style: none;

View File

@ -64,7 +64,7 @@
{% endif %}
</div>
<div class="details-block">
<div id="how-to-ping" class="details-block">
<h2>How To Ping</h2>
<div>
<p>Keep this check up by making HTTP requests to this URL:</p>
@ -220,7 +220,9 @@
data-toggle="modal"
data-target="#transfer-modal"
data-url="{% url 'hc-transfer' check.code %}"
class="btn btn-sm btn-default">Transfer to Another Project&hellip;</button>
class="btn btn-sm btn-default">
Transfer<span class="hidden-sm hidden-xs"> to Another Project</span>&hellip;
</button>
&nbsp;
<button
id="details-remove-check"
@ -235,7 +237,7 @@
<div id="events" class="col-sm-7">
<h2>
Log
<small>Click on individual items for details</small>
<small class="hidden-xs">Click on individual items for details</small>
<div id="format-switcher" class="btn-group pull-right" data-toggle="buttons">
<label class="btn btn-default btn-xs" data-format="UTC">
<input type="radio" name="date-format">

View File

@ -92,7 +92,7 @@
</p>
{% else %}
<div class="alert no-events">
You will see a live-updating log of received pings here. <br />
You will see a <span class="hidden-xs">live-updating</span> log of received pings here. <br />
This check has not received any pings yet.
</div>
{% endif %}