Added CSS Markdown classes for secondary buttons.

hibbitts-design · Jan 16, 2024 · 76eb6dd · 76eb6dd
1 parent 53786e5
commit 76eb6dd
Show file tree

Hide file tree

Showing 2 changed files with 52 additions and 1 deletion.
diff --git a/README.md b/README.md
@@ -249,12 +249,24 @@ For example, here is a [Docsify Open Course Site hosted within a Canvas course](
 [Required Reading Quiz due Jun 4th](https://canvas.sfu.ca/courses/44038/quizzes/166553 ':class=button')
 ```
 
+`button-secondary`  
+
+```markdown
+[Required Reading Quiz due Jun 4th](https://canvas.sfu.ca/courses/44038/quizzes/166553 ':class=button-secondary')
+```
+
 `button-rounded`  
 
 ```markdown
 [Required Reading Quiz due Jun 4th](https://canvas.sfu.ca/courses/44038/quizzes/166553 ':class=button-rounded')
 ```
 
+`button-rounded-secondary`  
+
+```markdown
+[Required Reading Quiz due Jun 4th](https://canvas.sfu.ca/courses/44038/quizzes/166553 ':class=button-rounded-secondary')
+```
+
 `embedly-card` (for linked article previews, embedded slides/videos, etc.)  
 
 ```markdown

diff --git a/docs/assets/css/theme.css b/docs/assets/css/theme.css
@@ -56,7 +56,6 @@
   color: var(--base-background-color);
   height: auto;
   display: inline-block;
-  margin-top: 4px;
   padding: 10px;
   font-family: -apple-system, "Segoe UI", "Helvetica Neue", sans-serif;
   line-height: 1.2rem;
@@ -71,6 +70,26 @@
   text-decoration: none !important;
 }
 
+.markdown-section .button-secondary {
+  cursor: pointer;
+  color: var(--link-color);
+  height: auto;
+  display: inline-block;
+  padding: 10px;
+  font-family: -apple-system, "Segoe UI", "Helvetica Neue", sans-serif;
+  line-height: 1.2rem;
+  background-color: transparent;
+  text-decoration: none;
+  border: 1px solid var(--link-color)!important;
+  border-radius: .25rem;
+}
+
+.markdown-section a.button-secondary {
+  cursor: pointer;
+  color: var(--link-color);
+  text-decoration: none !important;
+}
+
 .markdown-section .button-rounded {
   cursor: pointer;
   color: var(--base-background-color);
@@ -90,6 +109,26 @@
   text-decoration: none !important;
 }
 
+.markdown-section .button-secondary-rounded {
+  cursor: pointer;
+  color: var(--link-color);
+  height: auto;
+  display: inline-block;
+  padding: 10px min(20px, 5%) 10px min(20px, 5%);
+  font-family: -apple-system, "Segoe UI", "Helvetica Neue", sans-serif;
+  line-height: 1.2rem;
+  background-color: transparent;
+  text-decoration: none;
+  border: 1px solid var(--link-color)!important;
+  border-radius: 1.4rem;
+}
+
+.markdown-section a.button-secondary-rounded {
+  cursor: pointer;
+  color: var(--link-color);
+  text-decoration: none !important;
+}
+
 .markdown-section .navpill {
   cursor: pointer;
   color: var(--base-color);