fix: replace ion icons with SVGs and remove script dependencies (sugarlabs#516)

haroon10725 · web-flow · commit e766c2c1f454 · 2024-10-24T10:57:23.000-04:00
* removed ion icons

* created a folder in assets
diff --git a/assets/ion-icons/book.svg b/assets/ion-icons/book.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><path d="M202.24 74C166.11 56.75 115.61 48.3 48 48a31.36 31.36 0 00-17.92 5.33A32 32 0 0016 79.9V366c0 19.34 13.76 33.93 32 33.93 71.07 0 142.36 6.64 185.06 47a4.11 4.11 0 006.94-3V106.82a15.89 15.89 0 00-5.46-12A143 143 0 00202.24 74zM481.92 53.3A31.33 31.33 0 00464 48c-67.61.3-118.11 8.71-154.24 26a143.31 143.31 0 00-32.31 20.78 15.93 15.93 0 00-5.45 12v337.13a3.93 3.93 0 006.68 2.81c25.67-25.5 70.72-46.82 185.36-46.81a32 32 0 0032-32v-288a32 32 0 00-14.12-26.61z"/></svg>
diff --git a/assets/ion-icons/call.svg b/assets/ion-icons/call.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><path d="M391 480c-19.52 0-46.94-7.06-88-30-49.93-28-88.55-53.85-138.21-103.38C116.91 298.77 93.61 267.79 61 208.45c-36.84-67-30.56-102.12-23.54-117.13C45.82 73.38 58.16 62.65 74.11 52a176.3 176.3 0 0128.64-15.2c1-.43 1.93-.84 2.76-1.21 4.95-2.23 12.45-5.6 21.95-2 6.34 2.38 12 7.25 20.86 16 18.17 17.92 43 57.83 52.16 77.43 6.15 13.21 10.22 21.93 10.23 31.71 0 11.45-5.76 20.28-12.75 29.81-1.31 1.79-2.61 3.5-3.87 5.16-7.61 10-9.28 12.89-8.18 18.05 2.23 10.37 18.86 41.24 46.19 68.51s57.31 42.85 67.72 45.07c5.38 1.15 8.33-.59 18.65-8.47 1.48-1.13 3-2.3 4.59-3.47 10.66-7.93 19.08-13.54 30.26-13.54h.06c9.73 0 18.06 4.22 31.86 11.18 18 9.08 59.11 33.59 77.14 51.78 8.77 8.84 13.66 14.48 16.05 20.81 3.6 9.53.21 17-2 22-.37.83-.78 1.74-1.21 2.75a176.49 176.49 0 01-15.29 28.58c-10.63 15.9-21.4 28.21-39.38 36.58A67.42 67.42 0 01391 480z"/></svg>
diff --git a/assets/ion-icons/chatbubble-ellipses.svg b/assets/ion-icons/chatbubble-ellipses.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><path d="M398 81.84A227.4 227.4 0 00255.82 32C194.9 32 138 55.47 95.46 98.09 54.35 139.33 31.82 193.78 32 251.37a215.66 215.66 0 0035.65 118.76l.19.27c.28.41.57.82.86 1.22s.65.92.73 1.05l.22.4c1.13 2 2 4.44 1.23 6.9l-18.42 66.66a29.13 29.13 0 00-1.2 7.63A25.69 25.69 0 0076.83 480a29.44 29.44 0 0010.45-2.29l67.49-24.36.85-.33a14.75 14.75 0 015.8-1.15 15.12 15.12 0 015.37 1c1.62.63 16.33 6.26 31.85 10.6 12.9 3.6 39.74 9 60.77 9 59.65 0 115.35-23.1 156.83-65.06C457.36 365.77 480 310.42 480 251.49a213.5 213.5 0 00-4.78-45c-10.34-48.62-37.76-92.9-77.22-124.65zM87.48 380zM160 288a32 32 0 1132-32 32 32 0 01-32 32zm96 0a32 32 0 1132-32 32 32 0 01-32 32zm96 0a32 32 0 1132-32 32 32 0 01-32 32z"/></svg>
diff --git a/assets/ion-icons/code.svg b/assets/ion-icons/code.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><path d="M160 389a20.91 20.91 0 01-13.82-5.2l-128-112a21 21 0 010-31.6l128-112a21 21 0 0127.66 31.61L63.89 256l109.94 96.19A21 21 0 01160 389zM352 389a21 21 0 01-13.84-36.81L448.11 256l-109.94-96.19a21 21 0 0127.66-31.61l128 112a21 21 0 010 31.6l-128 112A20.89 20.89 0 01352 389z"/></svg>
diff --git a/assets/ion-icons/home.svg b/assets/ion-icons/home.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><path d="M261.56 101.28a8 8 0 00-11.06 0L66.4 277.15a8 8 0 00-2.47 5.79L63.9 448a32 32 0 0032 32H192a16 16 0 0016-16V328a8 8 0 018-8h80a8 8 0 018 8v136a16 16 0 0016 16h96.06a32 32 0 0032-32V282.94a8 8 0 00-2.47-5.79z"/><path d="M490.91 244.15l-74.8-71.56V64a16 16 0 00-16-16h-48a16 16 0 00-16 16v32l-57.92-55.38C272.77 35.14 264.71 32 256 32c-8.68 0-16.72 3.14-22.14 8.63l-212.7 203.5c-6.22 6-7 15.87-1.34 22.37A16 16 0 0043 267.56L250.5 69.28a8 8 0 0111.06 0l207.52 198.28a16 16 0 0022.59-.44c6.14-6.36 5.63-16.86-.76-22.97z"/></svg>
diff --git a/assets/ion-icons/language.svg b/assets/ion-icons/language.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><path d="M478.33 433.6l-90-218a22 22 0 00-40.67 0l-90 218a22 22 0 1040.67 16.79L316.66 406h102.67l18.33 44.39A22 22 0 00458 464a22 22 0 0020.32-30.4zM334.83 362L368 281.65 401.17 362zM267.84 342.92a22 22 0 00-4.89-30.7c-.2-.15-15-11.13-36.49-34.73 39.65-53.68 62.11-114.75 71.27-143.49H330a22 22 0 000-44H214V70a22 22 0 00-44 0v20H54a22 22 0 000 44h197.25c-9.52 26.95-27.05 69.5-53.79 108.36-31.41-41.68-43.08-68.65-43.17-68.87a22 22 0 00-40.58 17c.58 1.38 14.55 34.23 52.86 83.93.92 1.19 1.83 2.35 2.74 3.51-39.24 44.35-77.74 71.86-93.85 80.74a22 22 0 1021.07 38.63c2.16-1.18 48.6-26.89 101.63-85.59 22.52 24.08 38 35.44 38.93 36.1a22 22 0 0030.75-4.9z"/></svg>
diff --git a/assets/ion-icons/mail.svg b/assets/ion-icons/mail.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><path d="M424 80H88a56.06 56.06 0 00-56 56v240a56.06 56.06 0 0056 56h336a56.06 56.06 0 0056-56V136a56.06 56.06 0 00-56-56zm-14.18 92.63l-144 112a16 16 0 01-19.64 0l-144-112a16 16 0 1119.64-25.26L256 251.73l134.18-104.36a16 16 0 0119.64 25.26z"/></svg>
diff --git a/assets/ion-icons/people.svg b/assets/ion-icons/people.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><path d="M336 256c-20.56 0-40.44-9.18-56-25.84-15.13-16.25-24.37-37.92-26-61-1.74-24.62 5.77-47.26 21.14-63.76S312 80 336 80c23.83 0 45.38 9.06 60.7 25.52 15.47 16.62 23 39.22 21.26 63.63-1.67 23.11-10.9 44.77-26 61C376.44 246.82 356.57 256 336 256zm66-88zM467.83 432H204.18a27.71 27.71 0 01-22-10.67 30.22 30.22 0 01-5.26-25.79c8.42-33.81 29.28-61.85 60.32-81.08C264.79 297.4 299.86 288 336 288c36.85 0 71 9 98.71 26.05 31.11 19.13 52 47.33 60.38 81.55a30.27 30.27 0 01-5.32 25.78A27.68 27.68 0 01467.83 432zM147 260c-35.19 0-66.13-32.72-69-72.93-1.42-20.6 5-39.65 18-53.62 12.86-13.83 31-21.45 51-21.45s38 7.66 50.93 21.57c13.1 14.08 19.5 33.09 18 53.52-2.87 40.2-33.8 72.91-68.93 72.91zM212.66 291.45c-17.59-8.6-40.42-12.9-65.65-12.9-29.46 0-58.07 7.68-80.57 21.62-25.51 15.83-42.67 38.88-49.6 66.71a27.39 27.39 0 004.79 23.36A25.32 25.32 0 0041.72 400h111a8 8 0 007.87-6.57c.11-.63.25-1.26.41-1.88 8.48-34.06 28.35-62.84 57.71-83.82a8 8 0 00-.63-13.39c-1.57-.92-3.37-1.89-5.42-2.89z"/></svg>
diff --git a/assets/ion-icons/person.svg b/assets/ion-icons/person.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><path d="M332.64 64.58C313.18 43.57 286 32 256 32c-30.16 0-57.43 11.5-76.8 32.38-19.58 21.11-29.12 49.8-26.88 80.78C156.76 206.28 203.27 256 256 256s99.16-49.71 103.67-110.82c2.27-30.7-7.33-59.33-27.03-80.6zM432 480H80a31 31 0 01-24.2-11.13c-6.5-7.77-9.12-18.38-7.18-29.11C57.06 392.94 83.4 353.61 124.8 326c36.78-24.51 83.37-38 131.2-38s94.42 13.5 131.2 38c41.4 27.6 67.74 66.93 76.18 113.75 1.94 10.73-.68 21.34-7.18 29.11A31 31 0 01432 480z"/></svg>
diff --git a/contact-us.html b/contact-us.html
@@ -20,10 +20,10 @@
                             <h2 class="text-center" >How to reach us?</h2>
                             <hr>
                             <ul >
-                                <li class="listFont"><ion-icon name="home-sharp"></ion-icon>&nbsp;By mail: Sugar Labs</br>&nbsp;&nbsp;&nbsp;&nbsp;2028 E Ben White Blvd<b>&nbsp;STE 240 PMB 1271</b></br>&nbsp;&nbsp;&nbsp;&nbsp;AUSTIN, TX 78741</br>&nbsp;&nbsp;&nbsp;&nbsp;USA</li>
-                                <li class="listFont"><ion-icon name="call-sharp"></ion-icon>&nbsp;By text or voice: <a href="tel:+16177024088">+1 (617) 702-4088</a></li>
-                                <li class="listFont"><ion-icon name="mail-sharp"></ion-icon>&nbsp;By email: <a href="mailto:info@sugarlabs.org">info@sugarlabs.org</a></li>
-                                <li class="listFont"><ion-icon name="chatbubble-ellipses-sharp"></ion-icon>&nbsp;Via Matrix real-time chat: <a href="https://wiki.sugarlabs.org/go/Matrix">https://wiki.sugarlabs.org/go/Matrix</a></li>
+                                <li class="listFont"><object type="image/svg+xml" data="/assets/ion-icons/home.svg" width="16" height="16"></object>&nbsp;By mail: Sugar Labs</br>&nbsp;&nbsp;&nbsp;&nbsp;2028 E Ben White Blvd<b>&nbsp;STE 240 PMB 1271</b></br>&nbsp;&nbsp;&nbsp;&nbsp;AUSTIN, TX 78741</br>&nbsp;&nbsp;&nbsp;&nbsp;USA</li>
+                                <li class="listFont"><object type="image/svg+xml" data="/assets/ion-icons/call.svg" width="16" height="16"></object>&nbsp;By text or voice: <a href="tel:+16177024088">+1 (617) 702-4088</a></li>
+                                <li class="listFont"><object type="image/svg+xml" data="/assets/ion-icons/mail.svg" width="16" height="16"></object>&nbsp;By email: <a href="mailto:info@sugarlabs.org">info@sugarlabs.org</a></li>
+                                <li class="listFont"><object type="image/svg+xml" data="/assets/ion-icons/chatbubble-ellipses.svg" width="16" height="16"></object>&nbsp;Via Matrix real-time chat: <a href="https://wiki.sugarlabs.org/go/Matrix">https://wiki.sugarlabs.org/go/Matrix</a></li>
                             </ul>
                         </div>
                     </div>
@@ -87,6 +87,4 @@ <h2 class="text-center customPadding2">SOCIAL MEDIA PLATFORMS</h2>
         </div>
     </div>
 </section>
-    
-<script type="module" src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.esm.js"></script>
-<script nomodule src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.js"></script>
+
diff --git a/develop.html b/develop.html
@@ -98,13 +98,13 @@ <h2>What our developers say about their journey</h2>
                         <h2>IMPORTANT LINKS FOR DEVELOPERS</h2> 
                         <p class="customFontSize">The following is a list of important links for people interested in making development contributions to Sugar Labs:
                           <ul>
-			    <li><ion-icon name="chatbubble-ellipses-sharp"></ion-icon><a href="https://matrix.to/#/#sugar:matrix.org">&nbsp;Chat with us on Matrix</a></li>
-			    <li><ion-icon name="book-sharp"></ion-icon><a href="https://github.com/sugarlabs/sugar-docs/blob/master/README.md/">&nbsp;Developer guide</a></li>
-                            <li><ion-icon name="mail-sharp"></ion-icon><a href="https://wiki.sugarlabs.org/go/Mailing_Lists">&nbsp;Mailing lists (old-school, but still active and useful)</a></li>
-                            <li><ion-icon name="language-sharp"></ion-icon><a href="http://translate.sugarlabs.org/">&nbsp;Contribute to translations</a></li>
-			    <li><ion-icon name="code-sharp"></ion-icon><a href="https://github.com/sugarlabs/sugar-docs/blob/master/README.md">&nbsp;Related projects</a></li><!--What is this?-->
-			    <li><ion-icon name="person-sharp"></ion-icon><a href="{{ site.baseurl }}/profiles">&nbsp;Who are the developers of Sugar Labs?</a></li>
-			    <li><ion-icon name="people-sharp"></ion-icon><a href="https://github.com/sugarlabs/sugar-docs/blob/master/src/CODE_OF_CONDUCT.md">&nbsp;Code of Conduct</a></li>
+			                <li><a href="https://matrix.to/#/#sugar:matrix.org"><object type="image/svg+xml" data="/assets/ion-icons/chatbubble-ellipses.svg" width="16" height="16"></object>&nbsp;Chat with us on Matrix</a></li>
+			                <li><a href="https://github.com/sugarlabs/sugar-docs/blob/master/README.md/"><object type="image/svg+xml" data="/assets/ion-icons/book.svg" width="16" height="16"></object>&nbsp;Developer guide</a></li>
+                            <li><a href="https://wiki.sugarlabs.org/go/Mailing_Lists"><object type="image/svg+xml" data="/assets/ion-icons/mail.svg" width="16" height="16"></object>&nbsp;Mailing lists (old-school, but still active and useful)</a></li>
+                            <li><a href="http://translate.sugarlabs.org/"><object type="image/svg+xml" data="/assets/ion-icons/language.svg" width="16" height="16"></object>&nbsp;Contribute to translations</a></li>
+                            <li><a href="https://github.com/sugarlabs/sugar-docs/blob/master/README.md"><object type="image/svg+xml" data="/assets/ion-icons/code.svg" width="16" height="16"></object>&nbsp;Related projects</a></li><!--What is this?-->
+                            <li><a href="{{ site.baseurl }}/profiles"><object type="image/svg+xml" data="/assets/ion-icons/person.svg" width="16" height="16"></object>&nbsp;Who are the developers of Sugar Labs?</a></li>
+                            <li><a href="https://github.com/sugarlabs/sugar-docs/blob/master/src/CODE_OF_CONDUCT.md"><object type="image/svg+xml" data="/assets/ion-icons/people.svg" width="16" height="16"></object>&nbsp;Code of Conduct</a></li>
                         </ul>
                         </p>
                     </div>
@@ -158,6 +158,3 @@ <h2>What is free, libre, and open (FLO)?</h2>
         </div>
     </div>
 </section>
-
-<script type="module" src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.esm.js"></script>
-<script nomodule src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.js"></script>
