Retrospring/app/views/modal/_group.haml

#modal-group-memberships.modal.fade{"aria-hidden" => "true", "aria-labelledby" => "modal-group-memberships-label", :role => "dialog", :tabindex => "-1"}
  .modal-dialog
    .modal-content
      .modal-header
        %h5#modal-group-memberships-label.modal-title= t 'views.modal.group.title'
        %button.close{"data-dismiss" => "modal", :type => "button"}
          %span{"aria-hidden" => "true"} ×
          %span.sr-only= t 'views.actions.close'
      %div{role: "tabpanel"}
        %ul.nav.nav-tabs.mt-1{role: "tablist"}
          %li.nav-item{role: "presentation"}
            %a.nav-link.active{href: "#grouplist", aria: {controls: "grouplist"}, data: {toggle: "tab"}, role: "tab"}
              = t 'views.modal.group.tabs.main'
          %li.nav-item{role: "presentation"}
            %a.nav-link{href: "#create", aria: {controls: "create"}, data: {toggle: "tab"}, role: "tab"}
              = t 'views.modal.group.tabs.create'

        .tab-content
          .tab-pane.active{role:"tabpanel", id: "grouplist"}
            %ul.list-group
              - current_user.groups.each do |group|
                = render 'modal/group/item', group: group, user: @user
          .tab-pane{role:"tabpanel", id: "create"}
            .modal-body
              %input#new-group-name.form-control{type: :text, placeholder: t('views.modal.group.name')}
              %button#create-group.btn.btn-primary{type: :button, data: { user: @user.screen_name }}= t('views.modal.group.create')
      .modal-footer
        %button.btn.btn-primary{name: 'gm-save', type: :button, data: { dismiss: :modal }}= t 'views.actions.done'