1 files changed, 45 insertions, 0 deletions
diff --git a/site/assets/scss/_buttons.scss b/site/assets/scss/_buttons.scss
new file mode 100644
index 0000000..13bd6e4
--- /dev/null
+++ b/site/assets/scss/_buttons.scss
@@ -0,0 +1,45 @@
+// Buttons
+//
+// Custom buttons for the docs.
+
+// scss-docs-start btn-css-vars-example
+.btn-bd-primary {
+  --bs-btn-font-weight: 600;
+  --bs-btn-color: var(--bs-white);
+  --bs-btn-bg: var(--bd-violet);
+  --bs-btn-border-color: var(--bd-violet);
+  --bs-btn-border-radius: .5rem;
+  --bs-btn-hover-color: var(--bs-white);
+  --bs-btn-hover-bg: #{shade-color($bd-violet, 10%)};
+  --bs-btn-hover-border-color: #{shade-color($bd-violet, 10%)};
+  --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
+  --bs-btn-active-color: var(--bs-btn-hover-color);
+  --bs-btn-active-bg: #{shade-color($bd-violet, 20%)};
+  --bs-btn-active-border-color: #{shade-color($bd-violet, 20%)};
+}
+// scss-docs-end btn-css-vars-example
+
+.btn-bd-accent {
+  --bs-btn-font-weight: 600;
+  --bs-btn-color: var(--bd-accent);
+  --bs-btn-border-color: var(--bd-accent);
+  --bs-btn-hover-color: var(--bd-dark);
+  --bs-btn-hover-bg: var(--bd-accent);
+  --bs-btn-hover-border-color: var(--bd-accent);
+  --bs-btn-focus-shadow-rgb: var(--bd-accent-rgb);
+  --bs-btn-active-color: var(--bs-btn-hover-color);
+  --bs-btn-active-bg: var(--bs-btn-hover-bg);
+  --bs-btn-active-border-color: var(--bs-btn-hover-border-color);
+}
+
+.btn-bd-light {
+  --bs-btn-color: var(--bs-gray-600);
+  --bs-btn-border-color: var(--bs-gray-400);
+  --bs-btn-hover-color: var(--bd-violet);
+  --bs-btn-hover-border-color: var(--bd-violet);
+  --bs-btn-active-color: var(--bd-violet);
+  --bs-btn-active-bg: var(--bs-white);
+  --bs-btn-active-border-color: var(--bd-violet);
+  --bs-btn-focus-border-color: var(--bd-violet);
+  --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
+}