Skip to content
This repository has been archived by the owner on Sep 5, 2019. It is now read-only.

Commit

Permalink
Improves the print styles with a focus on printing tickets.
Browse files Browse the repository at this point in the history 
Resolves #169
  • Loading branch information
Denis Krienbühl committed Mar 17, 2016
1 parent af060af commit aab6348
Show file tree
Hide file tree
Showing 6 changed files with 139 additions and 44 deletions.
3 changes: 3 additions & 0 deletions HISTORY.rst
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,9 @@
Changelog
---------

- Improves the print styles with a focus on printing tickets.
[href]

- Changes the look and feel of the formcode field to be more like other fields.
[href]

Expand Down
2 changes: 1 addition & 1 deletion onegov/town/templates/layout.pt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@

<div id="inner-body">
<div class="row header">
<div class="small-12 medium-8 columns">
<div class="small-12 medium-8 columns logo">
<a href="${layout.homepage_url}" tal:define="logo_url layout.town.logo_url|nothing" aria-label="Back to the homepage" i18n:attributes="aria-label">
<img tal:condition="logo_url" src="${layout.town.logo_url}" alt="Town Logo" title="${layout.town.name}" i18n:attributes="alt"/>
<div tal:condition="not:logo_url" metal:use-macro="layout.svg['default_logo']"></div>
Expand Down
35 changes: 21 additions & 14 deletions onegov/town/templates/macros.pt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -242,7 +242,7 @@
<tal:block define="fields fieldset.non_empty_fields" condition="fields">
<h2 tal:condition="fieldset.is_visible">${fieldset.label}</h2>
<div class="field-display" tal:repeat="field fields.values()">
<tal:block define="rendered layout.render_field(field)" condition="rendered">
<div class="field-display-block" tal:define="rendered layout.render_field(field)" tal:condition="rendered">
<div class="field-display-label">${field.label.text}</div>
<div class="field-display-data" tal:define="downloadable request.is_logged_in and field.type == 'UploadField'">
<tal:block condition="downloadable">
Expand All @@ -254,7 +254,8 @@
<tal:block replace="structure layout.render_field(field)" />
</tal:block>
</div>
</tal:block>
</div>
<div class="clearfix"></div>
</div>
</tal:block>
</div>
Expand Down Expand Up @@ -363,8 +364,10 @@
<metal:ticket_callout define-macro="ticket_callout" i18n:domain="onegov.town">
<div class="page-content-panel" tal:condition="ticket">
<div class="field-display ticket-status-page">
<div class="field-display-label" i18n:translate="">Ticket Number</div>
<div class="field-display-data ticket-number"><a href="${request.link(ticket)}">${ticket.number}</a></div>
<div class="field-display-block">
<div class="field-display-label" i18n:translate="">Ticket Number</div>
<div class="field-display-data ticket-number"><a href="${request.link(ticket)}">${ticket.number}</a></div>
</div>
</div>
</div>
</metal:ticket_callout>
Expand Down Expand Up @@ -403,20 +406,24 @@
<div tal:repeat="reservation reservations">
<tal:block define="start reservation.display_start(); end reservation.display_end()">
<div class="field-display">
<div class="field-display-label" i18n:translate>Date</div>
<div class="field-display-data">
${layout.format_date(start, 'date')}
<!-- simple whole day check: -->
<tal:block condition="start.time() != end.time()">
${layout.format_date(start, 'time')} -
${layout.format_date(end, 'time')}
</tal:block>
<div class="field-display-block">
<div class="field-display-label" i18n:translate>Date</div>
<div class="field-display-data">
${layout.format_date(start, 'date')}
<!-- simple whole day check: -->
<tal:block condition="start.time() != end.time()">
${layout.format_date(start, 'time')} -
${layout.format_date(end, 'time')}
</tal:block>
</div>
</div>
</div>

<div class="field-display">
<div class="field-display-label" i18n:translate>Quota</div>
<div class="field-display-data">${reservation.quota}</div>
<div class="field-display-block">
<div class="field-display-label" i18n:translate>Quota</div>
<div class="field-display-data">${reservation.quota}</div>
</div>
</div>
</tal:block>
</div>
Expand Down
28 changes: 16 additions & 12 deletions onegov/town/templates/reservation_confirmation.pt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,31 +14,35 @@
</div>

<div class="field-display">
<div class="field-display-label" i18n:translate>Date</div>
<div class="field-display-data">
${layout.format_date(reservation.display_start(), 'weekday_long')},
${layout.format_date(reservation.display_start(), 'date_long')}
<div class="field-display-block">
<div class="field-display-label" i18n:translate>Date</div>
<div class="field-display-data">
${layout.format_date(reservation.display_start(), 'weekday_long')},
${layout.format_date(reservation.display_start(), 'date_long')}
</div>
</div>

<tal:block condition="allocation.whole_day">
<div class="field-display-block" tal:condition="allocation.whole_day">
<div class="field-display-label" i18n:translate>Timespan</div>
<div class="field-display-data" i18n:translate>The whole day</div>
</tal:block>
</div>

