Claytonia/TeamspeakStats
Claytonia
/
TeamspeakStats
mirror of https://github.com/Thor77/TeamspeakStats.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Improve presentation at mobile 

- Add custom hint--medium--xs style, to make the tooltips wrap neatly
- Add meta viewport tag
This commit is contained in:
Matthew Gamble 2017-02-16 08:57:17 +11:00
parent ba8b393b76
commit 531f5c57d2
No known key found for this signature in database
GPG Key ID: B5D06189C3995B3B
2 changed files with 9 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
tsstats/templates/index.jinja2
View File

@ -6,10 +6,18 @@
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/hint.css/2.4.1/hint.min.css" integrity="sha256-7KczUWqIa/6KaIKtNfG18eilVQR4vJ4S9SSiDAplUwc=" crossorigin="anonymous">
<meta name="referrer" content="no-referrer">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style type="text/css">
body {
padding-top: 50px;
}
@media screen and (max-width: 767px) {
.hint--medium--xs:after {
white-space: normal;
line-height: 1.4em;
word-wrap: break-word;
}
}
</style>
</head>
<body>

2
tsstats/templates/stats.jinja2
View File

@ -13,7 +13,7 @@
{% for client, value in clients %}
{% set id = [headline_id, client.nick|striptags]|join('.') %}
<li id="{{ id }}" onclick="window.location = '#{{ id }}'" class="list-group-item{{ ' list-group-item-success' if client.connected else loop.cycle('" style="background-color: #eee;', '') }}">
<span class="hint--right" data-hint="{{ client.nick_history|join(', ') }}">{{ client.nick }}{{ " (" + client.identifier + ")" if debug }}</span>
<span class="hint--right hint--medium--xs" data-hint="{{ client.nick_history|join(', ') }}">{{ client.nick }}{{ " (" + client.identifier + ")" if debug }}</span>
<span class="badge"><div{% if not client.connected and headline == 'Onlinetime' %} class="hint--left" data-hint="{{ client.last_seen|frmttime }}"{% endif %}>{{ value }}</div></span>
</li>
{% endfor %}