iio/pingvin-share
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: wrong layout if button text is too long in modals

Browse Source
This commit is contained in:
Elias Schneider
2023-07-22 16:23:04 +02:00
parent 231a2e95b9
commit f4c88aeb08
3 changed files with 53 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
frontend/src/components/upload/modals/showCreateUploadModal.tsx
View File

@@ -5,6 +5,7 @@ import {
Checkbox,
Col,
Grid,
Group,
MultiSelect,
NumberInput,
PasswordInput,
@@ -135,31 +136,29 @@ const CreateUploadModalBody = ({
})}
>
<Stack align="stretch">
<Grid align={form.errors.link ? "center" : "flex-end"}>
<Col xs={9}>
<TextInput
variant="filled"
label="Link"
placeholder="myAwesomeShare"
{...form.getInputProps("link")}
/>
</Col>
<Col xs={3}>
<Button
variant="outline"
onClick={() =>
form.setFieldValue(
"link",
Buffer.from(Math.random().toString(), "utf8")
.toString("base64")
.substr(10, 7)
)
}
>
<FormattedMessage id="common.button.generate" />
</Button>
</Col>
</Grid>
<Group align="end">
<TextInput
style={{ flex: "1" }}
variant="filled"
label="Link"
placeholder="myAwesomeShare"
{...form.getInputProps("link")}
/>
<Button
style={{ flex: "0 0 auto" }}
variant="outline"
onClick={() =>
form.setFieldValue(
"link",
Buffer.from(Math.random().toString(), "utf8")
.toString("base64")
.substr(10, 7)
)
}
>
<FormattedMessage id="common.button.generate" />
</Button>
</Group>
<Text
italic
@@ -173,6 +172,17 @@ const CreateUploadModalBody = ({
{!options.isReverseShare && (
<>
<Grid align={form.errors.link ? "center" : "flex-end"}>
<Col xs={6}>
<NumberInput
min={1}
max={99999}
precision={0}
variant="filled"
label={t("upload.modal.expires.label")}
disabled={form.values.never_expires}
{...form.getInputProps("expiration_num")}
/>
</Col>
<Col xs={6}>
<Select
disabled={form.values.never_expires}