snowbabel extension <br /> tag displayed in frontend - typo3

I've a problem with typo3 snowbabel extension. I need to insert a line break in frontend. In the manual, specified that "if you want to have a line break visible in front end, you'll have to insert the HTML line break tag.
I've added it. But the html br tag displayed in frontend.Also the line break is not working.
Is there any configurations for this?
Thanks,
Arun Chandran

This is just a handy quick solution to the problem.
You can use <section> tags instead of "<br/>" tags. Even though their purpose might be different, it still gives the output.
OR
Just use <br></br> instead of </br>. Works fine.

Related

Prettier - allow line breaks between html elements

I'd like to keep some space between some html blocks in my code. However, Prettier wants to remove these lines. Is there a Prettier setting to keep this spacing?
Before prettier:
<template>
<form>
<div>First block</div>
<div>Second block</div>
</form>
</template>
After pretter:
<template>
<form>
<div>First block</div>
<div>Second block</div>
</form>
</template>
There is no way to actually do this, you might only use tricks.
First trick
Ignore completely the file (or file extensions) but you will not benefit from Prettier
Second trick
Deny Prettier to trim whitespaces
trim_trailing_whitespace = true
And add whitespaces in line breaks.
Once again this is not an effective solution, it's only a trick.
An issue has been closed by devs
adding and removing line breaks is core to prettier's formatting algorithm
According to #suchipi , Github member:
adding and removing line breaks is core to prettier's formatting algorithm, so preserving them isn't consistently possible.
As a work around you can try:
setting very short printWidth
put // prettier-ignore comment above your code.
For Refernce:
Github issue
Is there a config in prettier to keep line breaks?
Don't know if this will work as intended however, in the document for Prettier, there is a section for "Empty Line" that says;
"Prettier collapses multiple blank lines into a single blank line."
By this, you may want to add a double blank line instead of a single blank, where you are wanting a space to be, as it should compress it into a single line rather than removing it all together.
Take a look on this thread https://github.com/prettier/prettier/issues/4870, it's pretty good explaining why this is still non-existing feature.
There is no simple way for formatter to determine what to keep and what to remove.
So the only practical things you can do
Add comments to disable formatting in certain places (which is bad idea and never work well, dev gents become annoyed with this super quickly).
Accept that empty lines would be collapsed (still bad, because of poor readability)
Disable this feature and maintain empty lines yourself (alternative editor). This one "arguably" seems to me the simplest (best) option in a long-term.

VSCode Wrap HTML attributes each on their own line

I'm looking for a setting or extension in VSCode that provides the following functionality:
Format on save
wrap html attributes on their own line, even if there is only one attribute
put closing symbol of opening tag on new line, aligned with tag
alphabetically order attributes
do not align attributes according to the position of the first attribute, simple use one level of indentation
Example 1:
<span my-attr="value">Hello, world!</span>
becomes
<span
my-attr="value"
>
Hello, world!
</span>
Example 2:
<x-status-indicator wire:click="pushMe" class="block" :status="$status"
:description="$description" />
then becomes
<x-status-indicator
:description="$description"
:status="$status"
class="block"
wire:click="pushMe"
/>
So far there have been many posts about formatting, but I could not find a single post or extension that satisfies these requirements. Any suggestions would be greatly appreciated, thank you! :)

Visual Studio Code and Prettier html formatting on separate lines

I'm using VS Code, and Prettier and cannot get it to format the way I want it to be upon saving.
If I have a line like
<input type="checkbox" /> Label<br />
upon format/save, it becomes
<input type="checkbox" />
Label
<br />
I don't want to turn off Format on Save since I want to be able to Format Document from time-to-time. Is there a setting to get the line breaks how I want them? I'd prefer it only wrap on line length and other wanted places (e.g. select and option tags on different lines)
Note: this is just a simplified example. There are many other cases where it's putting every tag on a separate line when I'd like them to stay on one.
You need to update your .prettierrc file in your root to have
"printWidth": 1000
or whatever print width you are looking to have and it should fix this. Also check out the Prettier docs at https://prettier.io/docs/en/configuration.html to see other items you can configure.

How to display newline in TimelineItem control's text property?

We have a SAPUI5 timeline control, where we are showing the comments coming from server.
The issue is, if the comments contain a newline \n, then the Timeline control is not able to display the text in newline. Instead, it introduces space wherever \n is present.
We have tried formatting \n to unicode character also but that also didn't worked. Timeline control aggregates TimelineItem.
The control we are using is: https://ui5.sap.com/#/api/sap.suite.ui.commons.TimelineItem
Code snippet can be found at:
https://jsbin.com/kuluyehilu/edit?html,output
I inspected your example and came up with the following solution.
Since the text is embedded in a <span>, all unnecessary whitespace will be trimmed. What you can do is telling the span (via CSS) that it should display the whitespace anyway.
If you don't have a CSS file in your project yet, create one. Then add the following lines
div.sapSuiteUiCommonsTimelineItemShellBody>span {
white-space: pre;
}
This should do the trick.
JSBin: https://jsbin.com/feladeneso/1/edit?html,output
If you inspect the rendered element, you will see it actually put in the break:
<span id="__item0-realtext">x
y</span>
...but did not convert it to a <br/> tag. You cannot add the tag yourself since it will be escaped, either. Maybe you can try to override the renderer, and convert any line breaks to html breaks

How to highlight a text with double simple quotes '' in a HTML section

I'd like to highlight one or two words in a <HTML></HTML> section in a dokuwiki (2014-05-05 "Ponder Stibbons") page like I'd do outside of the section with ''one or two words'' or with apostrophe in SE markdown. How can I achieve that? Example (embedded HTML option has to be enabled in configuration):
====== Title ======
<HTML>
<ul>
<li>Magic should happen ''here'', except not with '' because it isn't recognized</li>
</ul>
</HTML>
The following doesn't suit my needs
<tt>one two</tt> simply doesn't look the same
Besides this I don't have any ideas...
Try enclosing the string in &quot tag like &quotkey&quot i.e. &quot tag appended with semicolon
May be misunderstood your question , now more clear
Try something like this if it helps by enclosing in code tags as shown in :
https://www.dokuwiki.org/faq:lists
Magic should happen 'here', expect not with because it isn't recognized
Also,check out the following link :
https://www.dokuwiki.org/wiki:syntax