improve tempalte

This commit is contained in:
2019-09-10 01:32:32 +03:00
parent 5ce870714c
commit 59051dee7a
15 changed files with 368 additions and 36 deletions

View File

@ -1,8 +1,9 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Best in slot</title>
{% include "style.jinja2" %}
<link href="{{ static('styles.css') }}" rel="stylesheet" type="text/css">
</head>
<body>
<h2>best in slot</h2>
@ -24,7 +25,7 @@
<input name="is_tome" id="is_tome" title="is tome" type="checkbox"/>
<input name="action" id="action" type="hidden" value="add"/>
<input name="method" id="method" type="hidden" value="post"/>
<button>add</button>
<input name="add" id="add" type="button" value="add"/>
</form>
<form action="/bis" method="post">
<select name="player" id="player" title="player">
@ -34,7 +35,7 @@
</select>
<input name="bis" id="bis" placeholder="player bis link" title="bis" type="text"/>
<input name="method" id="method" type="hidden" value="put"/>
<button>add</button>
<input name="add" id="add" type="button" value="add"/>
</form>
<table id="result">
@ -52,8 +53,11 @@
<td>{{ item.is_tome|e }}</td>
<td>
<form action="/bis" method="post">
<input name="player" id="player" type="hidden" value="{{ item.player|e }}"/>
<input name="piece" id="piece" type="hidden" value="{{ item.piece|e }}"/>
<input name="is_tome" id="is_tome" type="hidden" value="{{ item.is_tome|e }}"/>
<input name="action" id="action" type="hidden" value="remove"/>
<button>remove</button>
<input name="remove" id="remove" type="button" value="x"/>
</form>
</td>
</tr>

View File

@ -1,14 +1,17 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>FFXIV loot helper</title>
<link href="{{ static('styles.css') }}" rel="stylesheet" type="text/css">
</head>
<body>
<center>
<a href="/party" title="party"><h2>party</h2></a>
<a href="/bis" title="bis management"><h2>bis</h2></a>
<a href="/loot" title="loot management"><h2>loot</h2></a>
<a href="/suggest" title="suggest loot"><h2>suggest</h2></a>
<h2><a href="/party" title="party">party</a></h2>
<h2><a href="/bis" title="bis management">bis</a></h2>
<h2><a href="/loot" title="loot management">loot</a></h2>
<h2><a href="/suggest" title="suggest loot">suggest</a></h2>
</center>
</body>
</html>

View File

@ -1,8 +1,9 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Loot</title>
{% include "style.jinja2" %}
<link href="{{ static('styles.css') }}" rel="stylesheet" type="text/css">
</head>
<body>
<h2>Loot</h2>
@ -23,7 +24,7 @@
</select>
<input name="is_tome" id="is_tome" title="is tome" type="checkbox"/>
<input name="action" id="action" type="hidden" value="add"/>
<button>add</button>
<input name="add" id="add" type="button" value="add"/>
</form>
<table id="result">
@ -41,8 +42,11 @@
<td>{{ item.is_tome|e }}</td>
<td>
<form action="/loot" method="post">
<input name="player" id="player" type="hidden" value="{{ item.player|e }}"/>
<input name="piece" id="piece" type="hidden" value="{{ item.piece|e }}"/>
<input name="is_tome" id="is_tome" type="hidden" value="{{ item.is_tome|e }}"/>
<input name="action" id="action" type="hidden" value="remove"/>
<button>remove</button>
<input name="remove" id="remove" type="button" value="x"/>
</form>
</td>
</tr>

View File

@ -1,8 +1,9 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Suggest loot</title>
{% include "style.jinja2" %}
<link href="{{ static('styles.css') }}" rel="stylesheet" type="text/css">
</head>
<body>
<h2>suggest loot</h2>
@ -17,7 +18,7 @@
{% endfor %}
</select>
<input name="is_tome" id="is_tome" title="is tome" type="checkbox"/>
<button>suggest</button>
<input name="suggest" id="suggest" type="button" value="suggest"/>
</form>
<table id="result">
@ -25,6 +26,7 @@
<th>player</th>
<th>bis pieces looted</th>
<th>total pieces looted</th>
<th></th>
</tr>
{% for player in suggest %}
@ -32,6 +34,14 @@
<td class="include_search">{{ player.player|e }}</td>
<td>{{ player.loot_count_bis|e }}</td>
<td>{{ player.loot_count|e }}</td>
<td>
<form action="/loot" method="post">
<input name="player" id="player" type="hidden" value="{{ player.player|e }}"/>
<input name="piece" id="piece" type="hidden" value="{{ item.piece|e }}"/>
<input name="is_tome" id="is_tome" type="hidden" value="{{ item.is_tome|e }}"/>
<input name="action" id="action" type="hidden" value="remove"/>
</form>
</td>
</tr>
{% endfor %}
</table>

View File

@ -1,8 +1,9 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>Party</title>
{% include "style.jinja2" %}
<link href="{{ static('styles.css') }}" rel="stylesheet" type="text/css">
</head>
<body>
<h2>party</h2>
@ -20,7 +21,7 @@
<input name="bis" id="bis" placeholder="player bis link" title="bis" type="text"/>
<input name="priority" id="priority" placeholder="player priority" title="priority" type="number" value="0"/>
<input name="action" id="action" type="hidden" value="add"/>
<button>add</button>
<input name="add" id="add" type="button" value="add"/>
</form>
<table id="result">
@ -42,8 +43,10 @@
<td>{{ player.priority|e }}</td>
<td>
<form action="/party" method="post">
<input name="nick" id="nick" type="hidden" value="{{ player.nick|e }}"/>
<input name="job" id="job" type="hidden" value="{{ player.job|e }}"/>
<input name="action" id="action" type="hidden" value="remove"/>
<button>remove</button>
<input name="remove" id="remove" type="button" value="x"/>
</form>
</td>
</tr>

