.user
   .avatar.bigger{ title: "#{@jid}" }

     %img{ src: "#{@avatar || 'assets/avatar.png'}", alt: I18n.t('chat.roster.avatar_alt') }

   %h1
     %input{ type: 'text', title: "#{@jid}", class: 'js-edit-name', value: "#{@name}"}
   %h2 #{@message || '<input type="text" class="js-edit-status empty" value="'+I18n.t('chat.roster.change_status_msg')+'">' }

   -#todo: nastylovat placeholder

   %h3

     .rolldown.js-change-state
       .js-state-clickable{ 'data-state': 'online' }
         %span.status.icon-record.online
         %a.active{ href: '#' }
           Online
           %br
       .hidden.js-state-clickable{ 'data-state': 'away' }
         %span.status.icon-record.away
         %a{ href: '#' }
           Away
           %br
       .hidden.js-state-clickable{ 'data-state': 'dnd' }
         %span.status.icon-record.dnd
         %a{ href: '#' }
           DND
     %span.icon-arrow-down.drop-down