You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
85 lines
2.3 KiB
85 lines
2.3 KiB
import React from "react"; |
|
|
|
import "./index.scss"; |
|
|
|
const maxDesktopSize = 1250; |
|
const maxMobileSize = 550; |
|
|
|
const fontSize = { |
|
desktop: { |
|
span: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 80, |
|
}, |
|
mobile: { |
|
span: window.innerWidth > maxMobileSize ? 14 : window.innerWidth / 30, |
|
}, |
|
}; |
|
|
|
export default function Document(props) { |
|
const { parent, name } = props; |
|
|
|
return ( |
|
<> |
|
{window.innerWidth < 1000 ? ( |
|
<div className="support__document d-flex justify-content-center align-items-center mb-3"> |
|
<input |
|
type="file" |
|
name={name} |
|
onChange={(e) => |
|
parent.onChange(e.target.name, e.target.files[0], "file") |
|
} |
|
/> |
|
{parent.state.file ? ( |
|
<span |
|
style={{ |
|
fontSize: fontSize.mobile.span, |
|
width: "100%", |
|
textAlign: "center", |
|
margin: "auto", |
|
}} |
|
> |
|
{parent.state.file?.name || "تصویر بارگزاری شد"} |
|
</span> |
|
) : ( |
|
<span style={{ fontSize: fontSize.mobile.span }}> |
|
در صورت نیاز تصویر مرتبط را انتخاب کنید. |
|
</span> |
|
)} |
|
</div> |
|
) : null} |
|
{window.innerWidth > 1000 ? ( |
|
<div className="support__document d-flex justify-content-center-align-items-center"> |
|
<input |
|
type="file" |
|
name={name} |
|
onChange={(e) => |
|
parent.onChange(e.target.name, e.target.files[0], "file") |
|
} |
|
/>{" "} |
|
{parent.state.file ? ( |
|
<span |
|
style={{ |
|
fontSize: fontSize.mobile.span, |
|
width: "100%", |
|
textAlign: "center", |
|
margin: "auto", |
|
}} |
|
> |
|
{parent.state.file?.name || "فایل ثبت شد"} |
|
</span> |
|
) : ( |
|
<span |
|
style={{ |
|
fontSize: fontSize.mobile.span, |
|
width: "100%", |
|
textAlign: "center", |
|
margin: "auto", |
|
}} |
|
> |
|
در صورت نیاز تصویر مرتبط را انتخاب کنید. |
|
</span> |
|
)} |
|
</div> |
|
) : null} |
|
</> |
|
); |
|
}
|
|
|