0b77b6113d1c4c2aaacdb7cd7a1a9f5ba15286dc
[website] / dist / thymeleaf / templates / layout.html
1 <!DOCTYPE html>
2 <html
3     xmlns="http://www.w3.org/1999/xhtml"
4     xmlns:th="http://www.thymeleaf.org"
5     xmlns:layout="http://www.thymeleaf.org"
6     thymeproxy:variables="SET:/thymeleaf/sitemap.json"
7     >
8   <head th:fragment="head" layout:fragment="head">
9     <title layout:title-pattern="$DECORATOR_TITLE - $CONTENT_TITLE" th:text="'juplo'">juplo - BASISTEMPLATE</title>
10     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
11     <meta name="viewport" content="width=device-width, initial-scale=1" />
12     <link rel="stylesheet" th:rel="stylesheet" type="text/css" href="../../less/base.less" th:href="@{/css/base.min.css}"/>
13     <link rel="stylesheet" type="text/css" href="../../less/screen.less" media="screen" th:remove="all"/>
14     <link rel="stylesheet" type="text/css" href="../../less/print.less" media="print" th:remove="all"/>
15     <style type="text/css" th:inline="text">
16       @import '[[@{/css/screen.min.css}]]' screen;
17       @import '[[@{/css/print.min.css}]]' print;
18     </style>
19     <script src="../../js/prettify.js" th:src="@{/js/prettify.js}"></script>
20     <!--[if lt IE 9]>
21       <script src="../../js/html5shiv.js" th:src="@{/js/html5shiv.js}"></script>
22     <![endif]-->
23     <!--[if IE 8]>
24       <link rel="stylesheet" th:rel="stylesheet" type="text/css" href="../../less/ie8.css" th:href="@{/css/ie8.min.css}"/>
25     <![endif]-->
26     <script src="../../js/less-1.7.0.min.js" th:remove="all"></script>
27   </head>
28   <body
29       th:with="page=${pages.get(uri)},crumbs=${page['crumbs']}"
30       id="top"
31       class="menu"
32       th:class="${contentclass}?:'menu'"
33       onload="prettyPrint()"
34       >
35     <div id="page" class="cf">
36       <header id="header">
37         <h1 id="logo" layout:fragment="header"><a href="../index.html" th:href="@{/}" title="Home" class="l"><img src="/img/logo.svg" alt="juplo"/></a></h1>
38         <span id="slogan"><strong>Java</strong> bits from nerds for nerds</span>
39         <hr class="h" />
40       </header>
41       <div id="breadcrumb">
42         <strong class="b title">You are here:</strong>
43         <ol class="b" layout:fragment="breadcrumb">
44           <li class="b"><a class="b" href="../index.html" th:href="@{/index.html}">Home</a></li>
45           <li class="b" th:each="crumb: ${crumbs}">
46             <a class="b" href="../projects.html" th:href="@{${crumb.uri}}" th:text="${crumb.name}">Projects</a>
47           </li>
48           <!--/*-->
49           <li class="b"><strong class="b" th:text="${title}">Fix SWF</strong></li>
50           <!--*/-->
51         </ol>
52         <a class="hide" href="#nav" title="Show navigation menu">Jump to navigation</a>
53         <hr class="b" />
54       </div>
55       <main class="content cf">
56         <article id="content" class="main" layout:fragment="maincontent" th:class="'main'">
57           <header><h1 th:text="${title}">juplo - BASISTEMPLATE</h1></header>
58           <div th:fragment="maincontent">
59             <p>
60               <strong>Lorem ipsum</strong> dolor
61               <a href="../projects/typo.html" th:href="@{/projects/typo.html}">sit amet</a>,
62               consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
63               labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
64               <a href="#" th:href="@{/projects/html-experimente.html}">exercitation</a>
65               ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
66               irure dolor in reprehenderit in voluptate velit esse cillum dolore
67               eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
68               proident, sunt in culpa qui officia deserunt mollit anim id est
69               laborum.
70             </p>
71             <h2>Duis aute irure dolor</h2>
72             <ul>
73               <li>Operators and other mathematical stuff: -+/*</li>
74               <li>
75                 Characters offten used in programming languages:
76                 {(&lt;&gt;)}@$?%*#;:&amp;/\!^&#034;&#039;`~
77               </li>
78               <li>Special german characters: ÄäÖöÜü</li>
79               <li>Other special characters: @?¢§%°</li>
80             </ul>
81             <h2>Excepteur sint occaecat cupidatat</h2>
82             <p>
83               Lorem ipsum dolor <em>sit amet</em>, consectetur adipisicing elit,
84               sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
85               Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
86               nisi ut 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             <p>
92               Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
93               eiusmod tempor incididunt ut labore et dolore magna aliqua.
94               <strong>Ut enim ad minim veniam, quis nostrud <em>exercitation
95               ullamco</em> laboris nisi ut aliquip ex ea commodo consequat</strong>.
96               Duis aute irure dolor in reprehenderit in voluptate velit esse
97               cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
98               cupidatat non proident, sunt in culpa qui officia deserunt mollit
99               anim id est laborum.
100             </p>
101           </div>
102         </article>
103         <div class="marginal">
104           <nav id="nav"
105               layout:fragment="navigation"
106               th:with="section=${crumbs != null ? crumbs[0] : null}"
107               >
108             <hr class="n"/>
109             <a class="hide" href="#top" title="Show Content">Jump back to the top of the page</a>
110             <h1 class="nav">Navigation</h1>
111             <h2 class="nav menu">Section-Menu</h2>
112             <ul id="menu" class="cf">
113               <li class="m blog" th:each="entry : ${sections}" th:class="'m ' + ${entry.key}">
114                 <a href="../blog.html" th:href="@{${entry.value}}" class="m" th:class="${entry.value == section.uri} ? 'm selected' : 'm'" th:text="${pages.get(entry.value).name}">Blog</a>
115               </li>
116               <!--/*-->
117               <li class="m projects"><a href="../projects.html" class="m selected">Projects</a></li>
118               <li class="m about"><a href="../about.html" class="m">About</a></li>
119               <!--*/-->
120             </ul>
121             <h2 class="nav submenu">
122               <span class="s">Submenu for section</span>
123               <a class="s selected" href="../projects.html" th:href="@{${section.uri}}" th:text="${section.name}">Projects</a>
124             </h2>
125             <ul layout:fragment="submenu"
126                 th:with="
127                   submenu=${pages[section.uri]['childs']},
128                   parent=${crumbs[0].uri},
129                   pos=1"
130                 id="submenu"
131                 class="s"
132                 >
133               <li th:fragment="submenu(submenu, parent, pos)"
134                   th:each="entry : ${submenu}"
135                   th:with="
136                       child=${pos == crumbs.size()},
137                       selected=${!child and crumbs.get(pos).uri == entry.key},
138                       sibling=${pos + 1 == crumbs.size() and (page['childs'] == null or uri == parent)},
139                       childs=${entry.key == parent ? null : pages[entry.key]['childs']}
140                       "
141                   class="s sub"
142                   th:class="'s' + (${childs} ? ' sub' : '') + (${selected or sibling or child} ? '' : ' off')"
143                   >
144                 <a  href="../projects/fix-swf.html"
145                     th:href="@{${entry.key}}"
146                     class="s selected"
147                     th:class="${selected} ? 's selected' : 's'"
148                     th:text="${entry.value}"
149                     >fix-swf</a>
150                 <ul th:if="${selected and childs != null}"
151                     class="s active"
152                     th:class="${selected && pos == crumbs.size()-1} ? 's active' : 's'"
153                     >
154                   <li th:replace="templates/layout :: submenu(submenu=${childs}, parent=${entry.key}, pos=${pos + 1})"
155                       class="s"
156                       >
157                     <strong class="s">Overview</strong>
158                   </li>
159                   <!--/*-->
160                   <li class="s"><a href="../projects/fix-swf/getting-started.html" class="s">Getting Started</a></li>
161                   <li class="s"><a href="#" class="s">FAQ</a></li>
162                   <li class="s"><a href="#" class="s">Documentation</a></li>
163                   <!--*/-->
164                 </ul>
165               </li>
166               <!--/*-->
167               <li class="s sub off"><a href="#" class="s">hibernate4-maven-plugin</a></li>
168               <li class="s off"><a href="#" class="s">jquery.openx</a></li>
169               <li class="s sub off"><a href="../projects/html-experimente.html" th:href="@{/projects/html-experimente.html}" class="s">HTML-Experimente</a></li>
170               <li class="s sub off"><a href="#" class="s">accelerator</a></li>
171               <li class="s off"><a href="../projects/typo.html" th:href="@{/projects/typo.html}" class="s">Typography</a></li>
172               <!--*/-->
173             </ul>
174             <hr class="n"/>
175           </nav>
176           <aside class="m" layout:fragment="marginalcontent" th:remove="tag">
177           <!--/* the following  is only visible during natural templating -->
178             <h1>Other nasty but marginal stuff</h1>
179             <p>
180               Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
181               eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
182               ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
183               aliquip ex ea commodo consequat. Duis aute irure dolor in
184               reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla
185               pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
186               culpa qui officia deserunt mollit anim id est laborum.
187             </p>
188           </aside>
189           <aside class="m">
190             <h1>More nasty stuff</h1>
191             <p>
192               This one is really short!
193             </p>
194           <!--*/-->
195           </aside>
196         </div>
197       </main>
198       <footer id="footer">
199         <hr class="f" />
200         <ul id="footerlinks" layout:fragment="footer">
201           <li class="f" id="copyright">© <strong>mo</strong> 2013</li>
202           <li class="f"><a class="f" href="../impressum.html" th:href="@{/impressum.html}">Impressum</a></li>
203           <li class="f about"><a class="f" href="../about.html" th:href="@{/about.html}">About</a></li>
204         </ul>
205       </footer>
206     </div>
207   </body>
208 </html>