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

fix(jumpbar): fixed collision on mobile

Browse source
This commit is contained in:
trashtemp 2022-01-20 15:26:58 +01:00
parent 68acfe26de
commit 6e89e10461
No known key found for this signature in database
GPG key ID: D1F0DB65081B0FC6
2 changed files with 22 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
src/components/common/messaging/bars/JumpToBottom.tsx
View file

@ -45,6 +45,10 @@ export const Bar = styled.div<{ position: "top" | "bottom"; accent?: boolean }>`
justify-content: space-between;
transition: color ease-in-out 0.08s;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
${(props) =>
props.accent
? css`
@ -86,6 +90,10 @@ export const Bar = styled.div<{ position: "top" | "bottom"; accent?: boolean }>`
display: flex;
align-items: center;
gap: 6px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
&:hover {
@ -103,6 +111,12 @@ export const Bar = styled.div<{ position: "top" | "bottom"; accent?: boolean }>`
padding: 0 12px;
`}
}
@media only screen and (max-width: 800px) {
.right > span {
display: none;
}
}
`;
export default observer(({ channel }: { channel: Channel }) => {
@ -119,8 +133,10 @@ export default observer(({ channel }: { channel: Channel }) => {
<div>
<Text id="app.main.channel.misc.viewing_old" />
</div>
<div>
<Text id="app.main.channel.misc.jump_present" />{" "}
<div className="right">
<span>
<Text id="app.main.channel.misc.jump_present" />
</span>
<DownArrowAlt size={18} />
</div>
</div>

6
src/components/common/messaging/bars/NewMessages.tsx
View file

@ -56,8 +56,10 @@ export default observer(
}}
/>
</div>
<div>
<Text id="app.main.channel.misc.jump_beginning" />
<div className="right">
<span>
<Text id="app.main.channel.misc.jump_beginning" />
</span>
<UpArrowAlt size={20} />
</div>
</div>