!MMqDFaFUehZZVwknKE:matrix.org

Draftail

50 Members
A configurable rich text editor built with Draft.js https://www.draftail.org/21 Servers

Load older messages


SenderMessageTime
12 Aug 2019
@_slack_wagtailcms_U1HDLHL9M:matrix.orgcoenvanderkamp Not sure if you are talking about images in the editor or in your frontend. 🤔 19:23:45
@_slack_wagtailcms_UBVEB3T0T:matrix.orgHanz van Aardt So if you have p test /p img ... /img p test2 /p and you want the image to be inline in the middle of the two p elements then a float right does not work. 19:59:38
@_slack_wagtailcms_U1HDLHL9M:matrix.orgcoenvanderkamp https://jsfiddle.net/allcaps/aq106w5L/ 20:24:25
@_slack_wagtailcms_UB1CW1P53:matrix.orgKalobTaulien
In reply to@_slack_wagtailcms_U1HDLHL9M:matrix.org
https://jsfiddle.net/allcaps/aq106w5L/
Draftail will add classes when you select left, right or center. If I recall right the css would look something like this:
.richtext-image.left {
  float: left;
}
.richtext-image.right {
  float: right;
}
.richtext-image.full-width {
  width: 100%;
}
21:45:21
@_slack_wagtailcms_UB1CW1P53:matrix.orgKalobTaulien
In reply to@_slack_wagtailcms_UB1CW1P53:matrix.org
Draftail will add classes when you select left, right or center. If I recall right the css would look something like this:
.richtext-image.left {
  float: left;
}
.richtext-image.right {
  float: right;
}
.richtext-image.full-width {
  width: 100%;
}
(edited) ... } ``` => ... } ``` Thats just in the template when we use `{{ self.field_name|richtext }}`. Im definitely wrong if its right inside of Draftail.
21:46:15
13 Aug 2019
@_slack_wagtailcms_UBVEB3T0T:matrix.orgHanz van Aardt
In reply to@_slack_wagtailcms_UB1CW1P53:matrix.org
Draftail will add classes when you select left, right or center. If I recall right the css would look something like this:
.richtext-image.left {
  float: left;
}
.richtext-image.right {
  float: right;
}
.richtext-image.full-width {
  width: 100%;
}
Thats just in the template when we use {{ self.field_name,richtext }}. Im definitely wrong if its right inside of Draftail.
Hi coenvanderkamp - thank you for the fiddle. It helps. I have modified it a bit to demonstrate the inline effect we are trying to achieve but failing to get right. See https://jsfiddle.net/utz2bkvf/1/
03:56:06
@_slack_wagtailcms_UBVEB3T0T:matrix.orgHanz van Aardt
In reply to@_slack_wagtailcms_UBVEB3T0T:matrix.org
Hi coenvanderkamp - thank you for the fiddle. It helps. I have modified it a bit to demonstrate the inline effect we are trying to achieve but failing to get right. See https://jsfiddle.net/utz2bkvf/1/
Float right and Float left is not the issue ... the issue we are struggling with is have an image embedded inline in the text. The issue is that the p element closes the moment you add an image. If the p element did not close this would not have been an issue I think.
03:58:15
@_slack_wagtailcms_U1HDLHL9M:matrix.orgcoenvanderkamp
In reply to@_slack_wagtailcms_UBVEB3T0T:matrix.org
Float right and Float left is not the issue ... the issue we are struggling with is have an image embedded inline in the text. The issue is that the p element closes the moment you add an image. If the p element did not close this would not have been an issue I think.
Ah, yes, the closing. Sorry, I don't know what is causing that or how to handle that.
06:48:32
@_slack_wagtailcms_U3T796GEP:matrix.orgharris changed their profile picture.13:42:07
@_slack_wagtailcms_UJ8V8S3M3:matrix.orgthp44 joined the room.14:27:27
@_slack_wagtailcms_UJ8V8S3M3:matrix.orgthp44 Would it be possible to add an “edit in html” button? 😉 14:33:52
@_slack_wagtailcms_U1HDLHL9M:matrix.orgcoenvanderkamp 'Edit in json' should be possible! 14:35:02
@_slack_wagtailcms_U4N6SF7K5:matrix.orgflipperpa changed their profile picture.22:10:18
14 Aug 2019
@_slack_wagtailcms_U642SEV53:matrix.orgalejandro changed their profile picture.14:05:02
15 Aug 2019
@_slack_wagtailcms_UANB7K25B:matrix.orgArthur changed their profile picture.09:18:32
@_slack_wagtailcms_U7KV2C319:matrix.orgsonny changed their profile picture.09:55:22
@_slack_wagtailcms_U0ME9SGR1:matrix.orgThibaud changed their profile picture.14:15:11
@_slack_wagtailcms_U0ME9SGR1:matrix.orgThibaud New Draftail release, & blog post: https://www.draftail.org/blog/2019/08/15/draftail-v1-3-0-community-improvements-beyond-wagtail TL;DR; – nothing new for Wagtail in here 😅 but hopefully useful improvements for people using the editor elsewhere 14:19:11
@_slack_wagtailcms_U0ME9SGR1:matrix.orgThibaud I’m just back from holidays, I see there’s been lots of activity here, will try my best to answer all of the messages tomorrow or early next week 14:19:42
@_slack_wagtailcms_U4N6SF7K5:matrix.orgflipperpa Awesome to see that Draftail is getting adopted outside of our ecosystem - great work, Thibaud! 🙂 16:00:00
@_slack_wagtailcms_UJHDYNXJP:matrix.orgEric Sherman joined the room.16:29:29
@_slack_wagtailcms_UJHDYNXJP:matrix.orgEric Sherman interested in talking about tables! 16:29:29
@_slack_wagtailcms_UB1CW1P53:matrix.orgKalobTaulien
In reply to@_slack_wagtailcms_UJHDYNXJP:matrix.org
interested in talking about tables!
https://media.giphy.com/media/X83Y7r03T6uty/giphy.gif
20:06:22
21 Aug 2019
@_slack_wagtailcms_UJHDYNXJP:matrix.orgEric Sherman changed their profile picture.23:03:54
22 Aug 2019
@_slack_wagtailcms_U4N6SF7K5:matrix.orgflipperpa changed their profile picture.01:30:51
@_slack_wagtailcms_U9DQ4PP9R:matrix.orgsharpertool changed their profile picture.10:55:11
@_slack_wagtailcms_U0LQA2BFT:matrix.orgmattwestcott changed their profile picture.14:23:36
23 Aug 2019
@_slack_wagtailcms_UJ6DZ84J2:matrix.orgJonathan Liuti changed their profile picture.10:32:59
@_slack_wagtailcms_UFCCF5RND:matrix.orgJason Dilworth changed their profile picture.11:31:06
@_slack_wagtailcms_U3T796GEP:matrix.orgharris changed their profile picture.16:42:50

Show newer messages


Back to Room ListRoom Version: 1