Thymeleaf special character conversion in Outlook - html

I have following html code (data coming in the variable as UTF-8)
<p style="margin: 0; font-size: 14px; font-family: Helvetica, Arial, sans-serif;">
Project Name: <span th:text="${projectName}">ProjectName</span>
</p>
Any special character that is in ${projectName} , for example : "Carol's" is getting converted to "Carol?s" in Outlook mail. Anyway to correct this in Thymeleaf ?

Related

how to render the below static html and css in reactjs

<h3 style="text-align:start;"><span style="color: rgb(97,189,109);font-size: 24px;font-family: Source Sans Pro;">(optional) customChunkRenderer</span></h3>
<p><span style="color: rgb(51,51,51);font-size: 18px;font-family: Source Sans Pro;">Use to define additional HTML nodes. Only supports atomic blocks.</span></p>
the above code has to be sanitized in react, like

use jsx and convert this to jsx format
use this -
<h3 style={{textAlign: 'start'}}><span style={{color: 'rgb(97,189,109)', fontSize: 24, fontFamily: 'Source Sans Pro'}}>(optional) customChunkRenderer</span></h3>
<p><span style={{color: 'rgb(51,51,51)', fontSize: 18, fontFamily: 'Source Sans Pro'}}>Use to define additional HTML nodes. Only supports atomic blocks.</span></p>

How do I view country flags on Windows 10 through HTML?

Is there a work around to make country flag emoji visible on windows 10 through HTML?
<!DOCTYPE html>
<html>
<style>
body {
font-size: 40px;
}
</style>
<body>
<p>9983 will display โ›ฟ</p>
<p>How to display American or Japanese flags?</p>
<p>๐Ÿ‡บ๐Ÿ‡ธ is just letters on Windows 10 ๐Ÿ˜“</p>
</body>
</html>
I found this on https://mdbootstrap.com/docs/jquery/content/flag/
I don't see a flag emoji on https://www.w3schools.com/charsets/ref_emoji.asp
I can view them on https://www.emojicopy.com/ but cannot use.
I found a CSS flag on
https://github.com/pixelastic/css-flags/blob/master/app/styles/_flags/usa.scss
I'm still learning to use stackOverflow, and I'm new at coding.
This is my fourth try at this question.

