Return to Answer

Shorthands can simplify the markup. The click handlers already use the shorthand @click instead of v-on:click. The bindings can be simplified as well. For example - instead of:

Yesterday there was an answer to your TODO app post which suggested using computed properties. With the current architecture using a computed property doesn't seem feasible, but a watcher method could be employed. Instead of setting up a method like doCompleted() that must be called manually, a watcher method can be used to adjust the values whenever that value changes.

Shorthands can simplify the markup. The click handlers already use the shorthand @click instead of v-on:click. The bindings can be simplified as well. For example - instead of:

Yesterday there was an answer to your TODO app post which suggested using computed properties. With the current architecture using a computed property doesn't seem feasible, but a watcher method could be employed. Instead of setting up a method like doCompleted() that must be called manually, a watcher method can be used to adjust the values whenever that value changes.

Watch it!

Watch out!

Those can be combined into a single rule:

Caveat: that might override values for the right and bottom margins, though inherit or initial could be used instead of 0 in some cases.

Presuming there is no margin inherited from other elements for the right and bottom, those can be combined into a single rule: