fix misaligned icons

muckelba · Dec 1, 2023 · f559aed · f559aed
1 parent b5e3cdb
commit f559aed
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 4 deletions.
diff --git a/src/lib/components/Faq.svelte b/src/lib/components/Faq.svelte
@@ -12,9 +12,13 @@
  <!-- svelte-ignore a11y-no-static-element-interactions -->
  <a class="card-header darker-bg" on:click={toggleFaq}>
  <p class="card-header-title title is-3 is-centered">
- <i class="fa fa-angle-{faqHidden ? 'down' : 'up'} icon is-large has-text-primary" />
+ <span class="icon is-large has-text-primary">
+ <i class="fa fa-angle-{faqHidden ? 'down' : 'up'}" />
+ </span>
  FAQ
- <i class="fa fa-angle-{faqHidden ? 'down' : 'up'} icon is-large has-text-primary" />
+ <span class="icon is-large has-text-primary">
+ <i class="fa fa-angle-{faqHidden ? 'down' : 'up'}" />
+ </span>
  </p>
  </a>
  <div class="card-content faq-content {faqHidden ? 'is-hidden' : ''} darker-bg">

diff --git a/src/lib/components/Tips.svelte b/src/lib/components/Tips.svelte
@@ -11,9 +11,13 @@
  <!-- svelte-ignore a11y-no-static-element-interactions -->
  <a class="card-header darker-bg" on:click={toggleHidden}>
  <p class="card-header-title title is-3 is-centered">
- <i class="fa fa-angle-{tipsHidden ? 'down' : 'up'} icon is-large has-text-primary" />
+ <span class="icon is-large has-text-primary">
+ <i class="fa fa-angle-{tipsHidden ? 'down' : 'up'} " />
+ </span>
  Helpful tips to get better
- <i class="fa fa-angle-{tipsHidden ? 'down' : 'up'} icon is-large has-text-primary" />
+ <span class="icon is-large has-text-primary">
+ <i class="fa fa-angle-{tipsHidden ? 'down' : 'up'}" />
+ </span>
  </p>
  </a>
  <div class="card-content {tipsHidden ? 'is-hidden' : ''} darker-bg">