This makes sure the entire printed sheet is rendered before the browser attempts to print it, solving all manner of errors
80 lines
3.2 KiB
HTML
80 lines
3.2 KiB
HTML
<template name="characterSheet">
|
|
<div class="fit layout vertical character-sheet">
|
|
<app-header fixed effects="waterfall">
|
|
<app-toolbar class="medium-tall {{colorClass}}" style="z-index: 2;">
|
|
<div top-item class="layout horizontal center">
|
|
<paper-icon-button icon="menu" drawer-toggle></paper-icon-button>
|
|
<div class="flex character-name">
|
|
{{name}}
|
|
</div>
|
|
{{#if canEditCharacter _id}}
|
|
{{> colorDropdown}}
|
|
<paper-menu-button class="character-menu" horizontal-align="right">
|
|
<paper-icon-button icon="more-vert" class="dropdown-trigger"></paper-icon-button>
|
|
<paper-menu class="dropdown-content black87">
|
|
<paper-icon-item id="deleteCharacter">
|
|
<iron-icon icon="delete" item-icon></iron-icon>
|
|
Delete
|
|
</paper-icon-item>
|
|
<paper-icon-item id="shareCharacter">
|
|
<iron-icon icon="social:share" item-icon></iron-icon>
|
|
Share
|
|
</paper-icon-item>
|
|
<a href={{printUrl}}>
|
|
<paper-icon-item id="printButton">
|
|
<iron-icon icon="print" item-icon></iron-icon>
|
|
Print
|
|
</paper-icon-item>
|
|
</a>
|
|
<paper-icon-item id="characterSettings">
|
|
<iron-icon icon="settings" item-icon></iron-icon>
|
|
Settings
|
|
</paper-icon-item>
|
|
<paper-icon-item id="characterExport">
|
|
<iron-icon icon="content-copy" item-icon></iron-icon>
|
|
Export to Improved Initiative
|
|
</paper-icon-item>
|
|
</paper-menu>
|
|
</paper-menu-button>
|
|
{{else}}
|
|
<paper-menu-button class="character-menu" horizontal-align="right">
|
|
<paper-icon-button icon="more-vert" class="dropdown-trigger"></paper-icon-button>
|
|
<paper-menu class="dropdown-content black87">
|
|
<paper-icon-item id="unshareCharacter">
|
|
<iron-icon icon="delete" item-icon></iron-icon>
|
|
Unshare
|
|
</paper-icon-item>
|
|
</paper-menu>
|
|
</paper-menu-button>
|
|
{{/if}}
|
|
</div>
|
|
<div bottom-item>
|
|
<paper-tabs id="characterSheetTabs" selected={{selectedTab}} class="{{colorClass}}">
|
|
<paper-tab name="stats" class="{{#if shouldBounce 0}}bounce{{/if}}">Stats</paper-tab>
|
|
<paper-tab name="features" class="{{#if shouldBounce 1}}bounce{{/if}}">Features</paper-tab>
|
|
<paper-tab name="inventory">Inventory</paper-tab>
|
|
{{#unless hideSpellcasting}}
|
|
<paper-tab name="spells">Spells</paper-tab>
|
|
{{/unless}}
|
|
<paper-tab name="persona">Persona</paper-tab>
|
|
<paper-tab name="journal" class="{{#if shouldBounce 5}}bounce{{/if}}">Journal</paper-tab>
|
|
</paper-tabs>
|
|
</div>
|
|
</app-toolbar>
|
|
{{#if newUserExperience}}{{> newUserStepper}}{{/if}}
|
|
</app-header>
|
|
<div class="flex" style="position: relative;">
|
|
<iron-pages id="tabPages" class="fit" selected={{selectedTab}}>
|
|
<div name="stats" class="tab-page fit">{{> stats}}</div>
|
|
<div name="features" class="tab-page fit">{{> features}}</div>
|
|
<div name="inventory" class="tab-page fit">{{> inventory}}</div>
|
|
{{#unless hideSpellcasting}}
|
|
<div name="spells" class="tab-page fit">{{> spells}}</div>
|
|
{{/unless}}
|
|
<div name="persona" class="tab-page fit">{{> persona}}</div>
|
|
<div name="journal" class="tab-page fit">{{> journal}}</div>
|
|
</iron-pages>
|
|
</div>
|
|
</div>
|
|
</template>
|