##  
##  kwiki-openpkg.pm -- Kwiki OpenPKG Theme
##

package Kwiki::Theme::OpenPKG;

use strict;
use warnings;
use Kwiki::Theme '-Base';
use mixin 'Kwiki::Installer';
our $VERSION = '1.0';

const theme_id    => 'openpkg';
const class_title => 'OpenPKG Wiki Theme';

1;

__DATA__

=head1 NAME 

Kwiki::Theme::OpenPKG - Kwiki OpenPKG Theme

=head1 SYNOPSIS

=head1 DESCRIPTION

This is the Kwiki theme of the OpenPKG Wiki http://wiki.openpkg.org/

=head1 AUTHOR

Ralf S. Engelschall <rse@engelschall.com>

=cut

__theme/openpkg/template/tt2/kwiki_screen.html__

[%- INCLUDE kwiki_doctype.html %]
[% INCLUDE kwiki_begin.html %]

<div>
  <table width=100%>
    <tr>
      <td align=left valign=bottom>
        <a href="http://www.openpkg.org/"><img src="http://www.openpkg.org/openpkg.gif" alt="OpenPKG" border="0"></a>
      </td>
      <td align=right valign=bottom>
        <table><tr><td>
        [% hub.widgets.html %]
        </td></tr></table>
      </td>
    </tr>
  </table>
  <p/>
  <table id="canvas">
    <tr>
      <td> 
        <span class="title">
          OpenPKG Wiki: [% screen_title || self.class_title %]
        </span>
        <p/>
        <table id="toolbar">
          <tr>
            <td class="left">
              [% hub.toolbar.html %]
            </td>
            <td class="mid">
            </td>
            <td class="right">
              [% IF hub.have_plugin('user_name') %]
              [% INCLUDE user_name_title.html %]
              [% END %]
            </td>
          </tr>
        </table>
        <p/>
        <div id="content_pane">
          [% INCLUDE $content_pane %]
        </div>
        <p/>
        <div id="status_pane">
          [% hub.status.html %]
        </div>
      </td>
    </tr>
  </table>
</div>

[% INCLUDE kwiki_end.html -%]

__theme/openpkg/css/kwiki.css__

/* document canvas */
html, body, body > div {
    width:              100%;
    height:             auto;
    -moz-box-sizing:    border-box;
    box-sizing:         border-box;
}
body {
    background-color:   #c0c0c0;
    color:              #333333;
    margin:             0 0 0 0;
    padding:            0 0 0 0;
    border:             10px solid #c0c0c0;
}
body > div {
    background-color:   #ffffff;
    background:         url(http://www.openpkg.org/bg.jpg);
    border-top:         1px solid #000000;
    border-left:        1px solid #000000;
    border-right:       1px solid #000000;
    border-bottom:      1px solid #000000;
    padding:            20px 100px 60px 100px;
    font-family:        serif,times,palatino,tahoma;
}
@media print {
    body {
        background-color:   #ffffff;
        color:              #000000;
        margin:             0 0 0 0;
        padding:            0 0 0 0;
        border:             0;
    }
    body > div {
        background-color:   #ffffff;
        border:             0;
        padding:            20px 80px 20px 80px;
    }
}

h1,h2,h3,h4,h5,h6 {
    font-family:        tahoma,helvetica,serif;
    margin:             0px;
}
h1 { font-size:         200%; }
h2 { font-size:         180%; }
h3 { font-size:         160%; }
h4 { font-size:         140%; }
h5 { font-size:         120%; }
h6 { font-size:         100%; }

#content_pane {
    font-family:        sans-serif;
}

#canvas {
    width:              100%;
}

#toolbar {
    width:              100%;
    border:             1px solid #cccccc;
    padding:            0px 20px 0px 20px;
    font-family:        sans-serif;
}
#toolbar td.mid {
    text-align:         left;
    vertical-align:     middle;
}
#toolbar td.right {
    text-align:         right;
}

.title {
    font-weight:        bold;
    font-family:        tahoma,arial,sans-serif;
    font-size:          200%;
}

hr {
    color:              #999999;
    background-color:   #999999;
    border-style:       none;
    height:             1px;
    width:              100%;
}

A         { text-decoration: none; font-weight: bold; }
A:link    { text-decoration: none; font-weight: bold; color: #a09080; }
A:visited { text-decoration: none; font-weight: bold; color: #a09080; }
A:hover   { text-decoration: none; font-weight: bold; color: #a09080; text-decoration: underline; }

PRE.formatter_pre {
    background:         none !important;
    border:             1px solid #cccccc;
}

/* style: Kwiki messages */
.error, .empty {
    color:              #cc3333;
}

/* style Kwiki::Search Button */
form.search input {
    background:         #ffffff;
}

/* style Kwiki::Display "Changed by..." */
.changedby {
    color:              #666666;
    border:             1px solid #cccccc;
    padding:            2px 20px 2px 20px;
}

/* style Kwiki::UserName text */
div#user_name_title {
    float:              none !important;
}

/* style Kwiki::Favorite */
input.favorite {
    background:         #f5f0e5;
}

/* style Kwiki::Diff */
.diff-added {
    background:         #bbbbee !important;
}
.diff-removed {
    background:         #ff6666 !important;
}
.diff-unmodified {
    background:         inherit;
}   
.diff-changed {
    background:         #e5e0d5 !important;
}
table.diff {
    border:             1px solid #cccccc !important;
}
table th {
    border-bottom:      1px solid #cccccc !important;
}
th.lhs, td.lhs {
    padding-left:       1em;
    padding-right:      1em;
}
th.rhs, td.rhs {
    padding-left:       1em;
    padding-right:      1em;
    border-left:        1px solid #cccccc !important;
}

/* style Kwiki::VimColor */
pre.vim { 
    padding:            10px 10px 10px 10px !important;
    border:             1px solid #e0e0e0 !important;
}
.synComment    {        color: #6666cc !important; }
.synConstant   {        color: #cc3333 !important; }
.synIdentifier {        color: #000000 !important; }
.synStatement  {        color: #333333 !important; font-weight: bold !important; }
.synPreProc    {        color: #cc3333 !important; }
.synType       {        color: #333333 !important; font-weight: bold !important; }
.synSpecial    {        color: #cc3333 !important; }
.synUnderlined {        color: #000000 !important; text-decoration: underline !important; }
.synError      {        color: #ffffff !important; background: #cc3333 none !important; }
.synTodo       {        color: #ffffff !important; background: #cc3333 none !important; }