Skip to content

Commit 03da090

Browse files
ZerlineOdile
Zerline
authored and
Odile
committed
Border, border-top, border-right ..
1 parent 7c60bf1 commit 03da090

File tree

5 files changed

+43
-129
lines changed

5 files changed

+43
-129
lines changed

‎ipywidgets/widgets/widget_layout.py

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -37,13 +37,12 @@ class Layout(Widget):
3737
'baseline', 'stretch'] + CSS_PROPERTIES, allow_none=True, help="The align-items CSS attribute.").tag(sync=True)
3838
align_self = CaselessStrEnum(['auto', 'flex-start', 'flex-end',
3939
'center', 'baseline', 'stretch'] + CSS_PROPERTIES, allow_none=True, help="The align-self CSS attribute.").tag(sync=True)
40+
border = Unicode(None, allow_none=True, help="The border CSS attribute.").tag(sync=True)
41+
border_top = Unicode(None, allow_none=True, help="The border top CSS attribute.").tag(sync=True)
42+
border_right = Unicode(None, allow_none=True, help="The border right CSS attribute.").tag(sync=True)
43+
border_bottom = Unicode(None, allow_none=True, help="The border bottom CSS attribute.").tag(sync=True)
44+
border_left = Unicode(None, allow_none=True, help="The border left CSS attribute.").tag(sync=True)
4045
bottom = Unicode(None, allow_none=True, help="The bottom CSS attribute.").tag(sync=True)
41-
border_collapse = Unicode(None, allow_none=True, help="The border collapse CSS attribute.").tag(sync=True)
42-
border_color = Unicode(None, allow_none=True, help="The border color CSS attribute.").tag(sync=True)
43-
border_image = Unicode(None, allow_none=True, help="The border image CSS attribute.").tag(sync=True)
44-
border_radius = Unicode(None, allow_none=True, help="The border radius CSS attribute.").tag(sync=True)
45-
border_style = Unicode(None, allow_none=True, help="The border style CSS attribute.").tag(sync=True)
46-
border_width = Unicode(None, allow_none=True, help="The border width CSS attribute.").tag(sync=True)
4746
display = Unicode(None, allow_none=True, help="The display CSS attribute.").tag(sync=True)
4847
flex = Unicode(None, allow_none=True, help="The flex CSS attribute.").tag(sync=True)
4948
flex_flow = Unicode(None, allow_none=True, help="The flex-flow CSS attribute.").tag(sync=True)

