More buttons

gistfile1.txt

<!-- wp:group {"align":"wide","backgroundColor":"white"} -->
<div class="wp-block-group alignwide has-white-background-color has-background"><div class="wp-block-group__inner-container"><!-- wp:paragraph -->
<p>This group block has a background color and a paragraph.</p>
<!-- /wp:paragraph -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button -->
<div class="wp-block-button"><a class="wp-block-button__link" href="#alink">Default</a></div>
<!-- /wp:button -->

<!-- wp:button {"className":"is-style-fill"} -->
<div class="wp-block-button is-style-fill"><a class="wp-block-button__link" href="#alink">filled</a></div>
<!-- /wp:button -->

<!-- wp:button {"className":"is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link" href="#alink">outline</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"backgroundColor":"red"} -->
<div class="wp-block-button"><a class="wp-block-button__link has-red-background-color has-background" href="#alink">Default, custom background color</a></div>
<!-- /wp:button -->

<!-- wp:button {"backgroundColor":"red","className":"is-style-fill"} -->
<div class="wp-block-button is-style-fill"><a class="wp-block-button__link has-red-background-color has-background" href="#alink">filled, custom background color</a></div>
<!-- /wp:button -->

<!-- wp:button {"backgroundColor":"red","className":"is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-red-background-color has-background" href="#alink">outline, custom background color -why is the background even an option for the outlined button?</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"backgroundColor":"red","textColor":"white"} -->
<div class="wp-block-button"><a class="wp-block-button__link has-white-color has-red-background-color has-text-color has-background" href="#alink">Default, custom colors</a></div>
<!-- /wp:button -->

<!-- wp:button {"backgroundColor":"red","textColor":"white","className":"is-style-fill"} -->
<div class="wp-block-button is-style-fill"><a class="wp-block-button__link has-white-color has-red-background-color has-text-color has-background" href="#alink">filled, custom colors</a></div>
<!-- /wp:button -->

<!-- wp:button {"backgroundColor":"red","textColor":"white","className":"is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-white-color has-red-background-color has-text-color has-background" href="#alink">outline, custom colors</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"style":{"color":{"text":"#f50000"}}} -->
<div class="wp-block-button"><a class="wp-block-button__link has-text-color" href="#alink" style="color:#f50000">Default, custom text color</a></div>
<!-- /wp:button -->

<!-- wp:button {"style":{"color":{"text":"#1f27ff"}},"className":"is-style-fill"} -->
<div class="wp-block-button is-style-fill"><a class="wp-block-button__link has-text-color" href="#alink" style="color:#1f27ff">filled, custom text color</a></div>
<!-- /wp:button -->

<!-- wp:button {"style":{"color":{"text":"#3ef9ff"}},"className":"is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-text-color" href="#alink" style="color:#3ef9ff">outline, custom text color</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons --></div></div>
<!-- /wp:group -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button -->
<div class="wp-block-button"><a class="wp-block-button__link" href="#alink">Default</a></div>
<!-- /wp:button -->

<!-- wp:button {"className":"is-style-fill"} -->
<div class="wp-block-button is-style-fill"><a class="wp-block-button__link" href="#alink">filled</a></div>
<!-- /wp:button -->

<!-- wp:button {"className":"is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link" href="#alink">outline</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"style":{"color":{"text":"#f50000"}}} -->
<div class="wp-block-button"><a class="wp-block-button__link has-text-color" href="#alink" style="color:#f50000">Default, custom text color</a></div>
<!-- /wp:button -->

<!-- wp:button {"style":{"color":{"text":"#1f27ff"}},"className":"is-style-fill"} -->
<div class="wp-block-button is-style-fill"><a class="wp-block-button__link has-text-color" href="#alink" style="color:#1f27ff">filled, custom text color</a></div>
<!-- /wp:button -->

<!-- wp:button {"style":{"color":{"text":"#3ef9ff"}},"className":"is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-text-color" href="#alink" style="color:#3ef9ff">outline, custom text color</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"backgroundColor":"red"} -->
<div class="wp-block-button"><a class="wp-block-button__link has-red-background-color has-background" href="#alink">Default, custom background color</a></div>
<!-- /wp:button -->

<!-- wp:button {"backgroundColor":"red","className":"is-style-fill"} -->
<div class="wp-block-button is-style-fill"><a class="wp-block-button__link has-red-background-color has-background" href="#alink">filled, custom background color</a></div>
<!-- /wp:button -->

<!-- wp:button {"backgroundColor":"red","className":"is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-red-background-color has-background" href="#alink">outline, custom background color -why is the background even an option for the outlined button?</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"backgroundColor":"red","textColor":"white"} -->
<div class="wp-block-button"><a class="wp-block-button__link has-white-color has-red-background-color has-text-color has-background" href="#alink">Default, custom colors</a></div>
<!-- /wp:button -->

<!-- wp:button {"backgroundColor":"red","textColor":"white","className":"is-style-fill"} -->
<div class="wp-block-button is-style-fill"><a class="wp-block-button__link has-white-color has-red-background-color has-text-color has-background" href="#alink">filled, custom colors</a></div>
<!-- /wp:button -->

<!-- wp:button {"backgroundColor":"red","textColor":"white","className":"is-style-outline"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link has-white-color has-red-background-color has-text-color has-background" href="#alink">outline, custom colors</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->

<!-- wp:file {"id":763,"href":"http://localhost:8888/wp-content/uploads/2008/06/dsc02085-15.jpg"} -->
<div class="wp-block-file"><a href="http://localhost:8888/wp-content/uploads/2008/06/dsc02085-15.jpg">Orange Iris</a><a href="http://localhost:8888/wp-content/uploads/2008/06/dsc02085-15.jpg" class="wp-block-file__button" download>Download</a></div>
<!-- /wp:file -->

<!-- wp:search {"label":"Search","buttonText":"Search"} /-->