cswimr/revite
1
0
Fork 0
mirror of https://github.com/revoltchat/revite.git synced 2024-11-22 07:00:58 -05:00
Code Issues Projects Releases Packages Wiki Activity

fix(msgbar): added support for keyboard focus

Browse source
This commit is contained in:
trashtemp 2022-01-15 12:55:23 +01:00
parent 79550cb2ad
commit 4a58a4082b
No known key found for this signature in database
GPG key ID: D1F0DB65081B0FC6
1 changed files with 9 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
src/components/common/messaging/bars/MessageOverlayBar.tsx
View file

@ -42,12 +42,12 @@ const OverlayBar = styled.div`
right: 0; right: 0;
top: -18px; top: -18px;
z-index: 0; z-index: 0;
overflow: hidden; //overflow: hidden;
transition: box-shadow 0.1s ease-out; transition: box-shadow 0.1s ease-out;
border-radius: 5px; border-radius: 5px;
background: var(--primary-header); background: var(--primary-header);
//border: 1px solid var(--background); border: 1px solid var(--background);
&:hover { &:hover {
box-shadow: rgb(0 0 0 / 20%) 0px 2px 10px; box-shadow: rgb(0 0 0 / 20%) 0px 2px 10px;
@ -55,19 +55,24 @@ const OverlayBar = styled.div`
`; `;
const Entry = styled.div` const Entry = styled.div`
height: 30px; height: 32px;
width: 30px; width: 32px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
flex-shrink: 0; flex-shrink: 0;
cursor: pointer; cursor: pointer;
transition: 0.2s ease background-color; transition: 0.2s ease background-color;
border-radius: var(--border-radius);
&:hover { &:hover {
background: var(--secondary-header); background: var(--secondary-header);
} }
&:focus {
box-shadow: 0 0 0 2.5pt var(--accent);
}
&:active { &:active {
svg { svg {
transform: translateY(1px); transform: translateY(1px);