Use Noto Color Emoji font.
First, write a #font-face rule with the unicode-range property. Then add the font to the top of your font stack:
(Source)
#font-face {
font-family: NotoColorEmojiLimited;
unicode-range: U+1F1E6-1F1FF;
src: url(https://raw.githack.com/googlefonts/noto-emoji/main/fonts/NotoColorEmoji.ttf);
}
div {
font-family: 'NotoColorEmojiLimited', -apple-system, BlinkMacSystemFont,
'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji',
'Segoe UI Emoji', 'Segoe UI Symbol';
}
<div>
<p>
๐Ÿ‡ฆ๐Ÿ‡ซ ๐Ÿ‡ฆ๐Ÿ‡ฑ ๐Ÿ‡ฉ๐Ÿ‡ฟ ๐Ÿ‡ฆ๐Ÿ‡ฉ ๐Ÿ‡ฆ๐Ÿ‡ด ๐Ÿ‡ฆ๐Ÿ‡ฌ ๐Ÿ‡ฆ๐Ÿ‡ท ๐Ÿ‡ฆ๐Ÿ‡ฒ ๐Ÿ‡ฆ๐Ÿ‡บ ๐Ÿ‡ฆ๐Ÿ‡น ๐Ÿ‡ฆ๐Ÿ‡ฟ ๐Ÿ‡ง๐Ÿ‡ธ ๐Ÿ‡ง๐Ÿ‡ญ ๐Ÿ‡ง๐Ÿ‡ฉ ๐Ÿ‡ง๐Ÿ‡ง ๐Ÿ‡ง๐Ÿ‡พ ๐Ÿ‡ง๐Ÿ‡ช ๐Ÿ‡ง๐Ÿ‡ฟ ๐Ÿ‡ง๐Ÿ‡ฏ ๐Ÿ‡ง๐Ÿ‡น ๐Ÿ‡ง๐Ÿ‡ด ๐Ÿ‡ง๐Ÿ‡ฆ ๐Ÿ‡ง๐Ÿ‡ผ ๐Ÿ‡ง๐Ÿ‡ท ๐Ÿ‡ง๐Ÿ‡ณ ๐Ÿ‡ง๐Ÿ‡ฌ ๐Ÿ‡ง๐Ÿ‡ซ ๐Ÿ‡ง๐Ÿ‡ฎ ๐Ÿ‡จ๐Ÿ‡ป ๐Ÿ‡ฐ๐Ÿ‡ญ ๐Ÿ‡จ๐Ÿ‡ฒ ๐Ÿ‡จ๐Ÿ‡ฆ ๐Ÿ‡จ๐Ÿ‡ซ ๐Ÿ‡น๐Ÿ‡ฉ ๐Ÿ‡จ๐Ÿ‡ฑ ๐Ÿ‡จ๐Ÿ‡ด ๐Ÿ‡ฐ๐Ÿ‡ฒ ๐Ÿ‡จ๐Ÿ‡ฉ ๐Ÿ‡จ๐Ÿ‡ท ๐Ÿ‡จ๐Ÿ‡ฎ ๐Ÿ‡ญ๐Ÿ‡ท ๐Ÿ‡จ๐Ÿ‡บ ๐Ÿ‡จ๐Ÿ‡พ ๐Ÿ‡จ๐Ÿ‡ฟ ๐Ÿ‡ฐ๐Ÿ‡ต ๐Ÿ‡จ๐Ÿ‡ฌ ๐Ÿ‡ฉ๐Ÿ‡ฐ ๐Ÿ‡ฉ๐Ÿ‡ฏ ๐Ÿ‡ฉ๐Ÿ‡ฒ ๐Ÿ‡ฉ๐Ÿ‡ด ๐Ÿ‡ช๐Ÿ‡จ ๐Ÿ‡ช๐Ÿ‡ฌ ๐Ÿ‡ธ๐Ÿ‡ป ๐Ÿ‡ฌ๐Ÿ‡ถ ๐Ÿ‡ช๐Ÿ‡ท ๐Ÿ‡ช๐Ÿ‡ช ๐Ÿ‡ธ๐Ÿ‡ฟ ๐Ÿ‡ช๐Ÿ‡น ๐Ÿ‡ซ๐Ÿ‡ฏ ๐Ÿ‡ซ๐Ÿ‡ฎ ๐Ÿ‡ซ๐Ÿ‡ท ๐Ÿ‡ฌ๐Ÿ‡ฆ ๐Ÿ‡ฌ๐Ÿ‡ฒ ๐Ÿ‡ฌ๐Ÿ‡ช ๐Ÿ‡ฉ๐Ÿ‡ช ๐Ÿ‡ฌ๐Ÿ‡ญ ๐Ÿ‡ฌ๐Ÿ‡ท ๐Ÿ‡ฌ๐Ÿ‡ฉ ๐Ÿ‡ฌ๐Ÿ‡น ๐Ÿ‡ฌ๐Ÿ‡ณ ๐Ÿ‡ฌ๐Ÿ‡ผ ๐Ÿ‡ฌ๐Ÿ‡พ ๐Ÿ‡ญ๐Ÿ‡น ๐Ÿ‡ญ๐Ÿ‡ณ ๐Ÿ‡ญ๐Ÿ‡บ ๐Ÿ‡ฎ๐Ÿ‡ธ ๐Ÿ‡ฎ๐Ÿ‡ณ ๐Ÿ‡ฎ๐Ÿ‡ฉ ๐Ÿ‡ฎ๐Ÿ‡ท ๐Ÿ‡ฎ๐Ÿ‡ถ ๐Ÿ‡ฎ๐Ÿ‡ช ๐Ÿ‡ฎ๐Ÿ‡ฑ ๐Ÿ‡ฎ๐Ÿ‡น ๐Ÿ‡ฏ๐Ÿ‡ฒ ๐Ÿ‡ฏ๐Ÿ‡ต ๐Ÿ‡ฏ๐Ÿ‡ด ๐Ÿ‡ฐ๐Ÿ‡ฟ ๐Ÿ‡ฐ๐Ÿ‡ช ๐Ÿ‡ฐ๐Ÿ‡ฎ ๐Ÿ‡ฐ๐Ÿ‡ผ ๐Ÿ‡ฐ๐Ÿ‡ฌ ๐Ÿ‡ฑ๐Ÿ‡ฆ ๐Ÿ‡ฑ๐Ÿ‡ป ๐Ÿ‡ฑ๐Ÿ‡ง ๐Ÿ‡ฑ๐Ÿ‡ธ ๐Ÿ‡ฑ๐Ÿ‡ท ๐Ÿ‡ฑ๐Ÿ‡พ ๐Ÿ‡ฑ๐Ÿ‡ฎ ๐Ÿ‡ฑ๐Ÿ‡น ๐Ÿ‡ฑ๐Ÿ‡บ ๐Ÿ‡ฒ๐Ÿ‡ฌ ๐Ÿ‡ฒ๐Ÿ‡ผ ๐Ÿ‡ฒ๐Ÿ‡พ ๐Ÿ‡ฒ๐Ÿ‡ป ๐Ÿ‡ฒ๐Ÿ‡ฑ ๐Ÿ‡ฒ๐Ÿ‡น ๐Ÿ‡ฒ๐Ÿ‡ญ ๐Ÿ‡ฒ๐Ÿ‡ท ๐Ÿ‡ฒ๐Ÿ‡บ ๐Ÿ‡ฒ๐Ÿ‡ฝ ๐Ÿ‡ซ๐Ÿ‡ฒ ๐Ÿ‡ฒ๐Ÿ‡จ ๐Ÿ‡ฒ๐Ÿ‡ณ ๐Ÿ‡ฒ๐Ÿ‡ช ๐Ÿ‡ฒ๐Ÿ‡ฆ ๐Ÿ‡ฒ๐Ÿ‡ฟ ๐Ÿ‡ฒ๐Ÿ‡ฒ ๐Ÿ‡ณ๐Ÿ‡ฆ ๐Ÿ‡ณ๐Ÿ‡ท ๐Ÿ‡ณ๐Ÿ‡ต ๐Ÿ‡ณ๐Ÿ‡ฑ ๐Ÿ‡ณ๐Ÿ‡ฟ ๐Ÿ‡ณ๐Ÿ‡ฎ ๐Ÿ‡ณ๐Ÿ‡ช ๐Ÿ‡ณ๐Ÿ‡ฌ ๐Ÿ‡ฒ๐Ÿ‡ฐ ๐Ÿ‡ณ๐Ÿ‡ด ๐Ÿ‡ด๐Ÿ‡ฒ ๐Ÿ‡ต๐Ÿ‡ฐ ๐Ÿ‡ต๐Ÿ‡ผ ๐Ÿ‡ต๐Ÿ‡ฆ ๐Ÿ‡ต๐Ÿ‡ฌ ๐Ÿ‡ต๐Ÿ‡พ ๐Ÿ‡ต๐Ÿ‡ช ๐Ÿ‡ต๐Ÿ‡ญ ๐Ÿ‡ต๐Ÿ‡ฑ ๐Ÿ‡ต๐Ÿ‡น ๐Ÿ‡ถ๐Ÿ‡ฆ ๐Ÿ‡ฐ๐Ÿ‡ท ๐Ÿ‡ฒ๐Ÿ‡ฉ ๐Ÿ‡ท๐Ÿ‡ด ๐Ÿ‡ท๐Ÿ‡บ ๐Ÿ‡ท๐Ÿ‡ผ ๐Ÿ‡ฐ๐Ÿ‡ณ ๐Ÿ‡ฑ๐Ÿ‡จ ๐Ÿ‡ป๐Ÿ‡จ ๐Ÿ‡ผ๐Ÿ‡ธ ๐Ÿ‡ธ๐Ÿ‡ฒ ๐Ÿ‡ธ๐Ÿ‡น ๐Ÿ‡ธ๐Ÿ‡ฆ ๐Ÿ‡ธ๐Ÿ‡ณ ๐Ÿ‡ท๐Ÿ‡ธ ๐Ÿ‡ธ๐Ÿ‡จ ๐Ÿ‡ธ๐Ÿ‡ฑ ๐Ÿ‡ธ๐Ÿ‡ฌ ๐Ÿ‡ธ๐Ÿ‡ฐ ๐Ÿ‡ธ๐Ÿ‡ฎ ๐Ÿ‡ธ๐Ÿ‡ง ๐Ÿ‡ธ๐Ÿ‡ด ๐Ÿ‡ฟ๐Ÿ‡ฆ ๐Ÿ‡ธ๐Ÿ‡ธ ๐Ÿ‡ช๐Ÿ‡ธ ๐Ÿ‡ฑ๐Ÿ‡ฐ ๐Ÿ‡ธ๐Ÿ‡ฉ ๐Ÿ‡ธ๐Ÿ‡ท ๐Ÿ‡ธ๐Ÿ‡ช ๐Ÿ‡จ๐Ÿ‡ญ ๐Ÿ‡ธ๐Ÿ‡พ ๐Ÿ‡น๐Ÿ‡ฏ ๐Ÿ‡น๐Ÿ‡ญ ๐Ÿ‡น๐Ÿ‡ฑ ๐Ÿ‡น๐Ÿ‡ฌ ๐Ÿ‡น๐Ÿ‡ด ๐Ÿ‡น๐Ÿ‡น ๐Ÿ‡น๐Ÿ‡ณ ๐Ÿ‡น๐Ÿ‡ท ๐Ÿ‡น๐Ÿ‡ฒ ๐Ÿ‡น๐Ÿ‡ป ๐Ÿ‡บ๐Ÿ‡ฌ ๐Ÿ‡บ๐Ÿ‡ฆ ๐Ÿ‡ฆ๐Ÿ‡ช ๐Ÿ‡ฌ๐Ÿ‡ง ๐Ÿ‡น๐Ÿ‡ฟ ๐Ÿ‡บ๐Ÿ‡ธ ๐Ÿ‡บ๐Ÿ‡พ ๐Ÿ‡บ๐Ÿ‡ฟ ๐Ÿ‡ป๐Ÿ‡บ ๐Ÿ‡ป๐Ÿ‡ช ๐Ÿ‡ป๐Ÿ‡ณ ๐Ÿ‡พ๐Ÿ‡ช ๐Ÿ‡ฟ๐Ÿ‡ฒ ๐Ÿ‡ฟ๐Ÿ‡ผ
</p>
<p>
Noto Color Emoji abcdefghijklmnopqrstuvwxyz0123456789
</p>
</div>

