Marketing: Add disabled states for buttons (and tweak hover) (#1768)

tobiasahlin · actions-user · web-flow · commit 4abb1af95b9b · 2021-12-06T08:37:43.000Z
* Add disabled styles

* Make sure links aren't decorated

* Create orange-camels-heal.md

* Stylelint auto-fixes

Co-authored-by: Actions Auto Build &lt;actions@github.com&gt;
diff --git a/.changeset/orange-camels-heal.md b/.changeset/orange-camels-heal.md
@@ -0,0 +1,5 @@
+---
+"@primer/css": patch
+---
+
+Marketing: Add disabled states for buttons (and tweak hover)
diff --git a/src/marketing/buttons/button.scss b/src/marketing/buttons/button.scss
@@ -38,6 +38,7 @@
   }
 
   &:hover {
+    text-decoration: none;
     box-shadow: var(--color-mktg-btn-shadow-hover) !important;
   }
 
@@ -68,6 +69,13 @@
       opacity: 0.5 !important;
     }
   }
+
+  &.disabled,
+  &[disabled] {
+    pointer-events: none;
+    cursor: default;
+    opacity: 0.5;
+  }
 }
 
 .btn-muted-mktg {

Original file line number	Diff line number	Diff line change
`@@ -38,6 +38,7 @@`
`38`	`38`	`}`
`39`	`39`
`40`	`40`	`&:hover {`
	`41`	`+ text-decoration: none;`
`41`	`42`	`box-shadow: var(--color-mktg-btn-shadow-hover) !important;`
`42`	`43`	`}`
`43`	`44`
`@@ -68,6 +69,13 @@`
`68`	`69`	`opacity: 0.5 !important;`
`69`	`70`	`}`
`70`	`71`	`}`
	`72`	`+`
	`73`	`+ &.disabled,`
	`74`	`+ &[disabled] {`
	`75`	`+ pointer-events: none;`
	`76`	`+ cursor: default;`
	`77`	`+ opacity: 0.5;`
	`78`	`+ }`
`71`	`79`	`}`
`72`	`80`
`73`	`81`	`.btn-muted-mktg {`