Open developit opened 9 years ago
@developit Awesome! However, I don't think this feature should be specific to toolbars. Icon inputs should be a feature available anywhere in the application.
So the base markup structure should probably be something like:
<div class="form-icon-text-group form-group">
<span class="icon icon-search"></span>
<input type="search" class="form-control" placeholder="Search...">
</div>
Then the SASS could be something like:
.form-icon-text-group {
position: relative;
.icon {
position: absolute;
top: 4px;
left: 10px;
z-index: 1;
}
.form-control {
padding-left: 25px;
}
}
Lastly, to get things working in the toolbar, all you have to do is remove the .form-group
class.
Agreed regarding a generic solution. That markup works for me.
any updates on this?
Add
toolbar-input
. I couldnt decide on markup for a generic input with inset icon. This at least partly addresses #14.JSFiddle: http://jsfiddle.net/developit/aqu10kd9/
*
Preview:
Markup:
*
the zoom border effect is not included in this PR