config-panel.component.html

<div *ngIf="config$ | async as setting" class="config-panel">
  <h2 class="headline mb-4">
    <mat-icon class="mr-3" svgIcon="mat:settings"></mat-icon>
    <span>Configuración</span>
  </h2>

  <div class="section">
    <h5 class="subheading">ESTILOS</h5>

    <div class="rounded-full mt-2 flex items-center cursor-pointer 
    relative bg-contrast-black text-contrast-white select-none" matRipple>
    <div class="m-2 h-6 w-6 rounded-full">
      <mat-icon svgIcon="mat:check"></mat-icon>
      <mat-icon svgIcon="mat:close"></mat-icon>
    </div>
    <p class="ml-1 font-medium text-sm">Calificación Comisión</p>

    <div class="rounded-full mt-2 flex items-center cursor-pointer 
    relative bg-contrast-black text-contrast-white select-none" matRipple>
    <div class="m-2 h-6 w-6 rounded-full">
      <mat-icon svgIcon="mat:check"></mat-icon>
      <mat-icon svgIcon="mat:close"></mat-icon>
    </div>
    <p class="ml-1 font-medium text-sm">Configuraciones</p>


    
  </div>
</div>