MNotes/components-wiki/figures/iconbutton/theming-filled-tonal.html

20 lines
726 B
HTML

<div class="figure-wrapper">
<figure
class="styled-example tonal"
title="Filled tonal icon button theming example."
aria-label="Image of a filled tonal icon button with a different theme applied">
<style>
.styled-example.tonal {
--md-filled-tonal-icon-button-container-width: 80px;
--md-filled-tonal-icon-button-container-height: 80px;
--md-filled-tonal-icon-button-container-shape: 0px;
--md-filled-tonal-icon-button-icon-size: 40px;
--md-sys-color-secondary-container: #006A6A;
padding-block: 8px;
}
</style>
<md-filled-tonal-icon-button>
<md-icon>check</md-icon>
</md-filled-tonal-icon-button>
</figure>
</div>