juplo.de Git - website/blob - dist/thymeleaf/projects/typo.html

   1 <!DOCTYPE html>
   2 <html
   3     xmlns="http://www.w3.org/1999/xhtml"
   4     xmlns:layout="http://www.thymeleaf.org"
   5     layout:decorator="templates/layout"
   6     th:with="uri='/projects/typo.html'"
   7     >
   8   <head>
   9     <title>Typography</title>
  10     <link rel="stylesheet" type="text/css" href="../../css/base.min.css"/>
  11     <style type="text/css">
  12       @import '../../css/screen.min.css' screen;
  13       @import '../../css/print.min.css' print;
  14     </style>
  15     <script src="../../js/prettify.js" th:src="@{/js/prettify.js}"></script>
  16   </head>
  17   <body onload="prettyPrint()">
  18     <article layout:fragment="maincontent">
  19       <header><h1>Typography</h1></header>
  20       <p>
  21         Lorem ipsum dolor <a href="#da">sit amet</a>, consectetur adipisicing elit,
  22         sed do eiusmod <strong>tempor incididunt</strong> ut labore et dolore
  23         magna aliqua. Ut enim ad minim veniam, quis nostrud
  24         <a href="#dort">exercitation</a> ullamco laboris nisi ut aliquip
  25         <em>ex ea</em> commodo consequat. Duis aute irure dolor in reprehenderit
  26         in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
  27         <strong>Excepteur sint <em>occaecat</em> cupidatat non proident</strong>,
  28         sunt in culpa qui officia deserunt mollit anim id est laborum.
  29       </p>
  30       <h2>Ein Link <a href="#link">im Titel</a></h2>
  31       <p>Ein Link <a href="#link">im Text</a>.</p>
  32       <h2>Normal / Italic / Bold / Bold+Italic</h2>
  33       <ul>
  34         <li>normal</li>
  35         <li><em>italic</em></li>
  36         <li><strong>bold</strong></li>
  37         <li><strong><em>bold italic</em></strong></li>
  38       </ul>
  39       <p>
  40         ÄäÖöÜüß@€¢
  41         <strong>ÄäÖöÜüß@€¢</strong>
  42         <em>ÄäÖöÜüß@€¢</em>
  43         <strong><em>ÄäÖöÜüß@€¢</em></strong>
  44       </p>
  45       <h1>H1: Heading</h1>
  46       <h2>H2: Heading</h2>
  47       <h3>H3: Heading</h3>
  48       <h4>H4: Heading</h4>
  49       <h1>H1: Heading</h1>
  50       <p>
  51         Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
  52         eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
  53         ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
  54         aliquip ex ea commodo consequat. Duis aute irure dolor in
  55         reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
  56         pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
  57         culpa qui officia deserunt mollit anim id est laborum.
  58       </p>
  59       <h2>H2: Heading</h2>
  60       <p>
  61         Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
  62         eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
  63         ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
  64         aliquip ex ea commodo consequat. Duis aute irure dolor in
  65         reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
  66         pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
  67         culpa qui officia deserunt mollit anim id est laborum.
  68       </p>
  69       <h3>H3: Heading</h3>
  70       <p>
  71         Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
  72         eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
  73         ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
  74         aliquip ex ea commodo consequat. Duis aute irure dolor in
  75         reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
  76         pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
  77         culpa qui officia deserunt mollit anim id est laborum.
  78       </p>
  79       <h4>H4: Heading</h4>
  80       <p>
  81         Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
  82         eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
  83         ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
  84         aliquip ex ea commodo consequat. Duis aute irure dolor in
  85         reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
  86         pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
  87         culpa qui officia deserunt mollit anim id est laborum.
  88       </p>
  89       <h1>Preformatted code</h1>
  90       <p>
  91         <em>Juplo Branding</em> uses
  92         <a href="http://google-code-prettify.googlecode.com/svn/trunk/README.html" title="Visit prettify's README">google-code-prettify</a> for automatic
  93         syntax highlighting.
  94       </p>
  95       <pre class="prettyprint linenums"><code class="language-xml">&lt;plugin&gt;
  96   &lt;groupId&gt;ro.isdc.wro4j&lt;/groupId&gt;
  97   &lt;artifactId&gt;wro4j-maven-plugin&lt;/artifactId&gt;
  98   &lt;version&gt;${wro4j.version}&lt;/version&gt;
  99   &lt;configuration&gt;
 100     &lt;wroManagerFactory&gt;ro.isdc.wro.maven.plugin.manager.factory.ConfigurableWroManagerFactory&lt;/wroManagerFactory&gt;
 101     &lt;cssDestinationFolder&gt;${project.build.directory}/${project.build.finalName}/css/&lt;/cssDestinationFolder&gt;
 102   &lt;/configuration&gt;
 103   &lt;executions&gt;
 104     &lt;execution&gt;
 105       &lt;phase&gt;package&lt;/phase&gt;
 106       &lt;goals&gt;
 107         &lt;goal&gt;run&lt;/goal&gt;
 108       &lt;/goals&gt;
 109     &lt;/execution&gt;
 110   &lt;/executions&gt;
 111 &lt;/plugin&gt;
 112 </code></pre>
 113     </article>
 114   </body>
 115 </html>