JezK

Edit File: _checkbox.scss

@use 'theme'; @mixin canonical { appearance: none; display: inline-grid; place-content: center; vertical-align: middle; inline-size: 20px; block-size: 20px; padding: 0; margin: 0; box-sizing: border-box; background: #fff; border: 1.5px solid theme.$control-border; border-radius: 5px; box-shadow: 0 2px 2px rgb(0 0 0 / 5%); cursor: pointer; &:focus { outline: 2px solid var(--wp-admin-theme-color); } &::before { content: none; } &:checked { background: theme.$accent; border-color: theme.$accent; &::before { content: ''; inline-size: 20px; block-size: 20px; margin: 0; background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M14.83 4.89l1.34.94-5.81 8.38H9.02L5.78 9.67l1.34-1.25 2.57 2.4z' fill='%23fff'/%3E%3C/svg%3E") center/20px no-repeat; } } }