filecoin-project/slate
1
1
Fork 0
mirror of https://github.com/filecoin-project/slate.git synced 2024-12-26 02:24:44 +03:00
Code Issues Packages Projects Releases Wiki Activity

slate settings sidebar

Browse Source
This commit is contained in:
Martina 2020-09-09 12:35:39 -07:00
parent b85a3afd32
commit 76739b7422
3 changed files with 33 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
components/sidebars/SidebarAddFileToBucket.js
View File

@ -151,7 +151,9 @@ export default class SidebarAddFileToBucket extends React.Component {
onChange={this._handleUpload} onChange={this._handleUpload}
/> />
{this.props.data && this.props.data.decorator === "SLATE" ? ( {this.props.data &&
(this.props.data.slatename ||
(this.props.data.data && this.props.data.data.name)) ? (
<System.P style={{ marginTop: 24 }}> <System.P style={{ marginTop: 24 }}>
This will add data to your Slate named{" "} This will add data to your Slate named{" "}
<strong> <strong>
@ -163,6 +165,10 @@ export default class SidebarAddFileToBucket extends React.Component {
</System.P> </System.P>
) : null} ) : null}
<System.P style={{ marginTop: 24 }}>
Click below or drop a file anywhere on the page to upload a file.
</System.P>
{!this.props.fileLoading ? ( {!this.props.fileLoading ? (
<System.ButtonPrimary <System.ButtonPrimary
full full

33
components/sidebars/SidebarSingleSlateSettings.js
View File

@ -5,6 +5,8 @@ import * as System from "~/components/system";
import * as Strings from "~/common/strings"; import * as Strings from "~/common/strings";
import { css } from "@emotion/react"; import { css } from "@emotion/react";
import { Input } from "~/components/core/Input";
import { Textarea } from "~/components/core/Textarea";
const STYLES_GROUP = css` const STYLES_GROUP = css`
display: flex; display: flex;
@ -118,15 +120,11 @@ export default class SidebarSingleSlateSettings extends React.Component {
> >
Slate Settings Slate Settings
</System.P> </System.P>
<System.P style={{ marginTop: 24 }}>
Update settings for{" "}
{this.props.current.data.name || this.props.current.slatename}.
</System.P>
<System.Input <Input
containerStyle={{ marginTop: 48 }} containerStyle={{ marginTop: 48 }}
style={{ marginTop: 24 }} style={{ marginTop: 24 }}
label="Slate name" label="Name"
description={ description={
<React.Fragment> <React.Fragment>
Changing the slatename will change your public slate URL. Your Changing the slatename will change your public slate URL. Your
@ -151,7 +149,7 @@ export default class SidebarSingleSlateSettings extends React.Component {
descriptionStyle={{ fontSize: Constants.system.lvl1 }} descriptionStyle={{ fontSize: Constants.system.lvl1 }}
labelStyle={{ fontSize: Constants.system.lvl2 }} labelStyle={{ fontSize: Constants.system.lvl2 }}
/> />
<System.Textarea <Textarea
style={{ marginTop: 24 }} style={{ marginTop: 24 }}
label="Description" label="Description"
name="body" name="body"
@ -165,7 +163,11 @@ export default class SidebarSingleSlateSettings extends React.Component {
<div css={STYLES_LEFT}> <div css={STYLES_LEFT}>
<System.DescriptionGroup <System.DescriptionGroup
label="Change privacy" label="Change privacy"
description="If enabled, your slate will be visible to anyone in the world. If disabled, your slate will only be visible to you on this screen." description={
this.state.public
? "This slate is public"
: "This slate is private"
}
descriptionStyle={{ fontSize: Constants.system.lvl1 }} descriptionStyle={{ fontSize: Constants.system.lvl1 }}
labelStyle={{ fontSize: Constants.system.lvl2 }} labelStyle={{ fontSize: Constants.system.lvl2 }}
/> />
@ -190,7 +192,11 @@ export default class SidebarSingleSlateSettings extends React.Component {
{!this.state.loading ? ( {!this.state.loading ? (
<System.ButtonSecondary <System.ButtonSecondary
style={{ marginTop: 16 }} style={{
marginTop: 16,
backgroundColor: "#e5e5e5",
color: Constants.system.red,
}}
full full
onClick={this._handleCancel} onClick={this._handleCancel}
> >
@ -213,8 +219,15 @@ export default class SidebarSingleSlateSettings extends React.Component {
full full
onClick={this._handleDelete} onClick={this._handleDelete}
loading={this.state.loading} loading={this.state.loading}
style={{
backgroundColor: "#e5e5e5",
color: Constants.system.red,
}}
> >
Delete {this.props.current.slatename} Delete{" "}
{this.props.current.data && this.props.current.data.name
? this.props.current.data.name
: this.props.current.slatename}
</System.ButtonSecondary> </System.ButtonSecondary>
</div> </div>
) : null} ) : null}

5
components/system/components/Toggle.js
View File

@ -51,8 +51,9 @@ export class Toggle extends React.Component {
css={STYLES_TOGGLE} css={STYLES_TOGGLE}
onClick={this._handleChange} onClick={this._handleChange}
style={{ style={{
backgroundColor: this.props.active ? Constants.system.yellow : null, backgroundColor: this.props.active ? Constants.system.brand : null,
}}> }}
>
<figure <figure
css={STYLES_DIAL} css={STYLES_DIAL}
style={{ transform: this.props.active ? `translateX(40px)` : null }} style={{ transform: this.props.active ? `translateX(40px)` : null }}