268 lines
7.2 KiB
Plaintext
268 lines
7.2 KiB
Plaintext
|
|
{% import "characters/view_character_macros" as macros %}
|
|
{% extends "base" %}
|
|
|
|
{% block content %}
|
|
<style type="text/css">
|
|
body {
|
|
font-family: Liberation Sans, Arial;
|
|
}
|
|
|
|
#basics .flex-container {
|
|
display: flex;
|
|
flex-flow: row wrap;
|
|
}
|
|
|
|
.basics-row {
|
|
display: block;
|
|
}
|
|
|
|
.basics-entry {
|
|
display: flex;
|
|
border: 1px solid gray;
|
|
margin-left: -1px;
|
|
margin-top: -1px;
|
|
}
|
|
|
|
.basics-entry label {
|
|
display: inline;
|
|
width: 5em;
|
|
text-align: right;
|
|
vertical-align: text-bottom;
|
|
padding: 8px;
|
|
margin: 0;
|
|
}
|
|
|
|
.basics-entry span {
|
|
width: 15em;
|
|
overflow: hidden;
|
|
padding: 8px;
|
|
border: none;
|
|
background-color: lightgray;
|
|
margin: 0;
|
|
}
|
|
|
|
#attributes .flex-container {
|
|
display: flex;
|
|
flex-flow: row wrap;
|
|
}
|
|
|
|
#attributes .attributes-section {
|
|
border: 1px solid gray;
|
|
margin-left: -1px;
|
|
margin-top: -1px;
|
|
}
|
|
|
|
.attribute {
|
|
display: flex;
|
|
}
|
|
|
|
.attribute label {
|
|
width: 10em;
|
|
display: inline;
|
|
text-align: right;
|
|
vertical-align: text-bottom;
|
|
padding: 8px;
|
|
margin: 0;
|
|
}
|
|
|
|
.attribute span {
|
|
width: 2em;
|
|
overflow: hidden;
|
|
padding: 8px;
|
|
border: none;
|
|
background-color: lightgray;
|
|
margin: 0;
|
|
}
|
|
|
|
#skills {
|
|
|
|
}
|
|
|
|
#skills .flex-container {
|
|
display: flex;
|
|
flex-flow: row wrap;
|
|
}
|
|
|
|
#skills .skills-section {
|
|
border: 1px solid gray;
|
|
margin-top: -1px;
|
|
margin-left: -1px;
|
|
}
|
|
|
|
.skill {
|
|
display: flex;
|
|
}
|
|
|
|
.skill label {
|
|
width: 10em;
|
|
text-align: right;
|
|
vertical-align: text-bottom;
|
|
padding: 8px;
|
|
margin: 0;
|
|
}
|
|
|
|
.skill span {
|
|
width: 2em;
|
|
overflow: hidden;
|
|
padding: 8px;
|
|
border: none;
|
|
background-color: lightgray;
|
|
margin: 0;
|
|
}
|
|
|
|
#merits, #items {
|
|
padding: 4px;
|
|
display: inline-flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
#merit-list, #item-list {
|
|
display: inline-flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.merit, .item {
|
|
display: flex;
|
|
border: 1px solid gray;
|
|
margin-top: -1px;
|
|
}
|
|
|
|
.merit span, .item span {
|
|
width: 3em;
|
|
text-align: left;
|
|
padding: 8px;
|
|
margin: 0;
|
|
}
|
|
|
|
.merit .merit-name, .item .item-name {
|
|
width: 10em;
|
|
white-space: nowrap;
|
|
overflow: auto;
|
|
padding: 0;
|
|
margin: 8px;
|
|
border: none;
|
|
border: 0px solid gray;
|
|
border-bottom-width: 1px;
|
|
}
|
|
|
|
.merit .merit-dots {
|
|
max-width: 4em;
|
|
padding: 8px;
|
|
border: none;
|
|
background-color: lightgray;
|
|
margin: 0;
|
|
}
|
|
</style>
|
|
|
|
<div>
|
|
<div id="basics">
|
|
<h1>
|
|
<span id="characterName" name="characterName">{{name}}</span>
|
|
</h1>
|
|
|
|
<div class="links">
|
|
<a href="/">Home</a> |
|
|
<a href="/characters/{{username}}/{{id}}/edit">Edit Character</a> |
|
|
<a href="/characters/{{username}}/{{id}}/delete">Delete Character</a>
|
|
</div>
|
|
|
|
<h2>Basics</h2>
|
|
<div>System: {{data_type}}</div>
|
|
|
|
<div class="flex-container">
|
|
<div class="basics-row">
|
|
<div class="basics-entry">
|
|
<label for="gender">Gender:</label>
|
|
<span id="gender" name="gender">{{sheet.gender}}</span>
|
|
</div>
|
|
|
|
<div class="basics-entry">
|
|
<label for="age">Age:</label>
|
|
<span id="age" name="age">{{sheet.age}}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="basics-row">
|
|
<div class="basics-entry">
|
|
<label for="concept">Concept:</label>
|
|
<span id="concept" name="concept">{{sheet.concept}}</span>
|
|
</div>
|
|
|
|
<div class="basics-entry">
|
|
<label for="chronicle">Chronicle:</label>
|
|
<span id="chronicle" name="chronicle">{{sheet.chronicle}}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div id="attributes">
|
|
<h2>Attributes</h2>
|
|
<div class="flex-container">
|
|
<div class="attributes-section" id="mentalAttributes">
|
|
{{ macros::attribute(name="Intelligence", value=sheet.intelligence) }}
|
|
{{ macros::attribute(name="Wits", value=sheet.wits) }}
|
|
{{ macros::attribute(name="Resolve", value=sheet.resolve) }}
|
|
</div>
|
|
|
|
<div class="attributes-section" id="physicalAttributes">
|
|
{{ macros::attribute(name="Strength", value=sheet.strength) }}
|
|
{{ macros::attribute(name="Dexterity", value=sheet.dexterity) }}
|
|
{{ macros::attribute(name="Stamina", value=sheet.stamina) }}
|
|
</div>
|
|
|
|
<div class="attributes-section" id="socicalAttributes">
|
|
{{ macros::attribute(name="Presence", value=sheet.presence) }}
|
|
{{ macros::attribute(name="Manipulation", value=sheet.manipulation) }}
|
|
{{ macros::attribute(name="Composure", value=sheet.composure) }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="skills">
|
|
<h2>Skills</h2>
|
|
<div class="flex-container">
|
|
<div class="skills-section" id="mentalSkills">
|
|
{% for skill_name, skill in sheet.mentalSkills %}
|
|
{{ macros::skill(name=skill_name, value=skill.dots) }}
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<div class="skills-section" id="physicalSkills">
|
|
{% for skill_name, skill in sheet.physicalSkills %}
|
|
{{ macros::skill(name=skill_name, value=skill.dots) }}
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<div class="skills-section" id="socialSkills">
|
|
{% for skill_name, skill in sheet.socialSkills %}
|
|
{{ macros::skill(name=skill_name, value=skill.dots) }}
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="merits">
|
|
<h2>Merits</h2>
|
|
<div id="merit-list">
|
|
{% for merit in sheet.merits %}
|
|
{{ macros::merit(name=merit.name, value=merit.dots) }}
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
|
|
<div id="items">
|
|
<h2>Items</h2>
|
|
<div id="item-list">
|
|
{% for item in sheet.items %}
|
|
<div class="item">
|
|
<span class="item-name">{{item.name}}</span>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock content %}
|