Status light

<div class="container">
<!-- Status light -->
<div class="container__status"></div>
<!-- Content -->
<div class="container__content">
...
</div>
</div>
.container {
/* Center the content */
align-items: center;
display: flex;
}
.container__status {
/* Background color */
background-color: rgb(66, 153, 225);
/* Rounded border */
border-radius: 9999px;
/* Size */
height: 8px;
width: 8px;
/* Spacing */
margin-right: 8px;
}
.container__content {
/* Take available width */
flex: 1;
}

Use cases

In review
Draft
Published