mirror of
https://github.com/Steffo99/festa.git
synced 2025-01-03 12:34:20 +00:00
Make the padding of EditableText consistent in all EditingModes
This commit is contained in:
parent
eaa378d23e
commit
8a6c363de4
2 changed files with 10 additions and 1 deletions
6
components/generic/editable/inputs.module.css
Normal file
6
components/generic/editable/inputs.module.css
Normal file
|
@ -0,0 +1,6 @@
|
||||||
|
.editableTextView {
|
||||||
|
/* Match the padding of the edit input
|
||||||
|
* 8px padding + 2px border
|
||||||
|
*/
|
||||||
|
padding: 10px;
|
||||||
|
}
|
|
@ -2,6 +2,7 @@ import { ComponentPropsWithoutRef } from "react"
|
||||||
import { FestaMoment } from "../renderers/datetime"
|
import { FestaMoment } from "../renderers/datetime"
|
||||||
import { FestaMarkdownRenderer } from "../renderers/markdown"
|
import { FestaMarkdownRenderer } from "../renderers/markdown"
|
||||||
import { EditingModeBranch } from "./base"
|
import { EditingModeBranch } from "./base"
|
||||||
|
import style from "./inputs.module.css"
|
||||||
|
|
||||||
|
|
||||||
type TextInputProps = ComponentPropsWithoutRef<"input"> & { value: string }
|
type TextInputProps = ComponentPropsWithoutRef<"input"> & { value: string }
|
||||||
|
@ -19,7 +20,9 @@ export const EditableText = (props: TextInputProps) => {
|
||||||
<input type="text" {...props} />
|
<input type="text" {...props} />
|
||||||
}
|
}
|
||||||
view={
|
view={
|
||||||
<div>{props.value}</div>
|
<div className={style.editableTextView}>
|
||||||
|
{props.value}
|
||||||
|
</div>
|
||||||
}
|
}
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
|
|
Loading…
Reference in a new issue