mirror of
https://github.com/revoltchat/revite.git
synced 2024-11-25 16:40:58 -05:00
chore(settings): added new translation strings
This commit is contained in:
parent
73b6da4e1e
commit
6bed278fe8
8 changed files with 99 additions and 31 deletions
2
external/lang
vendored
2
external/lang
vendored
|
@ -1 +1 @@
|
|||
Subproject commit 455c61db08463159ede88380ef8ef998fd9d9d33
|
||||
Subproject commit d5965a4234e30b2ecb172e0755f54e9559b09ed2
|
|
@ -219,12 +219,25 @@ export const DisplaySeasonalShim = observer(() => {
|
|||
|
||||
return (
|
||||
<>
|
||||
<h3>Theme Options</h3>
|
||||
<h3>
|
||||
<Text id="app.settings.pages.appearance.theme_options.title" />
|
||||
</h3>
|
||||
{/* TOFIX: WIP feature - follows system theme */}
|
||||
{/*<Checkbox
|
||||
checked={settings.get("appearance:seasonal") ?? true}
|
||||
onChange={(v) => settings.set("appearance:seasonal", v)}
|
||||
description={
|
||||
<Text id="app.settings.pages.appearance.theme_options.follow_desc" />
|
||||
}>
|
||||
<Text id="app.settings.pages.appearance.theme_options.follow" />
|
||||
</Checkbox>*/}
|
||||
<Checkbox
|
||||
checked={settings.get("appearance:seasonal") ?? true}
|
||||
onChange={(v) => settings.set("appearance:seasonal", v)}
|
||||
description="Displays effects in the home tab during holiday seasons.">
|
||||
Seasonal theme
|
||||
description={
|
||||
<Text id="app.settings.pages.appearance.theme_options.seasonal_desc" />
|
||||
}>
|
||||
<Text id="app.settings.pages.appearance.theme_options.seasonal" />
|
||||
</Checkbox>
|
||||
</>
|
||||
);
|
||||
|
|
|
@ -40,7 +40,8 @@ const CheckboxBase = styled.label`
|
|||
const CheckboxContent = styled.span`
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
font-size: 1rem;
|
||||
font-size: 14px;
|
||||
gap: 2px;
|
||||
font-weight: 600;
|
||||
flex-direction: column;
|
||||
`;
|
||||
|
@ -111,7 +112,10 @@ export default function Checkbox(props: CheckboxProps) {
|
|||
!props.disabled && props.onChange(!props.checked)
|
||||
}
|
||||
/>
|
||||
<Checkmark checked={props.checked} contrast={props.contrast} className="check">
|
||||
<Checkmark
|
||||
checked={props.checked}
|
||||
contrast={props.contrast}
|
||||
className="check">
|
||||
<Check size={20} />
|
||||
</Checkmark>
|
||||
</CheckboxBase>
|
||||
|
|
|
@ -30,6 +30,11 @@ const CategoryBase = styled.div<BaseProps>`
|
|||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.action {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.content {
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
|
|
|
@ -44,11 +44,32 @@ const ChannelContent = styled.div`
|
|||
`;
|
||||
|
||||
const PlaceholderBase = styled.div`
|
||||
@keyframes floating {
|
||||
0% {
|
||||
transform: translate(0, 0px);
|
||||
}
|
||||
50% {
|
||||
transform: translate(0, 15px);
|
||||
}
|
||||
100% {
|
||||
transform: translate(0, -0px);
|
||||
}
|
||||
}
|
||||
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
flex-direction: column;
|
||||
|
||||
.floating {
|
||||
animation-name: floating;
|
||||
animation-duration: 3s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-timing-function: ease-in-out;
|
||||
margin-left: 30px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.placeholder {
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
|
@ -163,7 +184,9 @@ function ChannelPlaceholder() {
|
|||
</PageHeader>
|
||||
|
||||
<div className="placeholder">
|
||||
<div className="floating">
|
||||
<Ghost width={80} />
|
||||
</div>
|
||||
<div className="primary">
|
||||
<Text id="app.main.channel.errors.title" />
|
||||
</div>
|
||||
|
|
|
@ -39,7 +39,6 @@ export const Appearance = observer(() => {
|
|||
id="settings_overrides"
|
||||
summary={<Text id="app.settings.pages.appearance.overrides" />}>
|
||||
<ThemeTools />
|
||||
|
||||
<h3>App</h3>
|
||||
<ThemeOverrides />
|
||||
</CollapsibleSection>
|
||||
|
|
|
@ -381,7 +381,7 @@ function BotCard({ bot, onDelete, onUpdate }: Props) {
|
|||
<CollapsibleSection
|
||||
defaultValue={false}
|
||||
id={`bot_profile_${bot._id}`}
|
||||
summary="Bot Profile">
|
||||
summary={<Text id="app.settings.pages.bots.profile" />}>
|
||||
<h3>
|
||||
<Text id="app.settings.pages.profile.custom_background" />
|
||||
</h3>
|
||||
|
|
|
@ -1,5 +1,13 @@
|
|||
import { Check } from "@styled-icons/boxicons-regular";
|
||||
import {
|
||||
Star,
|
||||
Brush,
|
||||
Bookmark,
|
||||
BarChartAlt2,
|
||||
} from "@styled-icons/boxicons-solid";
|
||||
import styled from "styled-components";
|
||||
|
||||
import { Text } from "preact-i18n";
|
||||
import { useEffect, useState } from "preact/hooks";
|
||||
|
||||
import { useApplicationState } from "../../../mobx/State";
|
||||
|
@ -279,7 +287,7 @@ export function ThemeShop() {
|
|||
return (
|
||||
<ThemeShopRoot>
|
||||
<h5>
|
||||
Browse hundreds of themes, created and curated by the community.
|
||||
<Text id="app.settings.pages.theme_shop.description" />
|
||||
</h5>
|
||||
{/*<LoadFail>
|
||||
<h5>
|
||||
|
@ -290,55 +298,66 @@ export function ThemeShop() {
|
|||
<Tip warning hideSeparator>
|
||||
The Theme Shop is currently under construction.
|
||||
</Tip>
|
||||
<hr />
|
||||
|
||||
{/* FIXME INTEGRATE WITH MOBX */}
|
||||
{/*<ActiveTheme>
|
||||
<div class="active-indicator">
|
||||
<Check size="16" />
|
||||
Currently active
|
||||
<Text id="app.settings.pages.theme_shop.active" />
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="theme">theme svg goes here</div>
|
||||
<div class="info">
|
||||
<div class="title">Theme Title</div>
|
||||
<div class="author">by Author</div>
|
||||
<div class="author">
|
||||
<Text id="app.settings.pages.theme_shop.by" />{" "}
|
||||
Author
|
||||
</div>
|
||||
<h5>This is a theme description.</h5>
|
||||
</div>
|
||||
</div>
|
||||
</ActiveTheme>
|
||||
<InputBox placeholder="Search themes..." contrast />
|
||||
<InputBox placeholder="<Text id="app.settings.pages.theme_shop.search" />" contrast />
|
||||
<Category>
|
||||
<div class="title">
|
||||
<Bookmark size={16} />
|
||||
Saved
|
||||
<Text id="app.settings.pages.theme_shop.category.saved" />
|
||||
</div>
|
||||
<a class="view">Manage installed</a>
|
||||
<a class="view">
|
||||
<Text id="app.settings.pages.theme_shop.category.manage" />
|
||||
</a>
|
||||
</Category>
|
||||
|
||||
<Category>
|
||||
<div class="title">
|
||||
<Star size={16} />
|
||||
New this week
|
||||
<Text id="app.settings.pages.theme_shop.category.new" />
|
||||
</div>
|
||||
<a class="view">View all</a>
|
||||
</Category>
|
||||
|
||||
<Category>
|
||||
<div class="title">
|
||||
<Brush size={16} />
|
||||
Default themes
|
||||
</div>
|
||||
<a class="view">View all</a>
|
||||
<a class="view">
|
||||
<Text id="app.settings.pages.theme_shop.category.viewall" />
|
||||
</a>
|
||||
</Category>
|
||||
|
||||
<Category>
|
||||
<div class="title">
|
||||
<BarChartAlt2 size={16} />
|
||||
Highest rated
|
||||
<Text id="app.settings.pages.theme_shop.category.highest" />
|
||||
</div>
|
||||
<a class="view">View all</a>
|
||||
</Category>*/}
|
||||
<a class="view">
|
||||
<Text id="app.settings.pages.theme_shop.category.viewall" />
|
||||
</a>
|
||||
</Category>
|
||||
|
||||
<Category>
|
||||
<div class="title">
|
||||
<Brush size={16} />
|
||||
<Text id="app.settings.pages.theme_shop.category.default" />
|
||||
</div>
|
||||
<a class="view">
|
||||
<Text id="app.settings.pages.theme_shop.category.viewall" />
|
||||
</a>
|
||||
</Category>*/}
|
||||
<hr />
|
||||
<ThemeList>
|
||||
{themeList?.map(([slug, theme]) => (
|
||||
<ThemeInfo
|
||||
|
@ -350,7 +369,9 @@ export function ThemeShop() {
|
|||
themes.hydrate(themeData[slug], true)
|
||||
}>
|
||||
<div class="previewBox">
|
||||
<div class="hover">Use theme</div>
|
||||
<div class="hover">
|
||||
<Text id="app.settings.pages.theme_shop.use" />
|
||||
</div>
|
||||
<ThemePreview
|
||||
slug={slug}
|
||||
theme={themeData[slug]}
|
||||
|
@ -359,7 +380,10 @@ export function ThemeShop() {
|
|||
</button>
|
||||
<h1 class="name">{theme.name}</h1>
|
||||
{/* Maybe id's of the users should be included as well / instead? */}
|
||||
<div class="creator">by {theme.creator}</div>
|
||||
<div class="creator">
|
||||
<Text id="app.settings.pages.theme_shop.by" />{" "}
|
||||
{theme.creator}
|
||||
</div>
|
||||
<h5 class="description">{theme.description}</h5>
|
||||
</ThemeInfo>
|
||||
))}
|
||||
|
|
Loading…
Reference in a new issue