<tal:block condition="not:allocation.whole_day">
<div class="field-display-block" tal:condition="not:allocation.whole_day">
<div class="field-display-label" i18n:translate>Timespan</div>
<div class="field-display-data">
${layout.format_date(reservation.display_start(), 'time')} - ${layout.format_date(reservation.display_end(), 'time')}
</div>
</tal:block>
</div>

<tal:block condition="(allocation.quota or 1) > 1 and allocation.quota_limit != 1">
<div class="field-display-block" tal:condition="(allocation.quota or 1) > 1 and allocation.quota_limit != 1">
<div class="field-display-label" i18n:translate>Quota</div>
<div class="field-display-data">${reservation.quota}</div>
</tal:block>
</div>

<div class="field-display-label" i18n:translate>E-Mail</div>
<div class="field-display-data">${reservation.email}</div>
<div class="field-display-block">
<div class="field-display-label" i18n:translate>E-Mail</div>
<div class="field-display-data">${reservation.email}</div>
</div>
</div>

<div metal:use-macro="layout.macros['display_form']" tal:condition="form"/>
Expand Down
42 changes: 26 additions & 16 deletions onegov/town/templates/ticket.pt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,39 +21,49 @@
<div class="columns small-12 medium-4">
<div class="page-content-panel">
<div class="field-display ticket-status-page">
<div class="field-display-label" i18n:translate>Ticket Number</div>
<div class="field-display-data ticket-number">
${ticket.number}
<div class="field-display-block">
<div class="field-display-label" i18n:translate>Ticket Number</div>
<div class="field-display-data ticket-number">
${ticket.number}
</div>
</div>

<div class="field-display-label" i18n:translate>State</div>
<div class="field-display-data ticket-state">
<tal:block metal:use-macro="layout.macros['ticket_status']" />
<div class="field-display-block">
<div class="field-display-label" i18n:translate>State</div>
<div class="field-display-data ticket-state">
<tal:block metal:use-macro="layout.macros['ticket_status']" />
</div>
</div>

<div class="field-display-label" i18n:translate>Group</div>
<div class="field-display-data ticket-group">
${ticket.group}
<div class="field-display-block">
<div class="field-display-label" i18n:translate>Group</div>
<div class="field-display-data ticket-group">
${ticket.group}
</div>
</div>

<tal:block condition="ticket.user_id">
<div tal:condition="ticket.user_id">
<div class="field-display-label" i18n:translate>Owner</div>
<div class="field-display-data ticket-owner">
<a href="mailto:${ticket.user.username}">${ticket.user.username}</a>
</div>
</tal:block>
</div>

<div class="field-display-label" i18n:translate>Created</div>
<div class="field-display-data ticket-date">
${layout.format_date(ticket.created, 'relative')}
<div class="field-display-block">
<div class="field-display-label" i18n:translate>Created</div>
<div class="field-display-data ticket-date">
${layout.format_date(ticket.created, 'relative')}
</div>
</div>

<tal:block define="submitter handler.email|ticket.snapshot.email|nothing" condition="submitter">
<div class="field-display-block" tal:define="submitter handler.email|ticket.snapshot.email|nothing" tal:condition="submitter">
<div class="field-display-label" i18n:translate>Submitter</div>
<div class="field-display-data ticket-submitter">
<a href="mailto:${submitter}">${submitter}</a>
</div>
</tal:block>
</div>

<div class="clearfix"></div>
</div>
</div>
</div>
Expand Down
73 changes: 72 additions & 1 deletion onegov/town/theme/styles/town.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -334,7 +334,7 @@ form {
&.read-only {
background-color: $input-disabled-bg;
color: $steel;
cursor: $input-disabled-cursor;
cursor: $input-disabled-cursor;
}
}

Expand Down Expand Up @@ -2169,6 +2169,77 @@ ul.search-results {
body {
font-size: 12px !important;
}

// tickets status panel
.page-content-panel {
margin-bottom: .5rem;

.field-display-block {
float: left;
margin-right: 1.5rem;
}
}

.field-display-block * {
background-color: transparent;
color: $body-font-color;
font-size: 12px;
margin: 0 !important;
padding: 0;
}

.ticket-summary {
* {
font-size: 12px;
}

ul {
margin-bottom: 0;
}
}

h1 {
font-size: 1.6rem;
}

h2 {
@include hairline;
font-size: 1.2rem;
margin-bottom: .25rem;
}

h3 {
font-size: 1.1rem;
margin-bottom: .15rem;
}

h4,
h5,
h6 {
font-size: 1rem;
}

.header {
max-height: 50px;
}

.logo {
max-height: 40px;

img,
svg {
max-height: 45px;
width: auto;
}
}

ul.breadcrumbs {
padding: 0 0 .25rem 1rem;

* {
font-size: 9px;
}
}
}

/*
Expand Down

0 comments on commit aab6348

Please sign in to comment.