Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make icons available to use in _quarto.yml #6

Open
mine-cetinkaya-rundel opened this issue Jul 16, 2022 · 11 comments
Open

Make icons available to use in _quarto.yml #6

mine-cetinkaya-rundel opened this issue Jul 16, 2022 · 11 comments

Comments

@mine-cetinkaya-rundel
Copy link
Contributor

Once the extension is installed in the project it would be great to be able to use them in _quarto.yml as well, e.g., for tools.

@mcanouil
Copy link
Contributor

It's already working.
I added the lemon FA icon to the title within your _quarto.yml.
Did you mean something else?
Screenshot 2022-07-17 at 10 49 45

@mine-cetinkaya-rundel
Copy link
Contributor Author

It did not work as an icon in the navbar, for example instead of rss-fill.

@mcanouil
Copy link
Contributor

I believe this and #7 (after looking more in the code) to be more a Quarto issue than an issue within the extension itself.

@B0ydT
Copy link

B0ydT commented Jul 19, 2022

I looked at the rlille.fr site maintained by @mcanouil when building mine, looking for reasons his icons were showing up in the nav bar but mine weren't.

The only difference I could find was that he included this line in his styles.css file and I didn't. I'm not an expert so I don't quite know why it works, but it fixed my problem.

/* @import url(https://use.fontawesome.com/releases/v6.1.1/css/all.css); */

@mcanouil
Copy link
Contributor

mcanouil commented Jul 19, 2022

This was a test before Quarto extensions.
The complete file is actually "empty" (only comments in there) https://github.com/RLille/rlille.fr/blob/main/styles.css

To note, icons are included via shortcodes, thus in the text keys.

https://github.com/RLille/rlille.fr/blob/5354264ece5b32cfa9a1dab0ce0b58faad45c071/_quarto.yml#L35-L50

@B0ydT
Copy link

B0ydT commented Jul 19, 2022

Oops, you're totally right, and I'm totally misremembering when it started working!

What actually worked for me was swapping the icon tag used for the base icons with a text tag. Of the 3 examples below, the first and third work, while the second does not:

website:
  title: "Example"
  navbar:
    right:
      - icon: twitter
        href: https://twitter.com/bioboyd
      - icon: "{{< fa brands twitter >}}"
        href: https://twitter.com/bioboyd
      - text: "{{< fa brands twitter >}}"
        href: https://twitter.com/bioboyd

@mcanouil
Copy link
Contributor

mcanouil commented Jul 19, 2022

icon keys are parsed specifically to handle one icon library/version.
While text keys are processed as regular markdown/raw code, leading to 1/3 working but not 2, in your last example.

@mine-cetinkaya-rundel did you use the shortcode in text keys for the navbar or elsewhere, when it did not worked?

@naupaka
Copy link

naupaka commented Mar 14, 2023

Thanks @B0ydT for the tip -- works great as text!

@Paulj1989
Copy link

Hi folks, has anyone had any luck getting font awesome icons into the sidebar tools of a Quarto book? I've been fiddling with this for a while, and have followed the suggestions here, and don't seem to be able to get it working. I've used the following code:

sidebar:
    tools:
      - text: "{{< fa brands python >}}"

I've tried a few different things, including a few different icons (to make sure the issue isn't specific to certain subsets of icons) and testing the same approach in the navbar (works fine).

It's possible I'm missing something, but if anyone has any suggestions that would be much appreciated!

@mcanouil
Copy link
Contributor

I would suggest to follow quarto-dev/quarto-cli#6359 because the issue here can't be adresse within the extension.

@Paulj1989
Copy link

Alright, thanks for the heads up @mcanouil!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants