From cb247db8d37ce79f1e827e5b780f9b9a4b615da2 Mon Sep 17 00:00:00 2001
From: Vincent Langlois <vtlanglo@gmail.com>
Date: Mon, 22 Jan 2024 17:52:10 -0500
Subject: [PATCH 1/3] Added default styling

---
 docs/index.html.ejs |  2 +-
 style.css           | 13 +++++++++++++
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/docs/index.html.ejs b/docs/index.html.ejs
index 253ba57..c8459a9 100644
--- a/docs/index.html.ejs
+++ b/docs/index.html.ejs
@@ -141,7 +141,7 @@
           They are given 12px of horizontal padding by default.
         </p>
 
-        <%- example(`<button>Click me</button>
+        <%- example(`<button class="default">Click me</button>
         <input type="submit" />
         <input type="reset" /> `)%>
 
diff --git a/style.css b/style.css
index 9d50c03..e6be1dc 100644
--- a/style.css
+++ b/style.css
@@ -58,6 +58,19 @@
     inset 1px 1px var(--window-frame);
   --border-sunken-inner: inset -2px -2px var(--button-face),
     inset 2px 2px var(--button-shadow);
+  --default-button-border-raised-outer: inset -2px -2px var(--window-frame), inset 1px 1px var(--window-frame);
+  --default-button-border-raised-inner: inset 2px 2px var(--button-highlight), inset -3px -3px var(--button-shadow), inset 3px 3px var(--button-face);
+  --default-button-border-sunken-outer: inset 2px 2px var(--window-frame), inset -1px -1px var(--window-frame);
+  --default-button-border-sunken-inner: inset -2px -2px var(--button-highlight), inset 3px 3px var(--button-shadow), inset -3px -3px var(--button-face);
+
+
+  .default {
+    box-shadow: var(--default-button-border-raised-outer), var(--default-button-border-raised-inner);
+  }
+  
+  .default:active {
+    box-shadow: var(--default-button-border-sunken-outer), var(--default-button-border-sunken-inner);
+  }
 
   /* Window borders flip button-face and button-highlight */
   --border-window-outer: inset -1px -1px var(--window-frame),

From 723995d5d2966731a9748846a1d75c63b6ff048f Mon Sep 17 00:00:00 2001
From: Vincent Langlois <vtlanglo@gmail.com>
Date: Mon, 22 Jan 2024 17:59:09 -0500
Subject: [PATCH 2/3] Added styling selectors

---
 style.css | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/style.css b/style.css
index e6be1dc..cee135d 100644
--- a/style.css
+++ b/style.css
@@ -64,14 +64,6 @@
   --default-button-border-sunken-inner: inset -2px -2px var(--button-highlight), inset 3px 3px var(--button-shadow), inset -3px -3px var(--button-face);
 
 
-  .default {
-    box-shadow: var(--default-button-border-raised-outer), var(--default-button-border-raised-inner);
-  }
-  
-  .default:active {
-    box-shadow: var(--default-button-border-sunken-outer), var(--default-button-border-sunken-inner);
-  }
-
   /* Window borders flip button-face and button-highlight */
   --border-window-outer: inset -1px -1px var(--window-frame),
     inset 1px 1px var(--button-face);
@@ -166,6 +158,12 @@ input[type="reset"] {
   padding: 0 12px;
 }
 
+button.default,
+input[type="submit"].default,
+input[type="reset"].default {
+  box-shadow: var(--default-button-border-raised-outer), var(--default-button-border-raised-inner);
+}
+
 .vertical-bar {
   width: 4px;
   height: 20px;
@@ -180,6 +178,12 @@ input[type="reset"]:not(:disabled):active {
   text-shadow: 1px 1px var(--text-color);
 }
 
+button.default:not(:disabled):active,
+input[type="submit"].default:not(:disabled):active,
+input[type="reset"].default:not(:disabled):active {
+  box-shadow: var(--default-button-border-sunken-outer), var(--default-button-border-sunken-inner);
+}
+
 @media (not(hover)) {
   button:not(:disabled):hover,
   input[type="submit"]:not(:disabled):hover,

From bc9ccf5490c9d7f5cb35874698523c0d0481a5d0 Mon Sep 17 00:00:00 2001
From: Vincent Langlois <vtlanglo@gmail.com>
Date: Mon, 22 Jan 2024 18:09:46 -0500
Subject: [PATCH 3/3] Added documentation w/ example

---
 docs/index.html.ejs | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/docs/index.html.ejs b/docs/index.html.ejs
index c8459a9..0e4b9e2 100644
--- a/docs/index.html.ejs
+++ b/docs/index.html.ejs
@@ -141,10 +141,18 @@
           They are given 12px of horizontal padding by default.
         </p>
 
-        <%- example(`<button class="default">Click me</button>
+        <%- example(`<button>Click me</button>
         <input type="submit" />
         <input type="reset" /> `)%>
 
+        <p>
+          You can add the class <code>default</code> to any button to apply additional styling, 
+          useful when communicating to the user what default action would happen in the active window if 
+          the <kbd>Enter</kbd> key was pressed on Windows 98.
+        </p>
+
+        <%- example(`<button class="default">OK</button>`)%>
+
         <p>
           When buttons are clicked, the raised borders become sunken.
           The following button is simulated to be in the pressed (active) state.