filecoin-project/slate
1
1
Fork 0
mirror of https://github.com/filecoin-project/slate.git synced 2024-09-19 02:08:14 +03:00
Code Issues Packages Projects Releases Wiki Activity

feat(SceneSlate): use new private indicator

Browse Source
This commit is contained in:
Aminejv 2021-08-18 08:27:53 +01:00
parent 4152d9f7ac
commit 7a23becdec
3 changed files with 18 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
common/svg.js
View File

@ -1988,25 +1988,6 @@ export const Box = (props) => (
</svg> </svg>
); );
export const Lock = (props) => (
<svg width={8} height={8} fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
<path
d="M6.333 3.667H1.667A.667.667 0 001 4.333v2.334c0 .368.298.666.667.666h4.666A.667.667 0 007 6.667V4.333a.667.667 0 00-.667-.666z"
stroke="#C7CACC"
strokeWidth={1.25}
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M2.333 3.667V2.333a1.667 1.667 0 013.334 0v1.334"
stroke="#C7CACC"
strokeWidth={1.25}
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
);
export const Share = (props) => ( export const Share = (props) => (
<svg width={16} height={16} fill="none" xmlns="http://www.w3.org/2000/svg" {...props}> <svg width={16} height={16} fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
<path <path

7
components/core/CollectionPreviewBlock/index.js
View File

@ -82,10 +82,11 @@ const STYLES_TEXT_GRAY = (theme) => css`
color: ${theme.semantic.textGray}; color: ${theme.semantic.textGray};
`; `;
const LOCK_WRAPPER = (theme) => css` const STYLES_SECURITY_LOCK_WRAPPER = (theme) => css`
background-color: ${theme.semantic.bgDark}; background-color: ${theme.semantic.bgDark};
border-radius: 4px; border-radius: 4px;
padding: 4px; padding: 4px;
color: ${theme.semantic.textGrayLight};
`; `;
export default function CollectionPreview({ collection, viewer, owner, onAction }) { export default function CollectionPreview({ collection, viewer, owner, onAction }) {
@ -177,8 +178,8 @@ export default function CollectionPreview({ collection, viewer, owner, onAction
{title} {title}
</H5> </H5>
{!isPublic && ( {!isPublic && (
<div css={LOCK_WRAPPER} style={{ marginLeft: 8 }}> <div css={STYLES_SECURITY_LOCK_WRAPPER} style={{ marginLeft: 8 }}>
<SVG.Lock style={{ display: "block" }} /> <SVG.SecurityLock height={8} style={{ display: "block" }} />
</div> </div>
)} )}
</div> </div>

27
scenes/SceneSlate.js
View File

@ -8,6 +8,7 @@ import * as Strings from "~/common/strings";
import * as Utilities from "~/common/utilities"; import * as Utilities from "~/common/utilities";
import * as UserBehaviors from "~/common/user-behaviors"; import * as UserBehaviors from "~/common/user-behaviors";
import * as Events from "~/common/custom-events"; import * as Events from "~/common/custom-events";
import * as Styles from "~/common/styles";
import { Link } from "~/components/core/Link"; import { Link } from "~/components/core/Link";
import { LoaderSpinner } from "~/components/system/components/Loaders"; import { LoaderSpinner } from "~/components/system/components/Loaders";
@ -58,6 +59,13 @@ const STYLES_MOBILE_ONLY = css`
} }
`; `;
const STYLES_SECURITY_LOCK_WRAPPER = (theme) => css`
background-color: ${theme.semantic.bgDark};
border-radius: 4px;
padding: 8px;
color: ${theme.semantic.textGrayLight};
`;
export default class SceneSlate extends React.Component { export default class SceneSlate extends React.Component {
state = { state = {
loading: true, loading: true,
@ -450,23 +458,16 @@ class SlatePage extends React.Component {
</span>{" "} </span>{" "}
</Link> </Link>
/ {data.name} / {data.name}
{isOwner && !isPublic && (
<SVG.SecurityLock
height="24px"
style={{ marginLeft: 16, color: Constants.system.grayLight2 }}
/>
)}
</span> </span>
) : ( ) : (
<span> <div css={Styles.HORIZONTAL_CONTAINER_CENTERED}>
{data.name} <span>{data.name}</span>
{isOwner && !isPublic && ( {isOwner && !isPublic && (
<SVG.SecurityLock <div css={STYLES_SECURITY_LOCK_WRAPPER} style={{ marginLeft: 16 }}>
height="24px" <SVG.SecurityLock height="16px" style={{ display: "block" }} />
style={{ marginLeft: 16, color: Constants.system.grayLight2 }} </div>
/>
)} )}
</span> </div>
) )
} }
actions={<span css={STYLES_MOBILE_HIDDEN}>{actions}</span>} actions={<span css={STYLES_MOBILE_HIDDEN}>{actions}</span>}