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

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

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