diff options
author | Jannis M. Hoffmann <jannis.hoffmann@rwth-aachen.de> | 2022-05-03 18:22:43 +0200 |
---|---|---|
committer | Jannis M. Hoffmann <jannis.hoffmann@rwth-aachen.de> | 2022-05-03 18:22:43 +0200 |
commit | a6e6f8be88a93699765f25aee0e6109a3eb0b307 (patch) | |
tree | c4ba131bdf3af616ff70072876d384924bf408ce /templates | |
parent | ebe37a68d39dbc1cc4f6af1c05301d5a5fc29c13 (diff) |
reworked templates based on purecss
Diffstat (limited to 'templates')
-rw-r--r-- | templates/_pagination1.html.ep | 5 | ||||
-rw-r--r-- | templates/_pagination2.html.ep | 22 | ||||
-rw-r--r-- | templates/error.html.ep | 3 | ||||
-rw-r--r-- | templates/headers/_display_bot_nav.html.ep | 53 | ||||
-rw-r--r-- | templates/headers/_display_folders.html.ep | 29 | ||||
-rw-r--r-- | templates/headers/_display_headers.html.ep | 107 | ||||
-rw-r--r-- | templates/headers/_display_top_nav.html.ep | 49 | ||||
-rw-r--r-- | templates/headers/_displayfolders.html.ep | 32 | ||||
-rw-r--r-- | templates/headers/_pagination1.html.ep | 7 | ||||
-rw-r--r-- | templates/headers/_pagination2.html.ep | 22 | ||||
-rw-r--r-- | templates/layouts/mainlayout.html.ep | 49 | ||||
-rw-r--r-- | templates/webmail/about.html.ep | 106 | ||||
-rw-r--r-- | templates/webmail/displayheaders.html.ep | 44 | ||||
-rw-r--r-- | templates/webmail/login.html.ep | 69 | ||||
-rw-r--r-- | templates/webmail/readmail.html.ep | 70 | ||||
-rw-r--r-- | templates/webmail/writemail.html.ep | 61 |
16 files changed, 351 insertions, 377 deletions
diff --git a/templates/_pagination1.html.ep b/templates/_pagination1.html.ep deleted file mode 100644 index 14354c0..0000000 --- a/templates/_pagination1.html.ep +++ /dev/null @@ -1,5 +0,0 @@ -<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> diff --git a/templates/_pagination2.html.ep b/templates/_pagination2.html.ep deleted file mode 100644 index e03dbb0..0000000 --- a/templates/_pagination2.html.ep +++ /dev/null @@ -1,22 +0,0 @@ -<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> - -%= form_for '' => begin - [ - %= 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 -% } -% } - -% end - -<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> diff --git a/templates/error.html.ep b/templates/error.html.ep index d120e69..3a1d5e3 100644 --- a/templates/error.html.ep +++ b/templates/error.html.ep @@ -1,4 +1,5 @@ -<!DOCTYPE html> +<!doctype html> + <html> <head> 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> diff --git a/templates/layouts/mainlayout.html.ep b/templates/layouts/mainlayout.html.ep index 9f36006..166f9ee 100644 --- a/templates/layouts/mainlayout.html.ep +++ b/templates/layouts/mainlayout.html.ep @@ -1,24 +1,33 @@ -<!DOCTYPE html> +<!doctype html> + <html lang="<%= $lang %>"> - <head> - <meta charset=UTF-8> - <title> - %= stash('title') || 'JWebmail' - </title> - %= stylesheet '/style.css' - </head> - <body> - %= content +<head> + <meta charset=utf-8> + <meta name="viewport" content="width=device-width, initial-scale=1"> + + <link rel="stylesheet" href="https://unpkg.com/purecss@2.1.0/build/pure-min.css" + integrity="sha384-yHIFVG6ClnONEA5yB5DJXfW2/KC173DIQrYoZMEtBvGzmf0PKiGyNEqe9N6BNDBH" crossorigin="anonymous"> + <link rel="stylesheet" href="https://unpkg.com/purecss@2.1.0/build/grids-responsive-min.css" /> + %= stylesheet '/style2.css' + + <title> + %= title || 'JWebmail' + </title> +</head> + +<body> + %= content + + <footer> + %= link_to about => begin + %= ucfirst l 'about' + JWebmail + % end + <br> + %= ucfirst l 'version' + %= $version + </footer> +</body> - <footer> - %= link_to about => begin - %= ucfirst l 'about' - JWebmail - % end - <br /> - %= ucfirst l 'version' - %= $version - </footer> - </body> </html> diff --git a/templates/webmail/about.html.ep b/templates/webmail/about.html.ep index 5cee603..6221bcc 100644 --- a/templates/webmail/about.html.ep +++ b/templates/webmail/about.html.ep @@ -2,70 +2,64 @@ % layout 'mainlayout'; -<table class=top> +<div class="jwm-base"> - <tr> - <th> - About JWebmail <%= $version %> - </th> - </tr> + <div class="jwm-post"> - <tr> - <td class=large-section> - <ul> - <li> - JWebmail <%= $version %> is a Webmail solution meant to be used with - <a href="https://www.fehcom.de/sqmail/sqmail.html">s/qmail</a> - </li> + <h1>About JWebmail <%= $version %></h1> - <li>Features: - <ul> - <!-- - <li>qmail, vmailmgr and vpopmail authentication support (<em>not</em> sendmail)</li> - <li>multiple signatures und headers support</li> - <li>basic folders support (4 defined folders)</li> - <li>featured addressbook</li> - <li>100% Maildir based</li> - <li>reads the mail directely from the server disk, without need for POP3 or IMAP</li> - --> - <li>multiple language support</li> - <li>session management </li> - <li>search for mails</li> - <li>CGI support but also psgi/plack and fcgi</li> - </ul> - </li> + <p> + JWebmail <%= $version %> is a Webmail solution meant to be used with + <a href="https://www.fehcom.de/sqmail/sqmail.html">s/qmail</a> + </p> - <li> - This is a - <a href="http://www.gnu.org/copyleft/gpl.html" target="_new">GPL</a> - licensed project, created by <a href="mailto:">Oliver 'omnis' Müller</a> - and currently maintained by - <a href="mailto:jannis@fehcom.de">Jannis M. Hoffmann</a> - </li> + <p> + <h3>Features</h3> + <ul> + <!-- + <li>qmail, vmailmgr and vpopmail authentication support (<em>not</em> sendmail)</li> + <li>multiple signatures und headers support</li> + <li>basic folders support (4 defined folders)</li> + <li>featured addressbook</li> + <li>100% Maildir based</li> + <li>reads the mail directely from the server disk, without need for POP3 or IMAP</li> + --> + <li>multiple language support</li> + <li>session management </li> + <li>search for mails</li> + <li>CGI support but also psgi/plack and fcgi</li> + </ul> + </p> + + <p> + This is a + <a href="http://www.gnu.org/copyleft/gpl.html" target="_new">GPL</a> + licensed project, created by <a href="mailto:">Oliver 'omnis' Müller</a> + and currently maintained by + <a href="mailto:jannis@fehcom.de">Jannis M. Hoffmann</a> + </p> - <li>Supported languages: - <p class=languages> + <p> + <h3>Supported languages</h3> + <ul> % foreach (@$languages) { - %= link_to $_ => {lang => $_} + <li> + %= link_to $_ => {lang => $_} + </li> % } - </p> - </li> + </ul> + </p> + + <p> + JWebmail is programmed in <a href="http://www.perl.org">Perl</a>, and is + a complete rewrite of oMail-webmail. + </p> - <li> - JWebmail is programmed in <a href="http://www.perl.org">Perl</a>, and is - a complete rewrite of oMail-webmail. - </li> + </div> - </ul> - </td> - </tr> + <nav> + %= link_to login => 'login' => (class => 'pure-button') + </nav> - <tr> - <td> - <nav> - %= button_to login => 'login' => (class => 'link-btn') - </nav> - </td> - </tr> -</table> +</div> diff --git a/templates/webmail/displayheaders.html.ep b/templates/webmail/displayheaders.html.ep index d823d9e..42e52fd 100644 --- a/templates/webmail/displayheaders.html.ep +++ b/templates/webmail/displayheaders.html.ep @@ -1,46 +1,26 @@ % layout 'mainlayout'; -<table id=displayheaders> +<div id=displayheaders> - <thead> - <tr> - <td id=folders> - %= include 'headers/_displayfolders'; - </td> - </tr> + %= include 'headers/_display_folders'; % if (my $loginmessage = stash 'loginmessage') { - <tr> - <td id=loginmessage> <%= $loginmessage %> </td> - </tr> + <p id=loginmessage> + %= $loginmessage + </p> % } - <tr> - <td id=navigation> - %= include 'headers/_display_top_nav'; - </td> - </tr> - </thead> + %= include 'headers/_display_top_nav'; - <tbody> - <tr> - <td> % if (@$msgs) { - %= include 'headers/_display_headers'; + %= include 'headers/_display_headers'; % } % else { - <p id=empty> <%= l 'empty_folder' %> </p> + <p id=empty-folder> + %= l 'empty_folder' + </p> % } - </td> - </tr> - </tbody> - <tfoot> - <tr> - <td class=navigation> - %= include 'headers/_display_bot_nav'; - </td> - </tr> - </tfoot> + %= include 'headers/_display_bot_nav'; -</table>
\ No newline at end of file +</div> diff --git a/templates/webmail/login.html.ep b/templates/webmail/login.html.ep index 4b2da5d..3e224a8 100644 --- a/templates/webmail/login.html.ep +++ b/templates/webmail/login.html.ep @@ -1,55 +1,34 @@ % layout 'mainlayout'; -<table id=noaction> - <thead> - <tr> - <th id=top-section> JWebmail – <%= ucfirst l 'login' %> </th> - </tr> - </thead> +<div id=login class="jwm-base"> + + <h1> + JWebmail – <%= ucfirst l 'login' %> + </h1> - <tbody> % if (my $msg = flash('message') || stash('warning')) { - <tr> - <td class="warning flash-fade"> - %= $msg - <td> - </tr> + <p class="jwm-warning"> + %= $msg + </p> % } - <tr> - <td class=login-form> - %= form_for login => (name => 'login1') => (method => 'post') => begin - - <table> - <tr> - <td class=label-cell> - %= label_for userid => ucfirst l 'userid' - </td> - <td> - %= text_field 'userid' - </td> - </tr> - <tr> - <td class=label-cell> - %= label_for password => ucfirst l 'passwd' - </td> - <td> - %= password_field 'password' - </td> - </tr> - <tr class=submit-row> - <td colspan=2> - %= submit_button l 'login' - </td> - </tr> - </table> - - % end - </td> - </tr> + %= form_for login => (name => 'login1') => (method => 'post') => (class => 'pure-form pure-form-aligned jwm-round') => begin + <fieldset> + <div class="pure-control-group"> + %= label_for userid => ucfirst l 'userid' + %= text_field 'userid' => '' => (required => '') + </div> + <div class="pure-control-group"> + %= label_for password => ucfirst l 'passwd' + %= password_field 'password' => (required => '') + </div> + <div class="pure-controls"> + %= submit_button l('login') => (class => 'pure-button pure-button-primary') + </div> + </fieldset> + % end - </tbody> -</table> +</div> %= javascript begin if (!document.login1.userid.value) { diff --git a/templates/webmail/readmail.html.ep b/templates/webmail/readmail.html.ep index 0a9fde0..f39dd0e 100644 --- a/templates/webmail/readmail.html.ep +++ b/templates/webmail/readmail.html.ep @@ -3,54 +3,62 @@ % my $mail_fmt = begin % my ($category, $value) = @_; <dt> <%= ucfirst l $category %> </dt> - <dd> <%= ref $value ? join(' ' . l('and') . ' ', map {"$_->{name} <$_->{address}>"} @$value) : $value %> </dd> + <dd> + %= ref $value ? join(' ' . l('and') . ' ', map {"$_->{name} <$_->{address}>"} @$value) : $value + </dd> % end -<div class=ow> - -<h1>Read Mail</h1> - -<dl id=show-head> - <dt> <%= uc l 'subject' %> </dt> - <dd> <%= $msg->{head}{subject} %> </dd> -%= $mail_fmt->('from', $msg->{head}{from}); -%= $mail_fmt->('to', $msg->{head}{to}); -%= $mail_fmt->('cc', $msg->{head}{cc}) if !ref $msg->{head}{cc} || @{ $msg->{head}{cc} }; -%= $mail_fmt->('bcc', $msg->{head}{bcc}) if !ref $msg->{head}{bcc} || @{ $msg->{head}{bcc} }; - <dt> <%= uc l 'date' %> </dt> - <dd> <%= $msg->{head}{date} %> </dd> - <dt> <%= uc l 'size' %> </dt> - <dd> <%= print_sizes10 $msg->{size} %> </dd> - <dt> <%= uc l 'content-type' %> </dt> - <dd> <%= $msg->{head}{content_type} %> </dd> -</dl> +<div class="jwm-base"> + + <h1>Read Mail</h1> + + <dl> + <dt> <%= uc l 'subject' %> </dt> + <dd> <%= $msg->{head}{subject} %> </dd> + + %= $mail_fmt->('from', $msg->{head}{from}) + %= $mail_fmt->('to', $msg->{head}{to}) + %= $mail_fmt->('cc', $msg->{head}{cc}) if !ref $msg->{head}{cc} || @{ $msg->{head}{cc} } + %= $mail_fmt->('bcc', $msg->{head}{bcc}) if !ref $msg->{head}{bcc} || @{ $msg->{head}{bcc} } + + <dt> <%= uc l 'date' %> </dt> + <dd> <%= $msg->{head}{date} %> </dd> + + <dt> <%= uc l 'size' %> </dt> + <dd> <%= print_sizes10 $msg->{size} %> </dd> + + <dt> <%= uc l 'content-type' %> </dt> + <dd> <%= $msg->{head}{content_type} %> </dd> + </dl> % my $body = $msg->{body}; % if ($msg->{head}{content_type} eq 'multipart/alternative') { % for (reverse @$body) { - <div class=show-body> + <div class=jwm-mail-body> % my $x = mime_render($_->{head}{content_type}, $_->{body}); -%== $x; - </div> + %== $x; + </div> % last if $x; % } % } % elsif (ref $body eq 'HASH') { % for (%$body) { - <div class=show-body> -%== mime_render($_->{head}{content_type}, $_->{body}); - </div> + <div class=jwm-mail-body> + %== mime_render($_->{head}{content_type}, $_->{body}); + </div> % } % } % else { - <div class=show-body> -%== mime_render($msg->{head}{content_type}, $body); - </div> + <div class=jwm-mail-body> + %== mime_render($msg->{head}{content_type}, $body); + </div> % } -<nav id=read-nav> - <a href="javascript:history.back()" class=btn> <%= l 'home' %> </a> -</nav> + <nav> + <a href="javascript:history.back()" class="pure-button"> + %= l 'back' + </a> + </nav> </div> diff --git a/templates/webmail/writemail.html.ep b/templates/webmail/writemail.html.ep index 8375bdf..6342927 100644 --- a/templates/webmail/writemail.html.ep +++ b/templates/webmail/writemail.html.ep @@ -1,51 +1,46 @@ % layout 'mainlayout'; -<div class=ow> +<div class="jwm-base"> -<h1>Write Message</h1> + <h1>Write Message</h1> -% if (my $msg = stash('warning')) { - <p class=warn> <%= $msg %> </p> -% } + % if (my $msg = stash('warning')) { + <p class=warn> <%= $msg %> </p> + % } -%= form_for '' => (method => 'post') => (enctype => 'multipart/form-data') => (id => 'write-form') => begin + %= form_for '' => (method => 'post') => (enctype => 'multipart/form-data') => (class => 'pure-form pure-form-stacked') => begin + <fieldset> - %= label_for mail => ucfirst l 'send_to' - %= email_field 'to', id => 'mail', multiple => '', required => '' - <br> + %= label_for mail => ucfirst l 'send_to' + %= email_field 'to' => (id => 'mail') => (multiple => '') => (required => '') - %= label_for subject => ucfirst l 'subject' - %= text_field 'subject', 'required' => '' - <br> + %= label_for subject => ucfirst l 'subject' + %= text_field 'subject' => (required => '') - %= label_for cc => 'CC' - %= email_field 'cc', 'multiple' => '' - <br> + %= label_for cc => 'CC' + %= email_field 'cc' => (multiple => '') - %= label_for bcc => 'BCC' - %= email_field 'bcc', 'multiple' => '' - <br> + %= label_for bcc => 'BCC' + %= email_field 'bcc' => (multiple => '') - %= label_for back_to => ucfirst l 'answer_to' - %= email_field 'back_to' - <br> + %= label_for back_to => ucfirst l 'answer_to' + %= email_field 'back_to' - %= label_for txt => ucfirst l 'content' - %= text_area body => (cols => 80) => (rows => 24) => (id => 'txt') - <br> + %= label_for txt => ucfirst l 'content' + %= text_area body => (cols => 80) => (rows => 24) => (name => 'txt') - %= file_field 'attach' - <br> + %= label_for attach => ucfirst l 'attach file' + %= file_field 'attach' - %= submit_button l 'send' + %= submit_button l('send') => (class => 'pure-button pure-button-primary') - %= csrf_field + %= csrf_field -% end + </fieldset> + % end -<nav> - %#<a href="<%= url_for('displayheaders') %>" class=btn> <%= l 'home' %> </a> - <a href="javascript:history.back()" class=btn> <%= l 'home' %> </a> -</nav> + <nav> + <a href="javascript:history.back()" class="pure-button"> <%= ucfirst l 'back' %> </a> + </nav> </div> |