hunk.code_window: export default class EditChannelHeaderModal extends React.Component {
       constructor(props) {
           super(props);
           this.handleEdit = this.handleEdit.bind(this);
           this.onShow = this.onShow.bind(this);
           this.onHide = this.onHide.bind(this);
  
hunk.labels: keep keep keep keep keep replace keep keep keep
hunk.after_edit:         this.handleChange = this.handleChange.bind(this);
           this.handleSubmit = this.handleSubmit.bind(this);
  
hunk.file_path: web/react/components/edit_channel_header_modal.jsx
hunk.type: replace
file: @charset "UTF-8";
  
  @media screen and (max-width: 1800px) {
      .inner__wrap {
          &.move--left {
              .date-separator, .new-separator {
                  &.hovered--comment {
                      &:before, &:after {
                          background: none;
                      }
                  }
              }
          }
      }
  }
  @media screen and (max-width: 1440px) {
      .date-separator, .new-separator {
          &.hovered--comment {
              &:before, &:after {
                  background: none !important;
              }
          }
      }
  }
  
  @media screen and (max-width: 1140px) {
      .tip-overlay {
          &.tip-overlay--chat {
              margin: -10px 0 0 -10px;
              .arrow {
                  right: 15px;
                  left: auto;
              }
          }
      }
      .inner__wrap {
          &.move--left {
              .file-overlay {
                  font-size: em(18px);
                  .overlay__circle {
                      width: 300px;
                      height: 300px;
                      margin: -150px 0 0 -150px;
                  }
                  .overlay__files {
                      margin: 60px auto 15px;
                      width: 150px;
                  }
              }
          }
      }
  }
  
  @media screen and (max-width: 960px) {
  
      .sidebar--right {
          width: 400px;
          z-index: 5;
          right: 0;
          @include translateX(100%);
  
          &.move--left {
              @include translateX(0);
          }
  
      }
  
      .inner__wrap {
  
          &.move--left {
              margin-right: 0;
          }
  
      }
  
      .post {
  
          .post-list__content & {
  
              &:hover {
                  background: transparent;
  
                  .comment-icon__container {
                      visibility: hidden;
  
                      &.icon--show {
                          visibility: visible;
                      }
  
                  }
  
              }
  
          }
  
          .dropdown {
              visibility: visible;
          }
  
          .post__dropdown {
              line-height: 9px;
              text-decoration: none;
              width: 20px;
              display: inline-block;
              text-align: center;
              height: 20px;
  
              &:after {
                  font-size: 20px;
                  content: '...';
                  top: -3px;
              }
  
          }
  
      }
  
  }
  
  @media screen and (max-width: 768px) {
  
      .signup-team__container {
          font-size: 1em;
      }
  
      .post {
  
          .post__header {
  
              .col__name {
                  pointer-events: none;
              }
  
          }
  
          &.same--root {
  
              &.same--user {
  
                  .post__time {
                      display: none;
                  }
  
              }
  
          }
  
          .post__img {
              width: 40px;
  
              img {
                  width: 32px;
                  height: 32px;
              }
          }
  
      }
  
      .post-image__column {
          width: 200px;
          height: 95px;
      }
  
      .textarea-wrapper {
          .textbox-preview-link, .textbox-help-link {
              display: none;
          }
      }
      .form-control {
          &.min-height {
              min-height: 100px;
          }
      }
      .img-div {
          max-width: 100%;
      }
      .tip-div {
          left: 15px;
          right: auto;
      }
      .tip-overlay {
          &.tip-overlay--chat {
              margin-left: 10px;
              .arrow {
                  left: 32px;
              }
          }
      }
      .file-details__container {
          display: block;
          .file-details__preview {
              display: block;
              width: 100%;
              height: 150px;
              border-right: none;
              border-bottom: 1px solid #ddd;
              img {
                  width: 64px;
                  height: 64px;
              }
          }
          .file-details {
              width: 100%;
              height: auto;
          }
      }
      .search-help-popover.visible {
          visibility: hidden;
      }
      .modal-direct-channels {
          .member-count {
              float: none;
              margin-top: 10px;
              display: block;
          }
      }
      .file-overlay {
          font-size: em(18px);
          &.center-file-overlay {
              .overlay__indent {
                  margin-left: 0;
              }
          }
          .overlay__circle {
              width: 300px;
              height: 300px;
              margin: -150px 0 0 -150px;
          }
          .overlay__files {
              margin: 60px auto 15px;
              width: 150px;
          }
      }
      .date-separator, .new-separator {
          &.hovered--after {
              &:before {
                  background: none;
              }
          }
          &.hovered--before {
              &:after {
                  background: none;
              }
          }
      }
      .signup-team__container {
          padding: 30px 0;
          margin-bottom: 30px;
          font-size: 0.9em;
          .signup-team__name {
              font-size: 2em;
          }
          .btn.btn-full {
              padding-left: 10px;
          }
          .btn {
              .icon, .fa {
                  margin-right: 6px;
              }
          }
      }
      .modal {
          .info__label {
              text-align: left;
              padding-bottom: 5px;
          }
          .modal-header {
              .modal-action {
                  margin-top: 10px;
              }
              .modal-title {
                  float: none;
                  max-width: 90%;
              }
              .btn {
                  &.btn-primary {
                      display: block;
                      margin: 10px 0 6px;
                      width: 100%;
                      float: none;
                  }
              }
          }
      }
      .row--invite {
          .col-sm-6 {
              padding: 0;
          }
      }
      .settings-modal {
          &.display--content {
              .modal-header {
                  display: none;
              }
              .settings-table {
                  display: block;
                  .settings-content {
                      &.minimize-settings {
                          display: block;
                          .section-edit {
                              position: absolute;
                              top: 7px;
                              right: 0;
                              width: 50px;
                              .fa {
                                  display: inline-block;
                              }
                          }
                      }
                      .section-min:hover {
                          background: none;
                      }
                      .no-padding--left {
                          padding-left: 15px;
                      }
                  }
                  .settings-links {
                      display: none;
                  }
                  .modal-header {
                      display: block;
                      position: absolute;
                      top: 0;
                      width: 100%;
                      z-index: 5;
                  }
                  .modal-title {
                      padding-left: 20px;
                  }
                  .user-settings {
                      .tab-header {
                          display: none;
                      }
                      .divider-dark.first {
                          display: none;
                      }
                  }
              }
          }
          .settings-table {
              .nav, .nav.absolute {
                  position: relative;
                  top: auto;
                  width: 100%;
              }
              .settings-content {
                  &.minimize-settings {
                      padding: 0;
                      display: none;
                      .user-settings {
                          padding: 70px 20px 30px;
                      }
                  }
              }
              .settings-links {
                  background: #fff;
              }
              .nav {
                  > li {
                      > a {
                          border-top: 1px solid #ddd;
                          font-size: 1.1em;
                          line-height: 2.7;
                          color: #555;
                          .glyphicon {
                              margin-left: 7px;
                          }
                      }
                  }
              }
          }
      }
      .post-create__container {
          .post-right__container & {
              padding: 0 1em;
              .msg-typing {
                  display: none;
              }
          }
          form {
              padding: 0.5em 0;
          }
          .post-create-footer {
              padding: 0 1em;
              .msg-typing {
                  display: none;
              }
              .control-label {
                  top: 0;
              }
          }
          .post-create-body {
              display: table;
              width: 100%;
              .post-body__cell {
                  display: table-cell;
                  padding-left: 45px;
                  .sidebar--right & {
                      padding-left: 0;
                  }
              }
              .app__content & {
                  .btn-file {
                      width: 45px;
                      padding: 0;
                      line-height: 36px;
                      bottom: -2px;
                      left: 0;
                      top: auto;
                  }
              }
              .send-button {
                  display: table-cell;
              }
          }
      }
      .preview-container {
          margin: 5px 0 0;
          .preview-div {
              margin-top: 0;
          }
          .remove-preview {
              width: 28px;
              height: 28px;
              left: auto;
              right: 0;
              top: 0;
              background: #444;
              background: rgba(#000, 0.5);
              text-align: center;
              &:after {
                  display: none;
              }
              i {
                  line-height: 29px;
                  top: auto;
                  right: auto;
                  position: relative;
                  font-size: 16px;
              }
          }
      }
      #navbar {
          .navbar-default {
              .navbar-header {
                  float: none;
                  margin: 0 -15px;
                  .dropdown__icon {
                      background: url("../images/dropdown-icon.png");
                      width: 4px;
                      height: 16px;
                      @include background-size(100% 100%);
                      display: inline-block;
                  }
              }
              .navbar-toggle {
                  display: block;
              }
              .navbar-brand {
                  white-space: nowrap;
              }
          }
      }
      body {
          &.white {
              .inner__wrap {
                  >.row.content {
                      margin-bottom: -185px;
                  }
              }
          }
      }
      .footer, .footer-pane, .footer-push {
          height: 187px;
      }
      .footer-pane {
          .footer-link {
              padding: 0;
              width: 100%;
              text-align: right;
              line-height: 1.7;
              &.copyright {
                  width: 100%;
              }
          }
      }
      .search__clear {
          display: block;
      }
      .search-bar__container {
          padding: 0;
          @include flex(0 0 44px);
          background: $primary-color;
          color: #fff;
          &.focused {
              .sidebar__collapse {
                  @include translateX(-45px);
              }
              .search__form {
                  @include translateX(-45px);
                  padding-left: 55px;
                  padding-right: 24px;
              }
              .search__clear {
                  @include translateX(0px);
              }
          }
          .search__form {
              border: none;
              @include translateX(0px);
              padding: 7px 20px 0 49px;
              height: 45px;
              position: relative;
              @include single-transition(all, 0.2s, linear);
              .glyphicon-refresh-animate {
                  right: 33px;
                  top: 15px;
                  color: #fff;
                  color: rgba(255,255,255,0.5);
              }
              .form-control {
                  border: none;
                  padding: 0 10px 0 31px;
                  background: rgba(black, 0.2);
                  @include border-radius(3px);
                  color: #444;
                  background: #fff;
              }
          }
      }
      .sidebar--menu {
          @include single-transition(transform, 0.5s, ease);
          @include translate3d(290px, 0, 0);
          width: 290px;
          border: none;
          display: block;
          &.move--left {
              @include translate3d(0, 0, 0);
          }
      }
      .sidebar--left {
          @include single-transition(transform, 0.5s, ease);
          @include translate3d(-290px, 0, 0);
          width: 290px;
          border: none;
          &.sidebar--padded {
              padding-top: 0;
          }
          &.move--right {
              @include translate3d(0, 0, 0);
          }
          > div {
              padding-bottom: 0;
          }
          .nav-pills__unread-indicator-bottom {
              bottom: 10px;
          }
          .badge {
              top: 13px;
          }
          .team__header {
              display: none;
              @include clearfix;
          }
          .search__form {
              display: block;
          }
          .nav {
              li {
                  &.dropdown.open {
                      padding-bottom: 25px;
                      ul {
                          clear: both;
                          background: #FFF;
                          border-radius: 3px;
                          top: 5px;
                          position: relative;
                          li {
                              a {
                                  line-height: 30px;
                              }
                          }
                      }
                  }
                  h4 {
                      margin: 16px 0 8px;
                  }
                  > a {
                      font-size: 15px;
                      margin: 0;
                      line-height: 2.5;
                      &:hover, &:focus {
                          background: transparent;
                      }
                      &.has-close {
                          .btn-close {
                              width: 40px;
                              text-align: center;
                              right: 0;
                              display: block;
                              @include opacity(0.5);
                          }
                      }
                  }
              }
          }
      }
      .sidebar--right {
          width: 100%;
          right: 0;
          @include translate3d(100%, 0, 0);
          z-index: 5;
          &.move--left {
              @include translate3d(0, 0, 0);
          }
          .sidebar__collapse, .sidebar__search-icon {
              display: block;
          }
          .sidebar--right__close {
              display: none;
          }
          .sidebar-right__body {
              height: calc(100% - 44px);
          }
      }
      .search-items-container {
          height: calc(100% - 44px);
      }
      .inner__wrap {
          &.move--right {
              @include translate3d(290px, 0, 0);
              &:before {
                  z-index: 9999;
                  content: "";
                  width: 100%;
                  height: 100%;
                  left: -15px;
                  top: 0;
                  position: absolute;
                  background: rgba(0, 0, 0, 0.4);
              }
          }
          &.move--left-small {
              @include translate3d(-290px, 0, 0);
              &:before {
                  z-index: 9999;
                  content: "";
                  width: 100%;
                  height: 100%;
                  right: -15px;
                  top: 0;
                  position: absolute;
                  background: rgba(0, 0, 0, 0.4);
              }
          }
          &.move--left {
              margin: 0;
              @include translate3d(-100%, 0, 0);
          }
      }
      .modal {
          .modal-image {
              .image-wrapper {
                  > div {
                      font-size: 12px;
                      min-width: 250px;
                  }
                  .modal-close {
                      @include opacity(1);
                  }
              }
              .modal-button-bar {
                  @include opacity(1);
              }
          }
      }
      .app__content {
          padding-top: 45px;
          margin: 0;
          .channel__wrap & {
              padding-top: 45px;
          }
          #channel-header {
              display: none;
          }
      }
  
  
      .channel__wrap {
          .row {
              &.header {
                  display: block;
              }
          }
      }
  
      .post-comments {
          padding: 9px 21px 10px 10px !important;
      }
  
      .post-image__column .post__image .file-playback-controls.stop, .image-wrapper > a .file-playback-controls.stop {
          @include opacity(1);
      }
  }
  @media screen and (max-width: 640px) {
      .access-history__table {
          > div {
              display: block;
          }
          .access__report {
              margin: 0 0 15px 15px;
          }
          .access__date {
              div {
                  margin-bottom: 15px;
              }
          }
      }
      .activity-log__table {
          > div {
              display: block;
          }
          .activity-log__report {
              width: 100%;
          }
          .activity-log__action {
              text-align: left;
              margin-top: 10px;
          }
      }
  }
  @media screen and (max-width: 480px) {
      .modal {
          .modal-body {
              max-height: 70%;
          }
          .settings-modal {
              &.display--content {
                  .modal-body {
                      max-height: 90%;
                  }
              }
          }
      }
      .member-div {
          padding: 8px 0;
          .member-drop, .member-role {
              position: relative;
              margin: 0px 0 0 44px;
              padding: 5px 0;
              top: 0;
              right: 0;
          }
          .open>.dropdown-menu {
              left: 0;
              right: auto;
          }
      }
      .sidebar--left {
          @include translate3d(-260px, 0, 0);
          width: 260px;
      }
      .inner__wrap {
          &.move--right {
              @include translate3d(260px, 0, 0);
          }
      }
      .modal {
          .modal-image {
              .modal-button-bar {
                  line-height: 30px;
                  padding: 5px;
              }
          }
      }
  }
  
  
  @media (min-width: 992px){
      .modal-lg {
          width: 700px;
      }
  }
  
  @media screen and (min-width: 768px) {
      .second-bar {
          display: none;
      }
  }
  
  @media screen and (max-height: 640px) {
      .signup-team__container {
          padding: 30px 0;
          margin-bottom: 30px;
          font-size: 0.9em;
          .signup-team__name {
              font-size: 2em;
          }
      }
  }