A new sheet arrives
This is terrifying.
This commit is contained in:
morgdalaine
@@ -0,0 +1,27 @@
|
||||
const gulp = require("gulp");
|
||||
const pug = require("gulp-pug");
|
||||
const sass = require('gulp-sass')(require('sass'));
|
||||
|
||||
gulp.task("scss", () => {
|
||||
return gulp.src("./scss/arc.scss")
|
||||
.pipe(sass({
|
||||
outputStyle: "expanded"
|
||||
}).on("error", sass.logError))
|
||||
.pipe(gulp.dest("../"))
|
||||
})
|
||||
|
||||
gulp.task("html", function () {
|
||||
return gulp.src("./pug/arc.pug")
|
||||
.pipe(pug({
|
||||
pretty: true,
|
||||
locals: require("../translation.json")
|
||||
}))
|
||||
.pipe(gulp.dest("../"))
|
||||
})
|
||||
|
||||
gulp.task("watch", gulp.series(["scss", "html"], () => {
|
||||
gulp.watch("./scss/**/*.scss", gulp.series(["scss"]))
|
||||
gulp.watch(["./pug/**/*.pug","./js/**/*.js"], gulp.series(["html"]))
|
||||
}))
|
||||
|
||||
gulp.task("build", gulp.series(["scss", "html"]))
|
||||
@@ -0,0 +1,125 @@
|
||||
|
||||
on("sheet:opened", () => {
|
||||
getAttrs(["sheet_type"], (updateAttrs) => {
|
||||
if (!updateAttrs.sheet_type) {
|
||||
updateAttrs.sheet_type = "character";
|
||||
}
|
||||
|
||||
setAttrs(updateAttrs);
|
||||
});
|
||||
});
|
||||
|
||||
// NOTE: The API sets export_show to "on";
|
||||
// it does not trigger the event handler
|
||||
on("sheet:opened change:export", (eventInfo) => {
|
||||
getAttrs(["export"], (val) => {
|
||||
const updateAttrs = {};
|
||||
updateAttrs.export_show = val.export ? "on" : "0";
|
||||
setAttrs(updateAttrs);
|
||||
});
|
||||
});
|
||||
|
||||
[1, 2, 3].forEach((l) => {
|
||||
on(`change:repeating_bonds:level_${l}`, (eventInfo) => {
|
||||
if (eventInfo.sourceType == "player") {
|
||||
|
||||
let updateAttrs = {};
|
||||
let changed = parseInt(eventInfo.sourceAttribute.slice(-1));
|
||||
|
||||
// fill major bonds below
|
||||
for (let f = changed - 1; f > 0; f--) {
|
||||
updateAttrs[`repeating_bonds_level_${f}`] = 4;
|
||||
}
|
||||
|
||||
// clear major bonds above
|
||||
for (let c = changed + 1; c <= 3; c++) {
|
||||
updateAttrs[`repeating_bonds_level_${c}`] = 0;
|
||||
}
|
||||
|
||||
setAttrs(updateAttrs);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
GLOBAL__HEALTH.forEach(s => on(`change:${s} change:${s}_max`, eventInfo =>
|
||||
currentMax(s, eventInfo)));
|
||||
|
||||
const currentMax = (attr, eventInfo) => {
|
||||
if (eventInfo.sourceType == "player") {
|
||||
let updateAttrs = {};
|
||||
let attr_max = `${attr}_max`;
|
||||
getAttrs([attr, attr_max], val => {
|
||||
const current = parseInt(val[attr]) || 0;
|
||||
const maximum = parseInt(val[attr_max]) || 0;
|
||||
const newCurr = (current > maximum)
|
||||
? maximum
|
||||
: Math.max(0, current);
|
||||
updateAttrs[attr] = newCurr;
|
||||
updateAttrs[attr_max] = Math.max(0, maximum);
|
||||
setAttrs(updateAttrs);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
on("change:repeating_inventory:name", (eventInfo) => {
|
||||
const id = eventInfo.sourceAttribute.split("_")[2];
|
||||
const updateAttrs = {};
|
||||
const name = eventInfo.newValue.trim();
|
||||
let translation = getTranslationByKey(name)
|
||||
if (translation) {
|
||||
updateAttrs[`repeating_inventory_${id}_name`] = translation;
|
||||
|
||||
const searchInputs = _.difference(GLOBAL__INVENTORY_INPUTS, ["name"]);
|
||||
_.each(searchInputs, (key) => {
|
||||
const attr = `repeating_inventory_${id}_${key}`;
|
||||
const i18n = `${name}_${key}`;
|
||||
|
||||
// check if property exists in global
|
||||
if (GLOBAL__INVENTORY[name][key]) {
|
||||
updateAttrs[attr] = GLOBAL__INVENTORY[name][key];
|
||||
}
|
||||
// check if translation exists
|
||||
else if (getTranslationByKey(i18n)) {
|
||||
updateAttrs[attr] = getTranslationByKey(i18n);
|
||||
}
|
||||
});
|
||||
|
||||
log(updateAttrs)
|
||||
setAttrs(updateAttrs, { silent: true });
|
||||
}
|
||||
});
|
||||
|
||||
on("clicked:repeating_inventory:item-expand-toggle", (eventInfo) => {
|
||||
const id = eventInfo.sourceAttribute.split("_")[2];
|
||||
getAttrs([`repeating_inventory_${id}_item_expand`], (val) => {
|
||||
setAttrs({
|
||||
[`repeating_inventory_${id}_item_expand`]: val[`repeating_inventory_${id}_item_expand`] === "0" ? "on" : "0"
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
GLOBAL__SKILLS.forEach((skill) => {
|
||||
on(`clicked:${skill}`, initiateSkillRoll);
|
||||
});
|
||||
|
||||
on("sheet:opened", () => {
|
||||
getAttrs(["version"], (updateAttrs) => {
|
||||
// Logic to determine what updates need to be done
|
||||
if (!updateAttrs.version) {
|
||||
// set sheet version if it doesn't exist
|
||||
updateAttrs.version = "1.0";
|
||||
}
|
||||
|
||||
setAttrs(updateAttrs);
|
||||
});
|
||||
});
|
||||
|
||||
on("sheet:opened", () => {
|
||||
var updateAttrs = {}
|
||||
for (i = 0; i < GLOBAL__HEALTH.length; i++) {
|
||||
var key = `${GLOBAL__HEALTH[i]}`;
|
||||
var translation = `${key}_i18n`;
|
||||
updateAttrs[translation] = getTranslationByKey(key);
|
||||
}
|
||||
setAttrs(updateAttrs);
|
||||
});
|
||||
@@ -0,0 +1,418 @@
|
||||
const GLOBAL__HEALTH = [ "blood", "guts" ];
|
||||
|
||||
const GLOBAL__APPROACHES = [ "creative", "careful", "concerted" ];
|
||||
|
||||
const GLOBAL__SKILLS = [
|
||||
"academic", "culture", "observe", "tactics",
|
||||
"charisma", "guile", "impose", "insight",
|
||||
"acrobatics", "coordination", "physique", "weaponry",
|
||||
"artistry", "survival", "tinker", "trade",
|
||||
"arcana", "focus"
|
||||
];
|
||||
|
||||
const GLOBAL__DIFFICULTIES = [ "tn_modifier+0", "tn_modifier-1", "tn_modifier-2", "tn_modifier-3", "tn_modifier+1", "tn_modifier+2", "tn_modifier+3" ];
|
||||
|
||||
const GLOBAL__APPROACH_QUERY = `[[?{Approach|${GLOBAL__APPROACHES.map((app, i) => `${getTranslationByKey(app)}, ${i}`).join("|")}}]]`;
|
||||
|
||||
const GLOBAL__DIFFICULTY_QUERY = `[[?{Modifiers|${GLOBAL__DIFFICULTIES.map((dif, i) => `${getTranslationByKey(dif)}, ${i}`).join("|")}}]]`;
|
||||
|
||||
const GLOBAL__DIFFICULTY_EFFECTS = {
|
||||
"tn_modifier+0": +0,
|
||||
"tn_modifier-1": -1,
|
||||
"tn_modifier-2": -2,
|
||||
"tn_modifier-3": -3,
|
||||
"tn_modifier+1": +1,
|
||||
"tn_modifier+2": +2,
|
||||
"tn_modifier+3": +3,
|
||||
};
|
||||
|
||||
const GLOBAL__INVENTORY_INPUTS = [
|
||||
"name",
|
||||
"type",
|
||||
"description",
|
||||
"first_boon",
|
||||
"second_boon",
|
||||
"complexity",
|
||||
"base_effect",
|
||||
"enhanced",
|
||||
"ritual"
|
||||
];
|
||||
|
||||
const GLOBAL__INVENTORY = {
|
||||
combat_scowling_face: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_pitchfork: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_memories_of_hardship: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_iron_briefs: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_booming_voice: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_well_rounded_education: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_darts: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_dagger: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_self_esteem: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_studden_leather_armor: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_devastating_vocabulary: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_critical_thinking: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_sturdy_sword: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_crossbow: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_plate_armor: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_love_letter: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_cunning_wit: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
combat_flaming_sword: {
|
||||
type: "damage_and_defense",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_rations: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_artisans_tools: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_crowbar_and_lantern: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_rope_and_carpet: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_bedroll: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_backpack: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_thieves_tools: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_fine_clothes: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_traps: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_tent: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_fishing_pole: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_live_hen: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_board_games: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_alchemists_tools: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_encyclopeida: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_spyglass: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_coded_letters: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
supplies_horse: {
|
||||
type: "supplies_and_sundries",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_seashell_horn: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_dead_donkey: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_ancient_ring: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_songbird: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_human_teeth: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_hat: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_monkey_head: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_heavy_crown: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_giant_serpent_scales: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_silk_dress: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_tyrant_pants: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_shadow_mirror: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_darkvision_glasses: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_divine_blood: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_seeds: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_potion_brawn: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_troll_flesh: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
oddities_telepathic_yak: {
|
||||
type: "oddities_and_valuables",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_trinket: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_trick_of_the_light: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_soundshift: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_lifebringer: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_whisper: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_bind_weapon: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_unmask_the_self: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_secret_door: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_burn_the_past: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_master_of_elements: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_little_escapologist: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_pierce_the_veil: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_manic_hands: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_shadowbind: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_compel: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_windstep: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_blackout: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_spirit_pact: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_from_dust_to_dust: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
spells_true_miracle: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_only_ones_who_know: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_uncanny_alarm: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_weave_through_water: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_memory_seed: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_flowmotion: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_saving_grace: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_inspiration: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_bind_magic: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_stonewall: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_heartpiercer: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_deadly_focus: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_redo: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_turn_the_tide: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_dispel: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_interdiction: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_fluorescent_transcendence: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_netherwave: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_become_one: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_defy_the_fates: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
techniques_doompause: {
|
||||
type: "spells_and_techniques",
|
||||
complexity: 0,
|
||||
},
|
||||
};
|
||||
@@ -0,0 +1,81 @@
|
||||
// thank you Scott C!
|
||||
const initiateSkillRoll = async function (event) {
|
||||
let skill = event.triggerName.replace(/clicked:/, "");
|
||||
|
||||
// figure out which approach to use -- so ask
|
||||
let approachRoll = await startRoll(`!&template:default} {{query=${GLOBAL__APPROACH_QUERY}}}`);
|
||||
// note that values for the query options above line up with their indexes in GLOBAL__APPROACHES
|
||||
// also, this is an API message: it won't be visible to any user
|
||||
// because it's so generic, it shouldn't trigger any API scripts
|
||||
|
||||
// finish approachRoll immediately vecause we aren't going to computee
|
||||
// any values from it -- it's just a dummy roll
|
||||
finishRoll(approachRoll.rollId);
|
||||
|
||||
// same song for difficulty
|
||||
let difficultyRoll = await startRoll(`!&template:default} {{query=${GLOBAL__DIFFICULTY_QUERY}}}`);
|
||||
finishRoll(difficultyRoll.rollId);
|
||||
|
||||
// parse the results
|
||||
let approachValue = approachRoll.results.query.result;
|
||||
let approach = GLOBAL__APPROACHES[approachValue];
|
||||
|
||||
let difficultyValue = difficultyRoll.results.query.result;
|
||||
let difficulty = GLOBAL__DIFFICULTIES[difficultyValue];
|
||||
|
||||
let i18nApproach = getTranslationByKey(approach);
|
||||
let i18nSkill = getTranslationByKey(skill);
|
||||
let i18nDifficulty = getTranslationByKey("difficulty");
|
||||
let i18nModifier = getTranslationByKey("modifier");
|
||||
let finalTemplate = [
|
||||
`&{template:skills}`,
|
||||
`{{character_name=@{character_name}}}`,
|
||||
`{{verb=^{tests}}}`,
|
||||
`{{type=skill-test}}`,
|
||||
`{{skill=${skill}}}`,
|
||||
`{{roll=[[1d6]]}}`,
|
||||
`{{flawless=[[1d6]]}}`,
|
||||
`{{flawless=[[1d6]]}}`,
|
||||
`{{TN=[[@{${skill}}[${i18nSkill}] + @{${approach}}[${i18nApproach}] +`,
|
||||
`${GLOBAL__DIFFICULTY_EFFECTS[difficulty]}[${i18nModifier}]]]}}`,
|
||||
`{{title=${approach}}}`,
|
||||
`{{difficulty=${difficulty}}}`
|
||||
].join("");
|
||||
|
||||
// now that we have all the helprmation, make the roll
|
||||
let finalRoll = await startRoll(finalTemplate);
|
||||
finishRoll(finalRoll.rollId);
|
||||
};
|
||||
|
||||
// Functions added for code to make sense, not needed for getting regular and repeating sections.
|
||||
// converts a value to a number, it's default value, or 0.
|
||||
const value = function(val, def) {
|
||||
return (+val||def||0);
|
||||
};
|
||||
|
||||
// ===== PARAMETERS ==========
|
||||
// destinations : the name of the attribute that stores the total quantity
|
||||
// can be a single attribute, or an array: ["total_cost", "total_weight"]
|
||||
// If more than one, the matching fields must be in the same order.
|
||||
//
|
||||
// section : name of repeating fieldset, without the repeating_
|
||||
//
|
||||
// fields : the name of the attribute field to be summed
|
||||
// destination and fields both can be a single attribute: "weight"
|
||||
// or an array of attributes: ["weight","number","equipped"]
|
||||
const repeatingSum = (destinations, section, fields) => {
|
||||
if (!Array.isArray(destinations)) destinations = [destinations.replace(/\s/g, "").split(",")];
|
||||
if (!Array.isArray(fields)) fields = [fields.replace(/\s/g, "").split(",")];
|
||||
getSectionIDs(`repeating_${section}`, idArray => {
|
||||
const attrArray = idArray.reduce((m, id) => [...m, ...(fields.map(field => `repeating_${section}_${id}_${field}`))], []);
|
||||
getAttrs([...attrArray], v => {
|
||||
const getValue = (section, id, field) => v[`repeating_${section}_${id}_${field}`] === "on" ? 1 : parseFloat(v[`repeating_${section}_${id}_${field}`]) || 0;
|
||||
const commonMultipliers = (fields.length <= destinations.length) ? [] : fields.splice(destinations.length, fields.length - destinations.length);
|
||||
const output = {};
|
||||
destinations.forEach((destination, index) => {
|
||||
output[destination] = idArray.reduce((total, id) => total + getValue(section, id, fields[index]) * commonMultipliers.reduce((subtotal, mult) => subtotal * getValue(section, id, mult), 1), 0);
|
||||
});
|
||||
setAttrs(output);
|
||||
});
|
||||
});
|
||||
};
|
||||
Generated
+8822
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,37 @@
|
||||
{
|
||||
"name": "arc",
|
||||
"version": "1.0.0",
|
||||
"description": "Roll20 character sheet for ARC: Doom Tabletop RPG",
|
||||
"main": "arc.html",
|
||||
"scripts": {
|
||||
"build": "gulp build",
|
||||
"watch": "gulp watch"
|
||||
},
|
||||
"author": "Morgdalaine",
|
||||
"funding": [
|
||||
{
|
||||
"type": "patreon",
|
||||
"url": "https://www.patreon.com/morgdalaine"
|
||||
},
|
||||
{
|
||||
"type": "ko-fi",
|
||||
"url": "https://ko-fi.com/morgdalaine"
|
||||
}
|
||||
],
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/morgdalaine/arc-doom-ttrpg",
|
||||
"directory": "ARC/source"
|
||||
},
|
||||
"keywords": [
|
||||
"Roll20"
|
||||
],
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"gulp": "4.0.2",
|
||||
"gulp-pug": "5.0.0",
|
||||
"gulp-sass": "5.0.0",
|
||||
"pug": "3.0.2",
|
||||
"sass": "1.37.0"
|
||||
}
|
||||
}
|
||||
Vendored
BIN
Binary file not shown.
@@ -0,0 +1,34 @@
|
||||
include components/common/elements
|
||||
include components/common/functions
|
||||
include components/common/inputs
|
||||
include components/common/popups
|
||||
include components/approaches
|
||||
include components/background
|
||||
include components/bonds
|
||||
include components/consequences
|
||||
include components/experience
|
||||
include components/header
|
||||
include components/health
|
||||
include components/inventory
|
||||
include components/skills
|
||||
include components/toolbar
|
||||
include meta/data
|
||||
|
||||
.arc
|
||||
+hidden({ name: "version", value: "1.0" })
|
||||
+hidden({ name: "sheet_type", value: "character" })
|
||||
+hidden({ name: "setting_tooltips", value: 1 })
|
||||
+toolbar
|
||||
+header
|
||||
main.arc__layout
|
||||
+hidden({ name: "sheet_type" })
|
||||
include layouts/character
|
||||
|
||||
//- Roll Templates
|
||||
include layouts/roll-template
|
||||
|
||||
//- Sheet Workers
|
||||
script(type="text/worker")
|
||||
include ../js/globals.js
|
||||
include ../js/sheetworkers.js
|
||||
include ../js/eventhandlers.js
|
||||
@@ -0,0 +1,18 @@
|
||||
|
||||
mixin approaches
|
||||
article.approaches
|
||||
each app in data.approaches
|
||||
+approach(app)
|
||||
+approach-popup(app)
|
||||
|
||||
mixin approach(type)
|
||||
+help(type)
|
||||
section.approach
|
||||
.approach__label
|
||||
+span({ data_i18n: type }).approach__label--span
|
||||
.approach__value
|
||||
+number({ name: type, min: 0, max: 3 }).approach__value--input
|
||||
|
||||
mixin approach-popup(type)
|
||||
+popup({ name: type, title: "approach" })
|
||||
+span({ data_i18n: `${type}_description` })
|
||||
@@ -0,0 +1,18 @@
|
||||
|
||||
mixin background
|
||||
article.background
|
||||
section.background__differences
|
||||
+label({ data_i18n: "makes_them_different", for: "different" }).background--label
|
||||
+textarea({ name: "different", id: "different" })
|
||||
section.background__rumors
|
||||
+label({ data_i18n: "three_rumors" }).background--label
|
||||
fieldset.repeating_rumors
|
||||
.background__rumors--wrapper
|
||||
+textbox({ name: "rumor" }).background__rumors--input
|
||||
section.background__lesson
|
||||
+label({ data_i18n: "painful_lesson", for: "lesson" }).background--label
|
||||
+textarea({ name: "lesson", id: "lesson" })
|
||||
//- section.portrait
|
||||
//- +label({ data_i18n: "portrait" }).background--label
|
||||
//- .portrait__image
|
||||
//- +img({ name: "character_avatar" }).portrait__image--img
|
||||
@@ -0,0 +1,26 @@
|
||||
|
||||
mixin bonds
|
||||
article.bonds
|
||||
.bonds__header
|
||||
+span({ data_i18n: "bonds" }).bonds__header--span
|
||||
+help("bonds")
|
||||
fieldset.repeating_bonds
|
||||
+relationship
|
||||
+popup({ name: "bonds", title: "bonds" })
|
||||
+span({ data_i18n: "bonds_description" })
|
||||
|
||||
mixin relationship
|
||||
article.bond
|
||||
.bond__with
|
||||
+textbox({ name: "relationship", data_i18n_placeholder: "name_placeholder" }).bond__with--input
|
||||
section.bond__levels
|
||||
each lvl in range(3)
|
||||
+bond-levels(lvl)
|
||||
|
||||
mixin bond-levels(lvl)
|
||||
.bond__container
|
||||
.bond__major
|
||||
+hidden({ name: `level_${lvl}`, value: 0 }).bond__control
|
||||
+radio({ name: `level_${lvl}`, value: 0, checked: true }).bond__minor.reset
|
||||
each minor in [4, 3, 2, 1]
|
||||
+radio({ name: `level_${lvl}`, value: minor, title: minor }).bond__minor
|
||||
@@ -0,0 +1,92 @@
|
||||
|
||||
//- create [tag] with properties
|
||||
//- [tag] is passed in the obj but removed to prevent adding it to the final html
|
||||
//- [data_i18n] is shorthand for data-i18n
|
||||
//- [data_i18n_title] allows for translated title on :hover
|
||||
//- [name] is prepended with attr_
|
||||
//- [title] defaults to the attribute @{...}
|
||||
//- [locals] adds text programmatically instead of writing it yourself
|
||||
mixin tag(obj)
|
||||
- const tag = obj.tag;
|
||||
- obj = handleTag(obj);
|
||||
#{tag}&attributes(obj)(class!=attributes.class)=locals[obj["data-i18n"]]
|
||||
block
|
||||
|
||||
mixin span(obj)
|
||||
- obj.tag = "span";
|
||||
+tag(obj)&attributes(attributes)
|
||||
block
|
||||
|
||||
mixin label(obj)
|
||||
- obj.tag = "label";
|
||||
+tag(obj)&attributes(attributes)
|
||||
block
|
||||
|
||||
mixin h1(obj)
|
||||
- obj.tag = "h1";
|
||||
+tag(obj)&attributes(attributes)
|
||||
block
|
||||
|
||||
mixin h2(obj)
|
||||
- obj.tag = "h2";
|
||||
+tag(obj)&attributes(attributes)
|
||||
block
|
||||
|
||||
mixin h3(obj)
|
||||
- obj.tag = "h3";
|
||||
+tag(obj)&attributes(attributes)
|
||||
block
|
||||
|
||||
mixin h4(obj)
|
||||
- obj.tag = "h4";
|
||||
+tag(obj)&attributes(attributes)
|
||||
block
|
||||
|
||||
mixin h5(obj)
|
||||
- obj.tag = "h5";
|
||||
+tag(obj)&attributes(attributes)
|
||||
block
|
||||
|
||||
mixin img(obj)
|
||||
- obj.tag = "img"
|
||||
- obj.title = obj.src;
|
||||
- obj.src = `${data.assets.folder}${data.assets[obj.src]}`;
|
||||
+tag(obj)&attributes(attributes)
|
||||
|
||||
mixin div(obj)
|
||||
- obj.tag = "div";
|
||||
+tag(obj)&attributes(attributes)
|
||||
block
|
||||
|
||||
mixin section(obj)
|
||||
- obj.tag = "section";
|
||||
+tag(obj)&attributes(attributes)
|
||||
block
|
||||
|
||||
mixin article(obj)
|
||||
- obj.tag = "article";
|
||||
+tag(obj)&attributes(attributes)
|
||||
block
|
||||
|
||||
mixin button(obj)
|
||||
if obj.type === "action"
|
||||
- obj.name = `act_${obj.name}`;
|
||||
else
|
||||
- obj.type = "roll";
|
||||
- obj.title = obj.title || `%{${obj.name}}`;
|
||||
- obj.name = `roll_${obj.name}`;
|
||||
if !obj["data-i18n"]
|
||||
- obj["data-i18n"] = obj.data_i18n ? obj.data_i18n : null;
|
||||
- obj.data_i18n = null;
|
||||
button&attributes(obj)(class!=attributes.class)
|
||||
block
|
||||
|
||||
mixin action(obj)
|
||||
- obj.type = "action";
|
||||
+button(obj)&attributes(attributes)
|
||||
block
|
||||
|
||||
mixin roll(obj)
|
||||
- obj.type = "roll";
|
||||
+button(obj)&attributes(attributes)
|
||||
block
|
||||
@@ -0,0 +1,64 @@
|
||||
-
|
||||
const
|
||||
range = (length) => [...Array(length).keys()].map(n => n + 1);
|
||||
|
||||
//- handle input object transformation
|
||||
- function handleInput(obj) {
|
||||
- // only set default title for specific inputs
|
||||
- if (obj.type !== "hidden" && obj.type !== "checkbox") {
|
||||
- obj.title = obj.title || `@{${obj.name}}`;
|
||||
- }
|
||||
- // default number placeholder to 0
|
||||
- if (obj.type === "number") {
|
||||
- obj.placeholder = obj.placeholder || 0;
|
||||
- }
|
||||
- // set data-i18n to value when unavailable
|
||||
- if (obj.type === "select") {
|
||||
- obj.data_i18n = obj.data_i18n || obj.value
|
||||
- }
|
||||
- // handle data-i18n-title and clear title
|
||||
- if (obj.data_i18n_title) {
|
||||
- obj["data-i18n-title"] = obj.data_i18n_title;
|
||||
- obj.data_i18n_title = null;
|
||||
- obj.title = null;
|
||||
- }
|
||||
- // handle data-i18n-placeholder
|
||||
- if (obj.data_i18n_placeholder) {
|
||||
- obj["data-i18n-placeholder"] = obj.data_i18n_placeholder;
|
||||
- obj.data_i18n_placeholder = null;
|
||||
- }
|
||||
- obj.name = `attr_${obj.name}`;
|
||||
- return obj;
|
||||
- };
|
||||
|
||||
//- handle element object transformation
|
||||
- function handleTag(obj) {
|
||||
- obj.tag = null;
|
||||
- // set default title for attributes
|
||||
- if (obj.name) {
|
||||
- obj.title = obj.title || `@{${obj.name}}`;
|
||||
- obj.name = `attr_${obj.name}`;
|
||||
- }
|
||||
- // handle data-i18n-title and clear title
|
||||
- if (obj.data_i18n_title) {
|
||||
- obj["data-i18n-title"] = obj.data_i18n_title;
|
||||
- obj.data_i18n_title = null;
|
||||
- obj.title = null;
|
||||
- }
|
||||
- // handle data-i18n
|
||||
- if (obj.data_i18n) {
|
||||
- obj["data-i18n"] = obj.data_i18n;
|
||||
- obj.data_i18n = null;
|
||||
- }
|
||||
- // handle data-i18n-vars
|
||||
- if (obj.data_i18n_vars) {
|
||||
- obj["data-i18n-vars"] = obj.data_i18n_vars;
|
||||
- obj.data_i18n_vars = null;
|
||||
- }
|
||||
- // handle data-i18n-value
|
||||
- if (obj.data_i18n_value) {
|
||||
- obj["data-i18n-value"] = obj.data_i18n_value;
|
||||
- obj.data_i18n_value = null;
|
||||
- }
|
||||
- return obj;
|
||||
- }
|
||||
@@ -0,0 +1,65 @@
|
||||
|
||||
//- base mixin for all inputs
|
||||
//- [name] is prepended with attr_
|
||||
//- [title] defaults to the attribute @{...}
|
||||
//- [id] is prepended with attr_ or left null to remove from html
|
||||
//- the reference for calling it in chat and custom macros
|
||||
//- (class!=attributes.class) allows you to pass classes with +input({}).class
|
||||
mixin input(obj)
|
||||
- obj = handleInput(obj);
|
||||
input&attributes(obj)(class!=attributes.class)
|
||||
|
||||
mixin checkbox(obj)
|
||||
- obj.type = "checkbox";
|
||||
+input(obj)&attributes(obj)(class!=attributes.class)
|
||||
|
||||
mixin radio(obj)
|
||||
- obj.type = "radio";
|
||||
+input(obj)&attributes(obj)(class!=attributes.class)
|
||||
|
||||
mixin textbox(obj)
|
||||
- obj.type = "text";
|
||||
+input(obj)&attributes(obj)(class!=attributes.class)
|
||||
|
||||
mixin number(obj)
|
||||
- obj.type = "number";
|
||||
+input(obj)&attributes(obj)(class!=attributes.class)
|
||||
|
||||
mixin textarea(obj)
|
||||
- obj = handleInput(obj);
|
||||
textarea&attributes(obj)(class!=attributes.class)
|
||||
|
||||
mixin hidden(obj)
|
||||
- obj.type = "hidden";
|
||||
+input(obj)&attributes(obj)(class!=attributes.class)
|
||||
|
||||
mixin select(obj)
|
||||
- obj = handleInput(obj);
|
||||
select&attributes(obj)(class!=attributes.class)
|
||||
if block
|
||||
block
|
||||
else
|
||||
+option({ value: "empty select, pebkac", selected: true})
|
||||
|
||||
mixin option(obj)
|
||||
- obj.tag = "option";
|
||||
- obj.data_i18n = obj.data_i18n || obj.value;
|
||||
+tag(obj)&attributes(obj)
|
||||
|
||||
mixin textarea(obj)
|
||||
- obj = handleInput(obj);
|
||||
textarea&attributes(obj)(class!=attributes.class spellcheck="false")
|
||||
|
||||
mixin fill-in-radios(obj)
|
||||
+div({ class: obj.class }).radio__ranks
|
||||
+radio({ name: obj.name, value: 0, checked: true, class: obj.class }).radio__rank.reset
|
||||
each x in range(obj.max)
|
||||
+radio({ name: obj.name, value: x, class: obj.class }).radio__rank
|
||||
|
||||
mixin alt-radios
|
||||
.fill-in__container
|
||||
.fill-in__major
|
||||
+hidden({ name: `test`, value: 0 }).fill-in__control
|
||||
+radio({ name: `test`, value: 0, checked: true }).fill-in__minor.reset
|
||||
each minor in [4, 3, 2, 1]
|
||||
+radio({ name: `test`, value: minor, title: minor }).fill-in__minor
|
||||
@@ -0,0 +1,23 @@
|
||||
|
||||
mixin help(name)
|
||||
+hidden({ name: "setting_tooltips" }).toggle-tooltip
|
||||
div&attributes(attributes).help
|
||||
+label({ }).help__label
|
||||
- name = `show_${name}`;
|
||||
+checkbox({ name }).help__label--input
|
||||
+img({ src: "help" }).help__label--icon
|
||||
|
||||
mixin popup(obj)
|
||||
- obj.header = obj.header || obj.name;
|
||||
- obj.name = `show_${obj.name}`;
|
||||
+hidden({ name: obj.name, value: 0}).toggle-popup
|
||||
article.popup(class!=attributes.class)
|
||||
.popup__title
|
||||
+span({ data_i18n: obj.title }).popup__title--span
|
||||
label.popup__close
|
||||
+checkbox({ name: obj.name }).popup__close--btn
|
||||
+img({ src: "close" }).popup__close--symbol
|
||||
.popup__header
|
||||
+span({ data_i18n: obj.header }).popup__header--span
|
||||
.popup__content
|
||||
block
|
||||
@@ -0,0 +1,31 @@
|
||||
|
||||
mixin fallen-consequences
|
||||
-
|
||||
const roll__consequences = [
|
||||
`&{template:fallen}`,
|
||||
`{{character_name=@{character_name}}}`,
|
||||
`{{title=^{fallen_consequences}}}`,
|
||||
`{{verb=^{chooses}}}`,
|
||||
`{{action=^{life}}}`,
|
||||
`{{type=fallen}}`,
|
||||
`{{consequence=[[1d6]]}}`,
|
||||
].join("");
|
||||
|
||||
article.consequences
|
||||
.consequences__header
|
||||
+span({ data_i18n: "fallen_heroes" }).consequences__header--span
|
||||
+help("consequences")
|
||||
section.consequences__grid
|
||||
+div({ data_i18n: "1d6" }).consequences__grid--header
|
||||
.consequences__roll
|
||||
+roll({ name: "consequence", value: roll__consequences }).consequences__roll--btn
|
||||
+span({ data_i18n: "consequence" }).consequences__roll--span
|
||||
each side in range(6)
|
||||
- let name = `fallen_consequence_${side}`;
|
||||
label.consequence__die
|
||||
+checkbox({ name, value: 1, id: name }).consequence__die--input
|
||||
.consequence__die--span=side
|
||||
.consequence__die--square
|
||||
+label({ data_i18n: name, for: name }).consequence__description
|
||||
+popup({ name: "consequences", title: "life_and_death", header: "fallen_heroes" })
|
||||
+span({ data_i18n: "fallen_heroes_description" })
|
||||
@@ -0,0 +1,14 @@
|
||||
|
||||
mixin experience
|
||||
article.experience
|
||||
.experience__header
|
||||
+span({ data_i18n: "xp" }).experience__header--span
|
||||
+help("xp")
|
||||
.experience__total
|
||||
+input({ type: "number", name: "xp_max", min: 0 }).experience__total--input
|
||||
+span({ data_i18n: "xp_total" }).experience__total--span
|
||||
.experience__spent
|
||||
+input({ type: "number", name: "xp", min: 0}).experience__spent--input
|
||||
+span({ data_i18n: "xp_spent" }).experience__spent--span
|
||||
+popup({ name: "xp", title: "xp", header: "experience" })
|
||||
+span({ data_i18n: "xp_description" })
|
||||
@@ -0,0 +1,21 @@
|
||||
mixin header
|
||||
header.arc__header.header
|
||||
+hidden({ name: "sheet_type" })
|
||||
article.header__character.character
|
||||
.header__title
|
||||
+label({ for: "pc_id_character_name" }).header__title--label
|
||||
+h2({ data_i18n: "character_name" }).header__title--header
|
||||
+textbox({ name: "character_name", id: "pc_id_character_name" }).header__title--input
|
||||
.header__pronouns
|
||||
+label({ for: "pronouns" }).header__pronouns--label
|
||||
+h3({ data_i18n: "pronouns" }).header__pronouns--header
|
||||
+textbox({ name: "pronouns", id: "pronouns" }).header__pronouns--input
|
||||
.header__player
|
||||
+label({ for: "player_name" }).header__player--label
|
||||
+h3({ data_i18n: "player_name" }).header__player--header
|
||||
+textbox({ name: "player_name", id: "player_name" }).header__player--input
|
||||
article.header__npc.npc
|
||||
+textbox({ name: "character_name", id: "npc_id_character_name" }).header__npc--input
|
||||
article.header__name
|
||||
.header__name
|
||||
+span({ name: "character_name" }).header__name--span
|
||||
@@ -0,0 +1,65 @@
|
||||
|
||||
mixin health
|
||||
article.healths
|
||||
+health-section("blood")
|
||||
+health-section("guts")
|
||||
+rests
|
||||
|
||||
mixin health-section(type)
|
||||
section.health
|
||||
.health__type
|
||||
+span({ data_i18n: type }).health__type--span
|
||||
+help(type)
|
||||
//- .health__plus
|
||||
//- span +
|
||||
.health__mod
|
||||
+span({ data_i18n: "mod" }).health__mod--span
|
||||
+number({ name: `${type}_mod`, min: 0 }).health__mod--input
|
||||
//- .health__equals
|
||||
//- span="=".health__equals
|
||||
.health__max
|
||||
+span({ data_i18n: "max" }).health__max--span
|
||||
+number({ name: `${type}_max`, min: 0 }).health__max--input
|
||||
.health__current
|
||||
+span({ data_i18n: "current" }).health__current--span
|
||||
+number({ name: type, min: 0 }).health__current--input
|
||||
|
||||
- var title = (type == "blood" ? "physical_health" : "combat_health" )
|
||||
+popup({ name: type, title })
|
||||
+span({ data_i18n: `${type}_description` })
|
||||
|
||||
mixin rests
|
||||
section.rests
|
||||
-
|
||||
const roll__short_rest = [
|
||||
`&{template:recover}`,
|
||||
`{{character_name=@{character_name}}}`,
|
||||
`{{action=^{short_rest}}}`,
|
||||
`{{verb=^{takes_a_rest}}}`,
|
||||
`{{type=short-rest}}`,
|
||||
`{{blood=[[1d6]]}}`,
|
||||
`{{guts=[[1d6]]}}`
|
||||
].join("");
|
||||
-
|
||||
const roll__long_rest = [
|
||||
`&{template:recover}`,
|
||||
`{{character_name=@{character_name}}}`,
|
||||
`{{action=^{long_rest}}}`,
|
||||
`{{type=long-rest}}`,
|
||||
`{{verb=^{takes_a_rest}}}`,
|
||||
`{{blood=[[2d6+@{blood_mod}[BLOOD]]]}}`,
|
||||
`{{guts=[[2d6+@{guts_mod}[GUTS]]]}}`
|
||||
].join("");
|
||||
|
||||
.rests__spacer
|
||||
hr.rests__spacer--line
|
||||
.rests__short
|
||||
+roll({ name: "short_rest", value: roll__short_rest }).rests__short--button
|
||||
+span({ data_i18n: "short_rest" }).rests__short--span
|
||||
.rests__spacer
|
||||
hr.rests__spacer--line
|
||||
.rests__long
|
||||
+roll({ name: "long_rest", value: roll__long_rest }).rests__long--button
|
||||
+span({ data_i18n: "long_rest" }).rests__long--span
|
||||
.rests__spacer
|
||||
hr.rests__spacer--line
|
||||
@@ -0,0 +1,114 @@
|
||||
|
||||
mixin inventory
|
||||
article.inventory
|
||||
datalist(id="datalist__inventory")
|
||||
each item in data.inventory.items
|
||||
option(value=item, data-i18n=item)
|
||||
.inventory__header
|
||||
+span({ data_i18n: "inventory" }).inventory__header--span
|
||||
+help("inventory")
|
||||
.inventory__type
|
||||
+span({ data_i18n: "item_type" }).inventory__type--span
|
||||
.inventory__qty
|
||||
+span({ data_i18n: "item_quantity" }).inventory__qty--span
|
||||
.inventory__edit
|
||||
.inventory__items
|
||||
fieldset.repeating_inventory
|
||||
+item
|
||||
+popup({ name: "inventory", title: "inventory" })
|
||||
+span({ data_i18n: "inventory_description" })
|
||||
|
||||
mixin item
|
||||
.item__wrapper
|
||||
+hidden({ name: "item_expand", value: "0" })
|
||||
+hidden({ name: "type" }).item__block--toggle
|
||||
section.item
|
||||
- let universals = Object.assign([], data.inventory.inputs.universal);
|
||||
- universals = universals.sort((x, y) => { return x.sort - y.sort });
|
||||
section.item__block.item__universal
|
||||
each field in universals
|
||||
+item-input(field)
|
||||
.item__expand
|
||||
+action({ name: "item-expand-toggle" }).item__expand--btn
|
||||
+img({ src: "edit" }).item__expand--img
|
||||
+img({ src: "close" }).item__close--img
|
||||
+item-details
|
||||
|
||||
mixin item-details
|
||||
section.item--details
|
||||
each itemType in data.inventory.types
|
||||
- let fields = [...data.inventory.inputs[itemType]];
|
||||
- fields = fields.sort((x, y) => { return x.sort - y.sort });
|
||||
+section({ class: `item__${itemType}` }).item__block
|
||||
each field in fields
|
||||
+item-input(field)
|
||||
|
||||
mixin item-input(obj)
|
||||
- const field = Object.assign({}, obj);
|
||||
- field.sort = null;
|
||||
- field.id = `id_item_${field.name}`;
|
||||
+div({ class: `item--${field.name}` })
|
||||
if field.type === "select"
|
||||
+field-select-block(field)
|
||||
else
|
||||
+field-block(field)
|
||||
|
||||
mixin field-block(obj)
|
||||
- const data_i18n = obj.label || null;
|
||||
- const data_i18n_title = obj.label_title || null;
|
||||
.field
|
||||
if data_i18n
|
||||
+label({ data_i18n_title, for: obj.id }).field__label
|
||||
+span({ data_i18n }).field__label--span
|
||||
- obj.label = null;
|
||||
- obj.label_title = null;
|
||||
- obj.class = `field--${obj.type}`;
|
||||
|
||||
if (obj.type === "radios")
|
||||
+fill-in-radios(obj)
|
||||
else if (obj.type === "textarea")
|
||||
- obj.type = null;
|
||||
+textarea(obj)
|
||||
else
|
||||
+input(obj)
|
||||
|
||||
mixin field-select-block(obj)
|
||||
- const data_i18n = obj.label || null;
|
||||
.field
|
||||
if data_i18n
|
||||
+label({ data_i18n_title, for: obj.id }).field__label
|
||||
+span({ data_i18n }).field__label--span
|
||||
- const options = obj.options;
|
||||
- obj.options = null;
|
||||
+select(obj).field--select
|
||||
each opt in options
|
||||
+option(opt)
|
||||
|
||||
|
||||
|
||||
//- not used
|
||||
mixin inventory-totals
|
||||
footer.inventory__totals
|
||||
.inventory__totals--empty
|
||||
.inventory__totals--empty
|
||||
.inventory__totals--pool
|
||||
+number({ name: "inventory_points_max", min: 0 })
|
||||
.inventory__totals--spent
|
||||
+number({ name: "inventory_points", min: 0 })
|
||||
.inventory__totals--empty
|
||||
.inventory__totals--pool
|
||||
+span({ data_i18n: "item_pool" })
|
||||
.inventory__totals--spent
|
||||
+span({ data_i18n: "item_pool" })
|
||||
|
||||
//- not used
|
||||
mixin type-checkboxes
|
||||
+label({ for: "supplies" }).item__is-supplies
|
||||
+radio({ name: "type", value: "supplies", id: "supplies" }).item__type--radio
|
||||
.item__type--square
|
||||
+label({ for: "damage-defense" }).item__is-damage-defense
|
||||
+radio({ name: "type", value: "damage", id: "damage-defense" }).item__type--radio
|
||||
.item__type--square
|
||||
+label({ for: "spell-technique" }).item__is-spell-technique
|
||||
+radio({ name: "type", value: "spell", id: "spell-technique" }).item__type--radio
|
||||
.item__type--square
|
||||
@@ -0,0 +1,38 @@
|
||||
|
||||
mixin skills
|
||||
article.skills
|
||||
.skills__header
|
||||
+span({ data_i18n: "skills" }).skills__header--span
|
||||
+help("skills")
|
||||
each skills, category in data.skills
|
||||
header.skill-category__header
|
||||
+span({ data_i18n: category }).skill-category__header--span
|
||||
//- +help(`${category}_popup`)
|
||||
hr.skill-category__header--line
|
||||
//- +category-popup(category)
|
||||
each skill in skills
|
||||
+skill(skill)
|
||||
+popup({ name: "skills", title: "skill", header: "skill_info" })
|
||||
+span({ data_i18n: "skill_description" })
|
||||
|
||||
|
||||
mixin category-popup(cat)
|
||||
+popup({ name: cat, title: "skill_check" })
|
||||
+span({ data_i18n: `${cat}_description` })
|
||||
|
||||
mixin skill(skill)
|
||||
.skill__button
|
||||
+action({ name: skill }).skill__button--btn
|
||||
+span({ data_i18n: skill }).skill__button--span
|
||||
+help(`${skill}`)
|
||||
+skill-popup(skill)
|
||||
|
||||
+fill-in-radios({ name: skill, max: 3, class: "skill" })
|
||||
//- .skill__ranks
|
||||
//- +radio({ name: skill, value: 0, checked: true }).skill__rank.reset
|
||||
//- each x in range(3)
|
||||
//- +radio({ name: skill, value: x }).skill__rank
|
||||
|
||||
mixin skill-popup(skill)
|
||||
+popup({ name: skill, title: "skill_info", header: skill })
|
||||
+span({ data_i18n: `${skill}_description` })
|
||||
@@ -0,0 +1,49 @@
|
||||
|
||||
mixin toolbar
|
||||
nav.toolbar
|
||||
.toolbar__labels
|
||||
label.toolbar__glossary
|
||||
+checkbox({ name: "show_glossary" })
|
||||
+img({ src: "book" }).toolbar__glossary--icon g
|
||||
label.toolbar__settings
|
||||
+checkbox({ name: "show_settings" })
|
||||
+img({ src: "settings" }).toolbar__settings--icon
|
||||
label.toolbar__version
|
||||
+span({ data_i18n: "version" }).toolbar__version--text
|
||||
+span({ name: "version" }).toolbar__version--number
|
||||
+glossary
|
||||
+settings
|
||||
|
||||
mixin glossary
|
||||
+popup({ name: "glossary", title: "quick_overview", header: "_" }).glossary
|
||||
article.glossary--wrapper
|
||||
each content in data.glossary
|
||||
details
|
||||
summary.glossary__entry
|
||||
hr.glossary__entry--line
|
||||
+h3({ data_i18n: content }).glossary__entry--header
|
||||
hr.glossary__entry--line
|
||||
.glossary__definition
|
||||
+span({ data_i18n: `${content}_description` })
|
||||
|
||||
mixin settings
|
||||
+popup({ name: "settings", title: "settings", header: "_" }).settings
|
||||
article.settings--wrapper
|
||||
section.settings__mode
|
||||
+h3({ data_i18n: "sheet_mode" }).settings__mode--header
|
||||
+select({ name: "sheet_type" }).settings__tooltips--select
|
||||
each option in data.settings.sheet_type
|
||||
+option(option)
|
||||
section.settings__theme
|
||||
+h3({ data_i18n: "theme" }).settings__theme--header
|
||||
+span({ data_i18n: "use_sync" }).settings__theme--span
|
||||
section.settings__tooltips
|
||||
+h3({ data_i18n: "tooltips" }).settings__tooltips--header
|
||||
+select({ name: "setting_tooltips" }).settings__tooltips--select
|
||||
each option in data.settings.tooltips
|
||||
+option(option)
|
||||
section.settings__export
|
||||
+roll({ data_i18n: "export_character", name: "api_export", value: "!arc .export @{character_id}" }).settings__export--btn
|
||||
+hidden({ name: "export_show", value: "0" }).settings__export--toggle
|
||||
+textarea({ name: "export", rows: 6, data_i18n_placeholder: "requires_arc_api" }).settings__export--json
|
||||
+span({ data_i18n: "requires_arc_api" }).settings__export--span
|
||||
@@ -0,0 +1,11 @@
|
||||
|
||||
article.arc__layout--left
|
||||
+health
|
||||
+approaches
|
||||
+skills
|
||||
+inventory
|
||||
aside.arc__layout--right.character
|
||||
+background
|
||||
+bonds
|
||||
+experience
|
||||
+fallen-consequences
|
||||
@@ -0,0 +1,97 @@
|
||||
|
||||
mixin tags(array)
|
||||
each tag in array
|
||||
| {{##{ tag }}}
|
||||
if block
|
||||
block
|
||||
each tag in array.reverse()
|
||||
| {{/#{ tag }}}
|
||||
|
||||
mixin roll-template-sentence
|
||||
.sheet-arc__sentence
|
||||
+tags(["character_name"])
|
||||
.sheet-arc__sentence--name(class=`{{type}}`) {{ character_name }}
|
||||
+tags(["verb"])
|
||||
.sheet-arc__sentence--verb(class=`{{type}}`) {{ verb }}
|
||||
+tags(["action"])
|
||||
.sheet-arc__sentence--action(class=`{{type}}`) {{ action }}
|
||||
|
||||
rolltemplate.sheet-rolltemplate-recover
|
||||
.sheet-arc__container
|
||||
.sheet-arc__banner(class=`{{type}}`)
|
||||
.sheet-arc__content(class=`{{type}}`)
|
||||
+roll-template-sentence
|
||||
.sheet-arc__recover(class=`{{type}}`)
|
||||
.sheet-arc__recover--arrow ▶
|
||||
.sheet-arc__recover--text
|
||||
+span({ data_i18n: "recovery_{{type}}",
|
||||
data_i18n_vars: "{{blood}}|{{guts}}" })
|
||||
.sheet-arc__footnote
|
||||
span.sheet-arc__footnote--mark ※
|
||||
+span({ data_i18n: "update_character_sheet" }).sheet-arc__footnote--span
|
||||
|
||||
rolltemplate.sheet-rolltemplate-fallen
|
||||
.sheet-arc__container
|
||||
.sheet-arc__banner(class=`{{type}}`)
|
||||
.sheet-arc__content(class=`{{type}}`)
|
||||
+roll-template-sentence
|
||||
.sheet-arc__fallen(class=`{{type}}`)
|
||||
.sheet-arc__fallen--roll
|
||||
span {{ consequence }}
|
||||
each con in range(6)
|
||||
+tags([`rollTotal() consequence ${con}`])
|
||||
.sheet-arc__fallen--text
|
||||
+span({ data_i18n: `fallen_consequence_${con}` })
|
||||
.sheet-arc__footnote
|
||||
span.sheet-arc__footnote--mark ※
|
||||
+span({ data_i18n: "update_character_sheet" }).sheet-arc__footnote--span
|
||||
|
||||
rolltemplate.sheet-rolltemplate-skills
|
||||
.sheet-arc__container
|
||||
.sheet-arc__banner(class=`{{type}}`)
|
||||
+tags(["rollLess() roll TN"])
|
||||
span.sheet-display-control.sheet-success
|
||||
+tags(["rollTotal() roll TN"])
|
||||
span.sheet-display-control.sheet-tie
|
||||
+tags(["rollGreater() roll TN"])
|
||||
span.sheet-display-control.sheet-fail
|
||||
|
||||
.sheet-arc__content(class=`{{type}}`)
|
||||
+roll-template-sentence
|
||||
.sheet-arc__approach-skill(class=`{{type}}`)
|
||||
.sheet-arc__approach-skill--arrow ▶
|
||||
.sheet-arc__approach-skill--approach(class=`{{title}}`)
|
||||
+div({ data_i18n: `{{skill}}` }).sheet-arc__approach-skill--text
|
||||
|
||||
.sheet-arc__results
|
||||
//- text for success | tie | fail
|
||||
.sheet-arc__results--text
|
||||
+tags(["rollLess() roll TN"])
|
||||
.sheet-arc__success
|
||||
+span({ data_i18n: "roll_success" }).sheet-arc__success--span
|
||||
+tags(["rollTotal() roll TN"])
|
||||
.sheet-arc__tie
|
||||
+span({ data_i18n: "roll_tie" }).sheet-arc__tie--span
|
||||
+tags(["rollGreater() roll TN"])
|
||||
.sheet-arc__fail
|
||||
+span({ data_i18n: "roll_fail" }).sheet-arc__fail--span
|
||||
|
||||
//- dice results
|
||||
.sheet-arc__results--values
|
||||
+div({ data_i18n: "roll" }).sheet-arc__roll--header
|
||||
+div({ data_i18n: "versus" }).sheet-arc__versus--header
|
||||
+div({ data_i18n: "tn" }).sheet-arc__tn--header
|
||||
|
||||
each roll in range(6)
|
||||
+tags([`rollTotal() roll ${roll}`])
|
||||
.sheet-arc__roll--value
|
||||
img(src=`https://raw.githubusercontent.com/morgdalaine/arc-momatoes/main/api-script/ARC/assets/die_${roll}.png`)
|
||||
| {{roll}}
|
||||
.sheet-arc__versus--value
|
||||
+tags(["rollLess() roll TN"])
|
||||
span.sheet-arc__versus--symbol.sheet-success="<"
|
||||
+tags(["rollTotal() roll TN"])
|
||||
span.sheet-arc__versus--symbol.sheet-tie="="
|
||||
+tags(["rollGreater() roll TN"])
|
||||
span.sheet-arc__versus--symbol.sheet-fail=">"
|
||||
.sheet-arc__tn--value {{TN}}
|
||||
@@ -0,0 +1,291 @@
|
||||
-
|
||||
const data = {
|
||||
assets: {
|
||||
folder: "https://raw.githubusercontent.com/morgdalaine/arc-momatoes/main/character-sheet/ARC/assets/",
|
||||
add: "add.svg",
|
||||
book: "book.svg",
|
||||
close: "close.svg",
|
||||
delete: "delete.svg",
|
||||
download: "download.svg",
|
||||
drag: "drag.svg",
|
||||
edit: "edit.svg",
|
||||
export: "export.svg",
|
||||
help: "help.svg",
|
||||
lock: "lock.svg",
|
||||
move: "move.svg",
|
||||
save: "save.svg",
|
||||
settings: "settings.svg",
|
||||
unlock: "unlock.svg",
|
||||
bg_check_success: "bg_check_success.png",
|
||||
bg_check_tie: "bg_check_tie.png",
|
||||
bg_check_fail: "bg_check_fail.png",
|
||||
bg_long_rest: "bg_long_rest.png",
|
||||
bg_short_rest: "bg_short_rest.png",
|
||||
tab_long_rest: "tab_long_rest.png",
|
||||
tab_short_rest: "tab_short_rest.png",
|
||||
tab_skill_check: "tab_skill_check.png",
|
||||
text_careful: "text_careful.svg",
|
||||
text_concerted: "text_concerted.svg",
|
||||
text_creative: "text_creative.svg",
|
||||
},
|
||||
settings: {
|
||||
sheet_type: [
|
||||
{
|
||||
value: "character",
|
||||
data_i18n: "character_mode",
|
||||
selected: true
|
||||
},
|
||||
{
|
||||
value: "npc",
|
||||
data_i18n: "npc_mode"
|
||||
}
|
||||
],
|
||||
tooltips: [
|
||||
{
|
||||
value: "1",
|
||||
data_i18n: "tooltip_show",
|
||||
selected: true
|
||||
},
|
||||
{
|
||||
value: "0",
|
||||
data_i18n: "tooltip_hide"
|
||||
}
|
||||
]
|
||||
},
|
||||
glossary: [
|
||||
"advantage",
|
||||
"attack",
|
||||
"complexity",
|
||||
"conflict",
|
||||
"consequence",
|
||||
"damage",
|
||||
"difficulty_modifier",
|
||||
"doom",
|
||||
"doomsday_clock",
|
||||
"focus",
|
||||
"group_skill_check",
|
||||
"initiative_category",
|
||||
"learning_spells_and_techniques",
|
||||
"moment",
|
||||
"movement_in_conflict",
|
||||
"omen",
|
||||
"opportunity",
|
||||
"rest",
|
||||
"ritual",
|
||||
"skill_check",
|
||||
"spells_and_techniques",
|
||||
"spells_and_techniques_in_conflict",
|
||||
"stand_ground",
|
||||
"threshold_number",
|
||||
"turn"
|
||||
],
|
||||
approaches: [ "creative", "careful", "concerted" ],
|
||||
skills: {
|
||||
knowledge: [ "academic", "culture", "observe", "tactics" ],
|
||||
social: [ "charisma", "guile", "impose", "insight" ],
|
||||
physical: [ "acrobatics", "coordination", "physique", "weaponry" ],
|
||||
practical: [ "artistry", "survival", "tinker", "trade" ],
|
||||
prowess: [ "arcana", "focus" ],
|
||||
},
|
||||
inventory: {
|
||||
types: [ "supplies_and_sundries", "oddities_and_valuables", "damage_and_defense", "spells_and_techniques" ],
|
||||
inputs: {
|
||||
universal: [
|
||||
{
|
||||
sort: 1,
|
||||
name: "name",
|
||||
type: "text",
|
||||
list: "datalist__inventory",
|
||||
data_i18n_placeholder: "name_placeholder",
|
||||
},
|
||||
{
|
||||
sort: 2,
|
||||
name: "type",
|
||||
type: "select",
|
||||
options: [
|
||||
{ data_i18n: "select_placeholder", value: "none", selected: true },
|
||||
{ value: "supplies_and_sundries" },
|
||||
{ value: "oddities_and_valuables" },
|
||||
{ value: "damage_and_defense" },
|
||||
{ value: "spells_and_techniques" },
|
||||
]
|
||||
},
|
||||
{
|
||||
sort: 3,
|
||||
name: "quantity",
|
||||
type: "number",
|
||||
placeholder: "0",
|
||||
min: 0,
|
||||
}
|
||||
],
|
||||
supplies_and_sundries: [
|
||||
{
|
||||
sort: 4,
|
||||
label: "description",
|
||||
name: "description",
|
||||
type: "text",
|
||||
data_i18n_placeholder: "description_placeholder",
|
||||
}
|
||||
],
|
||||
oddities_and_valuables: [
|
||||
{
|
||||
sort: 4,
|
||||
label: "description",
|
||||
name: "description",
|
||||
type: "text",
|
||||
data_i18n_placeholder: "description_placeholder",
|
||||
}
|
||||
],
|
||||
damage_and_defense: [
|
||||
{
|
||||
sort: 4,
|
||||
label: "boon",
|
||||
name: "first_boon",
|
||||
type: "textarea",
|
||||
data_i18n_placeholder: "boon_placeholder",
|
||||
},
|
||||
{
|
||||
sort: 5,
|
||||
label: "boon",
|
||||
name: "second_boon",
|
||||
type: "textarea",
|
||||
data_i18n_placeholder: "boon_placeholder",
|
||||
},
|
||||
{
|
||||
sort: 6,
|
||||
label: "description",
|
||||
name: "description",
|
||||
type: "text",
|
||||
data_i18n_placeholder: "description_placeholder",
|
||||
},
|
||||
],
|
||||
spells_and_techniques: [
|
||||
{
|
||||
sort: 4,
|
||||
label: "complexity",
|
||||
name: "complexity",
|
||||
type: "radios",
|
||||
class: "complexity",
|
||||
max: 4,
|
||||
},
|
||||
{
|
||||
sort: 5,
|
||||
label: "base_effect",
|
||||
name: "base_effect",
|
||||
type: "textarea",
|
||||
//- data_i18n_placeholder: "base_effect_placeholder",
|
||||
},
|
||||
{
|
||||
sort: 6,
|
||||
label: "enhanced",
|
||||
name: "enhanced",
|
||||
type: "textarea",
|
||||
//- data_i18n_placeholder: "enhanced_placeholder",
|
||||
},
|
||||
{
|
||||
sort: 7,
|
||||
label: "ritual",
|
||||
name: "ritual",
|
||||
type: "textarea",
|
||||
//- data_i18n_placeholder: "ritual_placeholder",
|
||||
},
|
||||
],
|
||||
},
|
||||
items: [
|
||||
"combat_scowling_face",
|
||||
"combat_pitchfork",
|
||||
"combat_memories_of_hardship",
|
||||
"combat_iron_briefs",
|
||||
"combat_booming_voice",
|
||||
"combat_well_rounded_education",
|
||||
"combat_darts",
|
||||
"combat_dagger",
|
||||
"combat_self_esteem",
|
||||
"combat_studden_leather_armor",
|
||||
"combat_devastating_vocabulary",
|
||||
"combat_critical_thinking",
|
||||
"combat_sturdy_sword",
|
||||
"combat_crossbow",
|
||||
"combat_plate_armor",
|
||||
"combat_love_letter",
|
||||
"combat_cunning_wit",
|
||||
"combat_flaming_sword",
|
||||
"supplies_rations",
|
||||
"supplies_artisans_tools",
|
||||
"supplies_crowbar_and_lantern",
|
||||
"supplies_rope_and_carpet",
|
||||
"supplies_bedroll",
|
||||
"supplies_backpack",
|
||||
"supplies_thieves_tools",
|
||||
"supplies_fine_clothes",
|
||||
"supplies_traps",
|
||||
"supplies_tent",
|
||||
"supplies_fishing_pole",
|
||||
"supplies_live_hen",
|
||||
"supplies_board_games",
|
||||
"supplies_alchemists_tools",
|
||||
"supplies_encyclopeida",
|
||||
"supplies_spyglass",
|
||||
"supplies_coded_letters",
|
||||
"supplies_horse",
|
||||
"oddities_seashell_horn",
|
||||
"oddities_dead_donkey",
|
||||
"oddities_ancient_ring",
|
||||
"oddities_songbird",
|
||||
"oddities_human_teeth",
|
||||
"oddities_hat",
|
||||
"oddities_monkey_head",
|
||||
"oddities_heavy_crown",
|
||||
"oddities_giant_serpent_scales",
|
||||
"oddities_silk_dress",
|
||||
"oddities_tyrant_pants",
|
||||
"oddities_shadow_mirror",
|
||||
"oddities_darkvision_glasses",
|
||||
"oddities_divine_blood",
|
||||
"oddities_seeds",
|
||||
"oddities_potion_brawn",
|
||||
"oddities_troll_flesh",
|
||||
"oddities_telepathic_yak",
|
||||
"spells_trinket",
|
||||
"spells_trick_of_the_light",
|
||||
"spells_soundshift",
|
||||
"spells_lifebringer",
|
||||
"spells_whisper",
|
||||
"spells_bind_weapon",
|
||||
"spells_unmask_the_self",
|
||||
"spells_secret_door",
|
||||
"spells_burn_the_past",
|
||||
"spells_master_of_elements",
|
||||
"spells_little_escapologist",
|
||||
"spells_pierce_the_veil",
|
||||
"spells_manic_hands",
|
||||
"spells_shadowbind",
|
||||
"spells_compel",
|
||||
"spells_windstep",
|
||||
"spells_blackout",
|
||||
"spells_spirit_pact",
|
||||
"spells_from_dust_to_dust",
|
||||
"spells_true_miracle",
|
||||
"techniques_only_ones_who_know",
|
||||
"techniques_uncanny_alarm",
|
||||
"techniques_weave_through_water",
|
||||
"techniques_memory_seed",
|
||||
"techniques_flowmotion",
|
||||
"techniques_saving_grace",
|
||||
"techniques_inspiration",
|
||||
"techniques_bind_magic",
|
||||
"techniques_stonewall",
|
||||
"techniques_heart_piercer",
|
||||
"techniques_deadly_focus",
|
||||
"techniques_redo",
|
||||
"techniques_turn_the_tide",
|
||||
"techniques_dispel",
|
||||
"techniques_interdiction",
|
||||
"techniques_fluorescent_transcendence",
|
||||
"techniques_netherwave",
|
||||
"techniques_become_one",
|
||||
"techniques_defy_the_fates",
|
||||
"techniques_doompause",
|
||||
]
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,80 @@
|
||||
.arc {
|
||||
@import "meta/reset";
|
||||
// @import "meta/unset";
|
||||
}
|
||||
|
||||
// shared variables and mixins
|
||||
@import "meta/variables";
|
||||
@import "meta/breakpoints";
|
||||
@import "components/common/mixins";
|
||||
@import "components/common/popups";
|
||||
|
||||
html {
|
||||
font-size: 13px !important;
|
||||
}
|
||||
|
||||
.ui-dialog {
|
||||
.charsheet {
|
||||
padding: 0px !important;
|
||||
button[type=roll] {
|
||||
&::before {
|
||||
font-family: unset;
|
||||
content: unset;
|
||||
}
|
||||
}
|
||||
input {
|
||||
height: unset;
|
||||
width: 100%;
|
||||
&[type=number] {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include repeatingSectionsButtons;
|
||||
|
||||
input[name*="sheet_type"] {
|
||||
&[value="character"] {
|
||||
~ .npc {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&[value="npc"] {
|
||||
~ .character {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.arc {
|
||||
position: relative;
|
||||
font-family: $primary-sans-serif;
|
||||
font-size: 13px;
|
||||
@import "meta/buttons";
|
||||
@import "components/common/inputs";
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
color: $primary-color-light;
|
||||
background: $primary-background-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
color: $primary-color-dark;
|
||||
background: $primary-background-dark;
|
||||
}
|
||||
|
||||
h2 { font-size: 1.5rem; }
|
||||
h3 { font-size: 1.17rem; }
|
||||
h4 { font-size: 1rem; }
|
||||
h5 {
|
||||
font-size: 1rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
// Components
|
||||
@import "components/toolbar";
|
||||
@import "components/header";
|
||||
}
|
||||
|
||||
@import "layouts/character";
|
||||
@import "layouts/roll-template";
|
||||
@@ -0,0 +1,52 @@
|
||||
.approaches {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.approach {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 25%;
|
||||
align-items: center;
|
||||
|
||||
&__label {
|
||||
&--span {
|
||||
font-family: $primary-serif;
|
||||
white-space: nowrap;
|
||||
text-transform: uppercase;
|
||||
writing-mode: vertical-rl;
|
||||
@include rotate(180deg);
|
||||
}
|
||||
}
|
||||
&__value {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 5px double transparent;
|
||||
border-radius: 50%;
|
||||
aspect-ratio: 1 / 1;
|
||||
width: 100%;
|
||||
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
border-color: $primary-accent-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
border-color: $primary-accent-dark;
|
||||
}
|
||||
|
||||
&--input[type="number"] {
|
||||
@include square(100%);
|
||||
padding: 0;
|
||||
font-size: 4rem;
|
||||
@media only screen and (max-width: $large) {
|
||||
font-size: 3rem;
|
||||
}
|
||||
@media only screen and (max-width: $medium) {
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,40 @@
|
||||
|
||||
.background {
|
||||
display: grid;
|
||||
grid-template-rows: repeat(3, auto);
|
||||
row-gap: 8px;
|
||||
height: fit-content;
|
||||
padding: 8px;
|
||||
@media (prefers-color-scheme: light) {
|
||||
background: linear-gradient($tertiary-background-light 75%, transparent);
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
background: linear-gradient($tertiary-background-dark 75%, transparent);
|
||||
}
|
||||
|
||||
&--label {
|
||||
font-size: 1.2rem;
|
||||
font-variant-caps: small-caps;
|
||||
cursor: pointer;
|
||||
}
|
||||
&__rumors {
|
||||
&--wrapper {
|
||||
margin: 8px 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.portrait {
|
||||
display: none;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
&__avi {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
&--img {
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,118 @@
|
||||
|
||||
.bonds {
|
||||
&__header {
|
||||
@include sectionHeader;
|
||||
}
|
||||
}
|
||||
|
||||
.bond {
|
||||
display: grid;
|
||||
grid-template-columns: 2fr 1fr;
|
||||
gap: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
|
||||
&__with {
|
||||
grid-column: 1 / 2;
|
||||
}
|
||||
&__levels {
|
||||
grid-column: 2 / 3;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
column-gap: 2px;
|
||||
align-content: center;
|
||||
}
|
||||
|
||||
&__container {
|
||||
border: 2px solid transparent;
|
||||
@include square(31px);
|
||||
@media (prefers-color-scheme: light) {
|
||||
border-color: $secondary-accent-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
border-color: $secondary-accent-dark;
|
||||
}
|
||||
}
|
||||
|
||||
&__major {
|
||||
display: grid;
|
||||
gap: 1px;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
grid-template-rows: repeat(2, 1fr);
|
||||
grid-template-areas:
|
||||
"minor1 minor2"
|
||||
"minor4 minor3";
|
||||
@include square(27px);
|
||||
@media (prefers-color-scheme: light) {
|
||||
background: linear-gradient($secondary-accent-light, $secondary-accent-light) center/100% 1px no-repeat, repeating-linear-gradient(to right, transparent 0 13px, $secondary-accent-light 0 14px);
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
background: linear-gradient($secondary-accent-dark, $secondary-accent-dark) center/100% 1px no-repeat, repeating-linear-gradient(to right,transparent 0 13px, $secondary-accent-dark 0 14px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bond__minor {
|
||||
border: 1px solid transparent;
|
||||
background: transparent;
|
||||
@include square(13px);
|
||||
cursor: pointer;
|
||||
box-sizing: border-box;
|
||||
appearance: none;
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
|
||||
&.reset { grid-area: minor1; }
|
||||
|
||||
&[value="1"] { grid-area: minor1; }
|
||||
&[value="2"] { grid-area: minor2; }
|
||||
&[value="3"] { grid-area: minor3; }
|
||||
&[value="4"] { grid-area: minor4; }
|
||||
|
||||
&:checked { display: none; }
|
||||
}
|
||||
|
||||
.bond__control {
|
||||
&:not([value="0"]) ~ .bond__minor[value="1"] {
|
||||
grid-area: minor2;
|
||||
}
|
||||
&:is([value="2"], [value="3"], [value="4"]) ~ .bond__minor[value="2"] {
|
||||
grid-area: minor3;
|
||||
}
|
||||
&:is([value="3"], [value="4"]) ~ .bond__minor[value="3"] {
|
||||
grid-area: minor4;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
.bond__minor.reset,
|
||||
.bond__minor:not(.reset):checked ~ .bond__minor {
|
||||
background: $secondary-highlight-light;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.bond__minor.reset,
|
||||
.bond__minor:not(.reset):checked ~ .bond__minor {
|
||||
background: $secondary-highlight-dark;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $large) {
|
||||
.bond {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
&__levels {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
input.bond__with--input[type=text] {
|
||||
padding-left: 0;
|
||||
text-align: center;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
// @media only screen and (max-width: $medium) {
|
||||
// }
|
||||
// @media only screen and (max-width: $small) {
|
||||
// }
|
||||
@@ -0,0 +1,90 @@
|
||||
|
||||
.consequences {
|
||||
&__header {
|
||||
@include sectionHeader;
|
||||
}
|
||||
&__grid {
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr;
|
||||
gap: 0.5rem;
|
||||
align-items: center;
|
||||
justify-items: center;
|
||||
&--header {
|
||||
padding: 0 1rem;
|
||||
text-align: center;
|
||||
font-size: 1.17rem;
|
||||
}
|
||||
}
|
||||
&__roll {
|
||||
justify-self: start;
|
||||
@include rollButton;
|
||||
&--span {
|
||||
text-transform: uppercase;
|
||||
text-align: left;
|
||||
font-size: 1.17rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.consequence {
|
||||
&__die {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
cursor: pointer;
|
||||
&--span {
|
||||
position: relative;
|
||||
top: 4px;
|
||||
font-size: 1.17rem;
|
||||
font-weight: bold;
|
||||
z-index: 1;
|
||||
@media (prefers-color-scheme: light) {
|
||||
color: $secondary-accent-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
color: $secondary-accent-dark;
|
||||
}
|
||||
}
|
||||
&--input {
|
||||
display: none;
|
||||
&:checked {
|
||||
+ .consequence__die--span {
|
||||
@media (prefers-color-scheme: light) {
|
||||
color: $secondary-color-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
color: $secondary-color-dark;
|
||||
}
|
||||
}
|
||||
~ .consequence__die--square {
|
||||
@media (prefers-color-scheme: light) {
|
||||
background: $secondary-accent-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
background: $secondary-accent-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&--square {
|
||||
position: absolute;
|
||||
border: 2px solid transparent;
|
||||
@include square(24px);
|
||||
@media (prefers-color-scheme: light) {
|
||||
border-color: $secondary-accent-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
border-color: $secondary-accent-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
&__description {
|
||||
display: flex;
|
||||
align-items: start;
|
||||
font-variant-caps: small-caps;
|
||||
width: 100%;
|
||||
min-height: 4rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,43 @@
|
||||
.experience {
|
||||
width: 100%;
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr 1fr;
|
||||
gap: 0.5rem;
|
||||
&__header {
|
||||
grid-row: 1;
|
||||
grid-column: 1 / 2;
|
||||
@include sectionHeader;
|
||||
}
|
||||
&__total, &__spent {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
&--input {
|
||||
border: none;
|
||||
font-size: 2rem;
|
||||
}
|
||||
&--span {
|
||||
margin-top: 4px;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
}
|
||||
&__total--input {
|
||||
border: 5px solid transparent;
|
||||
@media (prefers-color-scheme: light) {
|
||||
border-color: $secondary-border-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
border-color: $secondary-border-dark;
|
||||
}
|
||||
}
|
||||
&__spent--input {
|
||||
border: 5px double transparent;
|
||||
@media (prefers-color-scheme: light) {
|
||||
border-color: $primary-border-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
border-color: $primary-border-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,147 @@
|
||||
|
||||
.header {
|
||||
|
||||
&__character {
|
||||
display: grid;
|
||||
grid-template-columns: 3fr 2fr;
|
||||
grid-template-rows: auto auto;
|
||||
grid-gap: 0.5rem;
|
||||
}
|
||||
|
||||
&__npc {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
&--input {
|
||||
text-align: center;
|
||||
font-size: 2rem;
|
||||
font-family: $primary-serif;
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
&__title {
|
||||
grid-row: 1 / 3;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-content: space-between;
|
||||
|
||||
&--header {
|
||||
font-family: $primary-serif;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
&--input[type=text] {
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
&__pronouns, &__player {
|
||||
&--input {
|
||||
font-size: 1rem;
|
||||
font-family: $primary-serif;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
&__pronouns {
|
||||
grid-row: 1;
|
||||
grid-column: 2 / 3;
|
||||
}
|
||||
|
||||
&__player {
|
||||
grid-row: 2;
|
||||
grid-column: 2 / 3;
|
||||
}
|
||||
|
||||
&__name {
|
||||
display: none;
|
||||
&--span {
|
||||
font-size: 2rem;
|
||||
font-family: $primary-serif;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $medium) {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
grid-template-rows: 1fr auto auto;
|
||||
&__title, &__pronouns, &__player {
|
||||
&--label {
|
||||
padding-bottom: 1rem;
|
||||
text-align: center;
|
||||
}
|
||||
&--input {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
&__title {
|
||||
grid-row: 1;
|
||||
grid-column: 1 / 3;
|
||||
}
|
||||
&__pronouns {
|
||||
grid-row: 2;
|
||||
grid-column: 1 / 2;
|
||||
}
|
||||
&__player {
|
||||
grid-row: 2;
|
||||
grid-column: 2 / 3;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $small) {
|
||||
&__character.character, &__npc.npc {
|
||||
display: none;
|
||||
}
|
||||
&__name {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
.header {
|
||||
&__title {
|
||||
&--input {
|
||||
border-color: $primary-accent-light;
|
||||
}
|
||||
&--header {
|
||||
color: $primary-accent-light !important;
|
||||
}
|
||||
}
|
||||
&__pronouns, &__player {
|
||||
&--input {
|
||||
border-color: $primary-accent-light;
|
||||
}
|
||||
}
|
||||
&__name {
|
||||
color: $primary-accent-light !important;
|
||||
}
|
||||
&__npc--input {
|
||||
border-color: $primary-accent-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.header {
|
||||
&__title {
|
||||
&--input {
|
||||
border-color: $primary-accent-dark;
|
||||
}
|
||||
&--header {
|
||||
color: $primary-accent-dark !important;
|
||||
}
|
||||
}
|
||||
&__pronouns, &__player {
|
||||
&--input {
|
||||
border-color: $primary-accent-dark;
|
||||
}
|
||||
}
|
||||
&__name {
|
||||
color: $primary-accent-dark !important;
|
||||
}
|
||||
&__npc--input {
|
||||
border-color: $primary-accent-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,227 @@
|
||||
.healths {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
justify-content: center;
|
||||
@include fill-x;
|
||||
row-gap: 0.5rem;
|
||||
}
|
||||
|
||||
.rests {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr auto ) 1fr;
|
||||
width: 100%;
|
||||
&__spacer {
|
||||
align-self: center;
|
||||
&--line {
|
||||
border-bottom: 2px solid transparent;
|
||||
}
|
||||
}
|
||||
&__short, &__long {
|
||||
&--span {
|
||||
font-family: $primary-serif;
|
||||
font-size: 1.2rem;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
padding: 0 1rem;
|
||||
}
|
||||
}
|
||||
&__short {
|
||||
grid-column: 2 / 3;
|
||||
&--button {
|
||||
border: 2px solid transparent;
|
||||
}
|
||||
}
|
||||
&__long {
|
||||
grid-column: 4 / 5;
|
||||
&--button {
|
||||
border: 2px solid transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.health {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
@include fill-x;
|
||||
|
||||
&__type, &__mod, &__max, &__current {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
border: 5px double transparent;
|
||||
width: 6rem;
|
||||
|
||||
&--span {
|
||||
padding: 0.2rem 0;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
&__mod, &__max, &__current {
|
||||
&--span {
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
&--input {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
&__type {
|
||||
flex-direction: row;
|
||||
justify-content: start;
|
||||
&--span {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $medium) {
|
||||
.healths {
|
||||
justify-items: center;
|
||||
}
|
||||
.health {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
width: 80%;
|
||||
|
||||
&__type, &__mod, &__max, &__current {
|
||||
border-width: 3px;
|
||||
}
|
||||
&__type {
|
||||
grid-row: 1 / 2;
|
||||
grid-column: 1 / 4;
|
||||
justify-content: center;
|
||||
width: auto;
|
||||
border: none;
|
||||
&--span {
|
||||
font-size: 1.2rem;
|
||||
text-align: left;
|
||||
letter-spacing: 0.5rem;
|
||||
}
|
||||
}
|
||||
&__mod, &__max, &__current {
|
||||
grid-row: 2 / 3;
|
||||
width: auto;
|
||||
}
|
||||
&__mod {
|
||||
grid-column: 1 / 2;
|
||||
}
|
||||
&__max {
|
||||
grid-column: 2 / 3;
|
||||
}
|
||||
&__current {
|
||||
grid-column: 3 / 4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $small) {
|
||||
.rests {
|
||||
grid-template-columns: auto;
|
||||
row-gap: 0.5rem;
|
||||
&__spacer {
|
||||
display: none;
|
||||
}
|
||||
&__short, &__long {
|
||||
&--button {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
&__short {
|
||||
grid-column: auto;
|
||||
}
|
||||
&__long {
|
||||
grid-column: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
.rests {
|
||||
&__spacer {
|
||||
&--line {
|
||||
border-color: $primary-border-light;
|
||||
}
|
||||
}
|
||||
&__short, &__long {
|
||||
&--button:hover {
|
||||
border-color: $primary-highlight-light;
|
||||
background: $primary-highlight-light;
|
||||
color: $primary-color-light;
|
||||
}
|
||||
}
|
||||
&__short {
|
||||
&--button {
|
||||
border-color: $primary-border-light;
|
||||
background: $primary-border-light;
|
||||
color: $secondary-color-light;
|
||||
}
|
||||
}
|
||||
&__long {
|
||||
&--button {
|
||||
border-color: $primary-border-light;
|
||||
background: $primary-background-light;
|
||||
color: $primary-border-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.health {
|
||||
&__type {
|
||||
background: $primary-background-light;
|
||||
}
|
||||
&__mod, &__max {
|
||||
background: $secondary-background-light;
|
||||
}
|
||||
&__current {
|
||||
background: $primary-background-light;
|
||||
border-color: $primary-border-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.rests {
|
||||
&__spacer {
|
||||
&--line {
|
||||
border-color: $primary-border-dark;
|
||||
}
|
||||
}
|
||||
&__short, &__long {
|
||||
&--button:hover {
|
||||
border-color: $primary-highlight-dark;
|
||||
background: $primary-highlight-dark;
|
||||
color: $primary-color-dark;
|
||||
}
|
||||
}
|
||||
&__short {
|
||||
&--button {
|
||||
border-color: $primary-border-dark;
|
||||
background: $primary-border-dark;
|
||||
color: $secondary-color-dark;
|
||||
}
|
||||
}
|
||||
&__long {
|
||||
&--button {
|
||||
border-color: $primary-border-dark;
|
||||
background: $primary-background-dark;
|
||||
color: $primary-border-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.health {
|
||||
&__type {
|
||||
background: $primary-background-dark;
|
||||
}
|
||||
&__mod, &__max {
|
||||
background: $secondary-background-dark;
|
||||
}
|
||||
&__current {
|
||||
background: $primary-background-dark;
|
||||
border-color: $primary-border-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,254 @@
|
||||
|
||||
.inventory {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
row-gap: 8px;
|
||||
width: 100%;
|
||||
align-items: flex-end;
|
||||
&__header {
|
||||
grid-row: 1;
|
||||
grid-column: 1 / 2;
|
||||
white-space: nowrap;
|
||||
@include sectionHeader;
|
||||
}
|
||||
&__type, &__short-desc, &__qty {
|
||||
&--span {
|
||||
font-variant-caps: small-caps;
|
||||
}
|
||||
}
|
||||
&__type {
|
||||
grid-row: 1;
|
||||
grid-column: 2 / 3;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
// &--supplies, &--defense, &--spells {
|
||||
// grid-row: 1;
|
||||
// @include rotate(-45deg);
|
||||
// }
|
||||
// &--supplies {
|
||||
// grid-column: 2 / 3;
|
||||
// }
|
||||
// &--defense {
|
||||
// grid-column: 3 / 4;
|
||||
// }
|
||||
// &--spells {
|
||||
// grid-column: 4 / 5;
|
||||
// }
|
||||
}
|
||||
&__qty {
|
||||
grid-row: 1;
|
||||
grid-column: 3 / 4;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
margin-right: 8px;
|
||||
}
|
||||
&__items {
|
||||
grid-row: 2;
|
||||
grid-column: 1 / 6;
|
||||
padding: 0 8px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
input[name*="item_expand"] {
|
||||
&[value="0"] {
|
||||
~ .item--details {
|
||||
display: none;
|
||||
}
|
||||
~ .item .item__expand--img {
|
||||
display: inline;
|
||||
}
|
||||
~ .item .item__universal {
|
||||
.item--type {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
&[value="on"] {
|
||||
~ .item .item__close--img {
|
||||
display: inline;
|
||||
}
|
||||
~ .item .item__universal {
|
||||
grid-template-columns: 1fr auto;
|
||||
.item--quantity {
|
||||
grid-row: 2 / 3;
|
||||
}
|
||||
.item__expand {
|
||||
grid-column: 2 / 3;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item {
|
||||
margin: 4px 0;
|
||||
&__wrapper {
|
||||
margin: 4px 0;
|
||||
padding: 0 4px;
|
||||
border: 2px solid transparent;
|
||||
@media (prefers-color-scheme: light) {
|
||||
border-color: $primary-accent-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
border-color: $primary-accent-dark;
|
||||
}
|
||||
}
|
||||
&--details {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: 8px 0;
|
||||
}
|
||||
&__block {
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 0.5rem;
|
||||
}
|
||||
&__universal {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr repeat(2, auto);
|
||||
}
|
||||
}
|
||||
|
||||
$itemTypes: "supplies_and_sundries", "oddities_and_valuables", "damage_and_defense", "spells_and_techniques";
|
||||
@each $name in $itemTypes {
|
||||
.item__#{$name} {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.item__block--toggle {
|
||||
&[value="#{$name}"] {
|
||||
~ .item--details .item__#{$name} {
|
||||
display: grid;
|
||||
@media only screen and (max-width: $medium) {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item {
|
||||
&--name, &--type, &--quantity {
|
||||
.field { grid-template-rows: auto; }
|
||||
}
|
||||
&--name {
|
||||
grid-row: 1 / 2;
|
||||
grid-column: 1 / 2;
|
||||
}
|
||||
&--quantity {
|
||||
grid-row: 1 / 2;
|
||||
grid-column: 2 / 3;
|
||||
.field--number {
|
||||
font-size: 1.2rem;
|
||||
padding: 0.2rem;
|
||||
width: 3.5rem;
|
||||
height: 3rem;
|
||||
border: none;
|
||||
border-bottom: 2px double transparent;
|
||||
@media (prefers-color-scheme: light) {
|
||||
border-color: $primary-border-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
border-color: $primary-border-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
&--type {
|
||||
grid-row: 2 / 3;
|
||||
grid-column: 1 / 2;
|
||||
}
|
||||
&__expand {
|
||||
grid-row: 1 / 2;
|
||||
grid-column: 3 / 4;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 3.5rem;
|
||||
margin: 0 4px;
|
||||
&--img {
|
||||
display: none;
|
||||
cursor: pointer;
|
||||
@include square(20px);
|
||||
@include imgHover;
|
||||
}
|
||||
}
|
||||
&__close--img {
|
||||
display: none;
|
||||
cursor: pointer;
|
||||
@include square(20px);
|
||||
@include imgHover;
|
||||
}
|
||||
&--description {
|
||||
grid-column: 1 / 5;
|
||||
}
|
||||
&--first_boon {
|
||||
grid-row: 2;
|
||||
grid-column: 1 / 3;
|
||||
}
|
||||
&--second_boon {
|
||||
grid-row: 2;
|
||||
grid-column: 3 / 5;
|
||||
}
|
||||
&--complexity {
|
||||
grid-row: 2;
|
||||
grid-column: 3 / 5;
|
||||
margin: 0.5rem 0;
|
||||
|
||||
.field {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
@include fill-in-radios;
|
||||
.radio__rank {
|
||||
border: 1px solid $primary-accent-light;
|
||||
background: $primary-accent-light;
|
||||
}
|
||||
.radio__rank.reset {
|
||||
background: $primary-accent-light;
|
||||
}
|
||||
}
|
||||
&--base_effect {
|
||||
grid-row: 2 / 5;
|
||||
grid-column: 1 / 3;
|
||||
.field--textarea { height: 100%; }
|
||||
}
|
||||
&--enhanced {
|
||||
grid-row: 3 / 4;
|
||||
grid-column: 3 / 5;
|
||||
}
|
||||
&--ritual {
|
||||
grid-row: 4 / 5;
|
||||
grid-column: 3 / 5;
|
||||
}
|
||||
}
|
||||
|
||||
.field {
|
||||
display: grid;
|
||||
grid-template-rows: auto 1fr;
|
||||
@include square(100%);
|
||||
&__label {
|
||||
&--span {
|
||||
text-transform: uppercase;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
}
|
||||
&--text, &--number, &--select, &--textarea {
|
||||
width: 100%;
|
||||
}
|
||||
&--textarea {
|
||||
font-family: $primary-serif;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $small) {
|
||||
.item {
|
||||
&--complexity {
|
||||
.field {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,113 @@
|
||||
.skills {
|
||||
width: 100%;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, auto);
|
||||
align-items: center;
|
||||
&__header {
|
||||
grid-column: 1 / 5;
|
||||
@include sectionHeader;
|
||||
}
|
||||
&__category {
|
||||
display: grid;
|
||||
}
|
||||
}
|
||||
|
||||
.skill-category {
|
||||
&__header {
|
||||
grid-column: 1 / 5;
|
||||
display: grid;
|
||||
grid-template-columns: auto 2rem 1fr;
|
||||
margin: 1rem 0;
|
||||
&--span {
|
||||
grid-column: 1;
|
||||
margin-right: 0.5rem;
|
||||
text-transform: uppercase;
|
||||
white-space: nowrap;
|
||||
}
|
||||
&--line {
|
||||
grid-column: 3;
|
||||
border-bottom: 2px solid transparent;
|
||||
align-self: center;
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
border-color: $primary-border-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
border-color: $primary-border-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.skill__button {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
@include rollButton;
|
||||
&__ranks {
|
||||
display: flex;
|
||||
align-self: center;
|
||||
}
|
||||
&__popup {
|
||||
grid-column: 3;
|
||||
}
|
||||
}
|
||||
|
||||
.skills {
|
||||
@include fill-in-radios;
|
||||
|
||||
.radio__rank {
|
||||
border: 1px solid transparent;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
.radio__rank {
|
||||
border-color: $primary-accent-light;
|
||||
background: $primary-accent-light;
|
||||
}
|
||||
.radio__rank.reset {
|
||||
background: $primary-accent-light;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.radio__rank {
|
||||
border-color: $primary-accent-dark;
|
||||
background: $primary-accent-dark;
|
||||
}
|
||||
.radio__rank.reset {
|
||||
background: $primary-accent-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $small) {
|
||||
.skills {
|
||||
grid-template-columns: repeat(2, auto);
|
||||
&__header {
|
||||
grid-column: 1 / 3;
|
||||
}
|
||||
|
||||
.radio__ranks {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.radio__rank {
|
||||
@include square(1.5rem);
|
||||
}
|
||||
}
|
||||
|
||||
.skill-category {
|
||||
&__header {
|
||||
grid-column: 1 / 3;
|
||||
&--span {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.skill__button {
|
||||
&--span {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,202 @@
|
||||
.toolbar {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
&__labels {
|
||||
display: inline-flex;
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
}
|
||||
&__glossary, &__settings {
|
||||
font-weight: normal;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
|
||||
&--icon {
|
||||
@include square(24px);
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
&__glossary {
|
||||
input[type=checkbox] {
|
||||
display: none;
|
||||
&:checked + .toolbar__glossary--icon {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
&--icon {
|
||||
font-family: "pictos three";
|
||||
}
|
||||
}
|
||||
&__settings {
|
||||
input[type=checkbox] {
|
||||
display: none;
|
||||
&:checked + .toolbar__settings--icon {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
&--icon {
|
||||
font-family: pictos;
|
||||
}
|
||||
}
|
||||
&__version {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
opacity: 0.5;
|
||||
white-space: nowrap;
|
||||
&--text, &--number {
|
||||
margin: 0 0.5rem;
|
||||
font-variant: small-caps;
|
||||
line-height: 2.5rem;
|
||||
font-family: $primary-serif;
|
||||
}
|
||||
&--text::after {
|
||||
content: ":";
|
||||
}
|
||||
}
|
||||
|
||||
.settings, .glossary {
|
||||
left: auto;
|
||||
right: 5rem;
|
||||
}
|
||||
.settings {
|
||||
width: 250px !important;
|
||||
&--wrapper {
|
||||
padding: 0 0.5rem 0.5rem;
|
||||
}
|
||||
&__mode, &__theme, &__tooltips, &__export {
|
||||
margin-top: 0.5rem;
|
||||
&--header {
|
||||
font-family: $primary-serif;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
&--span {
|
||||
display: block;
|
||||
margin: 1rem 0 0 0.5rem;
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
&__export {
|
||||
&--span {
|
||||
margin: 1rem 0 0 0.5rem;
|
||||
opacity: 0.5;
|
||||
}
|
||||
&--btn {
|
||||
font-size: 1.17rem;
|
||||
font-family: $primary-serif;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
&--json {
|
||||
resize: none;
|
||||
border: none;
|
||||
font-size: 0.7rem;
|
||||
line-height: 1rem;
|
||||
margin-top: 0.5rem;
|
||||
padding: 0;
|
||||
white-space: normal;
|
||||
font-family: $primary-monospace;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.settings__export--toggle {
|
||||
&[value="0"] {
|
||||
~ .settings__export--json { display: none; }
|
||||
~ .settings__export--span { display: block; }
|
||||
}
|
||||
&[value="on"] {
|
||||
~ .settings__export--json { display: block; }
|
||||
~ .settings__export--span { display: none; }
|
||||
}
|
||||
}
|
||||
|
||||
.glossary {
|
||||
width: 75% !important;
|
||||
height: 75% !important;
|
||||
&--wrapper {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
&__entry {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto 1fr;
|
||||
height: 2rem;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
&--line {
|
||||
border-bottom: 2px solid transparent;
|
||||
margin: 0 1rem;
|
||||
}
|
||||
&--header {
|
||||
font-family: $primary-serif;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
&__definition {
|
||||
padding: 0 1.5rem;
|
||||
text-align: justify;
|
||||
@include firstLetter;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
.toolbar {
|
||||
.settings {
|
||||
&__mode, &__theme, &__tooltips {
|
||||
&--header {
|
||||
color: $primary-accent-light;
|
||||
}
|
||||
}
|
||||
&__export{
|
||||
&--btn {
|
||||
color: $primary-accent-light;
|
||||
}
|
||||
&--json {
|
||||
background: $tertiary-background-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
.glossary {
|
||||
&__entry {
|
||||
&--line {
|
||||
border-color: $primary-highlight-light;
|
||||
}
|
||||
&--header {
|
||||
color: $primary-accent-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.toolbar {
|
||||
.settings {
|
||||
&__mode, &__theme, &__tooltips {
|
||||
&--header {
|
||||
color: $primary-accent-dark;
|
||||
}
|
||||
}
|
||||
&__export{
|
||||
&--btn {
|
||||
color: $primary-accent-dark;
|
||||
}
|
||||
&--json {
|
||||
background: $tertiary-background-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
.glossary {
|
||||
&__entry {
|
||||
&--line {
|
||||
border-color: $primary-highlight-dark;
|
||||
}
|
||||
&--header {
|
||||
color: $primary-accent-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,45 @@
|
||||
|
||||
input, textarea, select {
|
||||
box-sizing: border-box; // Opera/IE 8+
|
||||
-moz-box-sizing: border-box; // Firefox, other Gecko
|
||||
-webkit-box-sizing: border-box; // Safari/Chrome, other WebKit
|
||||
|
||||
font-family: $primary-sans-serif;
|
||||
font-size: 1rem;
|
||||
background: none;
|
||||
border: none;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-radius: 0;
|
||||
text-decoration: none;
|
||||
line-height: 1.5rem;
|
||||
@include fill-x;
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
border-color: $primary-border-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
border-color: $primary-border-dark;
|
||||
}
|
||||
}
|
||||
|
||||
input[type=text] {
|
||||
height:3rem;
|
||||
padding: 0;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
textarea {
|
||||
resize: none;
|
||||
min-height: 5rem;
|
||||
max-height: 15rem;
|
||||
overflow-y: scroll;
|
||||
padding-top: 0.5rem;
|
||||
padding-left: 1rem;
|
||||
}
|
||||
select {
|
||||
height:3rem;
|
||||
}
|
||||
input[type='checkbox'].hide-element,
|
||||
input[type='radio'].hide-element,
|
||||
.hide-element {
|
||||
display: none;
|
||||
}
|
||||
@@ -0,0 +1,204 @@
|
||||
|
||||
@mixin sectionHeader {
|
||||
display: flex;
|
||||
&--span {
|
||||
font-size: 1.33rem;
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin fill-x {
|
||||
width: -moz-available; // WebKit-based browsers will ignore this.
|
||||
width: -webkit-fill-available; // Mozilla-based browsers will ignore this.
|
||||
// width: stretch;
|
||||
}
|
||||
|
||||
@mixin fill-y {
|
||||
height: -moz-available; // WebKit-based browsers will ignore this.
|
||||
height: -webkit-fill-available; // Mozilla-based browsers will ignore this.
|
||||
// height: fill-available;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
@mixin rotate($deg: -90deg) {
|
||||
transform: rotate($deg);
|
||||
// Legacy vendor prefixes
|
||||
-webkit-transform: rotate($deg); // Safari
|
||||
-moz-transform: rotate($deg); // Firefox
|
||||
-ms-transform: rotate($deg); // IE
|
||||
-o-transform: rotate($deg); // Opera
|
||||
}
|
||||
|
||||
@mixin square($length: 1rem) {
|
||||
width: $length;
|
||||
height: $length;
|
||||
}
|
||||
|
||||
@mixin contentImage($img) {
|
||||
background-image: url("#{$root-url}#{$img}");
|
||||
background-size: 18px;
|
||||
background-repeat: no-repeat;
|
||||
@include square(18px);
|
||||
}
|
||||
|
||||
@mixin firstLetter {
|
||||
&::first-letter {
|
||||
font-family: $primary-serif;
|
||||
font-size: 1.5rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin imgHover {
|
||||
opacity: 0.5;
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin rollButton {
|
||||
&--btn {
|
||||
text-align: left;
|
||||
white-space: nowrap;
|
||||
margin-right: 0.5rem;
|
||||
border: 1px solid transparent;
|
||||
padding: 4px;
|
||||
&:hover {
|
||||
font-weight: bold;
|
||||
@media (prefers-color-scheme: light) {
|
||||
background: $primary-highlight-light;
|
||||
border-color: $primary-highlight-light
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
background: $primary-highlight-dark;
|
||||
border-color: $primary-highlight-dark
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin repeatingSectionsButtons {
|
||||
.ui-dialog .charsheet {
|
||||
.repcontainer .repitem .itemcontrol {
|
||||
.repcontrol_move, .repcontrol_del {
|
||||
@include contentImage("unlock.svg");
|
||||
font-size: 0;
|
||||
&:hover {
|
||||
background-color: transparent;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.repcontrol_move {
|
||||
@include contentImage("move.svg");
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.repcontrol_del {
|
||||
@include contentImage("delete.svg");
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
|
||||
.repcontainer.ui-sortable.editmode[data-groupname*="repeating_"] {
|
||||
~ .repcontrol[data-groupname*="repeating_"] {
|
||||
.repcontrol_edit {
|
||||
font-size: 0;
|
||||
opacity: 0.5;
|
||||
@include contentImage("unlock.svg");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.repcontrol_add, .repcontrol_edit {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0.25rem 1rem;
|
||||
margin: 0.5rem 0.25rem;
|
||||
box-shadow: none;
|
||||
outline: none;
|
||||
|
||||
color: $jet;
|
||||
font-family: $primary-serif;
|
||||
font-weight: normal;
|
||||
font-size: 0px;
|
||||
letter-spacing: 0.04em;
|
||||
text-shadow: none;
|
||||
|
||||
&::before, &::after {
|
||||
visibility: visible;
|
||||
font-family: $primary-serif;
|
||||
text-transform: uppercase;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
letter-spacing: 0.04em;
|
||||
color: $jet;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: transparent;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.repcontrol_add {
|
||||
@include contentImage("add.svg");
|
||||
opacity: 0.5;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.repcontrol_edit {
|
||||
@include contentImage("lock.svg");
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@mixin fill-in-radios {
|
||||
.radio__ranks {
|
||||
display: flex;
|
||||
}
|
||||
.radio__rank {
|
||||
order: 1;
|
||||
@include square(13px);
|
||||
margin: 0 0.25rem;
|
||||
appearance: none;
|
||||
-webkit-appearance: none;
|
||||
cursor: pointer;
|
||||
&:hover {
|
||||
@media (prefers-color-scheme: light) {
|
||||
background-color: $primary-highlight-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
background-color: $primary-highlight-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
.radio__rank:checked {
|
||||
display: none;
|
||||
}
|
||||
.radio__rank:checked ~ .radio__rank {
|
||||
order: 3;
|
||||
background-color: transparent;
|
||||
&:hover {
|
||||
@media (prefers-color-scheme: light) {
|
||||
background-color: $primary-highlight-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
background-color: $primary-highlight-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
.radio__rank.reset {
|
||||
order: 2;
|
||||
&:hover {
|
||||
@media (prefers-color-scheme: light) {
|
||||
background-color: $primary-highlight-light;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
background-color: $primary-highlight-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,152 @@
|
||||
|
||||
.toggle-popup[value="0"] + .popup {
|
||||
display: none;
|
||||
}
|
||||
.toggle-tooltip[value="0"] + .help {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.popup {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
position: fixed;
|
||||
top: 7rem;
|
||||
left: 4rem;
|
||||
border: 2px solid transparent;
|
||||
padding: 0.5rem;
|
||||
width: 50%;
|
||||
z-index: 1000;
|
||||
min-width: 255px;
|
||||
box-shadow: 5px 5px 6px rgba($jet, 0.2);
|
||||
|
||||
&__title {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: -1.5rem;
|
||||
height: 2rem;
|
||||
align-items: end;
|
||||
text-align: center;
|
||||
&--span {
|
||||
padding: 0.2rem 0.5rem;
|
||||
border: 2px solid transparent;
|
||||
font-family: $primary-serif;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
&__close {
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
height: 2rem;
|
||||
position: absolute;
|
||||
right: 1rem;
|
||||
width: fit-content !important;
|
||||
&:hover {
|
||||
transition: all 1s;
|
||||
@include rotate(360deg);
|
||||
}
|
||||
&--btn {
|
||||
display: none !important;
|
||||
}
|
||||
&--symbol {
|
||||
float: right;
|
||||
@include square(18px);
|
||||
@include imgHover;
|
||||
}
|
||||
}
|
||||
&__header {
|
||||
font-family: $primary-serif;
|
||||
text-transform: uppercase;
|
||||
padding-bottom: 8px;
|
||||
@include sectionHeader;
|
||||
}
|
||||
&__content {
|
||||
overflow-y: scroll;
|
||||
@include firstLetter;
|
||||
}
|
||||
}
|
||||
|
||||
.help {
|
||||
@include square(12px);
|
||||
&__label {
|
||||
&--input{
|
||||
display: none !important;
|
||||
}
|
||||
&--icon {
|
||||
@include square(12px);
|
||||
cursor: help;
|
||||
@include imgHover;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
.popup {
|
||||
border-color: $primary-highlight-light;
|
||||
background: $primary-background-light !important;
|
||||
color: $jet;
|
||||
&__title {
|
||||
&--span {
|
||||
color: $primary-color-light;
|
||||
background: $primary-highlight-light;
|
||||
border-color: $primary-highlight-light;
|
||||
}
|
||||
}
|
||||
&__header {
|
||||
&--span {
|
||||
color: $primary-accent-light;
|
||||
}
|
||||
}
|
||||
&__close:hover {
|
||||
color: $primary-accent-light;
|
||||
fill: $primary-accent-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
.popup {
|
||||
border-color: $primary-highlight-light;
|
||||
background: $primary-background-light !important;
|
||||
color: $jet;
|
||||
&__title {
|
||||
&--span {
|
||||
color: $primary-color-light;
|
||||
background: $primary-highlight-light;
|
||||
border-color: $primary-highlight-light;
|
||||
}
|
||||
}
|
||||
&__header {
|
||||
&--span {
|
||||
color: $primary-accent-light;
|
||||
}
|
||||
}
|
||||
&__close:hover {
|
||||
color: $primary-accent-light;
|
||||
fill: $primary-accent-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.popup {
|
||||
border-color: $primary-highlight-dark;
|
||||
background: $primary-background-dark !important;
|
||||
color: $jet;
|
||||
&__title {
|
||||
&--span {
|
||||
color: $primary-color-dark;
|
||||
background: $primary-highlight-dark;
|
||||
border-color: $primary-highlight-dark;
|
||||
}
|
||||
}
|
||||
&__header {
|
||||
&--span {
|
||||
color: $primary-accent-dark;
|
||||
}
|
||||
}
|
||||
&__close:hover {
|
||||
color: $primary-accent-dark;
|
||||
fill: $primary-accent-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
.arc {
|
||||
.arc__layout {
|
||||
&--left {
|
||||
display: grid;
|
||||
grid-template-rows: repeat(4, auto) 1fr;
|
||||
row-gap: 24px;
|
||||
height: fit-content;
|
||||
}
|
||||
&--right {
|
||||
display: grid;
|
||||
grid-template-rows: repeat(4, auto);
|
||||
row-gap: 24px;
|
||||
height: fit-content;
|
||||
}
|
||||
@import "../components/health";
|
||||
@import "../components/approaches";
|
||||
@import "../components/skills";
|
||||
@import "../components/background";
|
||||
@import "../components/bonds";
|
||||
@import "../components/experience";
|
||||
@import "../components/consequences";
|
||||
@import "../components/inventory";
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,423 @@
|
||||
|
||||
|
||||
@mixin templateContainer {
|
||||
width: 100%;
|
||||
max-width: 400px;
|
||||
|
||||
.sheet-arc {
|
||||
&__container {
|
||||
display: grid;
|
||||
box-sizing: border-box;
|
||||
gap: 0;
|
||||
padding: 4px;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
&__banner {
|
||||
height: 30px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
height: 30px;
|
||||
&.sheet-short-rest {
|
||||
background-image: url("#{$root-url}tab_short_rest.png");
|
||||
}
|
||||
&.sheet-long-rest {
|
||||
background-image: url("#{$root-url}tab_long_rest.png");
|
||||
}
|
||||
&.sheet-skill-test {
|
||||
background-image: url("#{$root-url}tab_skill_check.png");
|
||||
}
|
||||
}
|
||||
|
||||
&__content {
|
||||
display: grid;
|
||||
grid-template-rows: auto 1fr;
|
||||
row-gap: 12px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
padding: 24px 8px 16px 8px;
|
||||
min-height: 200px;
|
||||
&.sheet-short-rest {
|
||||
background-image: url("#{$root-url}bg_short_rest.png");
|
||||
}
|
||||
&.sheet-long-rest {
|
||||
background-image: url("#{$root-url}bg_long_rest.png");
|
||||
}
|
||||
&.sheet-skill-test {
|
||||
grid-template-rows: auto auto 1fr;
|
||||
}
|
||||
&.sheet-fallen {
|
||||
background-image: url("#{$root-url}bg_fallen.png");
|
||||
}
|
||||
}
|
||||
|
||||
&__sentence {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: baseline;
|
||||
padding: 4px;
|
||||
|
||||
&--name {
|
||||
font-family: $secondary-serif;
|
||||
font-size: 3em;
|
||||
color: $primary-accent-light;
|
||||
text-align: left;
|
||||
line-height: 1em;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
&--verb {
|
||||
font-family: $primary-sans-serif;
|
||||
font-size: 1.33em;
|
||||
padding: 0 0.25em;
|
||||
text-align: left;
|
||||
font-style: oblique;
|
||||
&.sheet-short-rest {
|
||||
color: $short-rest-primary-color;
|
||||
}
|
||||
&.sheet-long-rest {
|
||||
color: $long-rest-primary-color;
|
||||
}
|
||||
&.sheet-skill-test {
|
||||
color: $skill-test-primary-color;
|
||||
}
|
||||
&.sheet-fallen {
|
||||
color: $fallen-primary-color;
|
||||
}
|
||||
}
|
||||
|
||||
&--action {
|
||||
font-family: $primary-sans-serif;
|
||||
font-size: 2em;
|
||||
font-weight: bold;
|
||||
text-align: left;
|
||||
font-style: oblique;
|
||||
text-transform: lowercase;
|
||||
&.sheet-short-rest {
|
||||
color: $short-rest-primary-color;
|
||||
}
|
||||
&.sheet-long-rest {
|
||||
color: $long-rest-primary-color;
|
||||
}
|
||||
&.sheet-skill-test {
|
||||
color: $skill-test-primary-color;
|
||||
}
|
||||
&.sheet-fallen {
|
||||
color: $fallen-primary-color;
|
||||
}
|
||||
&::after {
|
||||
content: ".";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__footnote {
|
||||
font-family: $secondary-serif;
|
||||
text-align: end;
|
||||
margin: 4px 0;
|
||||
&--span { font-size: 0.8em; }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
%sheetResult {
|
||||
flex: none;
|
||||
order: 1;
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
%inlinerollresult {
|
||||
font-style: normal;
|
||||
background: transparent;
|
||||
border: 0px solid transparent;
|
||||
box-sizing: border-box;
|
||||
--box-shadow-color: transparent;
|
||||
box-shadow: none;
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
%fullfail {
|
||||
background: transparent;
|
||||
border-color:transparent;
|
||||
box-sizing: border-box;
|
||||
--box-shadow-color:transparent;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
%fullcrit {
|
||||
background:transparent;
|
||||
border-color:transparent;
|
||||
box-sizing: border-box;
|
||||
--box-shadow-color:transparent;
|
||||
border-radius: 0;
|
||||
background: none;
|
||||
}
|
||||
|
||||
.sheet-rolltemplate {
|
||||
&-recover,
|
||||
&-skills,
|
||||
&-fallen {
|
||||
@include templateContainer;
|
||||
}
|
||||
}
|
||||
|
||||
.sheet-rolltemplate-recover {
|
||||
.sheet-arc {
|
||||
&__recover {
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr;
|
||||
align-items: center;
|
||||
column-gap: 4px;
|
||||
font-family: $primary-sans-serif;
|
||||
&--arrow, &--text {
|
||||
line-height: 1.8em;
|
||||
}
|
||||
&.sheet-short-rest {
|
||||
color: $primary-color-light;
|
||||
.inlinerollresult {
|
||||
border-color: $primary-color-light;
|
||||
}
|
||||
}
|
||||
&.sheet-long-rest {
|
||||
color: $secondary-color-light;
|
||||
.inlinerollresult {
|
||||
border-color: $tertiary-background-light;
|
||||
}
|
||||
}
|
||||
.inlinerollresult {
|
||||
@extend %inlinerollresult;
|
||||
padding: 0 4px;
|
||||
font-family: $primary-sans-serif;
|
||||
font-weight: bold;
|
||||
font-size: 1.33em;
|
||||
border-bottom: 2px solid transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sheet-rolltemplate-fallen {
|
||||
.sheet-arc {
|
||||
&__fallen {
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr;
|
||||
align-items: flex-start;
|
||||
column-gap: 4px;
|
||||
font-family: $secondary-serif;
|
||||
font-style: italic;
|
||||
&--roll, &--text {
|
||||
line-height: 1.8em;
|
||||
}
|
||||
&--text {
|
||||
font-family: $primary-sans-serif;
|
||||
}
|
||||
&.sheet-fallen {
|
||||
color: $secondary-color-light;
|
||||
}
|
||||
.inlinerollresult {
|
||||
@extend %inlinerollresult;
|
||||
padding: 0 4px;
|
||||
font-weight: bold;
|
||||
font-size: 3em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sheet-rolltemplate-skills {
|
||||
.sheet-display-control {
|
||||
display: none;
|
||||
&.sheet-success ~ .sheet-arc__content {
|
||||
&.sheet-skill-test {
|
||||
background-image: url("#{$root-url}bg_check_success.png");
|
||||
}
|
||||
.sheet-arc__roll--value {
|
||||
box-shadow: 0 0 4px 4px $skill-test-success-border;
|
||||
border-color: $skill-test-success-shadow;
|
||||
}
|
||||
}
|
||||
&.sheet-tie ~ .sheet-arc__content {
|
||||
&.sheet-skill-test {
|
||||
background-image: url("#{$root-url}bg_check_tie.png");
|
||||
}
|
||||
.sheet-arc__roll--value {
|
||||
border: 1px solid $skill-test-tie-border;
|
||||
box-shadow: 0px 0px 4px 4px $skill-test-tie-shadow;
|
||||
}
|
||||
}
|
||||
&.sheet-fail ~ .sheet-arc__content {
|
||||
&.sheet-skill-test {
|
||||
background-image: url("#{$root-url}bg_check_fail.png");
|
||||
}
|
||||
.sheet-arc__roll--value {
|
||||
border: 1px solid $skill-test-fail-border;
|
||||
box-shadow: 0px 0px 4px 4px $skill-test-fail-shadow;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sheet-arc {
|
||||
&__approach-skill {
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr;
|
||||
grid-template-rows: 35px auto 1fr;
|
||||
align-items: center;
|
||||
column-gap: 4px;
|
||||
font-family: $primary-sans-serif;
|
||||
|
||||
&--arrow {
|
||||
grid-row: 1 / 3;
|
||||
grid-column: 1 / 2;
|
||||
color: $secondary-color-light;
|
||||
}
|
||||
&--approach {
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
height: 35px;
|
||||
&.sheet-creative {
|
||||
background-image: url("#{$root-url}text_creative.svg");
|
||||
}
|
||||
&.sheet-careful {
|
||||
background-image: url("#{$root-url}text_careful.svg");
|
||||
}
|
||||
&.sheet-concerted {
|
||||
background-image: url("#{$root-url}text_concerted.svg");
|
||||
}
|
||||
}
|
||||
&--text {
|
||||
font-family: $secondary-serif;
|
||||
font-size: 2em;
|
||||
text-transform: uppercase;
|
||||
color: $secondary-color-light;
|
||||
&::before {
|
||||
content: "& ";
|
||||
font-family: $secondary-serif;
|
||||
color: $primary-accent-light;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__results {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto;
|
||||
column-gap: 4px;
|
||||
align-content: center;
|
||||
&--text {
|
||||
grid-column: 1 / 2;
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
&--values {
|
||||
grid-column: 2 / 3;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto 1fr;
|
||||
grid-template-rows: auto 1fr;
|
||||
row-gap: 4px;
|
||||
align-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
// sheet-arc__results--text
|
||||
&__success, &__tie, &__fail {
|
||||
font-size: 2em;
|
||||
line-height: 1em;
|
||||
font-family: $primary-sans-serif;
|
||||
&--span {
|
||||
white-space: nowrap;
|
||||
padding-right: 8px;
|
||||
}
|
||||
}
|
||||
&__success--span {
|
||||
color: $skill-test-success-color;
|
||||
}
|
||||
&__tie--span {
|
||||
color: $skill-test-tie-color;
|
||||
}
|
||||
&__fail--span {
|
||||
color: $skill-test-fail-color;
|
||||
}
|
||||
|
||||
// sheet-arc__results--values
|
||||
&__flawless, &__roll, &__versus, &__tn {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
&--header {
|
||||
grid-row: 1 / 2;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
font-family: $primary-sans-serif;
|
||||
color: $secondary-border-light;
|
||||
}
|
||||
}
|
||||
|
||||
&__flawless, &__roll, &__tn {
|
||||
&--value {
|
||||
grid-row: 2 / 3;
|
||||
font-family: serif;
|
||||
height: 42px;
|
||||
width: 42px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
.inlinerollresult {
|
||||
@extend %inlinerollresult;
|
||||
font-size: 36px;
|
||||
line-height: 36px;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
&__roll {
|
||||
&--header {
|
||||
color: $secondary-color-light;
|
||||
}
|
||||
&--value {
|
||||
color: transparent;
|
||||
}
|
||||
}
|
||||
&__tn {
|
||||
&--value {
|
||||
border: 1px solid $skill-test-threshold-border;
|
||||
box-shadow: 0 0 4px 4px $skill-test-threshold-shadow;
|
||||
color: $skill-test-threshold-color;
|
||||
background: rgba($skill-test-threshold-background, 0.7);
|
||||
}
|
||||
}
|
||||
&__versus {
|
||||
&--value {
|
||||
grid-row: 2 / 3 ;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 1;
|
||||
}
|
||||
&--symbol {
|
||||
position: absolute;
|
||||
font-family: $primary-sans-serif;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
padding: 2px;
|
||||
color: $secondary-color-light;
|
||||
@include square(18px);
|
||||
&.sheet-success {
|
||||
background: $skill-test-success-symbol;
|
||||
}
|
||||
&.sheet-tie {
|
||||
background: $skill-test-tie-symbol;
|
||||
}
|
||||
&.sheet-fail {
|
||||
background: $skill-test-fail-symbol;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,135 @@
|
||||
|
||||
.arc {
|
||||
max-width: $xlarge;
|
||||
display: grid;
|
||||
grid-template-columns: 1rem 1fr 1rem;
|
||||
grid-template-rows: auto auto 1fr;
|
||||
row-gap: 1rem;
|
||||
|
||||
.toolbar {
|
||||
grid-row: 1;
|
||||
grid-column: 2;
|
||||
}
|
||||
|
||||
&__header {
|
||||
grid-row: 2;
|
||||
grid-column: 2;
|
||||
}
|
||||
|
||||
&__layout {
|
||||
grid-column: 2;
|
||||
grid-row: 3;
|
||||
display: grid;
|
||||
grid-template-columns: 3fr 2fr;
|
||||
column-gap: 1rem;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
|
||||
&--left {
|
||||
grid-row: 1 / 2;
|
||||
grid-column: 1 / 2;
|
||||
|
||||
.healths {
|
||||
grid-row: 1;
|
||||
}
|
||||
.approaches {
|
||||
grid-row: 2;
|
||||
}
|
||||
.skills {
|
||||
grid-row: 3;
|
||||
}
|
||||
.inventory {
|
||||
grid-row: 4;
|
||||
}
|
||||
}
|
||||
|
||||
&--right {
|
||||
grid-row: 1 / 2;
|
||||
grid-column: 2 / 3;
|
||||
.background {
|
||||
grid-row: 1;
|
||||
}
|
||||
.bonds {
|
||||
grid-row: 2;
|
||||
}
|
||||
.experience {
|
||||
grid-row: 3;
|
||||
}
|
||||
.consequences {
|
||||
grid-row: 4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
input[name*="sheet_type"] {
|
||||
&[value="npc"] {
|
||||
~ .arc__layout {
|
||||
grid-template-columns: auto;
|
||||
}
|
||||
~ .arc__layout--right {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: $medium) {
|
||||
.arc {
|
||||
display: grid;
|
||||
grid-template-columns: 1rem 1fr 1rem;
|
||||
grid-template-rows: auto auto 1fr;
|
||||
row-gap: 1rem;
|
||||
|
||||
.toolbar {
|
||||
grid-row: 1;
|
||||
grid-column: 2;
|
||||
}
|
||||
|
||||
&__header {
|
||||
grid-row: 2;
|
||||
grid-column: 2;
|
||||
}
|
||||
|
||||
&__layout {
|
||||
grid-column: 2;
|
||||
grid-row: 3;
|
||||
display: grid;
|
||||
grid-template-columns: auto;
|
||||
width: 100%;
|
||||
|
||||
&--left {
|
||||
grid-row: 1;
|
||||
grid-column: 1;
|
||||
.healths {
|
||||
grid-row: 1;
|
||||
}
|
||||
.approaches {
|
||||
grid-row: 2;
|
||||
}
|
||||
.skills {
|
||||
grid-row: 3;
|
||||
}
|
||||
.inventory {
|
||||
grid-row: 4;
|
||||
}
|
||||
}
|
||||
|
||||
&--right {
|
||||
grid-column: 1;
|
||||
grid-row: 2;
|
||||
.background {
|
||||
grid-row: 1;
|
||||
}
|
||||
.bonds {
|
||||
grid-row: 2;
|
||||
}
|
||||
.experience {
|
||||
grid-row: 3;
|
||||
}
|
||||
.consequences {
|
||||
grid-row: 4;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
|
||||
button[type=roll], button[type=action] {
|
||||
font-size: 1rem;
|
||||
outline: none;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
text-shadow: none;
|
||||
box-shadow: none;
|
||||
background: none;
|
||||
|
||||
&::before {
|
||||
font-family: none;
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,87 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
|
||||
height: unset;
|
||||
width: unset;
|
||||
padding: unset;
|
||||
margin: unset;
|
||||
|
||||
font-family: unset;
|
||||
font-size: 1rem;
|
||||
font-weight: unset;
|
||||
line-height: unset;
|
||||
|
||||
color: unset;
|
||||
border: unset;
|
||||
border-radius: unset;
|
||||
background: unset;
|
||||
background-color: unset;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5 {
|
||||
font-size: unset;
|
||||
line-height: unset;
|
||||
|
||||
color: unset;
|
||||
}
|
||||
|
||||
label, input, input[type=number],
|
||||
select, textarea, button, button[type=roll] {
|
||||
display: unset;
|
||||
width: unset;
|
||||
height: unset;
|
||||
padding: unset;
|
||||
margin-bottom: unset;
|
||||
|
||||
font-family: unset;
|
||||
font-size: unset;
|
||||
font-weight: unset;
|
||||
line-height: unset;
|
||||
|
||||
color: unset;
|
||||
border: unset;
|
||||
border-radius: unset;
|
||||
background: unset;
|
||||
background-color: unset;
|
||||
box-shadow: unset;
|
||||
}
|
||||
|
||||
button[type=roll] {
|
||||
&::before {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
input[disabled], select[disabled], textarea[disabled],
|
||||
input[readonly], select[readonly], textarea[readonly] {
|
||||
background-color: unset;
|
||||
border-color: unset;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
span {
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
// Firefox
|
||||
input[type=number] {
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
-moz-appearance: textfield;
|
||||
|
||||
&::-webkit-outer-spin-button,
|
||||
&::-webkit-inner-spin-button {
|
||||
-webkit-appearance: none;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.btn:hover {
|
||||
background-position: 0 0;
|
||||
background-color: transparent;
|
||||
}
|
||||
@@ -0,0 +1,93 @@
|
||||
|
||||
// BREAKPOINTS
|
||||
$xlarge: 960px;
|
||||
$large: 720px;
|
||||
$medium: 540px;
|
||||
$small: 375px;
|
||||
|
||||
// FONTS
|
||||
@import url("https://fonts.googleapis.com/css?family=Josefin+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap");
|
||||
@import url("https://fonts.googleapis.com/css?family=Piazzolla:ital,wght@0,400;0,700;1,400;1,700&display=swap");
|
||||
@import url("https://fonts.googleapis.com/css?family=Playfair+Display:ital,wght@0,400;0,700;1,400;1,700&display=swap");
|
||||
@import url("https://fonts.googleapis.com/css?family=Fira+Code&display=swap");
|
||||
|
||||
$primary-sans-serif: "Josefin Sans", sans-serif;
|
||||
$primary-serif: "Piazzolla", serif;
|
||||
$secondary-serif: "Playfair Display", serif;
|
||||
$primary-monospace: "Fira Code", monospace;
|
||||
|
||||
// ASSETS
|
||||
// Icons made by Pixel Perfect
|
||||
// https://flaticon.com/authors/pixel-perfect
|
||||
$root-url: "https://raw.githubusercontent.com/morgdalaine/arc-momatoes/main/character-sheet/ARC/assets/";
|
||||
|
||||
// COLORS
|
||||
// https://coolors.co/171212-32635b-358b6d-82a677-dabb3d-efdd86-acb7b1-eaebe8-f6f7f6-fefeff
|
||||
$ash: #acb7b1;
|
||||
$asparagus: #82a677;
|
||||
$buff: #efdd86;
|
||||
$cultured: #f6f7f6;
|
||||
$emerald: #358b6d;
|
||||
$jet: #171212;
|
||||
$lionet: #dabb3d;
|
||||
$myrtle: #32635b;
|
||||
$platinum: #eaebe8;
|
||||
$snow: #fefeff;
|
||||
|
||||
// LIGHT
|
||||
$primary-color-light: $jet; // JET
|
||||
$secondary-color-light: $snow; // SNOW
|
||||
|
||||
$primary-accent-light: $lionet; // LIONET
|
||||
$primary-highlight-light: $buff; // BUFF
|
||||
$primary-border-light: $ash; // ASH
|
||||
$primary-background-light: $snow; // SNOW
|
||||
|
||||
$secondary-accent-light: $myrtle; // MYRTLE
|
||||
$secondary-highlight-light: $emerald; // EMERALD
|
||||
$secondary-border-light: $platinum; // PLATINUM
|
||||
$secondary-background-light: $platinum; // PLATINUM
|
||||
|
||||
$tertiary-background-light: $cultured; // CULTURED
|
||||
|
||||
// DARK
|
||||
$primary-color-dark: $jet; // JET
|
||||
$secondary-color-dark: $snow; // SNOW
|
||||
|
||||
$primary-accent-dark: $lionet; // LIONET
|
||||
$primary-highlight-dark: $buff; // BUFF
|
||||
$primary-border-dark: $ash; // ASH
|
||||
$primary-background-dark: $snow; // SNOW
|
||||
|
||||
$secondary-accent-dark: $myrtle; // MYRTLE
|
||||
$secondary-highlight-dark: $emerald; // EMERALD
|
||||
$secondary-border-dark: $platinum; // PLATINUM
|
||||
$secondary-background-dark: $platinum; // PLATINUM
|
||||
|
||||
$tertiary-background-dark: $cultured; // CULTURED
|
||||
|
||||
// ROLL TEMPLATE
|
||||
$fallen-primary-color: $snow;
|
||||
$long-rest-primary-color: $asparagus;
|
||||
$short-rest-primary-color: $myrtle;
|
||||
|
||||
$skill-test-primary-color: $snow;
|
||||
$skill-test-success-color: $lionet;
|
||||
$skill-test-success-border: #7f690b;
|
||||
$skill-test-success-shadow: #7f690b;
|
||||
$skill-test-success-symbol: #7f690b;
|
||||
|
||||
$skill-test-tie-color: #89a57d;
|
||||
$skill-test-tie-border: #2b4434;
|
||||
$skill-test-tie-shadow: #2b4434;
|
||||
$skill-test-tie-symbol: #2b4434;
|
||||
|
||||
$skill-test-fail-color: $ash;
|
||||
$skill-test-fail-border: #3c2f27;
|
||||
$skill-test-fail-shadow: #3c2f27;
|
||||
$skill-test-fail-symbol: #314d3c;
|
||||
|
||||
$skill-test-threshold-color: #6a878e;
|
||||
$skill-test-threshold-background: #192120;
|
||||
$skill-test-threshold-border: #394143;
|
||||
$skill-test-threshold-shadow: #2b3639;
|
||||
Reference in New Issue
Block a user