Implement a bit more of the view character template.
This commit is contained in:
parent
0a128a7067
commit
3ba7917455
|
|
@ -1,15 +1,148 @@
|
|||
|
||||
{% import "characters/view_character_macros" as macros %}
|
||||
{% extends "base" %}
|
||||
|
||||
{% block content %}
|
||||
<h1>Core Sheet</h1>
|
||||
<div>
|
||||
<h1>Character {{name}}</h1>
|
||||
<h3>User: {{username}}</h3>
|
||||
<p>System: {{data_type}}</h3>
|
||||
<p>Strength: {{sheet.strength}}</p>
|
||||
</div>
|
||||
<style type="text/css">
|
||||
body {
|
||||
font-family: Liberation Sans, Arial;
|
||||
}
|
||||
|
||||
<div>
|
||||
<a href="/characters/{{username}}/{{id}}/edit">Edit Character</a>
|
||||
</div>
|
||||
#attributes {
|
||||
padding: 4px;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
#attributes .attributes-section {
|
||||
border: 1px solid gray;
|
||||
border-collapse: collapse;
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
.attribute {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.attribute label {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
clear: left;
|
||||
width: 10em;
|
||||
text-align: right;
|
||||
vertical-align: text-bottom;
|
||||
padding: 8px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.attribute div.value {
|
||||
min-width: 1.5em;
|
||||
max-width: 4em;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
float: left;
|
||||
padding: 8px;
|
||||
border: none;
|
||||
background-color: lightgray;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#skills {
|
||||
padding: 4px;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
#skills .skills-section {
|
||||
border: 1px solid gray;
|
||||
border-collapse: collapse;
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
.skill {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.skill label {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
clear: left;
|
||||
width: 10em;
|
||||
text-align: right;
|
||||
vertical-align: text-bottom;
|
||||
padding: 8px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.skill div.value {
|
||||
min-width: 1.5em;
|
||||
max-width: 4em;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
float: left;
|
||||
padding: 8px;
|
||||
border: none;
|
||||
background-color: lightgray;
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
<h1>Core Sheet</h1>
|
||||
<div>
|
||||
<h1>Character {{name}}</h1>
|
||||
<h3>User: {{username}}</h3>
|
||||
<p>System: {{data_type}}</h3>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h1>Core Sheet</h1>
|
||||
<div>
|
||||
<h1>Name: <input type="text" value="{{name}}" /></h1>
|
||||
<p>System: {{data_type}}</p>
|
||||
<div id="attributes">
|
||||
<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 id="skills">
|
||||
<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>
|
||||
<a href="/characters/{{username}}/{{id}}/edit">Edit Character</a>
|
||||
</div>
|
||||
{% endblock content %}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,13 @@
|
|||
{% macro attribute(name, value) %}
|
||||
<div class="attribute">
|
||||
<label for="{{name}}">{{name}}:</label>
|
||||
<div class="value" id="{{name}}">{{value}}</div>
|
||||
</div>
|
||||
{% endmacro attribute %}
|
||||
|
||||
{% macro skill(name, value) %}
|
||||
<div class="skill">
|
||||
<label for="{{name}}">{{name}}:</label>
|
||||
<div class="value" id="{{name}}">{{value}}</div>
|
||||
</div>
|
||||
{% endmacro skill %}
|
||||
|
|
@ -6,57 +6,58 @@ const path = require('path');
|
|||
const root = path.resolve(__dirname, '..', '..');
|
||||
|
||||
function packPage(page, chunks) {
|
||||
if (!chunks) chunks = [];
|
||||
return new HtmlWebpackPlugin({
|
||||
template: `${root}/src/templates/${page}`,
|
||||
filename: `${root}/static/templates/${page}`,
|
||||
publicPath: '/scripts/dist',
|
||||
scriptLoading: 'defer',
|
||||
chunks: chunks,
|
||||
inject: false,
|
||||
minify: false
|
||||
});
|
||||
if (!chunks) chunks = [];
|
||||
return new HtmlWebpackPlugin({
|
||||
template: `${root}/src/templates/${page}`,
|
||||
filename: `${root}/static/templates/${page}`,
|
||||
publicPath: '/scripts/dist',
|
||||
scriptLoading: 'defer',
|
||||
chunks: chunks,
|
||||
inject: false,
|
||||
minify: false
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
entry: {
|
||||
edit_character: "./src/characters/edit.ts",
|
||||
},
|
||||
optimization: {
|
||||
runtimeChunk: "single",
|
||||
splitChunks: {
|
||||
chunks: 'all',
|
||||
entry: {
|
||||
edit_character: "./src/characters/edit.ts",
|
||||
},
|
||||
},
|
||||
mode: "development",
|
||||
output: {
|
||||
path: path.resolve(__dirname, 'dist'),
|
||||
filename: '[name].bundle.js'
|
||||
},
|
||||
devtool: 'inline-source-map',
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.ts$/,
|
||||
include: /src|_proto/,
|
||||
exclude: /node_modules/,
|
||||
loader: "ts-loader"
|
||||
}
|
||||
optimization: {
|
||||
runtimeChunk: "single",
|
||||
splitChunks: {
|
||||
chunks: 'all',
|
||||
},
|
||||
},
|
||||
mode: "development",
|
||||
output: {
|
||||
path: path.resolve(__dirname, 'dist'),
|
||||
filename: '[name].bundle.js'
|
||||
},
|
||||
devtool: 'inline-source-map',
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.ts$/,
|
||||
include: /src|_proto/,
|
||||
exclude: /node_modules/,
|
||||
loader: "ts-loader"
|
||||
}
|
||||
]
|
||||
},
|
||||
resolve: {
|
||||
extensions: [".ts", ".js"]
|
||||
},
|
||||
plugins: [
|
||||
new CleanWebpackPlugin(),
|
||||
packPage('login.html.tera'),
|
||||
packPage('base.html.tera'),
|
||||
packPage('error.html.tera'),
|
||||
packPage('index.html.tera'),
|
||||
packPage('registration.html.tera'),
|
||||
packPage('characters/edit_character.html.tera', ['edit_character']),
|
||||
packPage('characters/edit_character_macros.html.tera'),
|
||||
packPage('characters/new_character.html.tera'),
|
||||
packPage('characters/view_character.html.tera'),
|
||||
packPage('characters/view_character_macros.html.tera'),
|
||||
]
|
||||
},
|
||||
resolve: {
|
||||
extensions: [".ts", ".js"]
|
||||
},
|
||||
plugins: [
|
||||
new CleanWebpackPlugin(),
|
||||
packPage('login.html.tera'),
|
||||
packPage('base.html.tera'),
|
||||
packPage('error.html.tera'),
|
||||
packPage('index.html.tera'),
|
||||
packPage('registration.html.tera'),
|
||||
packPage('characters/edit_character.html.tera', ['edit_character']),
|
||||
packPage('characters/edit_character_macros.html.tera'),
|
||||
packPage('characters/new_character.html.tera'),
|
||||
packPage('characters/view_character.html.tera')
|
||||
]
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in New Issue