stream-chat-angular 4.66.2 → 5.0.0-v5.10

package/src/assets/styles/scss/Gallery.scss

@@ -1,121 +0,0 @@
-$image-size: 150px;
-
-.str-chat__gallery {
-  display: inline-flex;
-  flex-wrap: wrap;
-  justify-content: flex-end;
-  overflow: hidden;
-
-  &-image {
-    /* flex: 1; x */
-    width: $image-size;
-    height: $image-size;
-    background: var(--white);
-    margin-bottom: 1px;
-    margin-right: 1px;
-    border: none;
-    padding: 0;
-    display: flex;
-
-    &:hover {
-      cursor: -moz-zoom-in;
-      cursor: -webkit-zoom-in;
-      cursor: zoom-in;
-    }
-
-    img {
-      width: inherit;
-      // CDN resize requires max-height/height and max-width to be set on this element
-      height: inherit;
-      max-width: $image-size;
-      object-fit: cover;
-    }
-  }
-
-  &--square {
-    max-width: 301px; // 300px + 1px margin between images
-  }
-
-  &--square &-image:nth-child(even) {
-    margin-right: 0;
-  }
-}
-
-.livestream.str-chat,
-.messaging.str-chat,
-.commerce.str-chat,
-.team.str-chat {
-  .str-chat {
-    &__gallery {
-      margin: 4px 0;
-
-      &-image {
-        width: $image-size;
-        height: $image-size;
-      }
-
-      &-placeholder {
-        position: relative;
-        width: $image-size;
-        // CDN resize requires max-height/height and max-width to be set on this element
-        max-width: $image-size;
-        height: $image-size;
-        color: var(--white);
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        background-size: cover;
-        background-position: top left;
-        background-repeat: no-repeat;
-        cursor: -moz-zoom-in;
-        cursor: -webkit-zoom-in;
-        cursor: pointer;
-        border: none;
-
-        p {
-          position: relative;
-          z-index: 1;
-          font-size: 16px;
-        }
-
-        &::after {
-          content: '';
-          position: absolute;
-          top: 0;
-          left: 0;
-          width: 100%;
-          height: 100%;
-          background-color: var(--overlay-dark);
-          z-index: 0;
-        }
-      }
-    }
-  }
-}
-
-.commerce.str-chat {
-  .str-chat__gallery {
-    width: calc(100% - 30px);
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    grid-auto-rows: 100px;
-
-    &-image,
-    &-placeholder {
-      width: 100%;
-      height: 100%;
-    }
-  }
-
-  .str-chat__message-commerce {
-    .str-chat__gallery {
-      border-radius: var(--border-radius) var(--border-radius) var(--border-radius) 2px;
-    }
-
-    &--right {
-      .str-chat__gallery {
-        border-radius: var(--border-radius) var(--border-radius) 2px var(--border-radius);
-      }
-    }
-  }
-}

package/src/assets/styles/scss/ImageCarousel.scss

@@ -1,45 +0,0 @@
-.str-chat__message {
-  .str-chat__attachment-list-angular-host {
-    .str-chat__modal--open {
-      .str-chat__modal__inner {
-        height: 80%;
-        width: 80%;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        flex-direction: column;
-      }
-    }
-  }
-}
-
-.stream-chat-angular__image-modal-host {
-  .str-chat__modal__inner {
-    max-width: 80%;
-  }
-}
-
-.str-chat__image-carousel {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  min-height: 0;
-  min-width: 0;
-  max-width: 100%;
-  max-height: 100%;
-
-  .str-chat__image-carousel-stepper {
-    padding: 8px;
-    border: none;
-    cursor: pointer;
-    background: transparent;
-  }
-
-  .str-chat__image-carousel-image {
-    object-fit: cover;
-    min-height: 0;
-    max-height: 100%;
-    min-width: 0;
-    max-width: 100%;
-  }
-}

