Write development instructions within readme

Author: JoelCDL

README.md

@@ -1,4 +1,46 @@
 # Klaro UI
+
 The Klaro consent manager custom UI for the California Digital Library.
 
-Developer instructions coming soon.
+View sample at https://cdlib.github.io/klaro-ui
+
+## Requirements
+
+- Git
+- Node version 20 or above
+- NPM version 10 or above
+- Klaro source and a valid config file
+
+## Installation
+
+1. Follow the steps in [Getting Started](https://klaro.org/docs/getting-started) within the Klaro documentation.
+
+2. Within the `src` URL of the Klaro script (after the config script), replace the URL ending in **klaro.js** with the "no CSS" version:
+
+```
+https://cdn.kiprotect.com/klaro/v0.7/klaro-no-css.js
+```
+
+3. From your CLI, install Klaro UI into your application as a dependency:
+
+```
+npm install https://github.com/cdlib/klaro-ui --save
+```
+
+The module **klaro-ui** is now installed in your application's **node_modules** folder.
+
+4. From your bundler/build tool, source the `klaro-ui` stylesheet from the klaro-ui module:
+
+```
+/node_modules/klaro-ui/dist/klaro-ui.css
+```
+
+## Appearance
+
+Klaro UI doesn't include any typefaces. The Klaro text will include the font defined for the document.
+
+The Klaro UI default stylesheet renders a light colored theme when a user's system appearance is set to light colors and a dark colored theme when set to dark colors.
+
+For only the light colored theme, use **klaro-ui-light.css** within **klaro-ui/dist**.
+
+For only the dark colored theme, use **klaro-ui-dark.css** within **klaro-ui/dist**.

src/index.html

@@ -35,7 +35,7 @@
     <h1>Klaro UI for the California Digital Library</h1>
     <main>
       <p>This page demonstrates the Klaro consent manager using the custom CDL design, text and functionality.</p>
-      <p>Developer instructions for applying this custom UI to instances of Klaro on CDL websites will be published soon to <a href="https://github.com/cdlib/klaro-ui" target="_blank">cdlib Klaro-UI GitHub repository</a>.</p>
+      <p>To use this custom UI for instances of Klaro on CDL websites, see the <a href="https://github.com/cdlib/klaro-ui" target="_blank">cdlib Klaro-UI GitHub readme</a>.</p>
       <p>Below is filler content to force some vertical page scrolling and test that Klaro is always rendering as a fixed component in the lower-right of the browser.</p>
     </main>
     <aside>