‎packages/base/src/widget_layout.ts

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,11 @@ const css_properties: Dict<string | null> = {
1212
align_content: null,
1313
align_items: null,
1414
align_self: null,
15-
border_collapse: null,
16-
border_color: null,
17-
border_image: null,
18-
border_radius: null,
19-
border_style: null,
20-
border_width: null,
15+
border: null,
16+
border_top: null,
17+
border_right: null,
18+
border_bottom: null,
19+
border_left: null,
2120
bottom: null,
2221
display: null,
2322
flex: null,

‎packages/schema/jupyterwidgetmodels.latest.json

Lines changed: 10 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -94,43 +94,36 @@
9494
{
9595
"allow_none": true,
9696
"default": null,
97-
"help": "The border collapse CSS attribute.",
98-
"name": "border_collapse",
97+
"help": "The border CSS attribute.",
98+
"name": "border",
9999
"type": "string"
100100
},
101101
{
102102
"allow_none": true,
103103
"default": null,
104-
"help": "The border color CSS attribute.",
105-
"name": "border_color",
104+
"help": "The border bottom CSS attribute.",
105+
"name": "border_bottom",
106106
"type": "string"
107107
},
108108
{
109109
"allow_none": true,
110110
"default": null,
111-
"help": "The border image CSS attribute.",
112-
"name": "border_image",
111+
"help": "The border left CSS attribute.",
112+
"name": "border_left",
113113
"type": "string"
114114
},
115115
{
116116
"allow_none": true,
117117
"default": null,
118-
"help": "The border radius CSS attribute.",
119-
"name": "border_radius",
118+
"help": "The border right CSS attribute.",
119+
"name": "border_right",
120120
"type": "string"
121121
},
122122
{
123123
"allow_none": true,
124124
"default": null,
125-
"help": "The border style CSS attribute.",
126-
"name": "border_style",
127-
"type": "string"
128-
},
129-
{
130-
"allow_none": true,
131-
"default": null,
132-
"help": "The border width CSS attribute.",
133-
"name": "border_width",
125+
"help": "The border top CSS attribute.",
126+
"name": "border_top",
134127
"type": "string"
135128
},
136129
{

‎packages/schema/jupyterwidgetmodels.latest.md

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -29,12 +29,11 @@ Attribute | Type | Default | Help
2929
`align_content` | `null` or string (one of `'flex-start'`, `'flex-end'`, `'center'`, `'space-between'`, `'space-around'`, `'space-evenly'`, `'stretch'`, `'inherit'`, `'initial'`, `'unset'`) | `null` | The align-content CSS attribute.
3030
`align_items` | `null` or string (one of `'flex-start'`, `'flex-end'`, `'center'`, `'baseline'`, `'stretch'`, `'inherit'`, `'initial'`, `'unset'`) | `null` | The align-items CSS attribute.
3131
`align_self` | `null` or string (one of `'auto'`, `'flex-start'`, `'flex-end'`, `'center'`, `'baseline'`, `'stretch'`, `'inherit'`, `'initial'`, `'unset'`) | `null` | The align-self CSS attribute.
32-
`border_collapse` | `null` or string | `null` | The border collapse CSS attribute.
33-
`border_color` | `null` or string | `null` | The border color CSS attribute.
34-
`border_image` | `null` or string | `null` | The border image CSS attribute.
35-
`border_radius` | `null` or string | `null` | The border radius CSS attribute.
36-
`border_style` | `null` or string | `null` | The border style CSS attribute.
37-
`border_width` | `null` or string | `null` | The border width CSS attribute.
32+
`border` | `null` or string | `null` | The border CSS attribute.
33+
`border_bottom` | `null` or string | `null` | The border bottom CSS attribute.
34+
`border_left` | `null` or string | `null` | The border left CSS attribute.
35+
`border_right` | `null` or string | `null` | The border right CSS attribute.
36+
`border_top` | `null` or string | `null` | The border top CSS attribute.
3837
`bottom` | `null` or string | `null` | The bottom CSS attribute.
3938
`display` | `null` or string | `null` | The display CSS attribute.
4039
`flex` | `null` or string | `null` | The flex CSS attribute.

‎tests/test_borders.ipynb

Lines changed: 18 additions & 94 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,9 @@
1515
"metadata": {},
1616
"outputs": [],
1717
"source": [
18-
"t = Text(\"text input\")\n",
19-
"b = Button(description=\"button\")\n",
20-
"HBox((t,b))"
18+
"t1 = Text(\"text input\")\n",
19+
"b1 = Button(description=\"button\")\n",
20+
"HBox((t1,b1))"
2121
]
2222
},
2323
{
@@ -26,7 +26,10 @@
2626
"metadata": {},
2727
"outputs": [],
2828
"source": [
29-
"#t.layout.__dict__"
29+
"b1.layout.border = \"2px solid yellow\"\n",
30+
"t1.layout.border = \"1px dashed red\"\n",
31+
"t1.layout.border_left = \"5px dotted blue\"\n",
32+
"b1.layout.border_right = \"2px dotted blue\""
3033
]
3134
},
3235
{
@@ -35,7 +38,9 @@
3538
"metadata": {},
3639
"outputs": [],
3740
"source": [
38-
"t.layout.border_style = \"solid\""
41+
"t2 = Text(\"text input\")\n",
42+
"b2 = ToggleButton(description=\"toggle button\")\n",
43+
"HBox((t2,b2))"
3944
]
4045
},
4146
{
@@ -44,9 +49,10 @@
4449
"metadata": {},
4550
"outputs": [],
4651
"source": [
47-
"t.layout.border_color = \"blue green red yellow\"\n",
48-
"t.layout.border_style = \"solid dashed spotted none\"\n",
49-
"t.layout.border_width = \"1 2 3 4\""
52+
"t2.layout.border_left = \"5px dotted blue\"\n",
53+
"b2.layout.border_right = \"2px dotted blue\"\n",
54+
"b2.layout.border = \"2px solid yellow\"\n",
55+
"t2.layout.border = \"1px dashed red\""
5056
]
5157
},
5258
{
@@ -55,92 +61,10 @@
5561
"metadata": {},
5662
"outputs": [],
5763
"source": [
58-
"t.layout.border_style = \"dashed dashed dashed dashed\""
59-
]
60-
},
61-
{
62-
"cell_type": "code",
63-
"execution_count": null,
64-
"metadata": {},
65-
"outputs": [],
66-
"source": [
67-
"b.layout.border_color = \"green red yellow blue\"\n",
68-
"b.layout.border_style = \"solid dashed spotted none\"\n",
69-
"b.layout.border_width = \"1 2 3 4\""
70-
]
71-
},
72-
{
73-
"cell_type": "code",
74-
"execution_count": null,
75-
"metadata": {},
76-
"outputs": [],
77-
"source": [
78-
"t.style.border = \"1px solid red\"\n",
79-
"b.style.border = \"1px solid red\""
80-
]
81-
},
82-
{
83-
"cell_type": "code",
84-
"execution_count": null,
85-
"metadata": {},
86-
"outputs": [],
87-
"source": [
88-
"t.style.background_color = \"lightpurple\"\n",
89-
"b.style.background_color = \"lightpurple\""
90-
]
91-
},
92-
{
93-
"cell_type": "code",
94-
"execution_count": null,
95-
"metadata": {},
96-
"outputs": [],
97-
"source": [
98-
"#t.style.__dict__"
99-
]
100-
},
101-
{
102-
"cell_type": "code",
103-
"execution_count": null,
104-
"metadata": {},
105-
"outputs": [],
106-
"source": [
107-
"t1 = Text(\"1\")\n",
108-
"t2 = Text(\"2\")\n",
109-
"t3 = Text(\"3\")\n",
110-
"t4 = Text(\"4\")\n",
111-
"t5 = Text(\"5\")\n",
112-
"t6 = Text(\"6\")\n",
113-
"\n",
114-
"B = VBox((HBox((t1,t2,t3)), HBox((t4,t5,t6))))\n",
115-
"# HBox(children=(Text(\"1\"), Text(\"2\"), Text(\"3\"))),\n",
116-
"# HBox(children=(Text(\"4\"), Text(\"5\"), Text(\"6\")))))\n",
117-
"B.layout.border_color = \"orange\"\n",
118-
"B"
119-
]
120-
},
121-
{
122-
"cell_type": "code",
123-
"execution_count": null,
124-
"metadata": {},
125-
"outputs": [],
126-
"source": [
127-
"t1.layout.border_color = \"red\"\n",
128-
"t2.layout.border_color = \"red\"\n",
129-
"t3.layout.border_color = \"red\"\n",
130-
"t4.layout.border_color = \"red\"\n",
131-
"t5.layout.border_color = \"red\"\n",
132-
"t6.layout.border_color = \"red\"\n",
133-
"\n",
134-
"t1.layout.border_width = \"2\""
135-
]
136-
},
137-
{
138-
"cell_type": "code",
139-
"execution_count": null,
140-
"metadata": {},
141-
"outputs": [],
142-
"source": [
143-
"B.layout.border_collapse = \"collapse\""
64+
"t1.style.border_top = \"5px solid green\"\n",
65+
"b1.style.border = \"1px solid purple\"\n",
66+
"t2.style.border_top = \"5px solid green\"\n",
67+
"b2.style.border = \"1px solid purple\""
14468
]
14569
}
14670
],

0 commit comments

Comments
 (0)