package/src/assets/styles/scss/InfiniteScrollPaginator.scss

@@ -1,6 +0,0 @@
-.str-chat__infinite-scroll-paginator {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: var(--xs-p);
-}

package/src/assets/styles/scss/LoadMoreButton.scss

@@ -1,44 +0,0 @@
-.str-chat {
-  &.messaging {
-    .str-chat__load-more-button {
-      &__button {
-        border: 0;
-        width: 100%;
-        height: 40px;
-        border-radius: var(--border-radius-md);
-        background: var(--grey-whisper);
-        box-shadow: 0 1px 5px 0 var(--border);
-        color: var(--grey);
-        padding: var(--xs-p);
-        font-size: var(--md-font);
-
-        &:hover {
-          cursor: pointer;
-        }
-      }
-    }
-  }
-
-  &.team {
-    .str-chat__load-more-button {
-      &__button {
-        border: 0;
-        background: transparent;
-        width: 100%;
-        height: 40px;
-        padding: var(--xs-p);
-        font-size: var(--md-font);
-
-        &:hover {
-          cursor: pointer;
-        }
-      }
-    }
-  }
-}
-
-.str-chat__load-more-button__button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}

package/src/assets/styles/scss/LoadingChannels.scss

@@ -1,70 +0,0 @@
-.str-chat__loading-channels {
-  width: 300px;
-  height: 100%;
-  padding: var(--md-p);
-  background: var(--grey-gainsboro);
-
-  &-meta {
-    flex: 1;
-  }
-
-  &-avatar,
-  &-username,
-  &-status {
-    background-image: linear-gradient(
-      -90deg,
-      var(--bg-gradient-start) 0%,
-      var(--bg-gradient-end) 100%
-    );
-  }
-
-  &-username,
-  &-status {
-    border-radius: var(--border-radius);
-    height: 14px;
-  }
-
-  &-avatar {
-    width: 40px;
-    height: 40px;
-    border-radius: var(--border-radius-round);
-    margin-right: var(--xs-m);
-  }
-
-  &-username {
-    width: 40%;
-    margin-bottom: var(--xs-m);
-  }
-
-  &-status {
-    width: 80%;
-  }
-
-  &-item {
-    display: flex;
-    align-items: center;
-    width: 100%;
-    height: 40px;
-    border-radius: var(--border-radius-sm);
-    margin-bottom: var(--sm-m);
-    animation: pulsate 1s linear 0s infinite alternate;
-
-    &:nth-of-type(2) {
-      animation: pulsate 1s linear 0.3334s infinite alternate;
-    }
-
-    &:last-of-type {
-      animation: pulsate 1s linear 0.6667s infinite alternate;
-    }
-  }
-}
-
-@keyframes pulsate {
-  from {
-    opacity: 0.5;
-  }
-
-  to {
-    opacity: 1;
-  }
-}

package/src/assets/styles/scss/LoadingIndicator.scss

@@ -1,38 +0,0 @@
-.str-chat__loading-indicator {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  animation: rotate 1s linear infinite;
-
-  @-webkit-keyframes rotate {
-    from {
-      -webkit-transform: rotate(0deg);
-      -o-transform: rotate(0deg);
-      transform: rotate(0deg);
-    }
-
-    to {
-      -webkit-transform: rotate(360deg);
-      -o-transform: rotate(360deg);
-      transform: rotate(360deg);
-    }
-  }
-
-  @keyframes rotate {
-    from {
-      -ms-transform: rotate(0deg);
-      -moz-transform: rotate(0deg);
-      -webkit-transform: rotate(0deg);
-      -o-transform: rotate(0deg);
-      transform: rotate(0deg);
-    }
-
-    to {
-      -ms-transform: rotate(360deg);
-      -moz-transform: rotate(360deg);
-      -webkit-transform: rotate(360deg);
-      -o-transform: rotate(360deg);
-      transform: rotate(360deg);
-    }
-  }
-}