From a8836f3eba8523c6baa46d6a41734a8e0e2788ea Mon Sep 17 00:00:00 2001
From: "Emma C. Hughes" <84008144+emmachughes@users.noreply.github.com>
Date: Fri, 14 Jul 2023 10:14:08 +0200
Subject: [PATCH] use icon font to avoid SVG cross-domain restriction

---
 sourcecode/hub/resources/css/app.scss                |  8 +-------
 .../hub/resources/views/components/icon.blade.php    | 12 +++---------
 2 files changed, 4 insertions(+), 16 deletions(-)

diff --git a/sourcecode/hub/resources/css/app.scss b/sourcecode/hub/resources/css/app.scss
index 4956209725..1962cc76df 100644
--- a/sourcecode/hub/resources/css/app.scss
+++ b/sourcecode/hub/resources/css/app.scss
@@ -1,13 +1,7 @@
 @import "bootstrap/scss/bootstrap";
 @import '@fontsource/lato';
+@import 'bootstrap-icons/font/bootstrap-icons.css';
 
 :root {
     --bs-font-sans-serif: Lato, sans-serif;
 }
-
-.bi {
-    display: inline-block;
-    vertical-align: -0.125em;
-    width: 1em;
-    height: 1em;
-}
diff --git a/sourcecode/hub/resources/views/components/icon.blade.php b/sourcecode/hub/resources/views/components/icon.blade.php
index 7db57935c0..87db8013b3 100644
--- a/sourcecode/hub/resources/views/components/icon.blade.php
+++ b/sourcecode/hub/resources/views/components/icon.blade.php
@@ -1,15 +1,9 @@
-@php use Illuminate\Support\Facades\Vite; @endphp
-<svg {{ $attributes->except(['name', 'label'])->merge([
-    'class' => 'bi',
-    'width' => 16,
-    'height' => 16,
-    'fill' => 'currentColor',
+<span {{ $attributes->except(['name', 'label'])->merge([
+    'class' => 'bi bi-' . $name,
     ...(isset($label) ? [
         'aria-label' => $label,
         'role' => 'img',
     ] : [
         'aria-hidden' => 'true',
     ]),
-]) }}>
-    <use xlink:href="{{ Vite::asset('node_modules/bootstrap-icons/bootstrap-icons.svg') }}#{{ $name }}" />
-</svg>
+]) }}></span>