1
0
mirror of https://github.com/LaCasemate/fab-manager.git synced 2024-12-01 12:24:28 +01:00

Add labels

This commit is contained in:
vincent 2022-03-28 17:58:35 +02:00 committed by Sylvain
parent d1daa55be1
commit edc34d9836
4 changed files with 16 additions and 4 deletions

View File

@ -33,7 +33,7 @@ interface FabTextEditorProps {
*/ */
export const FabTextEditor: React.FC<FabTextEditorProps> = ({ label, paragraphTools, content, limit = 400, video, image, onChange, placeholder, error }) => { export const FabTextEditor: React.FC<FabTextEditorProps> = ({ label, paragraphTools, content, limit = 400, video, image, onChange, placeholder, error }) => {
const { t } = useTranslation('shared'); const { t } = useTranslation('shared');
const placeholderText = placeholder || t('app.shared.text_editor.placeholder'); const placeholderText = placeholder || t('app.shared.text_editor.text_placeholder');
// TODO: Add ctrl+click on link to visit // TODO: Add ctrl+click on link to visit
// Setup the editor // Setup the editor

View File

@ -221,6 +221,7 @@ export const MenuBar: React.FC<MenuBarProps> = ({ editor, paragraphTools, video,
<div ref={ref} className={`fab-textEditor-subMenu ${submenu ? 'is-active' : ''}`}> <div ref={ref} className={`fab-textEditor-subMenu ${submenu ? 'is-active' : ''}`}>
{ submenu === 'link' && { submenu === 'link' &&
(<> (<>
<h6>{t('app.shared.text_editor.add_link')}</h6>
<div> <div>
<input value={url.href} onChange={linkUrlChange} onKeyDown={handleEnter} type="text" placeholder={t('app.shared.text_editor.link_placeholder')} /> <input value={url.href} onChange={linkUrlChange} onKeyDown={handleEnter} type="text" placeholder={t('app.shared.text_editor.link_placeholder')} />
<button type='button' onClick={unsetLink}> <button type='button' onClick={unsetLink}>
@ -241,13 +242,14 @@ export const MenuBar: React.FC<MenuBarProps> = ({ editor, paragraphTools, video,
} }
{ submenu === 'video' && { submenu === 'video' &&
(<> (<>
<h6>{t('app.shared.text_editor.add_video')}</h6>
<select name="provider" onChange={handleSelect}> <select name="provider" onChange={handleSelect}>
<option value="youtube">YouTube</option> <option value="youtube">YouTube</option>
<option value="vimeo">Vimeo</option> <option value="vimeo">Vimeo</option>
<option value="dailymotion">Dailymotion</option> <option value="dailymotion">Dailymotion</option>
</select> </select>
<div> <div>
<input type="text" onChange={videoUrlChange} placeholder={t('app.shared.text_editor.link_placeholder')} /> <input type="text" onChange={videoUrlChange} placeholder={t('app.shared.text_editor.url_placeholder')} />
<button type='button' onClick={() => addIframe()}> <button type='button' onClick={() => addIframe()}>
<CheckCircle size={24} /> <CheckCircle size={24} />
</button> </button>
@ -256,8 +258,9 @@ export const MenuBar: React.FC<MenuBarProps> = ({ editor, paragraphTools, video,
} }
{ submenu === 'image' && { submenu === 'image' &&
(<> (<>
<h6>{t('app.shared.text_editor.add_image')}</h6>
<div> <div>
<input type="text" onChange={imageUrlChange} placeholder={t('app.shared.text_editor.link_placeholder')} /> <input type="text" onChange={imageUrlChange} placeholder={t('app.shared.text_editor.url_placeholder')} />
<button type='button' onClick={() => addImage()}> <button type='button' onClick={() => addImage()}>
<CheckCircle size={24} /> <CheckCircle size={24} />
</button> </button>

View File

@ -90,6 +90,11 @@
&:not(:last-of-type) { margin-bottom: 0.8rem; } &:not(:last-of-type) { margin-bottom: 0.8rem; }
} }
h6 {
@include text-sm();
margin-top: 0;
}
input[type="text"], input[type="text"],
select { select {
width: 100%; width: 100%;

View File

@ -25,9 +25,13 @@ en:
payment_card_declined: "Your card was declined." payment_card_declined: "Your card was declined."
#text editor #text editor
text_editor: text_editor:
placeholder: "Type something…" text_placeholder: "Type something…"
link_placeholder: "Paste link…" link_placeholder: "Paste link…"
url_placeholder: "Paste url…"
new_tab: "Open in a new tab" new_tab: "Open in a new tab"
add_link: "Insert a link"
add_video: "Embed a video"
add_image: "Insert an image"
#user edition form #user edition form
user: user:
man: "Man" man: "Man"