question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Some font-awesome icons not working for ToggleButtons

See original GitHub issue

I am trying to add some font-awesome icons (e.g., chart-line, chart-scatter, chart-bar) to ToggleButtons, but these charting icons could not show up on the ToggleButtons. Any help will be appreciated.

import ipywidgets as widgets
t = widgets.ToggleButtons(
    options=['', '', '', ''],
    disabled=False,
    button_style='primary', 
    tooltips=['Pointer', 'Open a file', 'bar chart', 'line chart'],
    icons=['mouse-pointer', 'folder-open', 'chart-bar', 'chart-line'],
    layout=widgets.Layout(width='auto', height='auto')
)
t.style.button_width='40px'
t

Here is what it looks like

Issue Analytics

  • State:open
  • Created 3 years ago
  • Comments:5 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
martinRenoucommented, Apr 8, 2020

As far as I know, the current front-end version (Jupyter Notebook but maybe not JupyterLab) are using font awesome 4.7 https://fontawesome.com/v4.7.0. So only those icons are available.

0reactions
giswqscommented, Apr 8, 2020

BTW, would it be possible to arrange the ToggleButtons as two columns vertically? I can only make it either one row horizontally or one column vertically, but I am not sure how to arrange it into more columns. It would be too long vertically with more than 10 icons.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Toggle Class With Font Awesome Not Working - Stack Overflow
I have multiple buttons, when a like button is clicked I would like the font awesome icon to switch as well, however, the...
Read more >
Is it possible to use own icons for ToggleButton
I have some custom icons that I would like to use for the on and off icons instead of the fa-* collection. Is...
Read more >
Toggle On Icon - Font Awesome
We've cooked up some examples of how you could use the “toggle-on” icon in your projects, whether they're apps, interfaces, or print designs....
Read more >
Create Toggle Buttons with jQuery and Font Awesome Icons
A jQuery plugin that helps you create interactive, touch-enabled, customizable toggle/push/signal buttons using Font Awesome icons.
Read more >
button with font awesome icon - jQWidgets
I'd like to create button wit 3 fontawesome icons and no text. How can I do that? Thanks. December 28, 2020 at 3:29...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found