feat(docs): make the blank link icon inherit color (#577)

close #451
kestra-io · Oct 11, 2023 · bfdf020 · bfdf020
1 parent 8426435
commit bfdf020
Showing 1 changed file with 11 additions and 5 deletions.
diff --git a/assets/styles/docs.scss b/assets/styles/docs.scss
@@ -188,10 +188,16 @@ $bd-gutter-x: 3rem;
         max-width: 100%;
     }
 
-    a[target="_blank"] {
-        background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' focusable='false' x='0px' y='0px' viewBox='0 0 100 100' width='15' height='15' class='icon outbound'><path fill='currentColor' d='M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z'></path> <polygon fill='currentColor' points='45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9'></polygon></svg>");
-        background-repeat: no-repeat;
-        background-position: center right;
-        padding-right: 16px;
+    a[target="_blank"]::after {
+        $svg-icon: "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' focusable='false' x='0px' y='0px' viewBox='0 0 100 100' width='15' height='15' class='icon outbound'><path fill='currentColor' d='M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z'></path> <polygon fill='currentColor' points='45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9'></polygon></svg>";
+        -webkit-mask: url($svg-icon);
+        mask: url($svg-icon);
+        display: inline-block;
+        width: 15px;
+        height: 15px;
+        background-color: currentcolor;
+        content: '';
+        vertical-align: baseline;
+        margin-left: 1px;
     }
 }