Small style and event fixes
This commit is contained in:
Stefan Zermatten
@@ -67,6 +67,12 @@ paper-fab.keyboard-focus {
|
||||
background: #630c05;
|
||||
}
|
||||
|
||||
.red-button:not([disabled]) {
|
||||
background: #d23f31;
|
||||
color: #fff;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
/*Buttons*/
|
||||
paper-button {
|
||||
color: #000;
|
||||
|
||||
@@ -1,41 +0,0 @@
|
||||
.detailContent {
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
html /deep/ .red-button:not([disabled]) {
|
||||
background: #d23f31;
|
||||
color: #fff;
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
#globalDetail {
|
||||
background-color: white;
|
||||
width: 624px;
|
||||
height: 500px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#globalDetail app-toolbar {
|
||||
border-radius: 2px 2px 0 0;
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
#globalDetail app-toolbar {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
#globalDetail {
|
||||
top: 0 !important;
|
||||
left: 0 !important;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.not-selected [hero] {
|
||||
visibility: hidden;
|
||||
}
|
||||
@@ -29,7 +29,7 @@
|
||||
{{/if}}
|
||||
</div>
|
||||
<div bottom-item>
|
||||
<paper-tabs id="characterSheetTabs" selected={{selectedTab}} class="{{colorClass}}" attr-for-selected="name">
|
||||
<paper-tabs id="characterSheetTabs" selected={{selectedTab}} class="{{colorClass}}">
|
||||
<paper-tab name="stats">Stats</paper-tab>
|
||||
<paper-tab name="features">Features</paper-tab>
|
||||
<paper-tab name="inventory">Inventory</paper-tab>
|
||||
@@ -43,7 +43,7 @@
|
||||
</app-toolbar>
|
||||
</app-header>
|
||||
<div>
|
||||
<neon-animated-pages id="tabPages" selected={{selectedTab}} transitions="slide-from-right" attr-for-selected="name">
|
||||
<neon-animated-pages id="tabPages" selected={{selectedTab}}>
|
||||
<div name="stats">{{> stats}}</div>
|
||||
<div name="features">{{> features}}</div>
|
||||
<div name="inventory">{{> inventory}}</div>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
Template.characterSheet.onRendered(function() {
|
||||
//default to the first tab
|
||||
Session.setDefault(this.data._id + ".selectedTab", "stats");
|
||||
//default to the stats tab
|
||||
Session.setDefault(this.data._id + ".selectedTab", "0");
|
||||
//watch this character and make sure their encumbrance is updated
|
||||
trackEncumbranceConditions(this.data._id, this);
|
||||
});
|
||||
|
||||
@@ -1,22 +1,15 @@
|
||||
html /deep/ .operationDropDown {
|
||||
.effectEdit .operationDropDown {
|
||||
width: 152px;
|
||||
}
|
||||
|
||||
html /deep/ .statDropDown {
|
||||
.effectEdit .statDropDown {
|
||||
width: 152px;
|
||||
}
|
||||
|
||||
html /deep/ .damageMultiplierDropDown {
|
||||
.effectEdit .damageMultiplierDropDown {
|
||||
width: 152px;
|
||||
}
|
||||
|
||||
html /deep/ .effectEdit paper-input {
|
||||
position: relative;
|
||||
bottom: 5px;
|
||||
}
|
||||
|
||||
html /deep/ .effectEdit {
|
||||
height: 64px;
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
.effectEdit .deleteEffect {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@@ -1,36 +1,30 @@
|
||||
<template name="effectEdit">
|
||||
<div class="effectEdit" layout horizontal center>
|
||||
<paper-dropdown-menu class="statDropDown"
|
||||
label="Stat">
|
||||
<paper-dropdown layered
|
||||
class="dropdown">
|
||||
<core-menu class="menu statMenu" selected={{stat}}>
|
||||
{{#each statGroups}}
|
||||
<div style="font-weight: bold;
|
||||
margin-top: 16px;">{{this}}</div>
|
||||
{{#each stats}}
|
||||
<paper-item name={{stat}}>{{name}}</paper-item>
|
||||
{{/each}}
|
||||
{{/each}}
|
||||
</core-menu>
|
||||
</paper-dropdown>
|
||||
<div class="effectEdit layout horizontal center">
|
||||
<paper-dropdown-menu label="Stat" class="statDropDown" dynamic-align>
|
||||
<dicecloud-selector class="statMenu dropdown-content" selected={{stat}} selectable="paper-item">
|
||||
{{#each statGroups}}
|
||||
<div style="font-weight: bold; margin-top: 16px; padding-left: 8px;">
|
||||
{{this}}
|
||||
</div>
|
||||
{{#each stats}}
|
||||
<paper-item name={{stat}}>{{name}}</paper-item>
|
||||
{{/each}}
|
||||
{{/each}}
|
||||
</dicecloud-selector>
|
||||
</paper-dropdown-menu>
|
||||
{{#if operations}}
|
||||
<paper-dropdown-menu class="operationDropDown"
|
||||
label="Operation">
|
||||
<paper-dropdown layered class="dropdown">
|
||||
<core-menu class="menu operationMenu" selected={{operation}}>
|
||||
{{#each operations}}
|
||||
<paper-item name={{operation}}>{{name}}</paper-item>
|
||||
{{/each}}
|
||||
</core-menu>
|
||||
</paper-dropdown>
|
||||
<paper-dropdown-menu class="operationDropDown" label="Operation" dynamic-align>
|
||||
<dicecloud-selector class="dropdown-content operationMenu" selected={{operation}}>
|
||||
{{#each operations}}
|
||||
<paper-item name={{operation}}>{{name}}</paper-item>
|
||||
{{/each}}
|
||||
</dicecloud-selector>
|
||||
</paper-dropdown-menu>
|
||||
{{/if}}
|
||||
{{#if effectValueTemplate}}
|
||||
{{> Template.dynamic template=effectValueTemplate}}
|
||||
{{else}}
|
||||
<div flex></div>
|
||||
<div class="flex"></div>
|
||||
{{/if}}
|
||||
<paper-icon-button class="deleteEffect"
|
||||
icon="delete">
|
||||
@@ -40,27 +34,22 @@
|
||||
</template>
|
||||
|
||||
<template name="regularEffectValue">
|
||||
<paper-input class="effectValueInput"
|
||||
label="Value"
|
||||
floatinglabel
|
||||
value={{effectValue}}
|
||||
flex
|
||||
<paper-input class="effectValueInput flex"
|
||||
label="Value"
|
||||
floatinglabel
|
||||
value={{effectValue}}
|
||||
style="flex-basis: 100px;">
|
||||
</paper-input>
|
||||
</template>
|
||||
|
||||
<template name="multiplierEffectValue">
|
||||
<paper-dropdown-menu class="damageMultiplierDropDown"
|
||||
label="Damage Multiplier">
|
||||
<paper-dropdown layered
|
||||
class="dropdown">
|
||||
<core-menu class="menu multiplierMenu"
|
||||
<paper-dropdown-menu class="damageMultiplierDropDown" label="Damage Multiplier" dynamic-align>
|
||||
<dicecloud-selector class="menu multiplierMenu dropdown-content"
|
||||
selected={{value}}>
|
||||
<paper-item name="0.5">Resistance</paper-item>
|
||||
<paper-item name="2">Vulnerability</paper-item>
|
||||
<paper-item name="0">Immunity</paper-item>
|
||||
</core-menu>
|
||||
</paper-dropdown>
|
||||
</dicecloud-selector>
|
||||
</paper-dropdown-menu>
|
||||
<div flex></div>
|
||||
<div class="flex"></div>
|
||||
</template>
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
//TODO add dexterity armor
|
||||
// jscs:disable maximumLineLength
|
||||
var stats = [
|
||||
{stat: "strength", name: "Strength", group: "Ability Scores"},
|
||||
{stat: "dexterity", name: "Dexterity", group: "Ability Scores"},
|
||||
@@ -68,9 +69,11 @@ var stats = [
|
||||
{stat: "psychicMultiplier", name: "Psychic", group: "Weakness/Resistance"},
|
||||
{stat: "radiantMultiplier", name: "Radiant", group: "Weakness/Resistance"},
|
||||
{stat: "slashingMultiplier", name: "Slashing", group: "Weakness/Resistance"},
|
||||
{stat: "thunderMultiplier", name: "Thunder", group: "Weakness/Resistance"}
|
||||
{stat: "thunderMultiplier", name: "Thunder", group: "Weakness/Resistance"},
|
||||
];
|
||||
|
||||
// jscs:enable maximumLineLength
|
||||
|
||||
var statsDict = _.indexBy(stats, "stat");
|
||||
var statGroups = _.groupBy(stats, "group");
|
||||
var statGroupNames = _.keys(statGroups);
|
||||
@@ -80,7 +83,7 @@ var attributeOperations = [
|
||||
{name: "Add", operation: "add"},
|
||||
{name: "Multiply", operation: "mul"},
|
||||
{name: "Min", operation: "min"},
|
||||
{name: "Max", operation: "max"}
|
||||
{name: "Max", operation: "max"},
|
||||
];
|
||||
var skillOperations = [
|
||||
{name: "Add", operation: "add"},
|
||||
@@ -91,7 +94,7 @@ var skillOperations = [
|
||||
{name: "Disadvantage", operation: "disadvantage"},
|
||||
{name: "Passive Bonus", operation: "passiveAdd"},
|
||||
{name: "Automatically Fail", operation: "fail"},
|
||||
{name: "Conditional Benefit", operation: "conditional"}
|
||||
{name: "Conditional Benefit", operation: "conditional"},
|
||||
];
|
||||
|
||||
Template.effectEdit.helpers({
|
||||
@@ -125,7 +128,7 @@ Template.effectEdit.helpers({
|
||||
|
||||
//default template
|
||||
return "regularEffectValue";
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
Template.regularEffectValue.helpers({
|
||||
@@ -135,33 +138,30 @@ Template.regularEffectValue.helpers({
|
||||
});
|
||||
|
||||
Template.effectEdit.events({
|
||||
"tap .deleteEffect": function(event){
|
||||
"click .deleteEffect": function(event){
|
||||
Effects.softRemoveNode(this._id);
|
||||
GlobalUI.deletedToast(this._id, "Effects", "Effect");
|
||||
},
|
||||
"core-select .statDropDown": function(event){
|
||||
"iron-select .statDropDown": function(event){
|
||||
var detail = event.originalEvent.detail;
|
||||
if (!detail.isSelected) return;
|
||||
var statName = detail.item.getAttribute("name");
|
||||
if (statName == this.stat) return;
|
||||
Effects.update(this._id, {$set: {stat: statName}});
|
||||
},
|
||||
"core-select .operationDropDown": function(event){
|
||||
"iron-select .operationDropDown": function(event){
|
||||
var detail = event.originalEvent.detail;
|
||||
if (!detail.isSelected) return;
|
||||
var opName = detail.item.getAttribute("name");
|
||||
if (opName == this.operation) return;
|
||||
Effects.update(this._id, {$set: {operation: opName}});
|
||||
},
|
||||
"core-select .damageMultiplierDropDown": function(event){
|
||||
"iron-select .damageMultiplierDropDown": function(event){
|
||||
var detail = event.originalEvent.detail;
|
||||
if (!detail.isSelected) return;
|
||||
var value = +detail.item.getAttribute("name");
|
||||
if (value == this.value) return;
|
||||
Effects.update(this._id, {$set: {
|
||||
value: value,
|
||||
calculation: "",
|
||||
operation: "mul"
|
||||
operation: "mul",
|
||||
}});
|
||||
},
|
||||
"change .effectValueInput": function(event){
|
||||
@@ -174,5 +174,5 @@ Template.effectEdit.events({
|
||||
if (this.calculation === value) return;
|
||||
Effects.update(this._id, {$set: {value: "", calculation: value}});
|
||||
}
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
@@ -1,13 +1,12 @@
|
||||
<!--needs to be given charId, parentId and parentCollection-->
|
||||
<template name="effectsEditList">
|
||||
{{#if effects.count}}
|
||||
<hr class="vertMargin">
|
||||
<div id="effects">
|
||||
<h2>Effects</h2>
|
||||
<div class="paper-font-title">Effects</div>
|
||||
{{#each effects}}
|
||||
{{>effectEdit}}
|
||||
{{/each}}
|
||||
</div>
|
||||
{{/if}}
|
||||
<paper-button id="addEffectButton" class="red-button" raised>Add Effect</paper-button>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
@@ -1,9 +1,8 @@
|
||||
<!--needs to be given charId, (parentId or stat) and type-->
|
||||
<template name="effectsViewList">
|
||||
{{#if effects.count}}
|
||||
<hr style="margin: 16px 0 16px 0;">
|
||||
<div class="effects">
|
||||
<h2 class="spaceAfter">Effects</h2>
|
||||
<div class="spaceAfter paper-font-title">Effects</div>
|
||||
<table class="wideTable">
|
||||
{{#each effects}}
|
||||
{{>effectView}}
|
||||
|
||||
@@ -2,10 +2,6 @@
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.features {
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.featureCardTop {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
@@ -1,23 +1,19 @@
|
||||
<template name="proficiencyEdit">
|
||||
<div layout horizontal around-justified>
|
||||
<paper-dropdown-menu class="typeDropDown" label="Stat Group" flex>
|
||||
<paper-dropdown layered class="dropdown">
|
||||
<core-menu class="menu typeMenu" selected={{type}}>
|
||||
{{#each proficiencyTypes}}
|
||||
<div class="layout horizontal around-justified">
|
||||
<paper-dropdown-menu class="typeDropDown flex" label="Stat Group">
|
||||
<dicecloud-selector class="typeMenu dropdown-content" selected={{type}}>
|
||||
{{#each proficiencyTypes}}
|
||||
<paper-item class="statGroupSelect" name={{type}}>{{name}}</paper-item>
|
||||
{{/each}}
|
||||
</core-menu>
|
||||
</paper-dropdown>
|
||||
{{/each}}
|
||||
</dicecloud-selector>
|
||||
</paper-dropdown-menu>
|
||||
{{> UI.dynamic template=nameInputTemplate}}
|
||||
<paper-dropdown-menu class="valueDropDown" label="Proficiency" flex>
|
||||
<paper-dropdown layered class="dropdown">
|
||||
<core-menu class="menu valueMenu" selected={{value}}>
|
||||
<paper-item name="1">Proficient</paper-item>
|
||||
<paper-item name="0.5">Half Prof. Bonus</paper-item>
|
||||
<paper-item name="2">Double Prof. Bonus</paper-item>
|
||||
</core-menu>
|
||||
</paper-dropdown>
|
||||
<paper-dropdown-menu class="valueDropDown flex" label="Proficiency">
|
||||
<dicecloud-selector class="valueMenu dropdown-content" selected={{value}}>
|
||||
<paper-item name="1">Proficient</paper-item>
|
||||
<paper-item name="0.5">Half Prof. Bonus</paper-item>
|
||||
<paper-item name="2">Double Prof. Bonus</paper-item>
|
||||
</dicecloud-selector>
|
||||
</paper-dropdown-menu>
|
||||
<paper-icon-button class="deleteProficiency"
|
||||
icon="delete">
|
||||
@@ -26,14 +22,12 @@
|
||||
</template>
|
||||
|
||||
<template name="nameDropdown">
|
||||
<paper-dropdown-menu class="nameDropDown sideMargin" label="Proficiency" flex>
|
||||
<paper-dropdown layered class="dropdown">
|
||||
<core-menu class="menu nameMenu" selected={{name}}>
|
||||
{{#each nameDropdownItems}}
|
||||
<paper-item name={{stat}}>{{name}}</paper-item>
|
||||
{{/each}}
|
||||
</core-menu>
|
||||
</paper-dropdown>
|
||||
<paper-dropdown-menu class="nameDropDown sideMargin flex" label="Proficiency">
|
||||
<dicecloud-selector class="nameMenu dropdown-content" selected={{name}}>
|
||||
{{#each nameDropdownItems}}
|
||||
<paper-item name={{stat}}>{{name}}</paper-item>
|
||||
{{/each}}
|
||||
</dicecloud-selector>
|
||||
</paper-dropdown-menu>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -51,27 +51,24 @@ Template.proficiencyEdit.helpers({
|
||||
});
|
||||
|
||||
Template.proficiencyEdit.events({
|
||||
"tap .deleteProficiency": function(event){
|
||||
"click .deleteProficiency": function(event){
|
||||
Proficiencies.softRemoveNode(this._id);
|
||||
GlobalUI.deletedToast(this._id, "Proficiencies", "Proficiency");
|
||||
},
|
||||
"core-select .typeDropDown": function(event){
|
||||
"iron-select .typeDropDown": function(event){
|
||||
var detail = event.originalEvent.detail;
|
||||
if (!detail.isSelected) return;
|
||||
var type = detail.item.getAttribute("name");
|
||||
if (type == this.type) return;
|
||||
Proficiencies.update(this._id, {$set: {type: type}});
|
||||
},
|
||||
"core-select .valueDropDown": function(event){
|
||||
"iron-select .valueDropDown": function(event){
|
||||
var detail = event.originalEvent.detail;
|
||||
if (!detail.isSelected) return;
|
||||
var value = +detail.item.getAttribute("name");
|
||||
if (value == this.value) return;
|
||||
Proficiencies.update(this._id, {$set: {value: value}});
|
||||
},
|
||||
"core-select .nameDropDown": function(event){
|
||||
"iron-select .nameDropDown": function(event){
|
||||
var detail = event.originalEvent.detail;
|
||||
if (!detail.isSelected) return;
|
||||
var name = detail.item.getAttribute("name");
|
||||
if (name == this.name) return;
|
||||
Proficiencies.update(this._id, {$set: {name: name}});
|
||||
|
||||
@@ -1,10 +1,8 @@
|
||||
<!--needs to be given charId, parentId and parentCollection-->
|
||||
<template name="proficiencyEditList">
|
||||
{{#if proficiencies.count}}
|
||||
<hr class="vertMargin">
|
||||
|
||||
<div id="proficiencies">
|
||||
<h2>Proficiencies</h2>
|
||||
<div class="paper-font-title">Proficiencies</div>
|
||||
{{#each proficiencies}}
|
||||
{{>proficiencyEdit}}
|
||||
{{/each}}
|
||||
@@ -15,4 +13,4 @@
|
||||
raised>
|
||||
Add Proficiency
|
||||
</paper-button>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
@@ -1,11 +1,10 @@
|
||||
<template name="proficiencyListItem">
|
||||
<div class="item-slot">
|
||||
<div class="proficiency item small"
|
||||
hero-id="main" {{detailHero}}
|
||||
layout horizontal center>
|
||||
<div class="proficiency item small layout horizontal center"
|
||||
hero-id="main" {{detailHero}}>
|
||||
<iron-icon icon="{{profIcon}}"
|
||||
style="margin-right: 16px;"></iron-icon>
|
||||
<div flex>{{getName}}</div>
|
||||
<div class="flex">{{getName}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
@@ -1,10 +1,7 @@
|
||||
<template name="proficiencyView">
|
||||
<div class="proficiencyView item small"
|
||||
style="padding: 0;"
|
||||
layout horizontal center>
|
||||
<div class="proficiencyView item small layout horizontal center"
|
||||
style="padding: 0;">
|
||||
<iron-icon icon="{{profIcon}}" style="margin-right: 16px;"></iron-icon>
|
||||
<div>{{getName}}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
@@ -1,11 +1,12 @@
|
||||
<template name="proficiencyViewList">
|
||||
{{#if proficiencies.count}}
|
||||
<hr class="vertMargin">
|
||||
<div class="proficiencies">
|
||||
<h2 style="margin-bottom: 8px;">Proficiencies</h2>
|
||||
<div class="paper-font-title" style="margin-bottom: 8px;">
|
||||
Proficiencies
|
||||
</div>
|
||||
{{#each proficiencies}}
|
||||
{{> proficiencyView}}
|
||||
{{/each}}
|
||||
</div>
|
||||
{{/if}}
|
||||
</template>
|
||||
</template>
|
||||
|
||||
@@ -23,10 +23,11 @@
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.intro .section paper-button {
|
||||
color: #FF5252;
|
||||
}
|
||||
|
||||
.intro paper-button {
|
||||
min-width: 200px;
|
||||
}
|
||||
|
||||
|
||||
.intro paper-button:not([raised]) {
|
||||
color: #d13b2e;
|
||||
}
|
||||
|
||||
@@ -3,12 +3,12 @@
|
||||
<div class="section white-text" style="background: #282828">
|
||||
<img style="width:130px; height:130px; background-color: #282828;"
|
||||
src="/crown-dice-logo-cropped-transparent.png">
|
||||
<div class="display1">
|
||||
<div class="paper-font-display1">
|
||||
Realtime D&D 5e Character Tracker
|
||||
</div>
|
||||
<h2>
|
||||
<div class="paper-font-title">
|
||||
Spend less time shuffling paper and more time playing
|
||||
</h2>
|
||||
</div>
|
||||
{{#unless currentUser}}
|
||||
<div layout horizontal around-justified wrap>
|
||||
<a href="/sign-in">
|
||||
@@ -32,16 +32,16 @@
|
||||
</div>
|
||||
<div class="section" style="background-color: #e9e9e9;">
|
||||
<div>
|
||||
<div class="display1">Character Sheets</div>
|
||||
<h2 style="margin-bottom: 16px;">
|
||||
<div class="paper-font-display1">Character Sheets</div>
|
||||
<div class="paper-font-title" style="margin-bottom: 16px;">
|
||||
Check out the example characters
|
||||
</h2>
|
||||
</div>
|
||||
<div class="layout horizontal around-justified wrap">
|
||||
<a href="/character/yBWwt5XQTTHZiRQxq">
|
||||
<paper-material class="card characterCard ssArcher clickable"
|
||||
elevation="2" style="margin: 16px;">
|
||||
<div class="top subhead green white-text">
|
||||
<div class="subhead" flex>
|
||||
<div class="top paper-font-subhead green white-text">
|
||||
<div class="flex">
|
||||
Starter Set Archer
|
||||
</div>
|
||||
</div>
|
||||
@@ -51,8 +51,8 @@
|
||||
<a href="/character/KxHKskm22fS2Xogah">
|
||||
<paper-material class="card characterCard ssWizard clickable"
|
||||
elevation="2" style="margin: 16px;">
|
||||
<div class="top subhead deep-purple white-text">
|
||||
<div class="subhead" flex>
|
||||
<div class="top paper-font-subhead deep-purple white-text">
|
||||
<div class="flex">
|
||||
Starter Set Wizard
|
||||
</div>
|
||||
</div>
|
||||
@@ -65,41 +65,44 @@
|
||||
<div class="section white-text" style="background: #282828">
|
||||
<div class="columns layout horizontal around-justified wrap">
|
||||
<div>
|
||||
<h1>Guide</h1>
|
||||
<p>
|
||||
<div class="paper-font-headline">
|
||||
Guide
|
||||
</div>
|
||||
<div>
|
||||
Learn how your class gives you features, those features have effects,
|
||||
and those effects determine your stats.
|
||||
<a href="/guide">
|
||||
<paper-button class="guideButton">
|
||||
View Guide
|
||||
</paper-button>
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<a href="/guide">
|
||||
<paper-button class="guideButton">
|
||||
View Guide
|
||||
</paper-button>
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<h1>
|
||||
<div class="paper-font-headline">
|
||||
Discuss
|
||||
</h1>
|
||||
<p>
|
||||
</div>
|
||||
<div>
|
||||
On the official subreddit
|
||||
<a href="http://www.reddit.com/r/dicecloud/">
|
||||
<paper-button class="redditButton">
|
||||
/r/dicecloud
|
||||
</paper-button>
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<a href="http://www.reddit.com/r/dicecloud/">
|
||||
<paper-button class="redditButton">
|
||||
/r/dicecloud
|
||||
</paper-button>
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<h1>
|
||||
<div class="paper-font-headline">
|
||||
Get involved
|
||||
</h1>
|
||||
<p>Shape upcoming features and track bugs on the DiceCloud Trello board
|
||||
<a href="https://trello.com/b/94M0SCnq/dicecloud-roadmap">
|
||||
<paper-button class="trelloButton">
|
||||
Trello Roadmap
|
||||
</paper-button>
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
Shape upcoming features and track bugs on the DiceCloud Trello board
|
||||
</div>
|
||||
<a href="https://trello.com/b/94M0SCnq/dicecloud-roadmap">
|
||||
<paper-button class="trelloButton">
|
||||
Trello Roadmap
|
||||
</paper-button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -5,12 +5,13 @@
|
||||
<app-header id="accountSummary" effects="waterfall parallax-background" condenses fixed>
|
||||
<app-toolbar>
|
||||
{{#if currentUser}}
|
||||
<a href="/account"
|
||||
style="text-decoration: underline; cursor: pointer; font-size: 16px;">
|
||||
<a href="/account" style="text-decoration: underline; cursor: pointer; font-size: 16px;">
|
||||
{{profileLink}}
|
||||
</a>
|
||||
{{else}}
|
||||
<a href="/sign-in" style="color: white; text-decoration: underline;">Sign in</a>
|
||||
<a href="/sign-in" style="text-decoration: underline; cursor: pointer; font-size: 16px;">
|
||||
Sign in
|
||||
</a>
|
||||
{{/if}}
|
||||
</app-toolbar>
|
||||
</app-header>
|
||||
|
||||
@@ -46,6 +46,7 @@
|
||||
<link rel="import" href="/components/paper-radio-group/paper-radio-group.html">
|
||||
<link rel="import" href="/components/paper-ripple/paper-ripple.html">
|
||||
<link rel="import" href="/components/paper-slider/paper-slider.html">
|
||||
<link rel="import" href="/components/paper-spinner/paper-spinner.html">
|
||||
<link rel="import" href="/components/paper-tabs/paper-tabs.html">
|
||||
<link rel="import" href="/components/paper-toast/paper-toast.html">
|
||||
<link rel="import" href="/components/paper-toggle-button/paper-toggle-button.html">
|
||||
|
||||
@@ -1,12 +1,16 @@
|
||||
<template name="loading">
|
||||
<app-toolbar class="app-grey white-text">
|
||||
<paper-icon-button icon="menu" drawer-toggle></paper-icon-button>
|
||||
</app-toolbar>
|
||||
<div fit layout vertical center center-justified>
|
||||
<paper-spinner class="bigSpinner" active></paper-spinner>
|
||||
<div class="subhead"
|
||||
style="margin-left: 16px;
|
||||
margin-right: 16px;
|
||||
text-align: center;">{{randomHint}}</div>
|
||||
</div>
|
||||
<app-header-layout has-scrolling-region fullbleed>
|
||||
<app-header class="app-grey white-text" fixed>
|
||||
<app-toolbar>
|
||||
<paper-icon-button icon="menu" drawer-toggle></paper-icon-button>
|
||||
</app-toolbar>
|
||||
</app-header>
|
||||
<div class="fit layout vertical center center-justified">
|
||||
<paper-spinner class="bigSpinner" active></paper-spinner>
|
||||
<div class="paper-font-subhead"
|
||||
style="margin-left: 16px;
|
||||
margin-right: 16px;
|
||||
text-align: center;">{{randomHint}}</div>
|
||||
</div>
|
||||
</app-header-layout>
|
||||
</template>
|
||||
|
||||
@@ -1,40 +1,38 @@
|
||||
<template name="baseDialog">
|
||||
<app-header-layout has-scrolling-region class="fit base-dialog">
|
||||
<app-header fixed effects="waterfall">
|
||||
<app-toolbar class={{class}}>
|
||||
<paper-icon-button id="backButton"
|
||||
icon="arrow-back">
|
||||
</paper-icon-button>
|
||||
<div main-title>{{title}}</div>
|
||||
{{#if editing}}
|
||||
{{#unless hideDelete}}
|
||||
<paper-icon-button id="deleteButton"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
icon="delete">
|
||||
</paper-icon-button>
|
||||
{{/unless}}
|
||||
{{#unless hideColor}}
|
||||
{{> colorDropdown}}
|
||||
{{/unless}}
|
||||
<paper-icon-button id="doneEditingButton"
|
||||
icon="done">
|
||||
<div class="fit base-dialog layout vertical">
|
||||
<app-toolbar class={{class}}>
|
||||
<paper-icon-button id="backButton"
|
||||
icon="arrow-back">
|
||||
</paper-icon-button>
|
||||
<div main-title>{{title}}</div>
|
||||
{{#if editing}}
|
||||
{{#unless hideDelete}}
|
||||
<paper-icon-button id="deleteButton"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
icon="delete">
|
||||
</paper-icon-button>
|
||||
{{/unless}}
|
||||
{{#unless hideColor}}
|
||||
{{> colorDropdown}}
|
||||
{{/unless}}
|
||||
<paper-icon-button id="doneEditingButton"
|
||||
icon="done">
|
||||
</paper-icon-button>
|
||||
{{else}}
|
||||
{{#if showEdit}}
|
||||
<paper-icon-button id="editButton"
|
||||
icon="create">
|
||||
</paper-icon-button>
|
||||
{{else}}
|
||||
{{#if showEdit}}
|
||||
<paper-icon-button id="editButton"
|
||||
icon="create">
|
||||
</paper-icon-button>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</app-toolbar>
|
||||
</app-header>
|
||||
<div class="form">
|
||||
{{/if}}
|
||||
</app-toolbar>
|
||||
<div class="form flex scroll-y">
|
||||
{{#unless editing}}
|
||||
{{> UI.contentBlock}}
|
||||
{{else}}
|
||||
{{> UI.elseBlock}}
|
||||
{{/unless}}
|
||||
</div>
|
||||
</app-header-layout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -34,6 +34,28 @@
|
||||
max-height: 600px;
|
||||
}
|
||||
|
||||
.dialog-stack app-toolbar {
|
||||
border-radius: 2px 2px 0 0;
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.dialog-stack app-toolbar {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.dialog-stack .dialog-sizer {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-width: initial;
|
||||
max-height: initial;
|
||||
}
|
||||
.dialog-stack .dialog {
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog-stack .dialog {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
@@ -42,7 +64,6 @@
|
||||
box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),
|
||||
0 3px 14px 2px rgba(0, 0, 0, 0.12),
|
||||
0 5px 5px -3px rgba(0, 0, 0, 0.4);
|
||||
overflow: hidden;
|
||||
border-radius: 2px;
|
||||
transform-origin: top left;
|
||||
}
|
||||
|
||||
@@ -16,6 +16,11 @@
|
||||
paper-item.short {
|
||||
--paper-item-min-height: 32px;
|
||||
}
|
||||
paper-button[raised] {
|
||||
background-color: var(--accent-color);
|
||||
color: #dedede;
|
||||
color: rgba(255,255,255,0.87);
|
||||
}
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
|
||||
Reference in New Issue
Block a user