Flags don't seem to work on Windows due to political reasons, see https://answers.microsoft.com/en-us/windows/forum/all/flag-emoji/85b163bc-786a-4918-9042-763ccf4b6c05?page=1
This thread seems to have found a workaround
Flag Emojis not rendering

Windows includes the Segoe UI Emoji font, but it does not support flags. To see flag emoji on Windows 10, you'll have to provide a custom emoji font that does support flags.
There's an ISO standard with two-letter codes for countries, like "JP" for Japan. In Unicode, the emoji flags are encoded as a pair of special characters that correspond to "A" to "Z", but that are different characters from A-Z. You can see the different sequences at https://unicode.org/emoji/charts/full-emoji-list.html#country-flag. For example, for the Japanese flag the sequence U+1F1EF U+1F1F5 is used. To encode those in a Web page, you can use character entities ๐Ÿ‡ฏ๐Ÿ‡ต: "๐Ÿ‡ฏ๐Ÿ‡ต". If the browser / host OS support display of emoji flags, that's what you'll see. If not, you'll probably see something that looks like "JP".

The problem is that the Windows' default emoji font, Segoe UI Emoji, has the 26 country flag letter codepoints the country flags are composed of, but has only letters representing them, so the flags will always be rendered as the Segoe UI Emoji letters unless an application explicitly declares that another Emoji Font is to be preferred.
Luckily, you can just replace the Windows Emoji font by taking another Emoji Font and changing its internal name to Segoe UI Emoji.
I did that for Google's Noto Emoji font, which you can download at https://github.com/perguto/Country-Flag-Emojis-for-Windows.

