JSFiddle - React, Tailwind, and code Playground

by jsmoi

HTML

<h1>Galileo Galilei widerruft vor der Inquisition am 22.
  Juni 1633 seine Lehre von der Bewegung der Erde</h1>
<pre>
  Und es war ein Junitag, der schnell verstrich  
  Und der war wichtig für dich und mich
  Aus Finsternis trat die Vernunft herfür 
  Ein' ganzen Tag stand sie vor der Tür.
</pre>
<h2>Im Palast des Florentinischen Gesandten in Rom</h2>
<code>Galileis Schüler warten auf Nachrichten. Der kleine Mönch und Federzoni spielen mit weiten Bewegungen das neü Schach. In einer Ecke kniet Virginia und betet den Englischen Gruss.
</code>
<h3>Der kleine Mönch</h3>
<p>Der Papst hat ihn nicht empfangen. Keine wissenschaftlichen Diskussionen mehr.</p>
<h3>Federzoni</h3>
<p> Er war seine letzte Hoffnung. Es war wahr, was er ihm damals vor Jahren in Rom sagte, als er noch der Kardinal Barberini war: wir brauchen dich. Jetzt haben sie ihn.</p>
<h3>Andrea</h3>
<p>Sie werden ihn umbringen. Die Discorsi werden nicht zu Ende geschrieben.</p>
<h3>Federzoni</h3>
<p>Meinst du?</p>
<h3>Andrea</h3>
<p>Da er niemals widerruft.</p>
<h3>Der kleine Mönch</h3>
<p>Man verbeisst sich immer in einen ganz nebensächlichen Gedanken, wenn man nachts wach liegt. Heute nacht zum Beispiel dachte ich immerfort: er hätte nie aus der Republik weggehen dürfen.</p>
<h3>Andrea</h3>
<p>Da konnte er sein Buch nicht schreiben.</p>
<h3>Federzoni</h3>
<p>Und in Florenz konnte er es nicht veröffentlichen.</p>

CSS

body {background-color: lightgrey;}
h1 {
  text-transform: uppercase;
  font-size: 120%;
}
pre {font-family: cursive; }
h2, code {
  font-family: Arial;
  font-size: 16px;
  font-weight: normal; 
  font-style: italic;
}
h3 {
  font-size: 12px;
  color: red;
}
p {
  font-size: 12px;
  color: blue;
}