docs: simplify cta css (#2507)

Author: bennypowers

docs/main.css

@@ -130,9 +130,11 @@ a.cta {
 }
 
 a.cta:not(.primary):not(.secondary)::after {
+  --img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.56 31.56' %3E%3Cpath d='M15.78 0l-3.1 3.1 10.5 10.49H0v4.38h23.18l-10.5 10.49 3.1 3.1 15.78-15.78L15.78 0z'%3E%3C/path%3E%3C/svg%3E");
   content: '';
-  background-image: url("data:image/svg+xml,%3Csvg fill='%230066cc' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.56 31.56' %3E%3Cpath d='M15.78 0l-3.1 3.1 10.5 10.49H0v4.38h23.18l-10.5 10.49 3.1 3.1 15.78-15.78L15.78 0z'%3E%3C/path%3E%3C/svg%3E");
-  background-repeat: no-repeat;
+  mask-image: var(--img);
+  -webkit-mask-image: var(--img);
+  background-color: currentcolor;
   display: inline-block;
   translate: 3px 0;
   width: 13px;
@@ -141,26 +143,6 @@ a.cta:not(.primary):not(.secondary)::after {
   margin-bottom: -1px;
 }
 
-.band:is(.dark, .accent) a.cta:not(.primary):not(.secondary)::after {
-  background-image: url("data:image/svg+xml,%3Csvg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.56 31.56' %3E%3Cpath d='M15.78 0l-3.1 3.1 10.5 10.49H0v4.38h23.18l-10.5 10.49 3.1 3.1 15.78-15.78L15.78 0z'%3E%3C/path%3E%3C/svg%3E");
-}
-
-.band:is(.dark, .accent) a.cta:hover:not(.primary):not(.secondary)::after {
-  background-image: url("data:image/svg+xml,%3Csvg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.56 31.56' %3E%3Cpath d='M15.78 0l-3.1 3.1 10.5 10.49H0v4.38h23.18l-10.5 10.49 3.1 3.1 15.78-15.78L15.78 0z'%3E%3C/path%3E%3C/svg%3E");
-}
-
-.band:is(.base) a.cta:not(.primary):not(.secondary)::after {
-  background-image: url("data:image/svg+xml,%3Csvg fill='%2306c' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.56 31.56' %3E%3Cpath d='M15.78 0l-3.1 3.1 10.5 10.49H0v4.38h23.18l-10.5 10.49 3.1 3.1 15.78-15.78L15.78 0z'%3E%3C/path%3E%3C/svg%3E");
-}
-
-.band:is(.base) a.cta:hover:not(.primary):not(.secondary)::after {
-  background-image: url("data:image/svg+xml,%3Csvg fill='%23004080' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.56 31.56' %3E%3Cpath d='M15.78 0l-3.1 3.1 10.5 10.49H0v4.38h23.18l-10.5 10.49 3.1 3.1 15.78-15.78L15.78 0z'%3E%3C/path%3E%3C/svg%3E");
-}
-
-.band:is(.light, .base) a.cta:visited:not(.secondary):not(.secondary)::after {
-  background-image: url("data:image/svg+xml,%3Csvg fill='%23004080' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.56 31.56' %3E%3Cpath d='M15.78 0l-3.1 3.1 10.5 10.49H0v4.38h23.18l-10.5 10.49 3.1 3.1 15.78-15.78L15.78 0z'%3E%3C/path%3E%3C/svg%3E");
-}
-
 .band a.cta:hover:not(.primary):not(.secondary)::after {
   translate: 6px;
 }
@@ -375,10 +357,6 @@ main.blog {
   color: var(--pf-theme--color--white, #fff);
 }
 
-.pf-bar a.cta:not(.primary):not(.secondary)::after {
-  background-image: url("data:image/svg+xml,%3Csvg fill='white' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 31.56 31.56' %3E%3Cpath d='M15.78 0l-3.1 3.1 10.5 10.49H0v4.38h23.18l-10.5 10.49 3.1 3.1 15.78-15.78L15.78 0z'%3E%3C/path%3E%3C/svg%3E");
-}
-
 .pf-bar a.cta:hover:not(.primary):not(.secondary)::after {
   translate: 6px;
 }