🎆 Fixes to fontawesome icons

src/client/assets/scss/App.scss

@@ -279,6 +279,7 @@ $size-8: 0.9rem;
       top: 204px;
       z-index: 1;
       background: #fffffc;
+      min-height: 120px;
     }
     tr {
       td {
@@ -329,15 +330,6 @@ $size-8: 0.9rem;
 }
 
 // comicvine search results
-.slide-pane__content {
-  padding: 24px 12px;
-}
-.slide-pane__header {
-  margin-top: 52px;
-}
-.slide-pane__close {
-  display: none;
-}
 .search-results-container {
   margin: 15px 0 0 0;
   overflow: hidden;
@@ -387,7 +379,6 @@ $size-8: 0.9rem;
   margin-bottom: 20px;
 }
 
-//
 // progress
 .progress-indicator-container {
   height: 100%;

src/client/components/AirDCPPSettingsForm.tsx

@@ -24,7 +24,9 @@ export const AirDCPPSettingsForm = (): ReactElement => {
             </div>
           </div>
 
-          <button type="submit" className="button is-primary">Submit</button>
+          <button type="submit" className="button is-primary">
+            Submit
+          </button>
         </form>
       )}
     />

src/client/components/ComicDetail.tsx

@@ -179,7 +179,7 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
     {
       id: 1,
       name: "Volume Information",
-      icon: <i className="fa-regular fa-layer-group"></i>,
+      icon: <i className="fa-solid fa-layer-group"></i>,
       content: isComicBookMetadataAvailable ? (
         <div key={1}>
           <div className="columns">
@@ -251,7 +251,7 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
             onClick={unpackComicArchive}
           >
             <span className="icon is-small">
-              <i className="fa-regular fa-box-open"></i>
+              <i className="fa-solid fa-box-open"></i>
             </span>
             <span>Unpack comic archive</span>
           </button>
@@ -269,7 +269,7 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
                       {extractedComicBookArchive.length} pages
                       <button className="button is-small is-light is-primary is-outlined">
                         <span className="icon is-small">
-                          <i className="fa-regular fa-compress"></i>
+                          <i className="fa-solid fa-compress"></i>
                         </span>
                         <span>Convert to CBZ</span>
                       </button>
@@ -284,7 +284,7 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
     },
     {
       id: 3,
-      icon: <i className="fa-regular fa-download"></i>,
+      icon: <i className="fa-solid fa-floppy-disk"></i>,
       name: "Acquisition",
       content: (
         <AcquisitionPanel comicBookMetadata={comicBookDetailData} key={3} />
@@ -326,7 +326,7 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
                   !isNil(comicBookDetailData) &&
                   !isEmpty(comicBookDetailData) ? (
                     <span className="download-icon-labels">
-                      <i className="fa-regular fa-cloud-arrow-down"></i>
+                      <i className="fa-solid fa-download"></i>
                       <span className="tag downloads-count">
                         {comicBookDetailData.acquisition.directconnect.length}
                       </span>
@@ -482,7 +482,7 @@ export const ComicDetail = ({}: ComicDetailProps): ReactElement => {
   //  Actions menu options and handler
   const CVMatchLabel = (
     <span>
-      <i className="fa-regular fa-magic"></i> Match on ComicVine
+      <i className="fa-solid fa-wand-magic"></i> Match on ComicVine
     </span>
   );