rbondesson
83d732d60e
* Refactor className? to component property in EncryptionEventView * Refactor extraClassNames to default react className as component property for DecryptionFailureBodyView * Refactor className to component property for MessageTimestampView * Refactor className and children to component properties for ReactionsRowButton * Refactor className to component property for DisambiguatedProfile * Refactor className to a component property in DateSeparatorView * Fix for lint errors and EncryptionEventView unsupported icon color * EncryptionEventView fix for icon color css specificity/order
71 lines
1.4 KiB
CSS
71 lines
1.4 KiB
CSS
/*
|
|
* Copyright 2026 Element Creations Ltd.
|
|
*
|
|
* SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
|
|
* Please see LICENSE files in the repository root for full details.
|
|
*/
|
|
|
|
.reactionsRow {
|
|
color: var(--cpd-color-text-primary);
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
gap: var(--cpd-space-1x);
|
|
}
|
|
|
|
.showAllButton {
|
|
all: unset;
|
|
color: var(--cpd-color-text-secondary);
|
|
font-size: var(--cpd-font-size-body-xs);
|
|
line-height: 20px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.showAllButton:hover,
|
|
.showAllButton:focus-visible {
|
|
color: var(--cpd-color-text-primary);
|
|
}
|
|
|
|
.addReactionButton {
|
|
all: unset;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 16px;
|
|
height: 16px;
|
|
padding: var(--cpd-space-1x);
|
|
margin-inline: var(--cpd-space-1x);
|
|
border-radius: var(--cpd-space-1x);
|
|
color: var(--cpd-color-icon-secondary);
|
|
visibility: hidden;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.reactionsRow:hover .addReactionButton {
|
|
visibility: visible;
|
|
}
|
|
|
|
.addReactionButtonVisible {
|
|
visibility: visible;
|
|
}
|
|
|
|
.addReactionButtonActive {
|
|
visibility: visible;
|
|
}
|
|
|
|
.addReactionButtonDisabled {
|
|
cursor: not-allowed;
|
|
opacity: 0.6;
|
|
}
|
|
|
|
.addReactionButton:hover,
|
|
.addReactionButton:focus-visible,
|
|
.addReactionButtonActive {
|
|
color: var(--cpd-color-icon-primary);
|
|
}
|
|
|
|
.addReactionButton svg {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|