Tornado Class Library

Special Topic - Display Modes & Skins

Display is a big part of any Web Applications. Tornado Display has many options for all operations including Style control.

 

Display Modes

Database records can generally be displayed in several formats -

Many web database report generating products provides just a grid display. This kind of products exists since the first generation ASP days and most of them are out of business. Now, there are many similar ones surface again under the DotNet umbrella and we do not expect them to last very long. After all, the Visual Studio.Net offers free grid controls that can out perform many of this 'grid products'. Tornado offers an unlimited amount of display modes via it's template feature. There are 14 pre-programmed display templates -

  1. Grid (Master records)
  2. Form (Details of one record)
  3. Dual (Grid up, Form down)
  4. Dual-Horiz (Grid left, Form right)
  5. Both (Grid and Form in separate screen)
  6. SBoxForm (Select Box and Form)
  7. SBox (Select Box only).
  8. Grid-Chart (Grid left, Chart right)
  9. Grid-Filter (Grid left, Filter right)
  10. Grid-Update (Grid left, Update right)
  11. Grid-Add (Grid left, Add right)
  12. Grid-RowEdit (Grid-Delete left, Update right)
  13. Grid- Snake (Multiple Columns Grids)
  14. Dual Snake (Multiple Columns Grids - Multiple Columns Fields)

 

Skins
  1. summermeadow
  2. gold
  3. al
  4. bluerain
  5. greenrain
  6. lilacrain
  7. honeychocolate
  8. bluesky
  9. coke
  10. moon
  11. darkmoon
  12. plain
  13. oceanabove
  14. oceanbelow
  15. watch
  1. moto
  2. city
  3. tornado
  4. brownbricks
  5. bluebricks
  6. albricks
  7. land
  8. air
  9. sea
  10. space
  11. cappuccino
  12. medical
  13. finance
  14. grandprix
  15. party
  1. aspdb
  2. aspdbbb
  3. aspdbzen
  4. spring
  5. summer
  6. autumn
  7. winter
  8. usa
  9. germany
  10. china
  11. england
  12. france
  13. russia

How can I change the font type of a skin?

  1. Locate the target skin type and style.css file.
  2. Make a backup of the file
  3. Open the style.css file with notepad and modify the font properties (name, size, color, weight) for appropriate classes.
  4. Modify the following accordingly -
    GH (GridHeader)
    FL (FormLabel)
    R1 (Row Strip1)
    R2 (Row Strip2)
    C1 (Column Strip1)
    C2 (Column Strip2)
    CS (ColSelected)
    SE (selected)
    CF (ColFixed)
     

 

Skin Css Styles

 

Allows Align Not Allow Align
  • C1 (ColStrip1)
  • C1F (ColStrip1_flat)
  • C2 (ColStrip2)
  • C2F (ColStrip2_flat)
  • CC1
  • CC2
  • CM (Comment)
  • CMF (Comment_flat)
  • CF (ColFixed)
  • CFF (ColFixed_flat)
  • CS (ColSelected)
  • CSF (ColSelected_flat)
  • NAS
  • NB
  • NR (Normal)
  • NRF (Normal_flat)
  • NT (Notes)
  • NTF (Notes_flat)
  • SS (ScriptStyle)
  • SSF (ScriptStyle_flat)
  • R1 (Rowstrip1)
  • R1F (RowStrip1_flat)
  • R2 (RowStrip2)
  • R2F (RowStrip2_flat)
  • SE (selected)
  • SEF (selected_flat)
  • TS (tablestyle)
  • TSF (tablestyle_flat)
  • CH (chrome) already right
  • CHF (chrome_flat) already right
  • EH (ErrorHeader) already center
  • EHF (ErrorHeader_flat) already center
  • FL (FormLabel) already right
  • FLF (FormLabel_flat) already right
  • GH (GridHeader) already center
  • GHF (GridHeader_flat) already center
  • IC (IndexCell) already center
  • ICF (IndexCell_flat) already center
  • TL1 already left or center
  • TL2 already left or center

 

Color styles for magic cell and any color tags

 Class=StyleName

  • Aqua
  • Beige
  • Black
  • Blue (np)
  • Brown
  • Chocolate
  • Crimson
  • DarkBlue (np)
  • DarkCyan
  • DarkKhaki
  • DarkViolet
  • DeepPink
  • DeepSkyBlue
  • Gold (np)
  • GoldenRod
  • Gray
  • Green (np)
  • GreenYellow (np)
  • Khaki
  • LightBlue
  • LightCoral
  • LightGrey
  • LightGreen
  • LightSalmon
  • LightSeaGreen
  • Lime
  • Magenta
  • Olive
  • Orange
  • OrangeRed
  • PaleVioletRed
  • PeachPuff
  • Pink
  • Purple
  • Red
  • RoyalBlue
  • SaddleBrown
  • Salmon
  • SandyBrown
  • SeaGreen
  • Silver
  • SkyBlue
  • SlateGray
  • SteelBlue
  • Teal
  • Tomato
  • Violet
  • White
  • Yellow (np)

Note: (np) = non-proportional font

 


Send comments on this topic.
Copyright (c) 1998-2006 ASP-db