mirror of
https://github.com/revoltchat/revite.git
synced 2024-11-10 01:03:36 -05:00
Refreshed languages menu in settings
This commit is contained in:
parent
0139a91882
commit
9581a4df92
4 changed files with 35 additions and 9 deletions
|
@ -77,7 +77,7 @@ const ServerList = styled.div`
|
|||
display: flex;
|
||||
overflow-y: scroll;
|
||||
padding-bottom: 20px;
|
||||
width: 58px;
|
||||
/*width: 58px;*/
|
||||
flex-direction: column;
|
||||
|
||||
scrollbar-width: none;
|
||||
|
@ -89,6 +89,11 @@ const ServerList = styled.div`
|
|||
&::-webkit-scrollbar {
|
||||
width: 0px;
|
||||
}
|
||||
|
||||
/*${isTouchscreenDevice &&
|
||||
css`
|
||||
width: 58px;
|
||||
`}*/
|
||||
`;
|
||||
|
||||
const ServerEntry = styled.div<{ active: boolean; home?: boolean }>`
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import { observer } from "mobx-react-lite";
|
||||
import { Redirect, useParams } from "react-router";
|
||||
import styled from "styled-components";
|
||||
import styled, { css } from "styled-components";
|
||||
|
||||
import { attachContextMenu } from "preact-context-menu";
|
||||
import { useEffect } from "preact/hooks";
|
||||
|
@ -11,6 +11,7 @@ import PaintCounter from "../../../lib/PaintCounter";
|
|||
import { dispatch } from "../../../redux";
|
||||
import { connectState } from "../../../redux/connector";
|
||||
import { Unreads } from "../../../redux/reducers/unreads";
|
||||
import { isTouchscreenDevice } from "../../../lib/isTouchscreenDevice";
|
||||
|
||||
import { useClient } from "../../../context/revoltjs/RevoltClient";
|
||||
|
||||
|
@ -37,6 +38,13 @@ const ServerBase = styled.div`
|
|||
border-start-start-radius: 8px;
|
||||
border-end-start-radius: 8px;
|
||||
overflow: hidden;
|
||||
|
||||
${isTouchscreenDevice &&
|
||||
css`
|
||||
padding-bottom: 50px;
|
||||
border-end-start-radius: 0;
|
||||
`}
|
||||
|
||||
`;
|
||||
|
||||
const ServerList = styled.div`
|
||||
|
|
|
@ -98,9 +98,6 @@
|
|||
flex-direction: row;
|
||||
background: var(--primary-background);
|
||||
|
||||
/* Scrollbox hides the scrollbar on the desktop app. */
|
||||
/*@media (hover: hover) { .scrollbox { visibility: hidden; }}*/
|
||||
|
||||
.scrollbox {
|
||||
overflow-y: scroll;
|
||||
visibility: hidden;
|
||||
|
@ -115,6 +112,7 @@
|
|||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
width: 4px;
|
||||
background-clip: content-box;
|
||||
border-top: 80px solid transparent;
|
||||
}
|
||||
|
@ -125,6 +123,7 @@
|
|||
overflow-y: scroll;
|
||||
justify-content: flex-end;
|
||||
background: var(--secondary-background);
|
||||
scrollbar-width: thin;
|
||||
|
||||
.container {
|
||||
min-width: 218px;
|
||||
|
|
|
@ -467,28 +467,42 @@
|
|||
|
||||
.languages {
|
||||
.list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 1em;
|
||||
gap: 10px;
|
||||
|
||||
.entry {
|
||||
height: 50px;
|
||||
display: flex;
|
||||
height: 45px;
|
||||
padding: 0 8px;
|
||||
background: var(--tertiary-background);
|
||||
border-radius: var(--border-radius);
|
||||
margin-top: 0;
|
||||
|
||||
&:hover {
|
||||
background: var(--secondary-background);
|
||||
}
|
||||
}
|
||||
|
||||
.entry > span > span {
|
||||
gap: 20px;
|
||||
gap: 12px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
|
||||
.flag {
|
||||
display: flex;
|
||||
font-size: 2.625rem;
|
||||
line-height: 48px;
|
||||
|
||||
> div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
> img {
|
||||
height: 32px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.description {
|
||||
|
|
Loading…
Reference in a new issue