mirror of
https://github.com/revoltchat/revite.git
synced 2024-11-26 09:00:57 -05:00
fix(msgbar): added support for keyboard focus
This commit is contained in:
parent
79550cb2ad
commit
4a58a4082b
1 changed files with 9 additions and 4 deletions
|
@ -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);
|
||||||
|
|
Loading…
Reference in a new issue