summaryrefslogtreecommitdiff
path: root/templates/headers
diff options
context:
space:
mode:
authorJannis M. Hoffmann <jannis.hoffmann@rwth-aachen.de>2022-05-03 18:22:43 +0200
committerJannis M. Hoffmann <jannis.hoffmann@rwth-aachen.de>2022-05-03 18:22:43 +0200
commita6e6f8be88a93699765f25aee0e6109a3eb0b307 (patch)
treec4ba131bdf3af616ff70072876d384924bf408ce /templates/headers
parentebe37a68d39dbc1cc4f6af1c05301d5a5fc29c13 (diff)
reworked templates based on purecss
Diffstat (limited to 'templates/headers')
-rw-r--r--templates/headers/_display_bot_nav.html.ep53
-rw-r--r--templates/headers/_display_folders.html.ep29
-rw-r--r--templates/headers/_display_headers.html.ep107
-rw-r--r--templates/headers/_display_top_nav.html.ep49
-rw-r--r--templates/headers/_displayfolders.html.ep32
-rw-r--r--templates/headers/_pagination1.html.ep7
-rw-r--r--templates/headers/_pagination2.html.ep22
7 files changed, 167 insertions, 132 deletions
diff --git a/templates/headers/_display_bot_nav.html.ep b/templates/headers/_display_bot_nav.html.ep
index ea1ce3c..9064d6e 100644
--- a/templates/headers/_display_bot_nav.html.ep
+++ b/templates/headers/_display_bot_nav.html.ep
@@ -1,33 +1,26 @@
-<table id=bot-nav width=100%>
-
- <colgroup>
- <col width=70% />
- <col width=10% />
- <col width=20% />
- </colgroup>
-
- <tr>
- <td>
- %= include '_pagination1';
- </td>
-
- <td>
- <label for=allbox><%= l 'check_all' %></label>:
- <input name=allbox type=checkbox onclick="check_all(this)">
- </td>
-
- <td>
- %= form_for move => (id => 'move-mail') => begin
- %= label_for 'select-folder' => l('move') . ' ' . l('to')
- %= select_field folder => [grep {$_ ne $folder} @$mail_folders] => (id => 'select-folder')
- %= csrf_field
- %= submit_button l 'move'
- % end
-
- </td>
- </tr>
-</table>
-
+<div class="pure-g jwm-nav">
+
+ <div class="pure-u-1-2 pure-u-md-1-4">
+ %= include 'headers/_pagination1'
+ </div>
+
+ <div class="pure-u-1-2 pure-u-md-1-4">
+ <label for=allbox><%= l 'check_all' %></label>
+ <input name=allbox type=checkbox onclick="check_all(this)">
+ </div>
+
+ <div class="pure-u-1-1 pure-u-md-1-2">
+ %= form_for move => (id => 'move-mail') => (class => 'pure-form') => begin
+ <fieldset>
+ %= label_for 'select-folder' => l('move') . ' ' . l('to')
+ %= select_field folder => [grep {$_ ne $folder} @$mail_folders] => (id => 'select-folder')
+ %= csrf_field
+ %= submit_button l('move') => (class => 'pure-button')
+ </fieldset>
+ % end
+ </div>
+
+</div>
<script type="text/javascript">
function check_all(box) {
diff --git a/templates/headers/_display_folders.html.ep b/templates/headers/_display_folders.html.ep
new file mode 100644
index 0000000..bf8a346
--- /dev/null
+++ b/templates/headers/_display_folders.html.ep
@@ -0,0 +1,29 @@
+<div id=display-folders class="pure-g jwm-nav">
+
+ <div class="pure-u-1-1 pure-u-md-1-2">
+ <nav class="pure-menu pure-menu-horizontal">
+
+ <strong class="pure-menu-heading">
+ %= l($folder) || $folder || 'Root'
+ </strong>
+
+ <ul class="pure-menu-list">
+% for my $v (grep {$_ ne $folder} @$mail_folders) {
+ <li class="pure-menu-item">
+ %= link_to '' => {folder => $v} => (class => 'bright') => begin
+ %= $v ? (l($v) || $v) : l 'Home'
+ % end
+ </li>
+% }
+ </ul>
+
+ </nav>
+ </div>
+
+ <p class="pure-u-1-1 pure-u-md-1-2">
+ <%= "$first_item - $last_item " . l('of') . " $total_items " . l('messages') %>\
+ <%= ", $total_new_mails " . l('new') if $total_new_mails > 0 =%>
+ <%= ' - ' . ucfirst(l 'mbox_size') . ": " . print_sizes10 $total_size if $total_size %>
+ </p>
+
+</div>
diff --git a/templates/headers/_display_headers.html.ep b/templates/headers/_display_headers.html.ep
index c278a37..f391259 100644
--- a/templates/headers/_display_headers.html.ep
+++ b/templates/headers/_display_headers.html.ep
@@ -1,42 +1,37 @@
% my $sort_param = begin
% my $param = shift;
- <th class=sort-param>
- %= link_to url_with->query(sort => $param eq (param('sort') || '') ? '!' . $param : $param) => begin
- % no warnings qw(experimental::smartmatch);
- %= do { given (param('sort')) { '↑' when ($param); '↓' when ('!' . $param) } }
- %= ucfirst l $param;
- % end
- </th>
+ %= link_to url_with->query(sort => $param eq (param('sort') || '') ? '!' . $param : $param) => begin
+ % no warnings qw(experimental::smartmatch);
+ %= do { given (param('sort')) { '↑' when ($param); '↓' when ('!' . $param) } }
+ %= ucfirst l $param;
+ % end
% end
-<table id=mail-headers>
-
- <colgroup>
- <col width=5% />
- <col width=10% />
- <col width=15% />
- <col width=25% />
- <col width=25% />
- <col width=10% />
- <col width=10% />
- </colgroup>
+<table id=mail-headers class="pure-table pure-table-horizontal">
<thead>
<tr id=sort>
- <th>
- %= ucfirst l 'nr'
+ <th class="hide-small">
+ No.
</th>
- %= $sort_param->('status');
+ <th>
+ <div class="pure-g">
- %= $sort_param->('date');
+ %# $sort_param->('status');
- % if ($folder ne "SENT") {
- %= $sort_param->('sender');
- % }
- % else {
+ <div class="pure-u-8-24 pure-u-md-4-24">
+ %= $sort_param->('date');
+ </div>
+
+% if ($folder ne "SENT") {
+ <div class="pure-u-16-24 pure-u-md-6-24">
+ %= $sort_param->('sender');
+ </div>
+% }
+% else {
<th class=sort-param>
%= link_to url_with->query(sort => param('sort') ne '!sender' ? 'sender' : '!sender' ) => begin
%= ucfirst l 'recipient'
@@ -48,44 +43,63 @@
% }
% end
</th>
- % }
+% }
+
+ <div class="pure-u-20-24 pure-u-md-12-24">
+ %= $sort_param->('subject');
+ </div>
- %= $sort_param->('subject');
+ <div class="pure-u-4-24 pure-u-md-2-24">
+ %= $sort_param->('size');
+ </div>
- %= $sort_param->('size');
+ </div>
+ </th>
<th>
- <!-- <img src="/chkb.gif"> -->
<input type=checkbox checked=1 disabled=1>
</th>
</tr>
</thead>
-
<tbody>
% foreach my $msgnum ($first_item .. $last_item) {
% my $msg = $msgs->[$msgnum - $first_item];
%= tag tr => (class => $msg->{new} ? 'new-mail' : '') => (id => $msg->{mid}) => begin
- <td>
+ <td class="hide-small">
%= $msgnum
</td>
+
<td>
- %= ucfirst($msg->{is_multipart} ? l('yes') : l('no'));
- </td>
- <td>
- % my $date = parse_iso_date $msg->{head}{date};
- %= join('/', $date->{mday}, $date->{month}, $date->{year}) . " $date->{hour}:$date->{min}";
- </td>
- <td>
- %= $msg->{head}{from}[0]{name} || $msg->{head}{from}[0]{email};
- </td>
- <td>
- %= link_to $msg->{head}{subject} || '_' => read => {id => $msg->{mid}}
- </td>
- <td>
- %= print_sizes10 $msg->{size};
+ <div class="pure-g">
+
+ <!--
+ <div class="pure-u-1-4">
+ %= ucfirst($msg->{is_multipart} ? l('yes') : l('no'));
+ </div>
+ -->
+
+ <div class="pure-u-8-24 pure-u-md-4-24">
+ % my $date = parse_iso_date $msg->{head}{date};
+ %= join('/', $date->{mday}, $date->{month}, $date->{year}) . " $date->{hour}:$date->{min}";
+ </div>
+
+ <div class="pure-u-16-24 pure-u-md-6-24">
+ %= $msg->{head}{from}[0]{name} || $msg->{head}{from}[0]{email};
+ </div>
+
+ <div class="pure-u-20-24 pure-u-md-12-24">
+ %= link_to $msg->{head}{subject} || '_' => read => {id => $msg->{mid}}
+ </div>
+
+ <div class="pure-u-4-24 pure-u-md-2-24">
+ %= print_sizes10 $msg->{size};
+ </div>
+
+ </div>
</td>
+
<td>
%= check_box mail => $msg->{mid} => (form => 'move-mail')
</td>
@@ -93,4 +107,5 @@
% }
</tbody>
+
</table>
diff --git a/templates/headers/_display_top_nav.html.ep b/templates/headers/_display_top_nav.html.ep
index 2b882af..6279f5f 100644
--- a/templates/headers/_display_top_nav.html.ep
+++ b/templates/headers/_display_top_nav.html.ep
@@ -1,34 +1,35 @@
-<table width=100%>
- <tr>
+<div class="pure-g">
- <td>
- <ul class=line>
- %# <a href="<%= url_with($prefsurl) %>"><%= TXT 'userconfig' %></a>
- %# <a href="<%=$prefsurl%>?action=editaddresses&folder=<%=$folder%>&sessionid=<%=$thissession%>&sort=<%=$sort%>&firstmessage=<%=$firstmessage+1%>&lang=<%=$lang%>" ><%= TXT 'addressbook' %></a>
- <li>
+ <div class="pure-u-1-2 pure-u-md-1-4">
+ <div class="pure-menu pure-menu-horizontal">
+ <ul class="pure-menu-list">
+ %# <a href="<%= url_with($prefsurl) %>"><%= TXT 'userconfig' %></a>
+ %# <a href="<%=$prefsurl%>?action=editaddresses&folder=<%=$folder%>&sessionid=<%=$thissession%>&sort=<%=$sort%>&firstmessage=<%=$firstmessage+1%>&lang=<%=$lang%>" ><%= TXT 'addressbook' %></a>
+ <li class="pure-menu-item">
%= link_to ucfirst(l 'logout') => 'logout'
</li>
- <li>
+ <li class="pure-menu-item">
%= link_to ucfirst(l 'compose') => 'write'
</li>
</ul>
- </td>
+ </div>
+ </div>
- <td>
- %= form_for '' => begin
- %= label_for search => ucfirst(l 'search') . ': '
- %= search_field search => (size => 8)
- % end
- </td>
+ <div class="pure-u-1-2 pure-u-md-1-4">
+ %= form_for '' => (class => 'pure-form') => begin
+ %= label_for search => ucfirst(l 'search')
+ %= search_field search => (size => 8)
+ % end
+ </div>
- <td id=pag2>
- %= include '_pagination2';
- </td>
+ <div class="pure-u-1-1 pure-u-md-1-2">
+ %= include 'headers/_pagination2';
+ </div>
- <td>
- <!-- delete button -->
- %# <form action="<%= url_for('delete_msg') %>" name=Formdel onsubmit="return confirm('<%= TXT q(js_confirm_delete) %>')" > </form>
- </td>
+ <!-- delete button
+ <td>
+ %# <form action="<%= url_for('delete_msg') %>" name=Formdel onsubmit="return confirm('<%= TXT q(js_confirm_delete) %>')" > </form>
+ </td>
+ -->
- </tr>
-</table>
+</div>
diff --git a/templates/headers/_displayfolders.html.ep b/templates/headers/_displayfolders.html.ep
deleted file mode 100644
index 7bc5b12..0000000
--- a/templates/headers/_displayfolders.html.ep
+++ /dev/null
@@ -1,32 +0,0 @@
-<table id=display-folders width=100%>
- <tr>
-
- <td id=folder-list class=alter-font>
- <strong class=up>
- %= l($folder) || $folder
- </strong>
-
- <ul class=line>
-% for my $v (grep {$_ ne $folder} @$mail_folders) {
- <li>
- %= link_to '' => {folder => $v} => (class => 'bright') => begin
- %= $v ? (l($v) || $v) : l 'Home'
- % end
- </li>
-% }
- </ul>
- </td>
-
- <td>
- <em class=msg-count>
- <%= "$first_item - $last_item " . l('of') . " $total_items " . l('messages') %>\
- <%= ", $total_new_mails " . l('new') if $total_new_mails > 0 =%>
-
-% if ($total_size) {
- - <%= ucfirst(l 'mbox_size') . ": " . print_sizes10 $total_size %>
-% }
- </em>
- </td>
-
- </tr>
-</table>
diff --git a/templates/headers/_pagination1.html.ep b/templates/headers/_pagination1.html.ep
new file mode 100644
index 0000000..010bdbd
--- /dev/null
+++ b/templates/headers/_pagination1.html.ep
@@ -0,0 +1,7 @@
+<div>
+ <a href="<%= url_with->query({start => $prev_page->[0]-1}) %>"><img src="/left.gif" alt="←"></a>
+ <a href="<%= url_with->query({start => $first_page->[0]-1}) %>"><img src="/first.gif" alt="↞"></a>
+ [<%= join(' ', ucfirst l('page'), $current_page, l('of'), $total_pages) %>]
+ <a href="<%= url_with->query({start => $last_page->[0]-1}) %>"><img src="/last.gif" alt="↠"></a>
+ <a href="<%= url_with->query({start => $next_page->[0]-1}) %>"><img src="/right.gif" alt="→"></a>
+</div>
diff --git a/templates/headers/_pagination2.html.ep b/templates/headers/_pagination2.html.ep
new file mode 100644
index 0000000..236e9bb
--- /dev/null
+++ b/templates/headers/_pagination2.html.ep
@@ -0,0 +1,22 @@
+<div>
+ %= form_for '' => (class => 'pure-form') => begin
+ <a href="<%= url_with->query({start => $first_page->[0]-1}) %>"><img src="/first.gif" alt="<%= l('first') . ' ' . l 'page' %>"></a>
+ <a href="<%= url_with->query({start => $prev_page->[0]-1}) %>"><img src="/left.gif" alt="<%= l('previous') . ' ' . l 'page' %>"></a>
+ [
+ %= label_for custompage => ucfirst l 'page'
+ %= number_field start => (id => 'custompage') => (size => 3) => (placeholder => $current_page)
+ %= l 'of'
+ %= $total_pages
+ ]
+
+% my $h = $c->req->query_params->to_hash;
+% while (my ($k, $v) = each %$h) {
+% if ($k ne 'start') {
+ %= hidden_field $k => $v
+% }
+% }
+
+ <a href="<%= url_with->query({start => $next_page->[0]-1}) %>"><img src="/right.gif" alt="<%= l('next') . ' ' . l 'page' %>"></a>
+ <a href="<%= url_with->query({start => $last_page->[0]-1}) %>"><img src="/last.gif" alt="<%= l('last') . ' ' . l('page') %>"></a>
+ % end
+</div>