<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
</head>
<body text="#000000" bgcolor="#FFFFFF">
Hi Tomas,<br>
<br>
If it can help you, this is my remote implementation of chords : I
split chords and text in 2 lines, use a fixed font (Fira Mono), fill
chords line with the HTML and when necessary text with
'-'.<br>
<br>
Here is a example :<br>
<br>
<p style="vertical-align: middle; display: table-cell;
font-family: Fira Mono; padding: 15px; font-size:
22px;"> Do Lam7 Sol <br><span>Quand je sonde l'univ-ers,</span><br> Fa2 Sol <br><span>les astres que tu as créés,</span><br> Do Lam Sol <br><span>Les océans, les mers,</span><br> Fa2 Sol <br><span>tout me révèle ta majesté.</span></p><br>
<br>
Regards,<br>
MBernis.<br>
<br>
<div class="moz-cite-prefix">Le 27/12/2016 à 19:08, Tomas Groth a
écrit :<br>
</div>
<blockquote
cite="mid:CAP7wHnnyyAqt9pB1DG0S7Qt=J7q9YU4Ov-+KFpopRjX8Z75ddg@mail.gmail.com"
type="cite">
<div dir="ltr">Hi all,
<div><br>
</div>
<div>As some of you might know I have been working on chord
support for OpenLP, and most of it has been implemented and
will (hopefully) soon be merged into trunk. But there is still
one thing missing: Support for printing chords. The challenge
is that we have implemented chord supports using CSS, but the
component we use for printing only supports a limited subset
of CSS, and the things we need for chords to be rendered
correctly is not supported.</div>
<div>So I have tried to implement chords using tables, but my
HTML/CSS skills are not good enough to crack this nut, so I
hope some of you can help me!</div>
<div><br>
</div>
<div>Here is an example of chords using CSS, which works fine: <a
moz-do-not-send="true"
href="https://jsfiddle.net/rm3vg5m7/1/"><a class="moz-txt-link-freetext" href="https://jsfiddle.net/rm3vg5m7/1/">https://jsfiddle.net/rm3vg5m7/1/</a></a></div>
<div><br>
</div>
<div>And here is the same chords using tables, which needs some
work: <a moz-do-not-send="true"
href="https://jsfiddle.net/3mbuxquv/1/">https://jsfiddle.net/3mbuxquv/1/</a></div>
<div>Feel free to fork this last one and come up with a solution
where the line wraps correctly, the trick is that you must
only use the HTML element and CSS properties mentioned on this
page: <a moz-do-not-send="true"
href="https://doc.qt.io/qt-5/richtext-html-subset.html">https://doc.qt.io/qt-5/richtext-html-subset.html</a></div>
<div><br>
</div>
<div>Best regards,</div>
<div>Tomas</div>
<div><br>
</div>
<div><br>
</div>
</div>
<br>
<fieldset class="mimeAttachmentHeader"></fieldset>
<br>
<pre wrap="">_______________________________________________
openlp-dev mailing list
<a class="moz-txt-link-abbreviated" href="mailto:openlp-dev@openlp.io">openlp-dev@openlp.io</a>
<a class="moz-txt-link-freetext" href="https://lists.openlp.io/mailman/listinfo/openlp-dev">https://lists.openlp.io/mailman/listinfo/openlp-dev</a>
</pre>
</blockquote>
<br>
</body>
</html>