Blitz - WPT: input-checkbox-base-appearance-rendering.html

wpt / css / css-forms / input-checkbox-base-appearance-rendering.html

/css/css-forms/input-checkbox-base-appearance-rendering.html

<!DOCTYPE html>
<link rel=author href="mailto:lwarlow@igalia.com">
<link rel=help href="https://drafts.csswg.org/css-forms-1">
<link rel=match href="input-checkbox-base-appearance-rendering-ref.html">

<input type="checkbox" checked style="appearance:base">
<input type="checkbox" id="indeterminate" style="appearance:base">
<input type="checkbox" style="appearance:base">

<script>
    indeterminate.indeterminate = true;
</script>

<style>
body {
  font-family: monospace;
  background-color: black;
  color: green;
}
</style>

/css/css-forms/input-checkbox-base-appearance-rendering-ref.html

<!DOCTYPE html>
<meta charset="utf-8">

<div><span>✓</span></div>
<div><span>─</span></div>
<div><span style="visibility: hidden">✓</span></div>

<style>
body {
  font-family: monospace;
  background-color: black;
  color: green;
}

div {
  box-sizing: border-box;
  background-color: transparent;

  border: 1px solid green;

  block-size: 1em;
  inline-size: 1em;
  font-size: 24px;

  display: inline-flex;
  align-items: center;
  justify-content: center;
}
</style>