Beginners code: HTML Styling ID within ID not working

I have just started learning HTML and I am having problems with IDs/classes within IDs/classes.
So, to my knowledge, an ID is specified by a #. That would mean that if I wanted to style an ID within and ID, wouldn't that be:
#ID1 #ID2 {
...
}
Which would mean that the styling will only apply for ID2 that is inside ID1? Please correct me if I'm wrong. When I used the same principle within my (very simple beginner) code, it didn't work. Here is my code:
<!DOCTYPE html>
<html>
<head>
<title>1 May 2016</title>
<style>
#name {
color: blue;
font-family: Tahoma;
}
#parafont #1 {
font-family: Arial;
}
#parafont #2 {
font-family: Times;
}
#parafont #3 {
font-family: Courier;
}
parafont #4 {
font-family: Lucida Grande;
}
#parafont #5 {
font-family: Helvetica;
}
#test1 #6 {
color: blue;
}
</style>
</head>
<body>
<h3 id="name">Bob Bobbington</h3>
<p>1 2 3 4 5 6 7 8 9 10</p>
<p>When was this website created? Check the <b>title</b>.</p>
<h3>All animals are quite interesting...</h3>
<p id="parafont">
<span id="1">This is a test paragraph.</span>
<span id="2">Each sentence should have a different font.</span>
<span id="3">This paragraph is going to use some styling.</span>
<span id="4">Styling will change the font of each sentence.</span>
<span id="5">Let's see whether it works!</span>
</p>
<div id="test1">
<p id="6">Test</p>
</div>
</body>
</html>
All help is very much appreciated!

