Package-Skin

Page créée le 11 septembre 2008 à 21h06 par François Direz print pdf


A skin entirely based on editable skin sections with a desktop-application like menu and a php generated css files witch allows one to use color-schemes. A color-scheme can be set individually for the entire site, a group or single page.

On this page... (hide)

  1. 1. Features
  2. 2. Files
  3. 3. Configuration
    1. 3.1 Skin Sections
    2. 3.2 CSS
    3. 3.3 Additional css files
  4. 4. Dependencies

1.  Features

Skin Sections
Entirely bases on editable skin sections. Every skin-section can be enabled/disabled.
Color Scheme
Define a color scheme and use it in all css files you may use.
Layout Settings
Be able to easily configure the most common layout settings like site-dimensions, backgrounds and fonts.
Flexible Configuration
All the settings above can be configured for the entire site, a specific group or a single page.
Desktop-Application like Menu
Have access to all actions and config-options at the same place. The menu stays fixed at the top of the web-page.

2.  Files

  • cookbook
    • netstreams
      • skin.php
    • docs
      • netstreams
        • netstreams-files_skin.txt
        • netstreams-versions_skin
        • sample-config-local_package-skin.php
        • sample-config_package-skin.php
        • sample-index.php
    • pub
      • netstreams
        • wikilib.d
        • dynamic.css
        • static.css
    • skins
      • netstreams
        • img
        • content-sample.css
        • layout.css
        • netstreams.php
        • netstreams.tmpl

3.  Configuration

netstreams.skin uses configuration-page-variables to store it's settings.

3.1  Skin Sections

Enable or disable skin-sections by setting pt'v in the coresponding configuration-pages. Example: To hide the left column for the entire site, set the ptv site_Header in the page SiteConfig.Data to 0.

Variable names:

NamePTV SitePTV GroupPTV PageCSS
Headersite_Headergroup_Headerpage_Header#Header
Navigationsite_Navigationgroup_Navigationpage_Navigation#navigation
LeftBarsite_LeftBargroup_LeftBarpage_LeftBar#ColLeft
Content   .content
RightBarsite_RightBargroup_RightBarpage_RightBar#ColRight
Footersite_Footergroup_Footerpage_Footer#Footer

The values:

SettingValue
defaultno value
show1
hide0

3.2  CSS

Colorscheme Variables

As values use standard css color definition.

  • $CS_baseA
  • $CS_baseA_bright
  • $CS_baseA_dark
  • $CS_highlight
  • $CS_highlight_bright
  • $CS_highlight_dark
  • $CS_system
  • $CS_system_bright
  • $CS_system_dark

Layout Variables

As values use standard css.

  • $site_width
  • $site_background
  • $body_background
  • $standard_fontSize
  • $standard_color
  • $standard_fontFamily
  • $links_color
  • $links_fontFamily
  • $heading_color
  • $heading_fontFamily
  • $header_color
  • $header_background
  • $header_fontFamily
  • $colleft_width
  • $colleft_fontSize
  • $colleft_background
  • $content_fontSize
  • $content_background
  • $colright_width
  • $colright_fontSize
  • $colright_background

3.3  Additional css files

To ad your custom css files:

  • Add the path of your css file to the $csspatharray, example: $csspatharray['mycss'] = "$FarmD/pub/mycss.css";
  • Use the config variables above instead of static css fefinitions.

CSS File:

a { color:$CS_baseA }

4.  Dependencies

Dernière modification le 18 février 2009 à 11h46