Elevation Scale

<p>Create shadow systems and effect styles with your choice of steps from a custom function.</p><p><br></p><h1><strong>Usage</strong></h1><ol><li>Run the plugin and click the&nbsp;<code>Create a new elevation scale</code>&nbsp;button</li><li>Select the elevation scale frame</li><li>Adjust the settings to your liking</li></ol><p><br></p><p><strong>Changes are automatically applied and saved.</strong></p><p><br></p><h2>Steps</h2><p><code>Steps</code>&nbsp;are the amount of elevations/shadows you want to create. For example&nbsp;<code>steps:2</code>&nbsp;will create two shadows each with all the layers you specify.</p><h3><br></h3><h2>Effect Styles</h2><p>To automatically create &amp; update effect styles enable the&nbsp;<code>Sync Styles</code>&nbsp;option. You can optionally provide a&nbsp;<code>style name</code>&nbsp;that will be used to create the effect styles. If you add a&nbsp;<code>#</code>&nbsp;to the name it will be replaced with the current step. A&nbsp;<code>##</code>&nbsp;will result in a 0 prefixed number if below 10.</p><pre class="ql-syntax" spellcheck="false">// Example style name with # Elevation / Level # // Elevation / Level 0, Elevation / Level 1, ... // Example style name with ## Elevation / ##dp // Elevation / 00dp, Elevation / 01dp, ..., Elevation / 12dp </pre><h3><br></h3><h2>Properties</h2><ul><li>Shadow type: Either&nbsp;<code>dropshadow</code>&nbsp;or&nbsp;<code>innershadow</code></li><li>x: The x offset of the shadow.&nbsp;<code>#</code>&nbsp;is replaced by the current step. E.g.&nbsp;<code>.5*#</code></li><li>y: The y offset of the shadow.&nbsp;<code>#</code>&nbsp;is replaced by the current step. E.g.&nbsp;<code>2+#</code></li><li>blur: The shadows blur radius.&nbsp;<code>#</code>&nbsp;is replaced by the current step. E.g.&nbsp;<code>(1+#)*4</code></li><li>spread: The shadows spread.&nbsp;<code>#</code>&nbsp;is replaced by the current step. E.g.&nbsp;<code>#/.5</code></li><li>color: a 6-digit hex color code between&nbsp;<code>000000</code>&nbsp;and&nbsp;<code>FFFFFF</code></li><li>opacity: The opacity for the color.&nbsp;<code>#</code>&nbsp;is replaced by the current step. E.g.&nbsp;<code>10+#</code>&nbsp;if&nbsp;<code>#</code>&nbsp;= 1 -&gt;&nbsp;<code>11%</code></li></ul><p><br></p><h2>Adding Layers</h2><p>An elevation step consists of one or more elevation layers (each `layer` is an effect e.g. a dropshadow or innershadow).&nbsp;</p><p>Each layer you add will be present on each step.</p><p>To add a new layer, click the "Add layer" button below the list of layers.</p><p>To delete a layer click the trash can icon next to the layer name. (You can not delete the last layer)</p><p><br></p><p>Layer names are purely for your organization of the different layers and have no effect on the elevations or the names.</p><p><br></p><h2><strong>Bug reports, PRs &amp; feature requests</strong></h2><p>If you find a bug or want to help by suggestion or even developing a feature, please reach out on the github project page: <a href="https://github.com/lukasoppermann/elevation-scale/issues" rel="noreferrer noopener nofollow" target="_blank">https://github.com/lukasoppermann/elevation-scale/issues</a></p>