juplo.de Git - website/blob - dist/potemkin/typo.html

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