fix(channel): last update before master merge

This commit is contained in:
trashtemp 2021-12-29 16:39:35 +01:00
parent cc531705b4
commit 086ab7b3bc
No known key found for this signature in database
GPG key ID: D1F0DB65081B0FC6
7 changed files with 139 additions and 88 deletions

2
external/lang vendored

@ -1 +1 @@
Subproject commit 1bf1a75b4dcc3b8543651c792ee0901b9db57e39
Subproject commit 33af4890e56757c27a5bbd23e81d05f03c4a0cde

View file

@ -26,9 +26,6 @@ const ServerBanner = styled.div<Props>`
display: flex;
flex-direction: column;
justify-content: end;
/*background-position: center;
background-repeat: no-repeat;
background-size: cover;*/
background-size: cover !important;
background-position: center center !important;

View file

@ -49,7 +49,7 @@ export default observer(
}
}}>
<div>
New messages since{" "}
<Text id="app.main.channel.misc.new_messages" />{" "}
{dayjs(decodeTime(last_id)).fromNow()}
</div>
<div>

View file

@ -1,3 +1,4 @@
import { Group } from "@styled-icons/boxicons-solid";
import { autorun } from "mobx";
import { observer } from "mobx-react-lite";
import { useHistory } from "react-router-dom";
@ -47,7 +48,7 @@ const EmbedInviteBase = styled.div`
const EmbedInviteDetails = styled.div`
flex-grow: 1;
padding-left: 12px;
padding-inline-start: 12px;
${() =>
isTouchscreenDevice &&
css`
@ -63,7 +64,14 @@ const EmbedInviteName = styled.div`
`;
const EmbedInviteMemberCount = styled.div`
display: flex;
align-items: center;
gap: 2px;
font-size: 0.8em;
> svg {
color: var(--secondary-foreground);
}
`;
type Props = {
@ -119,6 +127,7 @@ export function EmbedInvite({ code }: Props) {
<EmbedInviteDetails>
<EmbedInviteName>{invite.server_name}</EmbedInviteName>
<EmbedInviteMemberCount>
<Group size={12} />
{invite.member_count.toLocaleString()}{" "}
{invite.member_count === 1 ? "member" : "members"}
</EmbedInviteMemberCount>

View file

@ -8,6 +8,13 @@ export default styled.div`
user-select: none;
flex-direction: row;
align-items: stretch;
/*background: var(--background);*/
background-color: rgba(
var(--background-rgb),
max(var(--min-opacity), 0.75)
);
backdrop-filter: blur(20px);
/*> * > ::-webkit-scrollbar-thumb {
width: 4px;

View file

@ -24,12 +24,38 @@ import ChannelSettings from "./settings/ChannelSettings";
import ServerSettings from "./settings/ServerSettings";
import Settings from "./settings/Settings";
const AppContainer = styled.div`
background-size: cover !important;
background-position: center center !important;
`;
const StatusBar = styled.div`
height: 40px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: 13px;
gap: 14px;
.button {
border: 1px solid white;
padding: 5px;
border-radius: var(--border-radius);
}
`;
const Routes = styled.div`
min-width: 0;
display: flex;
flex-direction: column;
position: relative;
background: var(--primary-background);
/*background-color: rgba(
var(--primary-background-rgb),
max(var(--min-opacity), 0.75)
);*/
//backdrop-filter: blur(10px);
`;
export default function App() {
@ -44,91 +70,103 @@ export default function App() {
return (
<>
{window.isNative && !window.native.getConfig().frame && (
<Titlebar />
)}
<OverlappingPanels
width="100vw"
height={
window.isNative && !window.native.getConfig().frame
? "calc(var(--app-height) - var(--titlebar-height))"
: "var(--app-height)"
}
leftPanel={
inSpecial
? undefined
: { width: 288, component: <LeftSidebar /> }
}
rightPanel={
!inSpecial && inChannel
? { width: 236, component: <RightSidebar /> }
: undefined
}
bottomNav={{
component: <BottomNavigation />,
showIf: fixedBottomNav ? ShowIf.Always : ShowIf.Left,
height: 50,
}}
docked={isTouchscreenDevice ? Docked.None : Docked.Left}>
<Routes>
<Switch>
<Route
path="/server/:server/channel/:channel/settings/:page"
component={ChannelSettings}
/>
<Route
path="/server/:server/channel/:channel/settings"
component={ChannelSettings}
/>
<Route
path="/server/:server/settings/:page"
component={ServerSettings}
/>
<Route
path="/server/:server/settings"
component={ServerSettings}
/>
<Route
path="/channel/:channel/settings/:page"
component={ChannelSettings}
/>
<Route
path="/channel/:channel/settings"
component={ChannelSettings}
/>
{/*<StatusBar>
<div className="title">Planned outage: CDN (~2 hours)</div>
<div className="button">View status</div>
</StatusBar>*/}
<AppContainer>
{window.isNative && !window.native.getConfig().frame && (
<Titlebar />
)}
<OverlappingPanels
width="100vw"
height={
window.isNative && !window.native.getConfig().frame
? "calc(var(--app-height) - var(--titlebar-height))"
: "var(--app-height)"
}
leftPanel={
inSpecial
? undefined
: { width: 288, component: <LeftSidebar /> }
}
rightPanel={
!inSpecial && inChannel
? { width: 236, component: <RightSidebar /> }
: undefined
}
bottomNav={{
component: <BottomNavigation />,
showIf: fixedBottomNav ? ShowIf.Always : ShowIf.Left,
height: 50,
}}
docked={isTouchscreenDevice ? Docked.None : Docked.Left}>
<Routes>
<Switch>
<Route
path="/server/:server/channel/:channel/settings/:page"
component={ChannelSettings}
/>
<Route
path="/server/:server/channel/:channel/settings"
component={ChannelSettings}
/>
<Route
path="/server/:server/settings/:page"
component={ServerSettings}
/>
<Route
path="/server/:server/settings"
component={ServerSettings}
/>
<Route
path="/channel/:channel/settings/:page"
component={ChannelSettings}
/>
<Route
path="/channel/:channel/settings"
component={ChannelSettings}
/>
<Route
path="/channel/:channel/:message"
component={Channel}
/>
<Route
path="/server/:server/channel/:channel/:message"
component={Channel}
/>
<Route
path="/channel/:channel/:message"
component={Channel}
/>
<Route
path="/server/:server/channel/:channel/:message"
component={Channel}
/>
<Route
path="/server/:server/channel/:channel"
component={Channel}
/>
<Route path="/server/:server" component={Channel} />
<Route path="/channel/:channel" component={Channel} />
<Route
path="/server/:server/channel/:channel"
component={Channel}
/>
<Route path="/server/:server" component={Channel} />
<Route
path="/channel/:channel"
component={Channel}
/>
<Route path="/settings/:page" component={Settings} />
<Route path="/settings" component={Settings} />
<Route
path="/settings/:page"
component={Settings}
/>
<Route path="/settings" component={Settings} />
<Route path="/dev" component={Developer} />
<Route path="/friends" component={Friends} />
<Route path="/open/:id" component={Open} />
<Route path="/bot/:id" component={InviteBot} />
<Route path="/invite/:code?" component={Invite} />
<Route path="/" component={Home} />
</Switch>
</Routes>
<ContextMenus />
<Popovers />
<Notifications />
<StateMonitor />
</OverlappingPanels>
<Route path="/dev" component={Developer} />
<Route path="/friends" component={Friends} />
<Route path="/open/:id" component={Open} />
<Route path="/bot/:id" component={InviteBot} />
<Route path="/invite/:code?" component={Invite} />
<Route path="/" component={Home} />
</Switch>
</Routes>
<ContextMenus />
<Popovers />
<Notifications />
<StateMonitor />
</OverlappingPanels>
</AppContainer>
</>
);
}

View file

@ -31,8 +31,8 @@ export const Appearance = observer(() => {
<h3>
<Text id="app.settings.pages.appearance.theme_options.title" />
</h3>
<DisplaySeasonalShim />
<DisplayTransparencyShim />
<DisplaySeasonalShim />
<hr />
<DisplayFontShim />
<DisplayLigaturesShim />