modern-CentOS

1. Download

1.1. Theme

There are 40 attachment(s) stored for this page.

1.2. Background images

Add your propositions here:

To use one of these images as background:

1. Dowload your image of choise.

2. Rename it to moin-html-background.png.

3. Copy it into img/ directory.

4. Reinstall the theme to reflect changes.

2. Installation

After MoinMoin instalation, it is needed to create an instance of it. After the instance is configured you need to copy the related theme files inside the created instance. Then configure the instance in order to use the new theme.

To help this process we use three scripts:

1. moinmoin-postinstall.sh -- Used to create MoinMoin instances.

2. moinmoin-postinstall-wikifarm.sh -- Used to create a MoinMoin wikifarm instance.

3. install.sh -- Used to install/update this theme inside a specific wiki instance. What this script does is copy theme files, set permissions, look inside configuration files (./cgi-bin/*.py) for default configurations like logo image, logo alternative text, and theme name used after installation in order to replace them with those values related to CentOS. This script is inside modern-CentOS tar.gz file.

2.1. Steps

1. Log in as root user or become on it.

2. Install MoinMoin RPM package. You can configure the RPMForge repo and then run yum install moin.

3. Use moinmoin-postinstall.sh or moinmoin-postinstall-wikifarm.sh script to create a wiki instance. Note that you can change these scripts if you need to do so ... also you can create the instance manually

4. Download the modern-CentOS theme.

5. Unpack it (tar -xzvf modern-CentOS-1.10.tar.gz).

6. Get into modern-CentOS directory.

7. Edit install.sh script to reset the $WIKIINSTANCE variable.

8. Install the theme runing ./install.sh script.

3. Messages

Sometimes is needed to remark notes, ideas or important messages around the content.

For example, to show the following message:

we can use the following wiki code:

||<class="lmimg blue" :> ||||<class="lmtxt blue" (> This is a small note. ||

Note that these messages are built with a two-cells table and a class applied on each table cell. The left cell is used to show some icon (see below) or can be in blank, as shown above. The right cell is used to put the message text.

To know more about tables see the HelpOnTables page.

3.1. Including messages on articles

To include messages on your articles use the message wiki code shown above in a yellow box. Then, change "This is a small note." sentence with your own message text.

3.2. Message Colors

We have six color combinations available to use in our messages.

3.3. Message with left side image

For example, to show the following message:

we can use the following wiki code:

||<class="lmimg blue" :> attachment:ArtWork/WikiDesign/info.png ||||<class="lmtxt blue" (^> ~+'''Note:'''+~ This is a small note. ||

3.4. Multiline message with left side image

For example, to show the following message:

we can use the following wiki code:

||<class="lmimg blue" :^> attachment:ArtWork/WikiDesign/info.png ||||<class="lmtxt blue" (^> ~+'''Note:'''+~ [[BR]][[BR]] This is a small note. [[BR]][[BR]] It can be extended in other lines like this. ||

3.4.1. Available images

4. Todo

List of things that need to be done:

• To review.
• ... ?

5. Change Log

List of things that have been done:

1.10.3
======

   * Introduce automatically overflow inside table
     cells and pre elements. When a text overflows
     its parent element (in table cells and pre
     elements only) a scroll bar appears
     automatically below it.  Useful in code
     sections inside messages, table cells, and
     pre elements.

     The only exception is in table cells used as
     left side in a message (those where class
     `lmimg' is applied), where the image is
     shown. Here, overflowing is always visible,
     expanding the cell as much as needed.

     Example:
     http://wiki.centos.org/ArtWork/WikiDesign/modern-CentOS?action=AttachFile&do=get&target=Screenshot-scrolling_text_inside_tables.png

     If you consider some table cell shouldn't be
     overflowed automatically, you can use the
     style definition inside that cell and fix its
     dimensions. For example: If you have an 60px
     image width and it is cut because overflow is
     set automatically; you can use the following
     code to make that cell larger and that way,
     cover image horizontal dimension:

     ||<style="width:80px"> 60px image here ||

     With that, no scroll bar is show in that cell
     because there is not content overflowed in
     it.

     This version keeps content inside the page
     visible area, and scrolls overflowed content
     (horizontally, where needed) inside it.

1.10.2
======

   * Set 4% to left and right body margin.

   * Set fullsearch as defult search behavior.

1.10.1
======

   * Update print.css. Change message declaration into a
     class.

1.10
=======

   * Update header background image.

   * Update logo. Add comment "Community ENTerprise
     Operating System" on it.

   * Update navibar. Add some decorations :).

   * Update editorheader(self, d). Add the navibar,
     pagetrail, and username elements.

   * Remove dark and medium contrast message definitions.
     Leave just low contrast messages available.

   * Change messages definition into classes.

   * Update google adsense position. Now it is aligned to
     right.

   * Update RecentChanges table style.

   * Update moin-rss image on RecentChanges page.

   * Remove header_editbar and footer_editbar IDs. Leave
     editbar inside footer and header IDs and, control them
     so.

   * Change pageline definition into a class.

   * Fix username margin.

   * Rename cc(self, d) to credits(self, d). Common
     Creative references are into credits(self, d).

   * The underlined Creative Common link was changed for a
     link into <em> tags to remark it. The image link is
     into <strong> tags to remark the alternative text if
     browser can't display the image. The color was changed
     from #CCC to #EEE.

   * Change some css shortcut declarations to full
     declarations.

   * pagetrail was aligned to right.

   * Remove left and right margins. All the space available
     is used. The web browser can be resized to fit a nice
     reading dimensions at user consideration.

   * Some cosmetic changes.

1.9
=======

      * Set moin configuration directory path automatically.

      * Set url_prefix variable to `staticfiles'. This let us use the
        word `wiki' as an alias on apache, in order to refere to the
        wiki as http://www.example.tld/wiki/.

      * Use the text `mywiki' as default instance name.

      * Update background image. Squares were reduced in dimentions.

      * Update message presentation. It is removed from header and
        inserted over the page element. The orange color was changed
        to a soft blue color. Text is in bold. "Clear message" link
        remains equal.

      * Update interwiki position. It is now at the left side of
        trailpage element.

      * Add navibar def in order to change navibar stylesheet
        definition. Inicially navibar used <ul id="navibar">, actually
        it uses <ul class="navibar">. This change was necessary
        because it is not recommended to use two equal id elements in
        the same page.

      * Update links colors and behaviours.

      * Upate position of interwiki links.

      * Update searchbox style.

      * Update navibar menu links behaviours to avoid the green color
        over blue background when link is active and others wierd
        behaviours that made links unreadable.

      * Update action message near header. Now the background is the
        same of those used to low contrast messages. An orange
        background with very soft white boxes aligned.

      * Update space between last page content, info line, and footer.

      * Update admonition background images and presentation.

      * Update logo links' color. Make it white to contrast it against
        blue background.

      * Update recentchanges table.

      * Update print presentation.

1.7-30
======
  - Add Middle contrast Message style. The wiki syntax is:
        ||<id="mmimg" :^> attachment: ||||<id="mmtxt" (^> Text ... ||
        it also support the following clases:
        * class="orange"
        * class="red"
        * class="blue"
        * class="green"
        * class="violet"
        To use a class (i.e class="blue") we can use the following line:

        ||<id="mmimg" class="blue" :^> attachment: ||||<id="mmtxt" class="blue" (^> Text ...||

        If no class is used, then gray color is used.
  - Squares in the messages background were a bit reduced.
  - Add background to low and middle contrast messages to reflect
    semitransparent squares.

1.7-29
======
  - Resume CentOS mailing list discussion about messages presentation.
    Now we can use two message styles.
        1. Low contrast Message

        ||<id="lmimg" :^> attachment: ||||<id="lmtxt" (^> Text ...||

        2. High contrast Message

        ||<id="dmimg" :^> attachment: ||||<id="dmtxt" (^> Text ...||

        The following classes are available:

        * class="orange"
        * class="red"
        * class="blue"
        * class="green"
        * class="violet"

        To use a class (i.e class="blue") we can use the following line:

        ||<id="dmimg" class="blue" :^> attachment: ||||<id="dmtxt" class="blue" (^> Text ...||

        If no class is used, then gray color is used.
  - Give 0.5em to locationline margin-bottom. Before this update
    tables that were added at the begining of the page, as first
    element, were not properly shown due to the short margin
    locationline element has. Now this is fixed.
  - Update image background. Now squares are really over a white
    background. Before this they were over a transparent one.
  - Update comments.
  - It is no grey but gray, with "a" ;). Fix that!.
  - Make pre element not so yellow. Let it as it was inicially.

1.7-28
======
  - Come back to 10% page lateral margin presentation.
  - Change color on messages left border.

1.7-27
======
  - Remark messages' left side border.

1.7-26
======
  - Fix table of contents right margin.

1.7-25
======
  - Update messages style. Reduce messages padding.
  - Make the pre element more yellow and make its border gray.

1.7-24
======
  - Make messages background a bit softer.

1.7-23
======
  - Reduce both left and right space to 15px.

1.7-22
======
  - Reduce both left and right space to 5%.

1.7-21
======
  - Increase the number of boxes in the background image. Now, it is
    an image of 21x21 boxes. Each box is 15x15px.

1.7-20
======
  - Go back into light gray boxes background.
  - Now, the background boxes are 5px smaller.

1.7-19
======
  - Update messages style. Add messages orange class.

1.7-18
======
  - Update messages style. Add classes green, red, blue, and violet to
    let you change the messages image background among these colors.
    Also fix spacing between the image and text, they are a bit closer
    now. The wiki code of messages is as follow:
    ||<id="mimg" :^> attachment: here ||||<id="mtxt" (^> text here ||
    or with classes:
    ||<id="mimg" class="red" ^:> attachment here ||||<id="mtxt" class="red" (^> text here ||

1.7-17
======
  - Adjust credits position.

1.7-16
======
  - Before this update some links in the top edition bar were
    disabled. Due to the style used to locate locationline element.
    Now, the locationline elmenet is fixed and the edition links are
    fully active again.

1.7-15
======
 - Add a comment about wiki instance name, in the install.sh script
   file.
 - Change the default wiki instance name into wN. Where N is a number.
   The default value is `w0' now.
 - Update the position of pagelocation links. Now it's moved a little
   into the left.
 - Update page padding. The page padding is reduced 10px on left,
   right and bottom.
 - Update html background. Now it is dark.
 - Update pre tag code box color background.
 - Update lists presentation. The margin between them is a little
   reduced.
 - Update Adminition Messages style.
 - Other minors changes.

1.7-12
======
 - Make the body top and bottom padding 0px.
 - Update admonition messages styles.

1.7-11
======
 - Create the page styles to notes, warnings and stops messages. The
   styles are now on screen.css file. This make wiki code more clean and
   if we want to change the message design we just need to edit screen.css file.
   For example, to show a note, with format, we just have to use the following wiki code:
   ||<id="msg-img-info" :> attachment:Common/Image/Path/info.png ||||<id="msg-txt-info" (> This is the info message. ||

1.7-10
======
- Redesign the whole theme based on fedora CSS stylesheet.

1.7-9
=====
- Make Creative Common Link more visible.

1.7-8
=====
 - Create definition for Creative Common Reference code.

 - In the CC reference use the small image. The big one use text that is
   a little unreadable over the footer background.

 - Make text and links #CCCCCC on credits.

 - Adjust credits position.

1.7-7
=====

 - Change background image. We have now 16x16 boxes in the base
   background image.

 - Change "moin-bottom.png", and "moin-up.png" images to make them
   contrast on headers.

1.7-6
=====

 - Adjust pagetrail position.

 - Change small image before unordered list element.

1.7-5
=====

 - Separate pagetrail li and pagelocation li to set different colors on them.

1.7-4
=====

 - Adjust pagetrail position.

 - Adjust logo position.

1.7-3
=====

 - Adjust links colors.

 - Adjust table-of-contents.

 - Adjust small image before unordered list element.

 - Adjust searchform buttons.

1.7-2
=====

 - Include Google Ads code into modern-CentOS.py as a definition.

 - Move Google Ads into header area.

1.7-1
=====

 - Reduce content area.

 - Add a light background image.

 - Move breadcrumbs and searchform into content page.

 - Adjust searchform size and color.

 - Move Login to right.

 - Adjust navibar and pageline color.

 - Adjust navibar color on mouse over.

 - Use an small image before unordered list element.

 - Adjust editbar color.

1.6-10
======

 - Reduce searchform input size from 20 to 18. Otherwise in large page names
   the navibar is ugly shown over searchform input box. This has been tested to
   the following page names on navibar:

    - FrontPage | GettingHelp | HowTos | FAQ | Events | HowToContribute | RecentChanges

    - PáginaInicial | Ayuda | CÓMO | FAQ | Eventos | CómoContribuir | CambiosRecientes

 - Fix typo on screen.css.

1.6-9
=====

 - Remove border-top on footer.

 - Add footer_pageline to do the same that is done in header but in reverse.

 - Adjust footer_navibar height.

1.6-8
=====

 - Modify the pre style in common.css file, making it light gray with dashed border.

1.6-7
====

 - Remove searchform at page footer.

1.6-6
=====

 - Make searchinput field a little flat.

1.6-5
=====

 - Adjust searchform code and position. (Thanks to Ralph Angenendt's css diff)

 - Remove label from searchform and leave just the input value text as references.

 - Adjust navibar.

 - Change the pagelocation separator to  » .

1.6-4
=====

 - Move searchform out of editbar. Now it is on navibar right side.

 - Remove border-top on header's editbar.

 - Adjust navibar padding.

1.6-3
=====

 - Make the editbar always visible

 - Add background to headers (h1, h2, h3, h4, h5). Related file: moin-hx-background.png

 - Show small icon before links (we can change this, just talk about it)

 - Adjust navibar position (make it a little more like original modern theme)

 - Adjust pagetrail separator (change to "/ " as in default modern theme it is)

 - Adjust table-of-contents. Add left and rights borders and adjust position.

 - Add white background to navigation table, to make its links to contrast over the blue header background.

 - Add WIKINAME variable to install.sh, to make it a little more customizable.

1.6-2
=====

 - Improve install.sh script

1.6-1
=====

 - Move Searchform to right.

1.6
===

 - Put Searchform inside editbar.

1.5.1
=====

 - Fix NaviBar when the user is logout.

1.5
===

 - Add a NaviBar on the bottom of the page.

1.4
===

 - Fix some typos that made the theme crash.

1.3
===

 - Change moin-header-background.png:

   - Make it a little soft, like the default distro background :).

   - Redo the semi-transparent boxes.

 - Update screen.css file. Change header background to #204C8.

 - Update modern-CentOS.py file. Now only logged users can see editbar.

 - Update install.sh file. Add THEMENAME variable to define theme name.

1.2
===

 - Dark blue header for CentOS. An image (header-background.png) is added with some semi transparent rectangles all over.

 - No icon before external links.

 - Font reduction to 14px.

 - Modified header level 2. Make a dark blue bottom border and en light gray background on header.

 - Table of contents has a light gray background and a little more dark gray border. Also, its margin around text is a little larger. Its width is larger for those who like large titles :-/

 - The messages has light yellow background.

 - Now editbar has light blue background.