Use jsDeliver for example

brandonaaron · Nov 24, 2023 · 285642d · 285642d
1 parent aea43d8
commit 285642d
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 2 deletions.
diff --git a/README.md b/README.md
@@ -18,9 +18,9 @@ Add this to the `<head>`:
 
 ```html
 <!-- tiny render blocking script to avoid flash of content -->
-<script src="path/to/dist/DarkPref.blocking.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/@brandonaaron/dark-pref@1.0.0/dist/DarkPref.blocking.js"></script>
 <!-- rest of the exports could be bundled with your favorite bundler too -->
-<script src="path/to/dist/DarkPrefToggleElement.js" type="module"></script>
+<script src="https://cdn.jsdelivr.net/npm/@brandonaaron/dark-pref@1.0.0/dist/DarkPrefToggleElement.js" type="module"></script>
 <style>
   :root { /* optional css variables */
     --dark-pref-when-light-color: #999; /* defaults to #000 */

diff --git a/examples/basic-cdn.html b/examples/basic-cdn.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <script src="https://cdn.jsdelivr.net/npm/@brandonaaron/dark-pref@1.0.0/dist/DarkPref.blocking.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/@brandonaaron/dark-pref@1.0.0/dist/DarkPrefToggleElement.js" type="module"></script>
+    <style>
+      html { background-color: #fff; color: #000; }
+      html.dark { background-color: #000; color: #fff; }
+    </style>
+  </head>
+  <body>
+    <dark-pref-toggle></dark-pref-toggle>
+  </body>
+</html>