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.

Sign up for GitHub

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

1719 support more styles to toggle buttons #1834

Merged
merged 4 commits into from
Nov 22, 2017
Merged

1719 support more styles to toggle buttons #1834

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
7f2af46
Introduce button_color and font_weight to ToggleButtons style
Nov 21, 2017
bc0b0b6
Update the Jupyter widgets doc for ToggleButtons style
Nov 21, 2017
b25739b
Fixup for ToggleButtons style docstring
Nov 22, 2017
90e8c93
Tweak documentation wording
jasongrout Nov 22, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 15 additions & 1 deletion ipywidgets/widgets/widget_selection.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
from .valuewidget import ValueWidget
from .widget_core import CoreWidget
from .widget_style import Style
from .trait_types import InstanceDict
from .trait_types import InstanceDict, Color
from .widget import register, widget_serialization
from .docutils import doc_subst
from traitlets import (Unicode, Bool, Int, Any, Dict, TraitError, CaselessStrEnum,
Expand Down Expand Up @@ -375,6 +375,7 @@ def _repr_keys(self):
for key in sorted(chain(keys, ('options',))):
yield key


@register
class ToggleButtonsStyle(DescriptionStyle, CoreWidget):
"""Button style widget.
Expand All @@ -384,9 +385,22 @@ class ToggleButtonsStyle(DescriptionStyle, CoreWidget):
button_width: str
The width of each button. This should be a valid CSS
width, e.g. '10px' or '5em'.

button_color: str or None
The color of each button. This should be a valid CSS color unit,
for example 'yellow' or '#FFFF00'.

font_weight: str
The text font weight of each button, This should be a valid CSS font
weight unit, for example 'bold' or '600'
"""
_model_name = Unicode('ToggleButtonsStyleModel').tag(sync=True)
button_width = Unicode(help="The width of each button.").tag(sync=True)
button_color = Color(None, allow_none=True,
help="Color of each button.").tag(sync=True)
font_weight = Unicode(
help="Text font weight of each button."
).tag(sync=True)


@register
Expand Down
10 changes: 10 additions & 0 deletions packages/controls/src/widget_selection.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -380,6 +380,16 @@ class ToggleButtonsStyleModel extends DescriptionStyleModel {
selector: '.widget-toggle-button',
attribute: 'width',
default: null
},
button_color: {
selector: '.widget-toggle-button',
attribute: 'background-color',
default: null
},
font_weight: {
selector: '.widget-toggle-button',
attribute: 'font-weight',
default: ''
}
};
}
Expand Down
2 changes: 2 additions & 0 deletions packages/schema/jupyterwidgetmodels.v7.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -837,6 +837,8 @@ Attribute | Type | Default | Help
`_view_module_version` | string | `'1.0.0'` |
`_view_name` | string | `'StyleView'` |
`button_width` | string | `''` | The width of each button.
`button_color` | `null` or string | `null` | The color of each button
`font_weight` | string | `''` | The button text font weight of each button.

### VBoxModel (@jupyter-widgets/controls, 1.0.0); VBoxView (@jupyter-widgets/controls, 1.0.0)

Expand Down