DokuWiki

It's better when it's simple

User Tools

Site Tools


Sidebar

Translations of this page?:

Learn about DokuWiki

Advanced Use

Corporate Use

Our Community


Follow us on Facebook, Twitter and other social networks.

template:neolaoresources3

neolaoresources3 Template

Compatible with DokuWiki

2009-12-25

template HTML 5 template

Last updated on
2010-01-15

Tagged with css3, html5

This is a template for HTML5 Renderer.

Download and Install

Use the following URL to download this template:

Refer to template on how to install and use templates in DokuWiki.

Sites using this Template

Discussion

I like the playful appearance of this theme, but I made a couple of minor changes that might be useful to others so I would like to share them here:

  1. I like the new DokuWiki Admin screen icons, but they were missing with this template. I tracked the problem down to being due to a missing “dokuwiki” division tag, but if this tag is placed right after the body tag it messes up the page formatting. By placing it right after the section id=body tag it works. So around line 219 of main.php add the div line like this:
    <section id="body" role="main">
    ADD THIS ==>  <div class="dokuwiki">
    <?php html_msgarea()?>

    Just before the </section> tag, add a </div> tag (which will end up being line 230).

  2. I wanted the top menu buttons to react to the mouse moving over them, so in lines 184-190 of main.php I made all the li tags of class “menu” like this:
    <li class="menu> ... </li>

    Then I edited style.css to change “li.selected” into “li.menu” (a better name, I thought) and then changed the “a” element to be “a:hover” instead. The following are the lines I changed (with line numbers shown for convenience):

    135  body > nav li.menu a:hover
    141  body > nav[role="primary navigation"] li.menu a:hover
    149  body > nav[role="secondary navigation"] li.menu a:hover

    Now when I mouse-over the top menu items they change nicely.

  3. On the right ADMIN menu I did not care for the colour scheme, it didn't seem to blend with the rest. So I came up with a pleasing look by editing style.css in the folowing ways: In the style “body > aside section input[type=submit]” (line 212) I placed some space between buttons with this:
    padding-bottom: 2px;

    The class following it I changed thusly:

          body > aside section input[type=submit]:hover {
             background-color: #1ba6b2;
             border-top:       solid 1px silver;
             border-left:      solid 1px silver;
             border-bottom:    solid 1px black;
             border-right:     solid 2px black;
          }

    Try it and I think you will like the results.

Angelo Babudro 2010/02/06

template/neolaoresources3.txt · Last modified: 2013/04/09 16:32 by Klap-in