Web:Studio:Add BreakpointWarning component.
This commit is contained in:
parent
4f429cf030
commit
721e442374
27
public/images/breakpoint-warning.svg
Normal file
27
public/images/breakpoint-warning.svg
Normal file
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 15 KiB |
@ -31,6 +31,8 @@
|
||||
"BackupList": "Backup List",
|
||||
"BackupListWarningText": "If you delete any items from the list, their corresponding files will also be deleted. This action cannot be undone. To delete all the files use the link:",
|
||||
"BrowserNoCanvasSupport": "Your browser does not support the HTML5 canvas tag.",
|
||||
"BreakpointWarningText": "This section is only available in desktop version",
|
||||
"BreakpointWarningTextPrompt": "Please use the desktop site to access",
|
||||
"ByApp": "By authenticator app",
|
||||
"BySms": "By sms",
|
||||
"ChangeLogoButton": "Change Logo",
|
||||
|
@ -0,0 +1,22 @@
|
||||
import React from "react";
|
||||
|
||||
import { withTranslation } from "react-i18next";
|
||||
|
||||
import StyledBreakpointWarning from "./StyledBreakpointWarning";
|
||||
|
||||
const BreakpointWarning = ({ t, content }) => {
|
||||
return (
|
||||
<StyledBreakpointWarning>
|
||||
<img src="/static/images/breakpoint-warning.svg" />
|
||||
|
||||
<div className="description">
|
||||
<div className="text-breakpoint">{t("BreakpointWarningText")}</div>
|
||||
<div className="text-prompt">
|
||||
{t("BreakpointWarningTextPrompt")} {content}
|
||||
</div>
|
||||
</div>
|
||||
</StyledBreakpointWarning>
|
||||
);
|
||||
};
|
||||
|
||||
export default withTranslation(["Settings"])(BreakpointWarning);
|
@ -0,0 +1,27 @@
|
||||
import styled from "styled-components";
|
||||
|
||||
const StyledBreakpointWarning = styled.div`
|
||||
padding: 44px 44px 0 44px;
|
||||
|
||||
.description {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-top: 36px;
|
||||
white-space: break-spaces;
|
||||
}
|
||||
|
||||
.text-breakpoint {
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
line-height: 22px;
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
|
||||
.text-prompt {
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
}
|
||||
`;
|
||||
|
||||
export default StyledBreakpointWarning;
|
@ -0,0 +1 @@
|
||||
export default from "./BreakpointWarning";
|
Loading…
Reference in New Issue
Block a user