User Tools
en:template:start
Differences
This shows you the differences between two versions of the page.
| Both sides previous revision Previous revision Next revision | Previous revision Next revision Both sides next revision | ||
|
en:template:start [2016/08/10 17:17] Nicolas Ronvel [Shared Options] |
en:template:start [2017/06/22 10:51] Nicolas Ronvel [Globals] |
||
|---|---|---|---|
| Line 11: | Line 11: | ||
| "description": { }, | "description": { }, | ||
| "fonts" : [ ], | "fonts" : [ ], | ||
| + | "webfonts": { }, | ||
| "sharedOptions": [ ], | "sharedOptions": [ ], | ||
| - | "styles" : [ ] | + | "styles" : [ ], |
| + | "globals": [ ] | ||
| }; | }; | ||
| </code> | </code> | ||
| Line 40: | Line 42: | ||
| See [[custom-fonts|Custom Fonts]] for an explanation on how to add a font to your template. | See [[custom-fonts|Custom Fonts]] for an explanation on how to add a font to your template. | ||
| + | ===== Webfonts ===== | ||
| + | |||
| + | |||
| + | The ''webfonts'' element in the template is optional. Any template will work even if it's missing. | ||
| + | |||
| + | If you need specific font inside your template, and that it's available on a web library, you can reference it. It will be loaded from the library by the user's browser. | ||
| + | |||
| + | See [[web-fonts]] for an explanation on how to add a web-font to your template. | ||
| ===== Shared Options ===== | ===== Shared Options ===== | ||
| Line 51: | Line 61: | ||
| See the [[styles|Styles]] section for a more complete description of a Style. | See the [[styles|Styles]] section for a more complete description of a Style. | ||
| + | |||
| + | ===== Globals ===== | ||
| + | |||
| + | The ''globals'' part of a template stores data that is repeated through the template, and that can be put in a single global constant, in order to help maintainability. | ||
| + | |||
| + | It could be a color that runs through the template, a code variable, or even part of the canvas : | ||
| + | |||
| + | <code javascript> | ||
| + | { | ||
| + | "globals": { | ||
| + | "icon-color": "#ffffff", | ||
| + | "icon-color-old": "#fff5c4", | ||
| + | "text-color-auto": "{{value = tinycolor.mostReadable(card[color1].toHexString(), ['#FFF', '#888', '#000']).toHexString();}}", | ||
| + | "gradient": { | ||
| + | "type": "linear", | ||
| + | "coords": { "x1": 333, "y1": 333.80341, "x2": 402, "y2": 332.55273 }, | ||
| + | "colorStops": [ | ||
| + | { "offset": 1, "color": "$color2.hexa$", "opacity": 1 }, | ||
| + | { "offset": 0.2832, "color": "$color1.hexa$", "opacity": 1 } | ||
| + | ], | ||
| + | "offsetX": -323.59766, | ||
| + | "offsetY": -48.037109 | ||
| + | } | ||
| + | }, | ||
| + | "styles": [ ] | ||
| + | } | ||
| + | </code> | ||
en/template/start.txt · Last modified: 2017/06/22 11:02 by Nicolas Ronvel
Page Tools
Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Share Alike 4.0 International
