signal-desktop/stylesheets/components/CallingSelectPresentingSourcesModal.scss

// Copyright 2021 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only

.module-CallingSelectPresentingSourcesModal {
  &__width-container {
    max-width: 665px;
    position: relative;
  }

  // there's no module-class-name on the footer,
  // so we have to reference it using the generic selector
  .module-Modal__button-footer {
    background-color: $color-gray-95;
  }

  &__sources {
    margin-bottom: 34px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;

    &:last-child {
      margin-bottom: 0;
    }
  }

  &__title {
    margin-bottom: 12px;
  }

  &__source {
    @include button-reset();

    border-radius: 4px;
    border: 1px solid $color-gray-60;
    overflow: hidden;
    padding: 8px;
    text-align: center;
    width: 200px;

    &--selected {
      background-color: $color-ultramarine-dark;
      border: 1px solid $color-ultramarine-dark;
    }

    img {
      display: inline-block;
    }
  }

  &__screenshot {
    max-height: 102px;
    max-width: 184px;
  }

  &__name {
    &--container {
      align-items: center;
      display: flex;
      margin-top: 8px;
    }

    &--text {
      display: inline-block;
      overflow: hidden;
      text-overflow: ellipsis;
      vertical-align: middle;
      white-space: nowrap;
      width: 100%;
    }

    &--icon {
      margin-right: 8px;
    }
  }
}