From 21859f368757c6911f5cbcde9921b54ae7f78249 Mon Sep 17 00:00:00 2001
From: Adam Argyle <argyle@google.com>
Date: Tue, 15 Nov 2022 07:40:17 -0800
Subject: [PATCH] fixes icons after normalize update

---
 docsite/index.html | 26 +++++++++++++-------------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/docsite/index.html b/docsite/index.html
index 2170637d..c7ce9377 100644
--- a/docsite/index.html
+++ b/docsite/index.html
@@ -42,7 +42,7 @@
         <polyline points="9 11 12 14 22 4"></polyline>
         <path style="opacity:.75;" d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"></path>
       </symbol>
-      <symbol id="bent-arrow">
+      <symbol id="bent-arrow" fill="none" stroke="currentColor">
         <path d="m15 10 5 5-5 5"/>
         <path d="M4 4v7a4 4 0 0 0 4 4h12"/>
       </symbol>
@@ -101,19 +101,19 @@ <h1><span>CSS</span> <span>variables.</span></h1>
         <ul class="checkmark-list">
           <li>
             <svg viewBox="0 0 24 24">
-              <use href="#checkmark-icon"/>
+              <use href="#checkmark-icon" fill="none"/>
             </svg>
             Expertly crafted web design tokens
           </li>
           <li>
             <svg viewBox="0 0 24 24">
-              <use href="#checkmark-icon"/>
+              <use href="#checkmark-icon" fill="none"/>
             </svg>
             Create consistent components
           </li>
           <li>
             <svg viewBox="0 0 24 24">
-              <use href="#checkmark-icon"/>
+              <use href="#checkmark-icon" fill="none"/>
             </svg>
             Useful in any framework
           </li>
@@ -289,8 +289,8 @@ <h2>Why Use Open Props?</h2>
         <div>
           <dt>
             <svg viewBox="0 0 24 24">
-              <path d="M17.657 18.657A8 8 0 016.343 7.343S7 9 9 10c0-2 .5-5 2.986-7C14 5 16.09 5.777 17.656 7.343A7.975 7.975 0 0120 13a7.975 7.975 0 01-2.343 5.657z" />
-              <path d="M9.879 16.121A3 3 0 1012.015 11L11 14H9c0 .768.293 1.536.879 2.121z" />
+              <path d="M17.657 18.657A8 8 0 016.343 7.343S7 9 9 10c0-2 .5-5 2.986-7C14 5 16.09 5.777 17.656 7.343A7.975 7.975 0 0120 13a7.975 7.975 0 01-2.343 5.657z" stroke="currentColor" fill="none" />
+              <path d="M9.879 16.121A3 3 0 1012.015 11L11 14H9c0 .768.293 1.536.879 2.121z" stroke="currentColor" fill="none" />
             </svg>
             Design Consistently
           </dt>
@@ -299,7 +299,7 @@ <h2>Why Use Open Props?</h2>
         <div>
           <dt>
             <svg viewBox="0 0 24 24">
-              <path d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z" />
+              <path d="M4.318 6.318a4.5 4.5 0 000 6.364L12 20.364l7.682-7.682a4.5 4.5 0 00-6.364-6.364L12 7.636l-1.318-1.318a4.5 4.5 0 00-6.364 0z" stroke="currentColor" fill="none" />
             </svg>
             Predictable
           </dt>
@@ -308,8 +308,8 @@ <h2>Why Use Open Props?</h2>
         <div>
           <dt>
             <svg  viewBox="0 0 24 24" >
-              <path d="M11 3.055A9.001 9.001 0 1020.945 13H11V3.055z" />
-              <path d="M20.488 9H15V3.512A9.025 9.025 0 0120.488 9z" />
+              <path d="M11 3.055A9.001 9.001 0 1020.945 13H11V3.055z" stroke="currentColor" fill="none" />
+              <path d="M20.488 9H15V3.512A9.025 9.025 0 0120.488 9z" stroke="currentColor" fill="none" />
             </svg>
             Incrementally Adoptable
           </dt>
@@ -318,7 +318,7 @@ <h2>Why Use Open Props?</h2>
         <div>
           <dt>
             <svg viewBox="0 0 24 24">
-              <path d="M14 10l-2 1m0 0l-2-1m2 1v2.5M20 7l-2 1m2-1l-2-1m2 1v2.5M14 4l-2-1-2 1M4 7l2-1M4 7l2 1M4 7v2.5M12 21l-2-1m2 1l2-1m-2 1v-2.5M6 18l-2-1v-2.5M18 18l2-1v-2.5" />
+              <path d="M14 10l-2 1m0 0l-2-1m2 1v2.5M20 7l-2 1m2-1l-2-1m2 1v2.5M14 4l-2-1-2 1M4 7l2-1M4 7l2 1M4 7v2.5M12 21l-2-1m2 1l2-1m-2 1v-2.5M6 18l-2-1v-2.5M18 18l2-1v-2.5" stroke="currentColor" fill="none" />
             </svg>
             Customizable
           </dt>
@@ -1166,7 +1166,7 @@ <h2>Colors</h2>
         <div class="block-wrap">
           <p>Open Props includes <a href="https://yeun.github.io/open-color/">Open Color</a> (Version 1.9.1), an open-source color scheme optimized for UI development.</p>
           <blockquote class="icon-quote">
-            <svg viewBox="0 0 24 24">
+            <svg viewBox="0 0 24 24" stroke="currentColor" fill="none">
               <path d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z" />
             </svg>
             <span>Open the color picker in your browser dev tools, set the swatches to the page's custom properties, and enjoy picking from the set!</span>
@@ -2907,7 +2907,7 @@ <h2>Media Queries</h2>
           <p>Currently one step ahead of <a href="https://drafts.csswg.org/mediaqueries-5/#at-ruledef-custom-media">the CSS spec</a>, Open Props offers named media queries with the <code>@custom-media</code> syntax. Available only with <a href="https://github.com/csstools/postcss-plugins/tree/main/plugins/postcss-custom-media">this PostCSS plugin</a>, for now 😈</p>
 
           <blockquote class="icon-quote indigo">
-            <svg viewBox="0 0 24 24">
+            <svg viewBox="0 0 24 24" stroke="currentColor" fill="none">
               <path d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z" />
             </svg>
             <span>Media query widths also available as custom properties. Use like <code class="language-css">var(--size-sm)</code></span>
@@ -3095,7 +3095,7 @@ <h2>Masks</h2>
         <div class="block-wrap">
           <p>Rad edges and corner-cuts ready to go. A huge shout out to <a href="https://twitter.com/ChallengesCss">Temani Afif</a> and <a href="https://github.com/argyleink/open-props/discussions/71">their amazing mask work</a>. Be sure to check out their <a href="https://css-generators.com/">CSS Generators</a> too; customize the size and distribution of these masks. Try on <a href="https://codepen.io/argyleink/pen/mdxKrxR">Codepen</a>.</p>
           <blockquote class="icon-quote jagged">
-            <svg viewBox="0 0 24 24">
+            <svg viewBox="0 0 24 24" stroke="currentColor" fill="none">
               <path
                 d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z" />
             </svg>