Breaking Switch

Is used on the my news page.

This is an example of a Breaking Alert Switch.

Code: 🔼

<div class="BreakingSwitch_breakingSwitch__Mgs3H">
  <h3>Breaking nieuws alert</h3>
  <div class="BreakingSwitch_content__ZbGtQ"><span class="BreakingSwitch_description__keFyR">Ontvang een e-mail alert bij belangrijk FD Nieuws</span><label class="BreakingSwitch_switch__JgTaX" data-addurl="/add-breaking-alert" data-deleteurl="/delete-breaking-alert"><input type="checkbox" class="BreakingSwitch_switchInput__BUYkZ" aria-label="Ontvang een e-mail alert bij belangrijk FD Nieuws" /><span class="BreakingSwitch_switchLabel__KVcMO"><span class="BreakingSwitch_iconCheck__dgxG9"><svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="-240 -240 512 512"><path d="M-54.371 243.208l313.454-433.155-37.483-20.687L-66.106 102.03l-138.441-54.537-22.77 28.15 172.946 167.565z"></path></svg></span><span class="BreakingSwitch_iconTimes__vLAI6"><svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="-238.5 -240 512 512"><path d="M-164.47-126.755l39.34-39.34L17.53-23.455l142.6-142.64 39.34 39.34L17.51 55.285l-181.98-182.04z"></path><path d="M199.47 158.755l-39.34 39.34L17.47 55.455l-142.6 142.64-39.34-39.34L17.49-23.285l181.98 182.04z"></path></svg></span></span><span class="BreakingSwitch_switchHandle__EdrmD"></span></label></div>
</div>

📋React

<BreakingSwitch
  onChange={function k(){}}
/>