Merge pull request #46 from josefaidt/next

josefaidt · Jan 30, 2022 · 719ebe0 · 719ebe0 · vercel · Jan 30, 2022
2 parents 3e73cc0 + 673906f
commit 719ebe0
Show file tree

Hide file tree

Showing 51 changed files with 500 additions and 1,163 deletions.
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
@@ -0,0 +1,15 @@
+module.exports = {
+	root: true,
+	extends: ['eslint:recommended', 'prettier'],
+	plugins: ['svelte3'],
+	overrides: [{ files: ['*.svelte'], processor: 'svelte3/svelte3' }],
+	parserOptions: {
+		sourceType: 'module',
+		ecmaVersion: 2020
+	},
+	env: {
+		browser: true,
+		es2017: true,
+		node: true
+	}
+};
diff --git a/.gitignore b/.gitignore
@@ -3,7 +3,9 @@ node_modules
 *.log
 .vscode
 
-/lib
+/build
+/.svelte-kit
+/package
 
 .vercel
 coverage
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,14 @@
+{
+  "printWidth": 80,
+  "trailingComma": "es5",
+  "tabWidth": 2,
+  "semi": false,
+  "bracketSpacing": true,
+  "htmlWhitespaceSensitivity": "ignore",
+  "arrowParens": "avoid",
+  "singleQuote": true,
+  "svelteSortOrder": "options-scripts-markup-styles",
+  "svelteStrictMode": true,
+  "svelteBracketNewLine": true,
+  "svelteAllowShorthand": false
+}
diff --git a/components/index.js b/components/index.js
diff --git a/demo/app.html b/demo/app.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="description" content="" />
+    <link rel="icon" href="%svelte.assets%/favicon.png" />
+    <link rel="stylesheet" href="%svelte.assets%/global.css" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    %svelte.head%
+  </head>
+  <body>
+    <div id="svelte">%svelte.body%</div>
+  </body>
+</html>
diff --git a/docs/src/App.svelte → demo/routes/__layout.svelte b/docs/src/App.svelte → demo/routes/__layout.svelte
@@ -1,5 +1,7 @@
 <script>
-  import { ThemeWrapper, ThemeToggle } from 'svelte-themer'
+  import ThemeWrapper from '$lib/components/ThemeWrapper.svelte'
+  import ThemeToggle from '$lib/components/ThemeToggle.svelte'
+  import { stylesheet } from '$lib/use.js'
 
   const author = '@josefaidt'
   const title = 'svelte themer'
@@ -51,24 +53,7 @@
       </div>
     </div>
     <main>
-      <section id="intro">
-        <header>
-          <h1>Svelte Themer</h1>
-          <p>
-            A theming engine for your Svelte apps using CSS Variables,
-            persisted.
-          </p>
-        </header>
-        <div class="apps">
-          <a
-            href="https://github.com/josefaidt/svelte-themer/blob/main/README.md#svelte-themer"
-          >
-            readme
-          </a>
-          <a href="https://www.npmjs.com/package/svelte-themer">npm</a>
-          <a href="https://github.com/josefaidt/svelte-themer">github</a>
-        </div>
-      </section>
+      <slot />
     </main>
   </div>
 </ThemeWrapper>
@@ -111,54 +96,6 @@
     grid-auto-flow: row;
   }
 
