ipywidgets icon indicating copy to clipboard operation
ipywidgets copied to clipboard

Question: Change button text style

Open kCsenger opened this issue 6 years ago • 3 comments

Hi all!

Is there any way to change the style of the description of a widget? Specially at the moment I want to change the text color and size on a button. I want to create a clear red X buttod.

In the code below I have the button with an X but I want that bigger and red.

from ipywidgets import Button, Layout

b = Button(description = 'x',
           style = {'button_color': 'transparent'},
           layout = Layout(width = '30px'))

b

kCsenger avatar Jan 17 '19 08:01 kCsenger

Hi At least you can use CSS classes. Like:

%%html
<style>.myclass { color:red ; font-size:200%}

from ipywidgets import Button, Layout
b = Button(description = 'x',  
          style = {'button_color': 'transparent'}, 
          layout = Layout(width = '30px'))
b.add_class('myclass')
b

zerline avatar Feb 28 '19 10:02 zerline

This worked well for me, is there also a way to change the class one it is set ?

dgrosbard11 avatar Dec 09 '19 21:12 dgrosbard11

%%html
<style>.myclass { color:red ; font-size:200%}
from ipywidgets import Button, Layout
b = Button(description = 'x',  
          style = {'button_color': 'transparent'}, 
          layout = Layout(width = '30px'))
b.add_class('myclass')
b

Do you know how this would work in Open In Colab?

runfish5 avatar Sep 29 '22 07:09 runfish5