JSFiddle - React, Tailwind, and code Playground

by Amal Das

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.js"></script>

<div data-aga-g-r>
	<div data-aga-g="4-6-8-10-12">
		<span class="custom-check">
			<input id="checkbox1" type="checkbox"/>
			<label for="checkbox1">B</label>
		</span>
	</div>
</div>

<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label ">
<input data-bold="<%#Eval("Name")%>" id="bold<%#Eval("Name") %>" class="mdl-textfield__input mdl-button" name="<%#Eval("Name") %>" type="<%#Eval("Type") %>" formnode="true" Entity="Fields" Node="<%#Eval("Name")%>" value="<%#Eval("Value") %>"/>
<label for="bold">Bold</label>
</div>

CSS

.custom-check input[type='checkbox']:checked + label {
    font-weight: 800;
}





.custom-check input[type='checkbox'],.aga-in-check input[type='radio'] {height: 0;width: 0;opacity: 0;}