When typing MFM, a sugestor drop-down appears so you can see and/or choose what MFM function to use
The new MFM functions we support have now also been added
The `span`'s needed an inline-block for the transform to wrok
I also added an `overflow: hidden;` because these functions can make the text go beyond the borders of the StatusBody
With `overflow: hidden;`, it won't show outside of the borders
These now work for the new, FEP-c16b compliant, representation
Nesting also works
It already worked for text and "normal" emoji, but now it also works for custom emoji
Things like `speed=0.1s` now work
I also noticed a class was set on StatusBody, but we don't use it, we use StatusContent.
Therefor I removed it now.
We do still pass the setting through StatusBody to RichContent bc it's used there to decide to not show greentext for arrows when MFM was used.
Note that while this setting still works
* You have to refresh the page to see it working (was already like this, so I didn't touch it here)
* It explicitly checks for content type. If womeone provides MFM-like HTML, then it will still show as greentext if that option is enabled
I think it's a bit inconsistent, but otoh, the inconsistency to me seems more that we ignore the greentext option for one input type specifically
I do still notice generall bugs with MFM.
* Position doesn't seem to work, neither does scale.
* There also seems to be a regression where custom emojis don't become larger any more with e.g. `$[x2 :hehe: ]`
I don't assume the regression is made in this commit, so I add this already. The rest needs to be fixed before merging.
The SCSS that we took from Foundkey in a previous commit, is now working
The settings for disabling MFM or only show animation on hover are working
The previous representation also works and it's clearly marked in the code what is legacy
All the MFM SCSS is now located in one file specifically for MFM, ./src/components/status_content/mfm.scss
This is only SCSS:
* The variables who are provided as data-attributes are not working yet
* `sparkle` also doesn't work
This is part of a bigger work to fix MFM in Akkoma
See <AkkomaGang/akkoma#381>
Here we add the MFM stylesheet as it is used by Foundkey
See <b22e627089>
Foundkey uses MFM and both the Founkey and Akkoma projects and communities, have historically been closely related
As such it makes sense to start with feature-parity with Foundkey
This commit only adds the stylesheet so that correct attribution is given
Properly integrating and making it work will happen in later commits
MFM was defined in three places.
There was ./src/components/status_body/status_body.scss => I moved this to ./src/components/status_content/mfm.scss
There was ./src/components/status_content/status_content.vue => I moved this to ./src/components/status_content/mfm.scss
There's ./static/mfm.css => I kept this as-is
./src/components/status_content/mfm.scss is now being loaded in ./src/components/status_content/status_content.vue
I added a comment in both ./src/components/status_content/mfm.scss and ./static/mfm.css referencing each other
Note that this is just a first step in an overhoal of how MFM is handled. It seemed easier to do this as a first step and then build further on that.
