Skip to content

Commit 69f2624

Browse files
committed
Document the stripped styling of <button> elements
Closes #315
1 parent 503140f commit 69f2624

File tree

1 file changed

+23
-0
lines changed

1 file changed

+23
-0
lines changed

docs/migration/wsc55/templates.md

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,3 +30,26 @@ In the process, the integration of comments via templates has been significantly
3030
An example for the migration of existing template integrations can be found [here](https://github.com/WoltLab/WCF/commit/b1d5f7cc6b81ae7fd938603bb20a3a454a531a96#diff-3419ed2f17fa84a70caf0d99511d5ac2a7704c62f24cc7042984d7a9932525ce).
3131

3232
See [WoltLab/WCF#5210](https://github.com/WoltLab/WCF/pull/5210) for more details.
33+
34+
## The `<button>` Element
35+
36+
The styling of the `<button>` has been completely removed in WoltLab Suite 6.0 and the element has no longer any kind of styling.
37+
This change allows the element to be used in a lot of places that previously had to use an `a[href="#"][role="button"]` to replicate the same behavior.
38+
39+
If you have previously used the button element as an actual button, you should add the CSS class `.button` to it.
40+
41+
It is recommended to identify an uses of the anchor element to replicate a native button and to use the proper `<button>` element from now on.
42+
Buttons will implicitly submit a form, therefore you should set the `type` attribute to explicitly define its behavior.
43+
44+
```html
45+
<form method="post">
46+
<!-- These two buttons will submit the form. -->
47+
<button>Button 1</button>
48+
<button type="submit">Button 2</button>
49+
50+
<!-- Clicking this button does nothing on its own. -->
51+
<button type="button">Button 3</button>
52+
</form>
53+
```
54+
55+
See [WoltLab/WCF#4834](https://github.com/WoltLab/WCF/issues/4834) for more details.

0 commit comments

Comments
 (0)