kempo-css 1.1.0 → 1.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/docs/theme-editor.html +18 -4
- package/package.json +1 -1
package/docs/theme-editor.html
CHANGED
|
@@ -52,11 +52,22 @@
|
|
|
52
52
|
<k-side-menu id="navSideMenu">
|
|
53
53
|
<menu>
|
|
54
54
|
<div class="ta-center bb mb r0">
|
|
55
|
-
<h1 class="tc-primary">Kempo CSS</h1>
|
|
56
|
-
<h3 class="tc-primary">Theme
|
|
57
|
-
<img src="./media/icon128.png" alt="Kempo UI Icon"
|
|
55
|
+
<a href="./"><h1 class="tc-primary">Kempo CSS</h1></a>
|
|
56
|
+
<h3 class="tc-primary">Theme Editor</h3>
|
|
57
|
+
<a href="./"><img src="./media/icon128.png" alt="Kempo UI Icon" /></a>
|
|
58
58
|
</div>
|
|
59
|
-
<h5
|
|
59
|
+
<h5>Sections</h5>
|
|
60
|
+
<a href="#theme-colors">Theme Colors</a><br />
|
|
61
|
+
<a href="#background-colors">Background Colors</a><br />
|
|
62
|
+
<a href="#text-colors">Text Colors</a><br />
|
|
63
|
+
<a href="#border-colors">Border Colors</a><br />
|
|
64
|
+
<a href="#link-colors">Link Colors</a><br />
|
|
65
|
+
<a href="#button-styles">Button Styles</a><br />
|
|
66
|
+
<a href="#input-styles">Input Styles</a><br />
|
|
67
|
+
<a href="#focus-effects">Focus & Effects</a><br />
|
|
68
|
+
<a href="#typography">Typography</a><br />
|
|
69
|
+
<a href="#spacing-layout">Spacing & Layout</a><br />
|
|
70
|
+
<a href="#effects-animation">Effects & Animation</a><br />
|
|
60
71
|
<hr />
|
|
61
72
|
<a href="https://github.com/dustinpoissant/kempo-css?tab=License-1-ov-file#creative-commons-attribution-noncommercial-sharealike-20"
|
|
62
73
|
target="_blank"><k-icon name="license"></k-icon> Read the Lisence</a><br />
|
|
@@ -371,9 +382,12 @@
|
|
|
371
382
|
return words.join(' ');
|
|
372
383
|
};
|
|
373
384
|
|
|
385
|
+
const titleToId = title => title.toLowerCase().replace(/\s*&\s*/g, '-').replace(/\s+/g, '-');
|
|
386
|
+
|
|
374
387
|
propertyCategories.forEach(({ title, props }) => {
|
|
375
388
|
const section = document.createElement('div');
|
|
376
389
|
section.className = 'mb';
|
|
390
|
+
section.id = titleToId(title);
|
|
377
391
|
|
|
378
392
|
const heading = document.createElement('h4');
|
|
379
393
|
heading.className = 'mb-h';
|