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