Sometimes it's useful for authors to put a button on a page to draw more attention to it. For example, a "Get started" button on a documentation landing page, or a "Donate" button to direct users to a donation page.
Currently the closest thing you can get is manually defining an HTML element like:
<a href="/start">
<div style="border-radius: 1em; background-color: #e07330; width: 8em; height: 3em; margin: .5em auto; color: white;">
Get started
</div>
</a>
However this has a few shortcomings:
It is verbose and depends on enough CSS knowledge to hand-write the rules.
style works with <div> but not with <a> so you can't style the text inside the button.
It would be much easier if we either:
Supported native button syntax, like:
:::{button} Button text
:style: some ways to style the button, center it, etc
:::
Fixed #1617 so that you could style the <div> as you wished with classes from tailwind (and make this work for <a> as well)
Sometimes it's useful for authors to put a button on a page to draw more attention to it. For example, a "Get started" button on a documentation landing page, or a "Donate" button to direct users to a donation page.
Currently the closest thing you can get is manually defining an HTML element like:
However this has a few shortcomings:
<div>but not with<a>so you can't style the text inside the button.It would be much easier if we either:
Supported native button syntax, like:
<div>as you wished with classes from tailwind (and make this work for<a>as well)