summaryrefslogtreecommitdiff
path: root/templates/displayheaders
diff options
context:
space:
mode:
Diffstat (limited to 'templates/displayheaders')
-rw-r--r--templates/displayheaders/_bot_nav.html.ep53
-rw-r--r--templates/displayheaders/_folders.html.ep49
-rw-r--r--templates/displayheaders/_main_table.html.ep115
-rw-r--r--templates/displayheaders/_pagination1.html.ep12
-rw-r--r--templates/displayheaders/_pagination3.html.ep10
-rw-r--r--templates/displayheaders/_top_nav.html.ep71
6 files changed, 142 insertions, 168 deletions
diff --git a/templates/displayheaders/_bot_nav.html.ep b/templates/displayheaders/_bot_nav.html.ep
index 454941b..a6d089c 100644
--- a/templates/displayheaders/_bot_nav.html.ep
+++ b/templates/displayheaders/_bot_nav.html.ep
@@ -1,36 +1,39 @@
-<div class="pure-g jwm-nav">
+<div class="columns">
- <div class="pure-u-3-4">
- <div class="pure-u-1 pure-u-md-1-2">
+ <div class="column">
%= include 'displayheaders/_pagination1'
- </div><div class="pure-u-1 pure-u-md-1-2">
+ </div>
+
+ <div class="column">
% if (grep {$_ ne $folder} @$mail_folders) {
- %= form_for move => (id => 'move-mail') => (class => 'pure-form') => begin
- <fieldset>
- %= label_for 'select-folder' => l('move to')
- %= select_field folder => [map { $_ ? $_ : l 'Home' } grep {$_ ne $folder} @$mail_folders] => (id => 'select-folder')
- %= csrf_field
- %= submit_button l('move') => (class => 'pure-button')
- </fieldset>
+ %= form_for move => (id => 'move-mail') => begin
+
+ <div class="field is-horizontal">
+ <div class=field-label>
+ %= label_for 'select-folder' => l('move to') => (class => 'label')
+ </div>
+ <div class=field-body>
+ <div class="field is-grouped">
+ <div class=control>
+ <div class='select'>
+ %= select_field folder => [map { $_ ? $_ : l 'Home' } grep {$_ ne $folder} @$mail_folders]
+ </div>
+ </div>
+ %= csrf_field
+ <div class=control>
+ %= submit_button l('move') => (class => 'button')
+ </div>
+ </div>
+ </div>
+ </div>
+
% end
% }
</div>
- </div>
- <div class="pure-u-1-4">
+ <div class="column has-text-right">
<label for=allbox><%= l 'check all' %></label>
- <input name=allbox type=checkbox onclick="check_all(this)">
+ <input name=allbox type=checkbox id=check-all>
</div>
</div>
-
-<script type="text/javascript">
-function check_all(box) {
- const setTo = box.checked;
- const mails = document.getElementById('mail-headers').tBodies[0].rows;
-
- for (const m of mails) {
- m.lastElementChild.children[0].checked = setTo;
- }
-}
-</script>
diff --git a/templates/displayheaders/_folders.html.ep b/templates/displayheaders/_folders.html.ep
index b341768..457a838 100644
--- a/templates/displayheaders/_folders.html.ep
+++ b/templates/displayheaders/_folders.html.ep
@@ -1,29 +1,44 @@
-<div id=display-folders class="pure-g jwm-nav">
+<div class="columns">
- <div class="pure-u-1-1 pure-u-md-1-2">
- <nav class="pure-menu pure-menu-horizontal">
+ <div class="column">
+ <nav class="navbar">
- <strong class="pure-menu-heading">
- %= l($folder || '_mailbox_root')
- </strong>
+ <div class="navbar-brand">
+ <span class=navbar-item>
+ <%= l($folder || '_mailbox_root') %>
+ </span>
+ <a role="button" class="navbar-burger" data-target="navMenu" id=navbar-toggle>
+ <span aria-hidden="true"></span>
+ <span aria-hidden="true"></span>
+ <span aria-hidden="true"></span>
+ </a>
+ </div>
- <ul class="pure-menu-list">
+ <div class="navbar-menu" id="navMenu">
+ <div class=navbar-start>
% for (grep {$_ ne $folder} @$mail_folders) {
- <li class="pure-menu-item">
- %= link_to '' => {folder => $_} => (class => 'bright') => begin
+ %= link_to '' => {folder => $_} => (class => 'navbar-item') => begin
%= l($_ || '_mailbox_root')
% end
- </li>
% }
- </ul>
-
+ </div>
+ </div>
</nav>
</div>
- <p class="pure-u-1-1 pure-u-md-1-2">
- <%= l('[_1] of [_2] messages', $pgn->{this_page}[1] - $pgn->{this_page}[0], $pgn->{total_items}) %>\
- <%= l(', [_1] new', $total_new_mails) if $total_new_mails > 0 =%>
- <%= l(' - mailbox size: [_1]', $v->print_sizes10($total_size)) if $total_size %>
- </p>
+ <div class="column">
+ <div class="columns is-multiline is-mobile">
+ <span class="column is-half-mobile has-text-centered"><%= l('[_1] of [_2] messages', $pgn->{this_page}[1] - $pgn->{this_page}[0], $pgn->{total_items}) %>
+ </span>
+ <span class="column is-half-mobile has-text-centered"><%= l('[_1] new', $total_new_mails) if $total_new_mails > 0 =%>
+ </span>
+ <span class="column has-text-centered">
+ % if ($total_size) {
+ %= l('mailbox size: ')
+ %= $v->print_sizes10($total_size)
+ % }
+ </span>
+ </div>
+ </div>
</div>
diff --git a/templates/displayheaders/_main_table.html.ep b/templates/displayheaders/_main_table.html.ep
index 06bbbfc..e06e925 100644
--- a/templates/displayheaders/_main_table.html.ep
+++ b/templates/displayheaders/_main_table.html.ep
@@ -9,104 +9,43 @@
% end
-<table id=mail-headers class="pure-table pure-table-horizontal">
+<section class="box">
- <thead>
- <tr id=sort>
- <th class="hide-small">
- #
- </th>
-
- <th>
- <div class="pure-g">
-
- %# $sort_param->('status');
-
- <div class="pure-u-1 pure-u-md-4-24">
- %= $sort_param->('date');
- </div>
-
-% if ($folder ne "SENT") {
- <div class="pure-u-1 pure-u-md-8-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'
- % if (param('sort') eq "sender") {
- %= image '/down.gif' => (width => 12) => (height => 12) => (border => 0) => (alt => 'v')
- % }
- % elsif (param('sort') eq "recipient_rev") {
- %= image '/up.gif' => (width => 12) => (height => 12) => (border => 0) => (alt => '^')
- % }
- % end
- </th>
-% }
-
- <div class="pure-u-1 pure-u-md-12-24">
- %= $sort_param->('subject');
- </div>
-
- </div>
- </th>
-
- <th class="hide-small">
- %= $sort_param->('size');
- </th>
-
- <th>
- <input type=checkbox checked=1 disabled=1>
- </th>
- </tr>
- </thead>
-
- <tbody>
% foreach my $msgnum ($pgn->{first_item} .. $pgn->{last_item}) {
% my $msg = $msgs->[$msgnum - $pgn->{first_item}];
- %= tag tr => (class => $msg->{unread} ? 'new-mail' : '') => (id => $msg->{message_handle}) => begin
- <td class="hide-small" style="text-align: right">
+ %= tag div => (class => $msg->{unread} ? 'media jwm-new-mail' : 'media') => (id => $msg->{message_handle}) => begin
+ <div class="media-left is-hidden-mobile">
%= $msgnum + 1
- </td>
-
- <td>
- <div class="pure-g">
-
- <!--
- <div class="pure-u-1-4">
- %# ucfirst($msg->{head}{mime}{content_maintype} eq 'multipart' ? l('yes') : l('no'));
- </div>
- -->
-
- <div class="pure-u-1 pure-u-md-4-24">
- % my $date = $v->parse_iso_date($msg->{head}{date});
- %= join('/', $date->{mday}, $date->{month}, $date->{year}) . " $date->{hour}:$date->{min}";
- </div>
-
- <div class="pure-u-1 pure-u-md-8-24">
- <%= $msg->{head}{sender}[0]{display_name} || $msg->{head}{sender}[0]{address} ||
- $msg->{head}{from}[0]{display_name} || $msg->{head}{from}[0]{address}; %>
- </div>
+ </div>
- <div class="pure-u-1 pure-u-md-12-24">
- %= link_to $msg->{head}{subject} || '_' => read => {id => $msg->{message_handle}}
+ <div class="media-content">
+ <div class=" columns is-gapless is-multiline">
+ <div class="column is-10">
+ <%= $msg->{head}{sender}[0]{display_name} || $msg->{head}{sender}[0]{address} ||
+ $msg->{head}{from}[0]{display_name} || $msg->{head}{from}[0]{address}; %>
+ </div>
+
+ <div class="column is-2">
+ % my $date = $v->parse_iso_date($msg->{head}{date});
+ %= join('/', $date->{mday}, $date->{month}, $date->{year}) . " $date->{hour}:$date->{min}";
+ </div>
+
+ <div class="column is-10">
+ %= link_to $msg->{head}{subject} || '_' => read => {id => $msg->{message_handle}}
+ </div>
+
+ <div class="column is-2">
+ %= $v->print_sizes10($msg->{byte_size});
+ </div>
</div>
-
</div>
- </td>
-
- <td class="hide-small" style="text-align: right; white-space: nowrap">
- %= $v->print_sizes10($msg->{byte_size});
- </td>
- <td>
- %= check_box mail => $msg->{message_handle} => (form => 'move-mail')
- </td>
+ <div class=media-right>
+ %= check_box mail => $msg->{message_handle} => (form => 'move-mail') => (class => 'jwm-mail-checkbox')
+ </div>
% end
% }
- </tbody>
-</table>
+</section>
diff --git a/templates/displayheaders/_pagination1.html.ep b/templates/displayheaders/_pagination1.html.ep
index a32afe1..6a22ba5 100644
--- a/templates/displayheaders/_pagination1.html.ep
+++ b/templates/displayheaders/_pagination1.html.ep
@@ -1,14 +1,14 @@
<nav>
- <ul class="pagination-box">
+ <ul class="pagination-list">
<li>
- %= $c->_paginate->make_link('←', 'prev_page')
+ %= $c->_paginate->make_link('←', 'prev_page', class => 'pagination-link', class_disabled => 'is-disabled')
<li>
- %= $c->_paginate->make_link('↞', 'first_page')
+ %= $c->_paginate->make_link('↞', 'first_page', class => 'pagination-link', class_disabled => 'is-disabled')
<li>
- <span><%= l('page [_1] of [_2]', $pgn->{current_page}+1, $pgn->{total_pages}) %></span>
+ <span class="pagination-link is-current"><%= l('page [_1] of [_2]', $pgn->{current_page}+1, $pgn->{total_pages}) %></span>
<li>
- %= $c->_paginate->make_link('↠', 'last_page')
+ %= $c->_paginate->make_link('↠', 'last_page', class => 'pagination-link', class_disabled => 'is-disabled')
<li>
- %= $c->_paginate->make_link('→', 'next_page')
+ %= $c->_paginate->make_link('→', 'next_page', class => 'pagination-link', class_disabled => 'is-disabled')
</ul>
</nav>
diff --git a/templates/displayheaders/_pagination3.html.ep b/templates/displayheaders/_pagination3.html.ep
index fe573ce..846a285 100644
--- a/templates/displayheaders/_pagination3.html.ep
+++ b/templates/displayheaders/_pagination3.html.ep
@@ -1,6 +1,6 @@
% my $make_link_num = begin
% my ($txt, $to) = @_;
-%= link_to $txt => url_with->query({start => $to}) => (class => (param('start')//0) == $to ? 'current' : '')
+%= link_to $txt => url_with->query({start => $to}) => (class => (param('start')//0) == $to ? 'pagination-link is-current' : 'pagination-link')
% end
% my $nbh = begin
@@ -15,13 +15,13 @@
% }
% end
-<nav>
- <ul class="pagination-box">
+<nav class="pagination is-centered">
+ <ul class="pagination-list">
<li>
- %= $c->_paginate->make_link('Prev' => 'prev_page')
+ %= $c->_paginate->make_link('Prev' => 'prev_page', class => 'pagination-link', class_disabled => 'is-disabled')
</li>
%= $nbh->()
<li>
- %= $c->_paginate->make_link('Next' => 'next_page')
+ %= $c->_paginate->make_link('Next' => 'next_page', class => 'pagination-link', class_disabled => 'is-disabled')
</ul>
</nav>
diff --git a/templates/displayheaders/_top_nav.html.ep b/templates/displayheaders/_top_nav.html.ep
index f4c66d2..e5eaab8 100644
--- a/templates/displayheaders/_top_nav.html.ep
+++ b/templates/displayheaders/_top_nav.html.ep
@@ -1,35 +1,52 @@
-<div class="pure-g">
+<div class="columns">
- <div class="pure-u-1 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 class="pure-menu-item">
- %= link_to ucfirst(l 'compose') => 'write'
- </li>
- </ul>
+ <nav class="column">
+ %# <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>
+ %= link_to ucfirst(l 'logout') => 'logout' => (class => 'button')
+ %= link_to ucfirst(l 'compose') => 'write' => (class => 'button')
+ </nav>
+
+ %# <td> <form action="<%= url_for('delete_msg') %>" name=Formdel onsubmit="return confirm('<%= TXT q(js_confirm_delete) %>')" > </form> </td>
+
+ %= form_for '' => (class => 'column') => begin
+ <div class="field is-horizontal">
+ <div class=field-label>
+ %= label_for search => ucfirst(l 'search') => (class => 'label')
+ </div>
+ <div class=field-body>
+ <div class=field>
+ <div class="control">
+ %= search_field search => (size => 8) => (class => 'input')
+ </div>
+ </div>
+ </div>
</div>
- </div>
+ % end
- <div class="pure-u-1 pure-u-md-1-4">
- %= form_for '' => (class => 'pure-form') => begin
- %= label_for search => ucfirst(l 'search')
- %= search_field search => (size => 8)
- % end
- </div>
+ %= form_for '' => (class => 'column') => begin
+ <div class="field is-horizontal">
+ <div class=field-label>
+ %= label_for sort => ucfirst(l 'sort') => (class => 'label')
+ </div>
+ <div class=field-body>
+ <div class=field>
+ <div class="select" id=sort-select>
+ <select name=sort id=sort>
+ <option value="!date">Date - Descending</option>
+ <option value="date" >Date - Ascending</option>
+ <option value="!size">Size - Descending</option>
+ <option value="!sender">Sender - Descending</option>
+ <option value="sender" >Sender - Ascending</option>
+ </select>
+ </div>
+ </div>
+ </div>
+ </div>
+ % end
- <div class="pure-u-1-1 pure-u-md-1-2">
+ <div class="column">
%= include 'displayheaders/_pagination3';
</div>
- <!-- delete button
- <td>
- %# <form action="<%= url_for('delete_msg') %>" name=Formdel onsubmit="return confirm('<%= TXT q(js_confirm_delete) %>')" > </form>
- </td>
- -->
-
</div>
generated by cgit v1.2.3 (git 2.39.1) at 2024-12-23 17:19:43 +0000