content: pass color directly through slots in various places

Primarily through generateColorStyle{Rules,Variables}, the former
of which is also refactored into generatePageLayout, which now
takes a direct color slot itself as well.

1 files changed, 6 insertions, 8 deletions

diff --git a/src/content/dependencies/generateColorStyleVariables.js b/src/content/dependencies/generateColorStyleVariables.js
index 90346d8d..f30d786b 100644
--- a/src/content/dependencies/generateColorStyleVariables.js
+++ b/src/content/dependencies/generateColorStyleVariables.js
@@ -1,14 +1,12 @@
 export default {
-  extraDependencies: [
-    'getColors',
-  ],
+  extraDependencies: ['html', 'getColors'],
 
-  data(color) {
-    return {color};
+  slots: {
+    color: {validate: v => v.isColor},
   },
 
-  generate(data, {getColors}) {
-    if (!data.color) return [];
+  generate(slots, {getColors}) {
+    if (!slots.color) return [];
 
     const {
       primary,
@@ -18,7 +16,7 @@ export default {
       bg,
       bgBlack,
       shadow,
-    } = getColors(data.color);
+    } = getColors(slots.color);
 
     return [
       `--primary-color: ${primary}`,