// Copyright 2021 Signal Messenger, LLC // SPDX-License-Identifier: AGPL-3.0-only .ContextMenu { &__container { align-items: center; display: flex; justify-content: center; } &__popper { @extend %module-composition-popper; margin: 0; padding-block: 6px; padding-inline: 0px; width: auto; &--single-item { padding: 0; } } &__title { @include font-body-1-bold; margin-bottom: 12px; } &__button { @include button-reset(); } &__option { @include button-reset(); @include font-body-2; @include dark-theme { color: $color-gray-05; } align-items: center; display: flex; justify-content: space-between; padding-block: 7px; padding-inline: 12px; min-width: 150px; width: 100%; &--container { display: flex; align-items: center; } &--icon { height: 16px; margin-inline-end: 8px; width: 16px; } &--selected { height: 12px; margin-block: 0; margin-inline: 6px; width: 16px; @include light-theme { @include color-svg('../images/icons/v3/check/check.svg', $color-black); } @include dark-theme { @include color-svg('../images/icons/v3/check/check.svg', $color-white); } } &--title { @include font-body-2; } &--description { @include font-subtitle; } &:hover { @include light-theme() { background-color: $color-gray-05; } @include dark-theme() { background-color: $color-gray-65; } } &--focused, &:focus, &:active { @include keyboard-mode { box-shadow: 0 0 1px 1px $color-ultramarine; outline: none; } } } &__popper--single-item &__option { padding-block: 12px; } &__divider { border-style: solid; border-width: 0 0 1px 0; margin-top: 2px; margin-bottom: 2px; @include light-theme { border-color: $color-gray-15; } @include dark-theme { border-color: $color-gray-65; } } }