fix: externalise icons

js/components/arrow-button.js

@@ -54,13 +54,6 @@ class ArrowButton extends HTMLElement {
           flex-shrink: 0;
         }
 
-        .arrow-icon svg {
-          width: 24px;
-          height: 24px;
-          stroke: currentColor;
-          fill: none;
-        }
-
         .button-text {
           text-decoration: underline;
           text-underline-offset: 3px;
@@ -68,11 +61,7 @@ class ArrowButton extends HTMLElement {
       </style>
       <a class="arrow-button" href="${this.href}">
         <span class="arrow-icon">
-          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-            <circle cx="12" cy="12" r="10"/>
-            <path d="m12 16 4-4-4-4"/>
-            <path d="M8 12h8"/>
-          </svg>
+          <arrow-circle-right-icon size="24"></arrow-circle-right-icon>
         </span>
         <span class="button-text">
           <slot></slot>