Design iterations based on PR feedback
This commit is contained in:
parent
036bc50b5d
commit
279654cc9e
8 changed files with 55 additions and 11 deletions
|
@ -143,10 +143,13 @@ $SpaceRoomViewInnerWidth: 428px;
|
|||
}
|
||||
// XXX remove this when spaces leaves Beta
|
||||
.mx_SpaceRoomView_preview_spaceBetaPrompt {
|
||||
font-size: $font-15px;
|
||||
font-weight: $font-semi-bold;
|
||||
font-size: $font-14px;
|
||||
line-height: $font-24px;
|
||||
color: $secondary-fg-color;
|
||||
margin-top: 14px;
|
||||
color: $primary-fg-color;
|
||||
margin-top: 24px;
|
||||
position: relative;
|
||||
padding-left: 24px;
|
||||
|
||||
.mx_AccessibleButton_kind_link {
|
||||
display: inline;
|
||||
|
@ -154,6 +157,19 @@ $SpaceRoomViewInnerWidth: 428px;
|
|||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
height: $font-24px;
|
||||
width: 20px;
|
||||
left: 0;
|
||||
mask-repeat: no-repeat;
|
||||
mask-position: center;
|
||||
mask-size: contain;
|
||||
mask-image: url('$(res)/img/element-icons/room/room-summary.svg');
|
||||
background-color: $secondary-fg-color;
|
||||
}
|
||||
}
|
||||
|
||||
.mx_SpaceRoomView_preview_inviter {
|
||||
|
|
|
@ -45,6 +45,7 @@ limitations under the License.
|
|||
display: block;
|
||||
margin: 20px 0;
|
||||
padding: 12px 40px;
|
||||
width: max-content;
|
||||
}
|
||||
|
||||
.mx_BetaCard_disclaimer {
|
||||
|
|
|
@ -140,7 +140,7 @@ export default class MyGroups extends React.Component {
|
|||
</div>
|
||||
</div>*/}
|
||||
</div>
|
||||
<BetaCard featureId="feature_spaces" title={_t("Communities are changing to spaces")} />
|
||||
<BetaCard featureId="feature_spaces" title={_t("Communities are changing to Spaces")} />
|
||||
<div className="mx_MyGroups_content">
|
||||
{ contentHeader }
|
||||
{ content }
|
||||
|
|
|
@ -604,7 +604,7 @@ const SpaceSetupPrivateInvite = ({ space, onFinished }) => {
|
|||
</div>
|
||||
|
||||
<div className="mx_SpaceRoomView_inviteTeammates_betaDisclaimer">
|
||||
<BetaPill />
|
||||
<BetaPill onClick={onBetaClick} />
|
||||
{ _t("<b>This is an experimental feature.</b> For now, " +
|
||||
"new users receiving an invite will have to open the invite on <link/> to actually join.", {}, {
|
||||
b: sub => <b>{ sub }</b>,
|
||||
|
|
|
@ -21,6 +21,7 @@ import {_t} from "../../../languageHandler";
|
|||
import AccessibleButton from "../elements/AccessibleButton";
|
||||
import SettingsStore from "../../../settings/SettingsStore";
|
||||
import {SettingLevel} from "../../../settings/SettingLevel";
|
||||
import TextWithTooltip from "../elements/TextWithTooltip";
|
||||
|
||||
interface IProps {
|
||||
title?: string;
|
||||
|
@ -28,6 +29,26 @@ interface IProps {
|
|||
}
|
||||
|
||||
export const BetaPill = ({ onClick }: { onClick?: () => void }) => {
|
||||
if (onClick) {
|
||||
return <TextWithTooltip
|
||||
class={classNames("mx_BetaCard_betaPill", {
|
||||
mx_BetaCard_betaPill_clickable: !!onClick,
|
||||
})}
|
||||
tooltip={<div>
|
||||
<div className="mx_Tooltip_title">
|
||||
{ _t("Spaces is a beta feature") }
|
||||
</div>
|
||||
<div className="mx_Tooltip_sub">
|
||||
{ _t("Tap for more info") }
|
||||
</div>
|
||||
</div>}
|
||||
onClick={onClick}
|
||||
tooltipProps={{ yOffset: -10 }}
|
||||
>
|
||||
{ _t("Beta") }
|
||||
</TextWithTooltip>;
|
||||
}
|
||||
|
||||
return <span
|
||||
className={classNames("mx_BetaCard_betaPill", {
|
||||
mx_BetaCard_betaPill_clickable: !!onClick,
|
||||
|
|
|
@ -169,6 +169,7 @@ const SpaceCreateMenu = ({ onFinished }) => {
|
|||
>
|
||||
<FocusLock returnFocus={true}>
|
||||
<BetaPill onClick={() => {
|
||||
onFinished();
|
||||
defaultDispatcher.dispatch({
|
||||
action: Action.ViewUserSettings,
|
||||
initialTabId: USER_LABS_TAB,
|
||||
|
|
|
@ -785,10 +785,11 @@
|
|||
"%(senderName)s: %(stickerName)s": "%(senderName)s: %(stickerName)s",
|
||||
"Change notification settings": "Change notification settings",
|
||||
"Spaces": "Spaces",
|
||||
"Spaces are a new way to group people and rooms for fun, work, yourself or anything in between.": "Spaces are a new way to group people and rooms for fun, work, yourself or anything in between.",
|
||||
"Spaces are new ways to group rooms and people.": "Spaces are new ways to group rooms and people.",
|
||||
"%(brand)s will reload with Spaces disabled. Communities and custom tags will be visible again.": "%(brand)s will reload with Spaces disabled. Communities and custom tags will be visible again.",
|
||||
"Beta available for web, desktop and Android. Thank you for trying the beta.": "Beta available for web, desktop and Android. Thank you for trying the beta.",
|
||||
"%(brand)s will reload with Spaces enabled, communities and custom tags hidden.": "%(brand)s will reload with Spaces enabled, communities and custom tags hidden.",
|
||||
"%(brand)s will reload with Spaces enabled. Communities and custom tags will be hidden.": "%(brand)s will reload with Spaces enabled. Communities and custom tags will be hidden.",
|
||||
"You can leave the beta any time from settings or tapping on a beta badge, like the one above.": "You can leave the beta any time from settings or tapping on a beta badge, like the one above.",
|
||||
"Beta available for web, desktop and Android. Some features may be unavailable on your homeserver.": "Beta available for web, desktop and Android. Some features may be unavailable on your homeserver.",
|
||||
"Show options to enable 'Do not disturb' mode": "Show options to enable 'Do not disturb' mode",
|
||||
"Send and receive voice messages (in development)": "Send and receive voice messages (in development)",
|
||||
|
@ -2459,6 +2460,8 @@
|
|||
"Revoke permissions": "Revoke permissions",
|
||||
"Move left": "Move left",
|
||||
"Move right": "Move right",
|
||||
"Spaces is a beta feature": "Spaces is a beta feature",
|
||||
"Tap for more info": "Tap for more info",
|
||||
"Beta": "Beta",
|
||||
"Leave the beta": "Leave the beta",
|
||||
"Join the beta": "Join the beta",
|
||||
|
@ -2595,7 +2598,7 @@
|
|||
"Error whilst fetching joined communities": "Error whilst fetching joined communities",
|
||||
"Create a new community": "Create a new community",
|
||||
"Create a community to group together users and rooms! Build a custom homepage to mark out your space in the Matrix universe.": "Create a community to group together users and rooms! Build a custom homepage to mark out your space in the Matrix universe.",
|
||||
"Communities are changing to spaces": "Communities are changing to spaces",
|
||||
"Communities are changing to Spaces": "Communities are changing to Spaces",
|
||||
"You’re all caught up": "You’re all caught up",
|
||||
"You have no visible notifications.": "You have no visible notifications.",
|
||||
"%(brand)s failed to get the protocol list from the homeserver. The homeserver may be too old to support third party networks.": "%(brand)s failed to get the protocol list from the homeserver. The homeserver may be too old to support third party networks.",
|
||||
|
|
|
@ -136,8 +136,7 @@ export const SETTINGS: {[setting: string]: ISetting} = {
|
|||
controller: new ReloadOnChangeController(),
|
||||
betaInfo: {
|
||||
title: _td("Spaces"),
|
||||
caption: _td("Spaces are a new way to group people and rooms for fun, " +
|
||||
"work, yourself or anything in between."),
|
||||
caption: _td("Spaces are new ways to group rooms and people."),
|
||||
disclaimer: (enabled) => {
|
||||
if (enabled) {
|
||||
return <>
|
||||
|
@ -150,9 +149,12 @@ export const SETTINGS: {[setting: string]: ISetting} = {
|
|||
}
|
||||
|
||||
return <>
|
||||
<p>{ _t("%(brand)s will reload with Spaces enabled, communities and custom tags hidden.", {
|
||||
<p>{ _t("%(brand)s will reload with Spaces enabled. " +
|
||||
"Communities and custom tags will be hidden.", {
|
||||
brand: SdkConfig.get().brand,
|
||||
}) }</p>
|
||||
<p>{ _t("You can leave the beta any time from settings or tapping on a beta badge, " +
|
||||
"like the one above.") }</p>
|
||||
<p>{ _t("Beta available for web, desktop and Android. " +
|
||||
"Some features may be unavailable on your homeserver.") }</p>
|
||||
</>;
|
||||
|
|
Loading…
Reference in a new issue