wam: Some additional content and styling tweaks
* Relabeled the "Notes" column to "Translations" since that's what it really is. * Replaced the Download label with an icon and moved it to the add-on names column. * Restyled add-on version/author a bit. * Add-on type is now more or less aligned to the middle of the icon (regardless of what the cell height actually is -- there can be extra empty space below the type line if the add-on title is too long, for instance).
This commit is contained in:
Ignacio R. Morelle
parent
73a2e653b7
commit
acf5e3ec64
2 changed files with 61 additions and 38 deletions
|
|
@ -87,7 +87,7 @@ def output(path, url, data):
|
|||
w("<table class=\"tablesorter\" id=\"campaigns\">")
|
||||
w("<thead>")
|
||||
w("<tr>")
|
||||
for header in ["Type", "Icon", "Addon", "Size", "Traffic", "Date", "Notes"]:
|
||||
for header in ["Type", "Icon", "Addon", "Size", "Traffic", "Date", "Translations"]:
|
||||
w("<th>%s </th>" % header)
|
||||
w("</tr>")
|
||||
w("</thead>")
|
||||
|
|
@ -127,62 +127,67 @@ def output(path, url, data):
|
|||
type = htmlescape(v("type", "none"))
|
||||
size = float(v("size", "0"))
|
||||
name = htmlescape(v("title", "unknown"))
|
||||
w('<td class="addon-type">')
|
||||
if type == "scenario":
|
||||
w("""\
|
||||
<td>Scenario<div class="type"><b>single player scenario</b><br/>
|
||||
After install the scenario will show up in the list you get when choosing "Campaign" in the main menu. (Basically it's just a campaign with only one scenario.)</div></td>""")
|
||||
Scenario<div class="type-tooltip"><b>single player scenario</b><br/>
|
||||
After install the scenario will show up in the list you get when choosing "Campaign" in the main menu. (Basically it's just a campaign with only one scenario.)</div>""")
|
||||
elif type == "campaign":
|
||||
w("""\
|
||||
<td>Campaign<div class="type"><b>single player campaign</b><br/>
|
||||
After install the campaign will show up in the list you get when choosing "Campaign" in the main menu.</div></td>""")
|
||||
Campaign<div class="type-tooltip"><b>single player campaign</b><br/>
|
||||
After install the campaign will show up in the list you get when choosing "Campaign" in the main menu.</div>""")
|
||||
elif type == "campaign_sp_mp":
|
||||
w("""\
|
||||
<td>SP/SP Campaign<div class="type"><b>single/multi player campaign</b><br />
|
||||
After install the campaign will show up both in the list you get when choosing "Campaign" in the main menu, and in the map list in the multiplayer "Create Game" dialog.</div></td>""")
|
||||
SP/SP Campaign<div class="type-tooltip"><b>single/multi player campaign</b><br />
|
||||
After install the campaign will show up both in the list you get when choosing "Campaign" in the main menu, and in the map list in the multiplayer "Create Game" dialog.</div>""")
|
||||
elif type == "campaign_mp":
|
||||
w("""\
|
||||
<td>MP Campaign<div class="type"><b>multiplayer campaign</b><br/>
|
||||
After install the first scenario of the campaign will be available in the map list in the multiplayer "Create Game" dialog.</div></td>""")
|
||||
MP Campaign<div class="type-tooltip"><b>multiplayer campaign</b><br/>
|
||||
After install the first scenario of the campaign will be available in the map list in the multiplayer "Create Game" dialog.</div>""")
|
||||
elif type == "scenario_mp":
|
||||
w("""\
|
||||
<td>MP Scenario<div class="type"><b>multiplayer scenario</b><br/>
|
||||
After install the scenario will be available in the map list in the multiplayer "Create Game" dialog.</div></td>""")
|
||||
MP Scenario<div class="type-tooltip"><b>multiplayer scenario</b><br/>
|
||||
After install the scenario will be available in the map list in the multiplayer "Create Game" dialog.</div>""")
|
||||
elif type == "map_pack":
|
||||
w("""\
|
||||
<td>MP map-pack<div class="type"><b>multiplayer map pack</b><br/>
|
||||
After install the maps/scenarios will be available in the map list in the multiplayer "Create Game" dialog.</div></td>""")
|
||||
MP map-pack<div class="type-tooltip"><b>multiplayer map pack</b><br/>
|
||||
After install the maps/scenarios will be available in the map list in the multiplayer "Create Game" dialog.</div>""")
|
||||
elif type == "era":
|
||||
w("""\
|
||||
<td>MP era<div class="type"><b>multiplayer era</b><br/>
|
||||
After install the included era(s) will be available in the multiplayer "Create Game" dialog.</div></td>""")
|
||||
MP era<div class="type-tooltip"><b>multiplayer era</b><br/>
|
||||
After install the included era(s) will be available in the multiplayer "Create Game" dialog.</div>""")
|
||||
elif type == "faction":
|
||||
w("""\
|
||||
<td>MP faction<div class="type"><b>multiplayer faction</b><br/>
|
||||
Usually comes with an era or is dependency of another add-on.</div></td>""")
|
||||
MP faction<div class="type-tooltip"><b>multiplayer faction</b><br/>
|
||||
Usually comes with an era or is dependency of another add-on.</div>""")
|
||||
elif type == "mod_mp":
|
||||
w("""\
|
||||
<td>MP modification<div class="type"><b>multiplayer modification</b><br />
|
||||
After install the included MP gameplay modification(s) will be available in the multiplayer "Create Game" dialog.</div></td>""")
|
||||
MP modification<div class="type-tooltip"><b>multiplayer modification</b><br />
|
||||
After install the included MP gameplay modification(s) will be available in the multiplayer "Create Game" dialog.</div>""")
|
||||
elif type == "media":
|
||||
w("""\
|
||||
<td>Resources<div class="type"><b>miscellaneous content/media</b><br/>
|
||||
Unit packs, terrain packs, music packs, etc. Usually a (perhaps optional) dependency of another add-on.</div></td>""")
|
||||
else: w(('<td>%s</td>') % type)
|
||||
Resources<div class="type-tooltip"><b>miscellaneous content/media</b><br/>
|
||||
Unit packs, terrain packs, music packs, etc. Usually a (perhaps optional) dependency of another add-on.</div>""")
|
||||
else:
|
||||
w(type)
|
||||
w('</td>')
|
||||
w(('<td><img alt="%s" src="%s" width="72" height="72"/>'
|
||||
) % (icon, imgurl))
|
||||
described = htmlescape(v("description", "(no description)"))
|
||||
w('<div class="desc"><b>%s</b><pre>%s</pre></div></td>' % (
|
||||
w('<div class="desc-tooltip"><b>%s</b><pre>%s</pre></div></td>' % (
|
||||
name, described))
|
||||
w("<td><b>%s</b><br/>" % name)
|
||||
w("Version: %s<br/>" % htmlescape(v("version", "unknown")))
|
||||
w("Author: %s</td>" % htmlescape(v("author", "unknown")))
|
||||
MiB = 1024 * 1024
|
||||
w("<td><span hidden>%d</span><b>%.2f</b> MiB" % (size, size / MiB))
|
||||
w("<td><b>%s</b>" % name)
|
||||
if url:
|
||||
link = url.rstrip("/") + "/" + htmlescape(v("name")) + ".tar.bz2"
|
||||
w("<br/><a href=\"%s\">Download</a></td>" % link)
|
||||
else:
|
||||
w("</td>")
|
||||
w("""\
|
||||
<a class='addon-download' href=\"%s\">
|
||||
<i class='fa fa-fw fa-2x fa-download' aria-hidden='true'></i>
|
||||
<span class='sr-only'>Download</span>
|
||||
</a>""" % link)
|
||||
w("<br /><span class='addon-meta'><span class='addon-meta-label'>Version:</span> %s<br/>" % htmlescape(v("version", "unknown")))
|
||||
w("<span class='addon-meta-label'>Author:</span> %s</span></td>" % htmlescape(v("author", "unknown")))
|
||||
MiB = 1024 * 1024
|
||||
w("<td><span hidden>%d</span><b>%.2f</b> MiB</td>" % (size, size / MiB))
|
||||
downloads = int(v("downloads", "0"))
|
||||
w("<td><b>%d</b> down<br/>" % (downloads))
|
||||
w("%s up</td>" % htmlescape(v("uploads", "unknown")))
|
||||
|
|
|
|||
|
|
@ -18,8 +18,8 @@ table#campaigns td img {
|
|||
float: left;
|
||||
}
|
||||
|
||||
div.type,
|
||||
div.desc {
|
||||
div.type-tooltip,
|
||||
div.desc-tooltip {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
|
@ -27,12 +27,12 @@ tbody td {
|
|||
position: relative;
|
||||
}
|
||||
|
||||
td:hover div.type,
|
||||
td:hover div.desc {
|
||||
td:hover div.type-tooltip,
|
||||
td:hover div.desc-tooltip {
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 2em;
|
||||
top: 100%;
|
||||
width: 16em;
|
||||
padding: 0.3em 0.6em;
|
||||
z-index: 1;
|
||||
|
|
@ -43,11 +43,11 @@ td:hover div.desc {
|
|||
border-radius: 4px;
|
||||
}
|
||||
|
||||
td:hover div.desc {
|
||||
td:hover div.desc-tooltip {
|
||||
width: 28em;
|
||||
}
|
||||
|
||||
div.desc pre {
|
||||
div.desc-tooltip pre {
|
||||
border: none;
|
||||
background: transparent;
|
||||
white-space: pre-wrap;
|
||||
|
|
@ -95,3 +95,21 @@ table.tablesorter thead tr .headerSortDown {
|
|||
background-image: url(desc.gif);
|
||||
background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2222%22%20height%3D%2216%22%3E%3Cpath%20d%3D%22m%2015.502%2C11.002%20-5%2C-5.001%20-5%2C5.001%20z%22%20fill%3D%22%23333333%22%2F%3E%3C%2Fsvg%3E');
|
||||
}
|
||||
|
||||
.addon-type {
|
||||
padding-top: 24px; /* a little bit more than 25% image height (72px) */
|
||||
}
|
||||
|
||||
.addon-meta {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
|
||||
.addon-meta-label {
|
||||
color: #724f2e; /* $wui-border-dark */
|
||||
}
|
||||
|
||||
.addon-download {
|
||||
display: inline-block;
|
||||
float: right;
|
||||
margin: 0 0 0.9em 0.9em;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue