-<!DOCTYPE html>
-
+<!DOCTYPE html >
<html>
<head>
- <title>#{get 'title' /}</title>
- <meta charset="${_response_encoding}">
- <link rel="stylesheet" media="screen" href="@{'/public/stylesheets/main.css'}">
- #{get 'moreStyles' /}
- <link rel="shortcut icon" type="image/png" href="@{'/public/images/favicon.png'}">
- <script src="@{'/public/javascripts/jquery-1.6.4.min.js'}" type="text/javascript" charset="${_response_encoding}"></script>
- #{get 'moreScripts' /}
+ <title>#{get 'title' /}</title>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+ <link rel="stylesheet" type="text/css" media="screen"
+ href="@{'/public/stylesheets/main.css'}" />
+ <link rel="shortcut icon" type="image/png"
+ href="@{'/public/images/favicon.png'}" />
</head>
<body>
- #{doLayout /}
+
+ <div id="header">
+ <div id="logo">
+ lootjes.
+ </div>
+ <ul id="tools">
+ <li>
+ <a href="#">Log in to write something</a>
+ </li>
+ </ul>
+ <div id="title">
+ <span class="about">About this blog</span>
+ <h1><a href="#">${blogTitle}</a></h1>
+ <h2>${blogBaseline}</h2>
+ </div>
+ </div>
+
+ <div id="main">
+ #{doLayout /}
+ </div>
+
+ <p id="footer">
+ Lootjes is .... built with the
+ <a href="http://www.playframework.org">Play framework</a>
+ as a tutorial application.
+ </p>
+
</body>
</html>
--- /dev/null
+*{ Display a party in one of these modes: 'full', 'home' or 'teaser' }*
+
+<div class="post ${_as == 'teaser' ? 'teaser' : ''}">
+ <h2 class="post-title">
+ <a href="#">${_party.description}</a>
+ </h2>
+
+ <div class="post-metadata">
+ <span class="post-author">
+ by ${_party.organiser.fullname}
+ </span>
+ <span class="post-date">
+ ${_party.date.format('dd MMM yy')}
+ </span>
+ <div class="post-comments">
+ ${_party.participants.size() ?: 'geen'}
+ deelnemer${_party.participants.size().pluralize()}
+ #{if _party.participants}
+ :
+ #{list items:_party.participants, as:'participant'}
+ <span class="participant-name">${participant.fullname}</span>
+ #{/list}
+ #{/if}
+ </div>
+ </div>
+ </div>
+
+/** Main layout **/
+
+html, body {
+ background: #364B66 !important;
+ font-family: Helvetica, Arial, Sans !important;
+}
+
+body {
+ width: 900px;
+ padding: 0 30px;
+ margin: auto;
+}
+
+/** Blog header **/
+
+#header {
+ padding: 10px 0;
+ position: relative;
+}
+
+#logo {
+ display: block;
+ height: 49px;
+ margin-left: 20px;
+ color: #fff;
+ font-size: 48px;
+ font-weight: bold;
+ letter-spacing: -4px;
+ text-shadow: 1px 2px 2px #000;
+}
+
+#logo span {
+ color: #f00;
+ font-size: 70%;
+}
+
+#tools {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ position: absolute;
+ right: 0;
+ top: 30px;
+ right: 20px;
+}
+
+#tools a {
+ color: #fff;
+ text-decoration: none;
+}
+
+#title {
+ background: #B8C569;
+ padding: 20px 30px 30px 20px;
+ margin: 20px 0;
+ color: #3C4313;
+ position: relative;
+ -webkit-border-radius: 16px;
+ -webkit-box-shadow: 0 2px 0 #93A045;
+ -moz-border-radius: 16px;
+}
+
+/** A little hacky to create arrows without images **/
+.about {
+ text-indent: -999em;
+ display: block;
+ width: 0;
+ height: 0;
+ border-left: 10px solid transparent;
+ border-right: 10px solid transparent;
+ border-bottom: 10px solid #BAC36E;
+ border-top: 0;
+ position: absolute;
+ top: -10px;
+ left: 60px;
+}
+
+#title h1 {
+ font-size: 64px;
+ margin: 0;
+}
+
+#title h1 a {
+ text-decoration: none;
+ color: inherit;
+}
+
+#title h2 {
+ font-size: 26px;
+ margin: 0;
+ font-weight: normal;
+}
+
+/** Main content **/
+
+#main {
+ background: #314660;
+ background: -webkit-gradient(linear, left top, left 30%, from(#314660), to(#364B66));
+ -webkit-border-radius: 16px;
+ -moz-border-radius: 16px;
+ padding: 20px;
+}
+
+/** Post **/
+
+.post .post-title {
+ margin: 0;
+}
+
+.post .post-title a {
+ font-size: 36px;
+ color: #F5C2CC;
+ text-decoration: none;
+}
+
+.post .post-metadata {
+ color: #BAC36E;
+ display: block;
+ font-size: 70%;
+ display: inline-block;
+}
+
+.post .post-author {
+ font-size: 130%;
+ font-weight: bold;
+}
+
+.post .post-metadata a {
+ color: #9FA85D;
+}
+
+.post .post-content {
+ position: relative;
+ background: #fff;
+ padding: 10px;
+ margin: 10px 0 50px 0;
+ -webkit-border-radius: 10px;
+ -moz-border-radius: 10px;
+ -webkit-box-shadow: 0 2px 0 #BBBBBB;
+}
+
+.post .about {
+ text-indent: -999em;
+ display: block;
+ width: 0;
+ height: 0;
+ border-left: 10px solid transparent;
+ border-right: 10px solid transparent;
+ border-bottom: 10px solid #fff;
+ border-top: 0;
+ position: absolute;
+ top: -6px;
+ left: 24px;
+}
+
+
+/** Older posts **/
+
+.older-posts h3 {
+ color: #869AB1;
+ font-size: 28px;
+ margin-bottom: 15px;
+}
+
+.older-posts h3 .from {
+ font-weight: normal;
+ font-size: 70%;
+}
+
+.older-posts .post {
+ margin-bottom: 15px;
+ border-left: 3px solid #869AB1;
+ padding-left: 10px;
+}
+
+.older-posts .post-title a {
+ padding: 0;
+ color: #131921;
+ font-size: 20px;
+}
+
+.older-posts .post-metadata {
+ color: #869AB1;
+ padding: 0;
+ font-size: 12px;
+}
+
+.older-posts .post-metadata a {
+ color: #869AB1;
+}
+
+/** Comments **/
+
+.comments {
+ margin-bottom: 30px;
+}
+
+h3 {
+ color: #869AB1;
+ font-size: 18px;
+ margin-bottom: 15px;
+}
+
+h3 span {
+ font-size: 80%;
+ font-weight: normal;
+}
+
+.comment {
+ width: 70%;
+ clear: both;
+}
+
+.comment .comment-metadata {
+ color: #869AB1;
+ display: block;
+ font-size: 50%;
+ display: block;
+ float: left;
+ width: 80px;
+ text-align: right;
+}
+
+.comment .comment-author {
+ font-size: 150%;
+ font-weight: bold;
+ display: block;
+}
+
+.comment .comment-content {
+ position: relative;
+ background: #E4EAFF;
+ color: #242C58;
+ font-size: 80%;
+ margin-top: 10px;
+ margin-bottom: 10px;
+ margin-left: 100px;
+ padding: 10px;
+ -webkit-border-radius: 10px;
+ -moz-border-radius: 10px;
+}
+
+.comment .about {
+ text-indent: -999em;
+ display: block;
+ width: 0;
+ height: 0;
+ border-top: 10px solid transparent;
+ border-bottom: 10px solid transparent;
+ border-right: 10px solid #E4EAFF;
+ border-left: 0;
+ position: absolute;
+ top: 4px;
+ left: -4px;
+}
+
+/** Form **/
+
+form {
+ padding: 10px;
+ background: #253142;
+ background: -webkit-gradient(linear, left top, left 60%, from(#253142), to(#364B66));
+ -webkit-border-radius: 10px;
+ -moz-border-radius: 10px;
+}
+
+form .error {
+ background: #c00;
+ color: #fff;
+ font-size: 90%;
+ padding: 3px 5px;
+ -webkit-border-radius: 6px;
+ -moz-border-radius: 6px;
+ -webkit-box-shadow: 0 2px 0 #800;
+}
+
+form p {
+ margin: 5px 0 0 0;
+}
+
+form textarea {
+ width: 70%;
+ height: 150px;
+}
+
+form input, form textarea {
+ font-size: 14px;
+}
+
+form label {
+ display: block;
+ font-weight: bold;
+ font-size: 90%;
+ color: #aaa;
+ margin-bottom: 3px;
+}
+
+#captcha{
+ display: block;
+ height: 50px;
+}
+
+.success {
+ background: #67AD10;
+ color: #fff;
+ padding: 10px;
+ -webkit-border-radius: 6px;
+ -moz-border-radius: 6px;
+ -webkit-box-shadow: 0 2px 0 #4E840B;
+}
+
+/** Pagination **/
+
+#pagination {
+ list-style: none;
+ padding: 0;
+ position: relative;
+ color: #869AB1;
+ font-size: 90%;
+ top: -20px;
+ margin-bottom: 30px;
+}
+
+#pagination a {
+ color: #869AB1;
+ font-size: 90%;
+}
+
+#pagination #previous {
+ position: absolute;
+ top: 0;
+ left: 0;
+}
+
+#pagination #previous:before {
+ content: '<< ';
+}
+
+#pagination #next {
+ position: absolute;
+ top: 0;
+ right: 0;
+}
+
+#pagination #next:after {
+ content: ' >>';
+}
+
+/** Footer **/
+
+#footer {
+ border-top: 1px solid #45597A;
+ font-size: 70%;
+ padding: 10px 30px;
+ text-align: center;
+ color: #869AB1;
+ margin-top: 30px;
+}
+
+#footer a {
+ color: #869AB1;
+ font-weight: bold;
+}
+
+/** Admin **/
+
+.tags-list .tag {
+ cursor: pointer;
+ color: red;
+}
+
+#adminMenu {
+ list-style: none;
+ padding: 0;
+ margin: 0 0 20px 0;
+}
+
+#adminMenu li {
+ display: inline;
+}
+
+#adminMenu li a {
+ color: #fff;
+ text-decoration: none;
+ font-size: 80%;
+ background: #591C64;
+ padding: 2px 10px;
+ -webkit-border-radius: 9px;
+ -moz-border-radius: 9px;
+}
+
+#adminMenu li.selected a {
+ background: #82A346;
+}
+
+#crudContent {
+ color: #8B98AD;
+}
+
+#crudContent h2 {
+ color: #EDC3CD !important;
+}
+
+#crudContent thead tr {
+ background: #512162 !important;
+}
+
+#crudContent table {
+ border: none !important;
+}
+
+#crudContent table td {
+ color: #444;
+}
+
+tr.odd {
+ background: #BECCE7 !important;
+}
+
+#crud #crudContent, #crudContent form, #crudListSearch, #crudListPagination, .crudButtons {
+ background: transparent;
+ border: none;
+ padding: 0;
+}
+
+#crudListTable {
+ margin: 10px 0;
+}
+
+.crudField, .objectForm {
+ border: none;
+ padding-left: 0;
+}
+
+.crudField label {
+ color: #B8FA5C;
+}
+
+.crudHelp {
+ color: #fff !important;
+}
+
+.crudField .tag {
+ color: #111;
+ font-size: 80%;
+}
+
+.crudButtons input {
+ font-size: 110%;
+}
+
+.crudButtons {
+ margin-top: 20px;
+ border-top: 1px dotted #8B98AD;
+ padding-top: 10px;
+}
+
+.crudFlash {
+ border: 0;
+ -webkit-border-radius: 8px;
+ font-size: 80%;
+ padding: 2px 10px;
+}
+
+.crudField .tag.selected {
+ -webkit-border-radius: 8px;
+ -moz-border-radius: 8px;
+}
+
+.crudField .error {
+ background: transparent;
+ border: none;
+ padding: 0;
+ color: pink;
+ -webkit-box-shadow: none;
+}
+
+/** Login **/
+
+#login form {
+ background: #8B98AD !important;
+ border: 0 !important;
+ -webkit-border-radius: 16px;
+ -moz-border-radius: 16px;
+}
+
+#login label, #password-field label, #username-field label {
+ color: #161D28 !important;
+ font-size: 110% !important;
+}
+
+
+#remember-field {
+ display: none;
+}
+
+/** My posts **/
+
+#admin .post {
+ background: #fff;
+ padding: 4px;
+ margin: 0;
+ font-size: 90%;
+}
+
+#admin .post.odd {
+ background: #C0CBE5;
+}
+
+#admin .post a {
+ color: #444;
+}
+
+#newPost {
+ border-top: 1px dotted #C0CBE5;
+ padding-top: 15px;
+}
+
+#newPost a {
+ background: #C88116;
+ -webkit-border-radius: 12px;
+ -moz-border-radius: 12px;
+ padding: 5px 10px;
+ font-size: 80%;
+ text-decoration: none;
+ color: #fff;
+ font-weight: bold;
+ -webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.3);
+}
+
+#newPost a span {
+ background: #7D510E;
+ -webkit-border-radius: 8px;
+ -moz-border-radius: 8px;
+ padding: 0 5px 2px 5px;
+ position: relative;
+ top: -1px;
+}
+
+#postContent {
+ width: 100%;
+ height: 300px;
+}
+
+.hasError {
+ background: pink;
+}
projects / lootjes-play / commitdiff