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