Change the id numbers 1 to something that starts with letters.
ID and NAME tokens must begin with a letter ([A-Za-z]) and may be
followed by any number of letters, digits ([0-9]), hyphens ("-"),
underscores ("_"), colons (":"), and periods (".").

IDs can not start with numbers first of all. Also since IDs are meant to be specific, using nesting to select an element is redundant. #id #id2 would be the same thing as just #id2 as long as the more specific #id #id2 was used

UIWebView : css ignored

I'm pretty new in objective C
I try to pass a NSString containing some html and css to my webview :
[_webView loadHTMLString:htmlString baseURL:nil];
The string :
#"<!DOCTYPE html PUBLIC \"-//W3C//DTD HTML 4.01//EN\">\n<html>\n <head>\n <style type=\"text/css\">\n
body {\n font-family: \"Gill sans\";\n font-size: 12pt;\n color: #808080;\n margin: 0px;\n }\n
a:link, a.visited, a:active {\n font-style: normal;\n color: #ffffff;\n text-decoration: underline;\n }\n
.accroche {\n font-size: 19pt;\n color: #ffffff;\n text-align : center;\n }\n
#title {\n \n text-transform : capitalize;\n }\n
</style>\n
</head>\n
<body>\n
<div id=\"title\">Informations Utiles</div>\n
<p><span class=\"accroche\"><p>blablahblablablah<br /> blabla<br />blabla <br /> </p></span></p>\n
</body>\n</html>\n"
Sorry about the formatting but i don't want to change it too much as it may hide things.
Problem is, on the screen in the simulator, css is just ignored, capitalize wont work, as well as text-align or font-size, anything...
Any idea?

I have tried this on a real device and it renders correctly. This is a simulator issue :(
I was using Xcode 4.3.2 and the simulator running iOS5.1.
I will raise this as a bug with Apple, but hopefully this answer will help somebody else in the future!
Hope it helps.

sendmailR: html and multilingual support

I use sendmailR (ver. 1.0-0) to create automated corporate mails. Inside the mail message I insert html code to produce tables. Finally, before sending, I convert the message to utf8 - since it contains multilingual characters, using
msg <- iconv(msg, to = "utf8")
After migrating to ver. 1.1-2 (in order to send mails with attachments), the contents of the mail cannot be read anymore. The text is unreadable and the html code is ignored. This is an example of the contents after upgrading:
รŽยณรŽยนรŽยฑ รโ€žรŽยฟ รŽยผรŽยฎรŽยฝรŽยฑ รŽโ€รŽยตรŽยบรŽยญรŽยผรŽยฒร รŽยนรŽยฟ (รŽยฑรŽยฝรŽยฌ รฦ’ร รŽยผรŽยฒรŽยฑรฦ’รŽยท รŽยบรŽยฑรŽยน รŽยฑรŽยธร รŽยฟรŽยนรฦ’รโ€žรŽยนรŽยบรŽยฌ), รŽยญรโ€กรŽยฟรโ€ฆรŽยฝ รโ€ฐรโ€š รŽยตรŽยพรŽยฎรโ€š.<br><br> <b>รŽโ€˜รŽยฝรŽยฌ รŽลกรŽยฑรโ€žรŽยทรŽยณรŽยฟร รŽยฏรŽยฑ รŽยบรŽยฑรŽยน รŽยฃร รŽยผรŽยฒรŽยฑรฦ’รŽยท</b><br>
<table style='border-collapse: collapse; border-color: rgb(136, 136, 136); border-width: 1px;' border='1' bordercolor='#888888' cellspacing='0'>
<tbody><tr>
<td style='text-align: center; width: 40px; height: 20px;'> รŽโ€˜.A.</td>
Do you suggest to continue using the initial version?
Thank you