Files
element-web/res/css/views/rooms/_MessageComposerFormatBar.pcss
Michael Telatynski 5869c519ed Tweak rendering of icons for accessibility (#31346)
* Tweak rendering of icons in dropdowns

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak rendering of icons in composer format bar

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak rendering of icons in jump to bottom button

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak rendering of icons in quick settings button

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak rendering of icons in left panel search

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Delint

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix margin

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak rendering of icons in security user settings tab

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak rendering of icons in space hierarchy

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Delint

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Simplify

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tidy

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add test

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2025-11-27 16:03:19 +00:00

70 lines
1.7 KiB
Plaintext

/*
Copyright 2024 New Vector Ltd.
Copyright 2019 The Matrix.org Foundation C.I.C.
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.
*/
.mx_MessageComposerFormatBar {
display: none;
width: calc(32px * 6);
height: 32px;
position: absolute;
cursor: pointer;
border-radius: 8px;
background-color: $background;
border: var(--cpd-border-width-1) solid var(--cpd-color-border-disabled);
user-select: none;
/* equal to z-index of mx_ReplyPreview and mx_RoomView_statusArea (1000) */
/* but as it appears after them in the DOM, will appear on top. */
z-index: 1000;
&.mx_MessageComposerFormatBar_shown {
display: block;
}
> * {
white-space: nowrap;
display: inline-block;
position: relative;
margin: 2px;
}
.mx_MessageComposerFormatBar_button {
width: 28px;
height: 28px;
box-sizing: border-box;
vertical-align: middle;
background: none;
border: none;
padding: 0;
svg {
width: inherit;
height: inherit;
box-sizing: border-box;
padding: var(--cpd-space-1x);
color: var(--cpd-color-icon-secondary);
}
&:hover {
background: var(--cpd-color-bg-subtle-secondary);
border-radius: 6px;
z-index: 1;
svg {
color: var(--cpd-color-icon-primary);
}
}
}
}
.mx_MessageComposerFormatBar_buttonTooltip {
white-space: nowrap;
font-size: $font-13px;
font-weight: var(--cpd-font-weight-semibold);
min-width: 54px;
text-align: center;
}