123 lines
2.6 KiB
SCSS
123 lines
2.6 KiB
SCSS
// Copyright 2023 Signal Messenger, LLC
|
|
// SPDX-License-Identifier: AGPL-3.0-only
|
|
|
|
.ContactListItem {
|
|
&__context-menu {
|
|
&__chat-icon {
|
|
@include dark-theme {
|
|
@include color-svg(
|
|
'../images/icons/v3/chat/chat-compact.svg',
|
|
$color-white
|
|
);
|
|
}
|
|
@include light-theme {
|
|
@include color-svg(
|
|
'../images/icons/v3/chat/chat-compact.svg',
|
|
$color-black
|
|
);
|
|
}
|
|
}
|
|
|
|
&__phone-icon {
|
|
@include dark-theme {
|
|
@include color-svg(
|
|
'../images/icons/v3/phone/phone-compact.svg',
|
|
$color-white
|
|
);
|
|
}
|
|
@include light-theme {
|
|
@include color-svg(
|
|
'../images/icons/v3/phone/phone-compact.svg',
|
|
$color-black
|
|
);
|
|
}
|
|
}
|
|
|
|
&__video-icon {
|
|
@include dark-theme {
|
|
@include color-svg(
|
|
'../images/icons/v3/video/video-compact.svg',
|
|
$color-white
|
|
);
|
|
}
|
|
@include light-theme {
|
|
@include color-svg(
|
|
'../images/icons/v3/video/video-compact.svg',
|
|
$color-black
|
|
);
|
|
}
|
|
}
|
|
|
|
&__delete-icon {
|
|
@include dark-theme {
|
|
@include color-svg(
|
|
'../images/icons/v3/minus/minus-circle-compact.svg',
|
|
$color-white
|
|
);
|
|
}
|
|
@include light-theme {
|
|
@include color-svg(
|
|
'../images/icons/v3/minus/minus-circle-compact.svg',
|
|
$color-black
|
|
);
|
|
}
|
|
}
|
|
|
|
&__block-icon {
|
|
@include dark-theme {
|
|
@include color-svg(
|
|
'../images/icons/v3/block/block-compact.svg',
|
|
$color-white
|
|
);
|
|
}
|
|
@include light-theme {
|
|
@include color-svg(
|
|
'../images/icons/v3/block/block-compact.svg',
|
|
$color-black
|
|
);
|
|
}
|
|
}
|
|
|
|
// Overrides
|
|
&__popper.ContextMenu__popper {
|
|
min-width: 240px;
|
|
}
|
|
|
|
&__button.ContextMenu__button {
|
|
opacity: 0;
|
|
|
|
.ContactListItem:hover & {
|
|
opacity: 1;
|
|
}
|
|
|
|
&:hover {
|
|
@include light-theme {
|
|
background-color: $color-gray-20;
|
|
}
|
|
|
|
@include dark-theme {
|
|
background-color: $color-gray-80;
|
|
}
|
|
}
|
|
|
|
width: 28px;
|
|
height: 28px;
|
|
padding: 4px;
|
|
border-radius: 4px;
|
|
|
|
&::after {
|
|
display: block;
|
|
width: 20px;
|
|
height: 20px;
|
|
content: '';
|
|
|
|
@include dark-theme {
|
|
@include color-svg('../images/icons/v3/more/more.svg', $color-white);
|
|
}
|
|
@include light-theme {
|
|
@include color-svg('../images/icons/v3/more/more.svg', $color-black);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|