-  section {
-    display: grid;
-    grid-auto-flow: row;
-    grid-auto-rows: min-content;
-    grid-gap: 2rem;
-    place-items: center;
-    place-content: center;
-    padding: var(--theme-padding-large);
-    text-align: center;
-    /* max-width: 240px; */
-  }
-
-  #intro {
-    grid-area: intro;
-  }
-  .apps {
-    display: grid;
-    grid-auto-flow: column;
-    grid-gap: 3rem;
-    justify-content: center;
-  }
-
-  footer {
-    position: fixed;
-    bottom: 1vh;
-    left: 2vw;
-    right: 2vw;
-    display: flex;
-    justify-content: space-between;
-  }
-
-  h1,
-  h2 {
-    color: var(--theme-colors-text);
-    margin: 0;
-    text-transform: lowercase;
-  }
-
-  h1 {
-    font-size: 4rem;
-    font-weight: var(--theme-font-weight-lighter);
-  }
-
-  a,
-  a:visited {
-    color: var(--theme-colors-primary);
-  }
-
   @media (max-width: 768px) {
     main {
       max-width: initial;

diff --git a/demo/routes/index.svelte b/demo/routes/index.svelte
@@ -0,0 +1,56 @@
+<section id="intro">
+  <header>
+    <h1>Svelte Themer</h1>
+    <p>A theming engine for your Svelte apps using CSS Variables, persisted.</p>
+  </header>
+  <div class="apps">
+    <a
+      href="https://github.com/josefaidt/svelte-themer/blob/main/README.md#svelte-themer"
+    >
+      readme
+    </a>
+    <a href="https://www.npmjs.com/package/svelte-themer">npm</a>
+    <a href="https://github.com/josefaidt/svelte-themer">github</a>
+  </div>
+</section>
+
+<style>
+  section {
+    display: grid;
+    grid-auto-flow: row;
+    grid-auto-rows: min-content;
+    grid-gap: 2rem;
+    place-items: center;
+    place-content: center;
+    padding: var(--theme-padding-large);
+    text-align: center;
+    /* max-width: 240px; */
+  }
+
+  #intro {
+    grid-area: intro;
+  }
+  .apps {
+    display: grid;
+    grid-auto-flow: column;
+    grid-gap: 3rem;
+    justify-content: center;
+  }
+
+  h1,
+  h2 {
+    color: var(--theme-colors-text);
+    margin: 0;
+    text-transform: lowercase;
+  }
+
+  h1 {
+    font-size: 4rem;
+    font-weight: var(--theme-font-weight-lighter);
+  }
+
+  a,
+  a:visited {
+    color: var(--theme-colors-primary);
+  }
+</style>
diff --git a/demo/static/favicon.png b/demo/static/favicon.png
diff --git a/docs/public/global.css → demo/static/global.css b/docs/public/global.css → demo/static/global.css
diff --git a/docs/.gitignore b/docs/.gitignore
diff --git a/docs/README.md b/docs/README.md
diff --git a/docs/index.html b/docs/index.html
diff --git a/docs/jsconfig.json b/docs/jsconfig.json
diff --git a/docs/package.json b/docs/package.json
diff --git a/docs/public/favicon.ico b/docs/public/favicon.ico
diff --git a/docs/src/assets/svelte.png b/docs/src/assets/svelte.png
diff --git a/docs/src/main.js b/docs/src/main.js
diff --git a/docs/src/vite-env.d.ts b/docs/src/vite-env.d.ts
diff --git a/docs/vite.config.js b/docs/vite.config.js
diff --git a/examples/svelte-kit/package.json b/examples/svelte-kit/package.json
@@ -11,9 +11,9 @@
   "devDependencies": {
     "@sveltejs/adapter-static": "next",
     "@sveltejs/kit": "next",
-    "autoprefixer": "^10.4.0",
-    "svelte": "^3.42.6",
-    "svelte-preprocess": "^4.9.8",
-    "svelte-themer": "workspace:../../"
+    "autoprefixer": "^10.4.2",
+    "svelte": "^3.46.3",
+    "svelte-preprocess": "^4.10.2",
+    "svelte-themer": "^0.5.4"
   }
 }
diff --git a/examples/svelte-kit/svelte.config.js b/examples/svelte-kit/svelte.config.js
@@ -7,7 +7,6 @@ const config = {
     // hydrate the <div id="svelte"> element in src/app.html
     target: '#svelte',
     adapter: adapter(),
-    ssr: false,
     vite: {
       css: {
         postcss: {

diff --git a/examples/vite/package.json b/examples/vite/package.json
@@ -9,10 +9,10 @@
   },
   "devDependencies": {
     "@sveltejs/vite-plugin-svelte": "next",
-    "autoprefixer": "^10.3.4",
-    "postcss": "^8.3.6",
-    "svelte": "^3.42.4",
-    "svelte-themer": "workspace:../../",
-    "vite": "^2.5.6"
+    "autoprefixer": "^10.4.2",
+    "postcss": "^8.4.5",
+    "svelte": "^3.46.3",
+    "svelte-themer": "^0.5.4",
+    "vite": "^2.7.13"
   }
 }
diff --git a/jsconfig.json b/jsconfig.json
@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "$lib/*": ["src/*"]
+    }
+  },
+  "include": ["src/**/*.d.ts", "src/**/*.js", "src/**/*.svelte"]
+}