Single Line Publisher

Basic

<div class="publisher">  <input class="publisher-input" type="text" placeholder="Write something">  <button class="publisher-btn"><i class="fa fa-paper-plane"></i></button></div>

Actions

<div class="publisher">  <input class="publisher-input" type="text" placeholder="Write something">  <span class="publisher-btn file-group">    <i class="fa fa-paperclip file-browser"></i>    <input type="file">  </span>  <a class="publisher-btn" href="#"><i class="fa fa-smile-o"></i></a>  <a class="publisher-btn" href="#"><i class="fa fa-paper-plane"></i></a></div>

Avatar

<div class="publisher">  <img class="avatar" src="../assets/img/avatar/1.jpg" alt="...">  <input class="publisher-input" type="text" placeholder="Write something">  <span class="publisher-btn file-group">    <i class="fa fa-paperclip file-browser"></i>    <input type="file">  </span>  <a class="publisher-btn" href="#"><i class="fa fa-smile-o"></i></a>  <a class="publisher-btn" href="#"><i class="fa fa-paper-plane"></i></a></div>

Expandable input

<div class="publisher">  <img class="avatar align-self-start" src="../assets/img/avatar/1.jpg" alt="...">  <textarea class="publisher-input auto-expand" rows="1" placeholder="Write something"></textarea>  <div class="align-self-end gap-items">    <span class="publisher-btn file-group">      <i class="fa fa-paperclip file-browser"></i>      <input type="file">    </span>    <a class="publisher-btn" href="#"><i class="fa fa-smile-o"></i></a>    <a class="publisher-btn" href="#"><i class="fa fa-paper-plane"></i></a>  </div></div>

Transparent

<div class="publisher bg-transparent">  <img class="avatar" src="../assets/img/avatar/1.jpg" alt="...">  <input class="publisher-input" type="text" placeholder="Write something">  <span class="publisher-btn file-group">    <i class="fa fa-paperclip file-browser"></i>    <input type="file">  </span>  <a class="publisher-btn" href="#"><i class="fa fa-smile-o"></i></a>  <a class="publisher-btn" href="#"><i class="fa fa-paper-plane"></i></a></div>

Bordered

<div class="publisher bg-transparent b-1">  <img class="avatar" src="../assets/img/avatar/1.jpg" alt="...">  <input class="publisher-input" type="text" placeholder="Write something">  <span class="publisher-btn file-group">    <i class="fa fa-paperclip file-browser"></i>    <input type="file">  </span>  <a class="publisher-btn" href="#"><i class="fa fa-smile-o"></i></a>  <a class="publisher-btn" href="#"><i class="fa fa-paper-plane"></i></a></div>