javascript - Materialize.css remove styling from input element -
i want make materialize.css cards editable on doubleclick. place input within card div, instead of p.
div.row each cards div.col.m4.s12 div.card.teal div.card-content.white-text if opencard //input(type='text' value='#{text}') textarea.materialize-textarea #{text} else p #{text}
problem input (and textarea) elements have extensive material design styling, including line underneath input. in other occasions looks neat, inside card unnecessary.
is there way how remove styling input element, usable in such double-click edit mode?
or maybe there other solutions, how edit double-click on card, not involve reuse of styled elements?
p.s. run within meteor, , there jade preprocessor. however, facts should not affect neither question, nor answer.
if double-click isn't essential other functionality, can optimize dropping both double-click , textarea leaving <p> added attribute contenteditable="true". use onblur event listener save edited text.
so in jade file have this:
div.row each cards div.col.m4.s12 div.card.teal div.card-content.white-text p(contenteditable="true") #{text}
and in template events this:
'blur .card-content p': function(event) {...}
p.s. while testing locally found out weird issue chrome: additional div on enter - sure take in account.
Comments
Post a Comment