277
templates/static/styles.css Normal file
View File

@ -0,0 +1,277 @@
/* in-text images */
figure.img {
float: right;
border: 0px solid #333;
padding: 0px;
margin: 5px 0px 5px 10px;
}
figure.img img {
max-width: 100%;
height: auto;
}
figure.img figcaption {
margin: 0px;
font-size: 90%;
font-style: italic;
text-align: center;
}
h1 .octicon-link, h2 .octicon-link, h3 .octicon-link, h4 .octicon-link, h5 .octicon-link, h6 .octicon-link {
display: none;
color: #222222;
vertical-align: middle;
}
h1:hover .anchor, h2:hover .anchor, h3:hover .anchor, h4:hover .anchor, h5:hover .anchor, h6:hover .anchor{
padding-left: 8px;
margin-left: -24px;
text-decoration: none;
}
h1:hover .anchor .octicon-link, h2:hover .anchor .octicon-link, h3:hover .anchor .octicon-link, h4:hover .anchor .octicon-link, h5:hover .anchor .octicon-link, h6:hover .anchor .octicon-link {
display: inline-block;
}
body {
padding: 50px;
font: 14px/1.5 "Liberation Sans", Helvetica, Arial, sans-serif;
color: #555555;
background: #eaeaea
}
h1, h2, h3, h4, h5, h6 {
color: #222222;
margin: 0 0 20px;
}
p, ul, ol, table, pre, dl {
margin: 0 0 20px;
text-align: justify;
}
h1, h2, h3 {
line-height: 1.1;
}
h1 {
font-size: 28px;
}
h2 {
color: #393939;
}
h3, h4, h5, h6 {
color: #494949;
}
a {
color: #3399cc;
font-weight: 350;
text-decoration: none;
}
a small {
font-size: 11px;
color: #777777;
margin-top: -0.6em;
display: block;
}
.wrapper {
width: 80%;
margin: 0 auto;
}
blockquote {
border-left: 1px solid #ffffff;
margin: 0;
padding: 0 0 0 20px;
font-style: italic;
}
code, pre {
font-family: "Liberation Mono", Monaco, Bitstream Vera Sans Mono, Lucida Console, Terminal;
color: #222222;
font-size: 12px;
}
pre {
padding: 8px 15px;
border-radius: 5px;
border: 1px solid #e5e5e5;
overflow-x: auto;
overflow-y: auto;
}
input, select{
box-sizing: border-box;
}
table {
width: 100%;
border-collapse: collapse;
}
th, td {
padding: 5px 10px;
border-bottom: 1px solid #ffffff;
}
td {
text-align: justify;
}
dt {
color: #444444;
font-weight: 700;
}
th {
text-align: left;
color: #444444;
}
img {
max-width: 100%;
}
header {
width: 20%;
float: left;
position: fixed;
}
header ul {
list-style: none;
height: 40px;
padding: 0;
background: #eeeeee;
border-radius: 5px;
border: 1px solid #d2d2d2;
box-shadow: inset #fff 0 1px 0, inset rgba(0,0,0,0.03) 0 -1px 0;
width: 15%;
}
header li {
width: 8%;
float: left;
border-right: 1px solid #d2d2d2;
height: 40px;
}
header ul a {
line-height: 1;
font-size: 11px;
color: #999999;
display: block;
text-align: center;
padding-top: 6px;
height: 40px;
}
strong {
color: #222222;
font-weight: 700;
}
header ul li + li {
width: 8%;
border-left: 1px solid #ffffff;
}
header ul li + li + li {
width: 8%;
border-right: none;
}
header ul a strong {
font-size: 14px;
display: block;
color: #222222;
}
section {
width: 70%;
float: right;
padding-bottom: 50px;
}
small {
font-size: 11px;
}
hr {
border: 0;
background: #ffffff;
height: 1px;
margin: 0 0 20px;
}
footer {
width: 20%;
float: left;
position: fixed;
bottom: 50px;
}
@media print, screen and (max-width: 960px) {
div.wrapper {
width: auto;
margin: 0;
}
header, section, footer {
float: none;
position: static;
width: auto;
}
header {
padding-right: 320px;
}
section {
border: 1px solid #e5e5e5;
border-width: 1px 0;
padding: 20px 0;
margin: 0 0 20px;
}
header a small {
display: inline;
}
header ul {
position: absolute;
right: 50px;
top: 52px;
}
}
@media print, screen and (max-width: 720px) {
body {
word-wrap: break-word;
}
header {
padding: 0;
}
header ul, header p.view {
position: static;
}
pre, code {
word-wrap: normal;
}
}
@media print, screen and (max-width: 480px) {
body {
padding: 15px;
}
header ul {
display: none;
}
}
@media print {
body {
padding: 0.4in;
font-size: 12pt;
color: #444444;
}
}

View File

@ -1,6 +0,0 @@
<style>
table { border-collapse: collapse; }
table, th, td { border: 1px solid black; padding: 5px; }
input { margin: 5px; }
#error { color: #ff0000; }
</style>