Don’t Build a Component Library without a Designer

Photo from Unsplash by Harpal Singh

Don’t Build a Component Library in These 3 Cases

<label>
<span>Field Label</span>
<input type="text" />
</label>
<style>
label span {
font-size: 16px;
}
</style>
<label>
<input type="text" placeholder="Field Label" />
</label>
<label>
<input type="text" />
<span>Field Label</span>
</label>
<style>
label {
position: relative;
}
label span {
position: absolute;
top: 20px;
left: 20px;
font-size: 16px;
transition: top 0.3s, font-size 0.3s;
}
label input.not-empty + span {
top: 4px;
font-size: 12px;
}
</style>

What You Should Do Instead

A screenshot of the Reaction Bar and Buttons on a Facebook post

Summary

Front-end developer. I ❤ CSS & JavaScript. My brain occasionally runs out of memory so I need to pen down my thoughts.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store