59 lines
1.3 KiB
JavaScript
59 lines
1.3 KiB
JavaScript
// import React from "react";
|
|
import styled from "styled-components";
|
|
import Modal from "../Modal";
|
|
import Button from "../../component/styled/Button";
|
|
|
|
const Styled = styled.div`
|
|
margin-top: 15px;
|
|
pointer-events: all;
|
|
width: 300px;
|
|
padding: 16px 32px;
|
|
border-radius: 6px;
|
|
background: #fff;
|
|
box-shadow: 0px 25px 50px rgba(31, 41, 55, 0.25);
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 12px;
|
|
.tip {
|
|
line-height: 1.4;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 5px;
|
|
color: #333;
|
|
.title {
|
|
font-size: 18px;
|
|
font-weight: bold;
|
|
}
|
|
.desc {
|
|
font-size: 12px;
|
|
color: #666;
|
|
}
|
|
}
|
|
.btns {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
gap: 12px;
|
|
}
|
|
`;
|
|
export default function Prompt({ handleInstall, closePrompt }) {
|
|
return (
|
|
<Modal mask={false}>
|
|
<Styled>
|
|
<div className="tip">
|
|
<h2 className="title">Add this Web APP</h2>
|
|
<p className="desc">Add to your PC and open like native APP</p>
|
|
</div>
|
|
<div className="btns">
|
|
<Button className="main small" onClick={handleInstall}>
|
|
Install
|
|
</Button>
|
|
<Button className="ghost small" onClick={closePrompt}>
|
|
Cancel
|
|
</Button>
|
|
</div>
|
|
</Styled>
|
|
</Modal>
|
|
);
|
|
}
|