3 ms·
Funny thing, if you make the most straightforward no dependency version in "Vanilla HTML+CSS+JS" you'll easily get below 250 characters, but it will break the l
by myfonj 6y ago
Funny thing, if you make the most straightforward no dependency version in "Vanilla HTML+CSS+JS" you'll easily get below 250 characters, but it will break the last rule
> Starting HTML body should be empty except the <script>
Because you'll have no <script> tag. To fulfill this, you'll have to unnecessarily wrap the whole thing in script, like:
<script>document.write(`<style>:checked+*{text-decoration:line-through}#t{display:none}</style><p id="t"><input type="checkbox"><input><div id="f"></div><p><button onclick="f.appendChild(t.cloneNode(true)).id=''">+</button><button onclick="f.innerHTML=''">×</button>`)</script>
(277 chars, golfable even further, but I'm not going to replace button elements with something inappropriate.)
- vukgr 6y agoAm I missing something or did everyone forget <s> is a thing in html?
- franciscop 6y agoNope, could be made with <strike> as well, but swapping element tags takes more characters than toggling a class. In the case of UmbrellaJS I made a .wrap() method, but since there is no .unwrap() again it takes more than toggling classes.
- vukgr 6y agoAh, fair. The challenge itself didn't mention toggling (just crossing tasks off), so you could probably get away with it; But that's just the golfer in me talking I guess.
- rukshn 6y agoI also thought of using the <s> tag, but I didn’t use it because it is considered to be an outdated tag But yes that is totally possible
- franciscop 6y agoAh wow the :checked + * {text-decoration:line-through} is pretty smart! No need for JS in that case. Your reply inspired me for a new version: https://twitter.com/FPresencia/status/1341037189409296384 https://twitter.com/FPresencia/status/1341037189409296384 https://jsfiddle.net/franciscop/6p9xwv7e/ https://jsfiddle.net/franciscop/6p9xwv7e/ <script>b=u("body").append(u("<input>").on("keyup",e=>{t=e.currentTarget;if(13==e.keyCode){b.append(`<p><label><input type="checkbox"> <span>`+t.value);t.value=''}})).append(u('<button>Clear').on('click',e=>u('p').remove()))</script><style>:checked+*{text-decoration:line-through}