Plugin Directory

Changeset 599493


Ignore:
Timestamp:
09/15/2012 10:08:27 PM (13 years ago)
Author:
flashpixx
Message:

readme layout

Location:
geshi-source-colorer
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • geshi-source-colorer/tags/0.12/readme.txt

    r599490 r599493  
    9494
    9595This section should be a short how-to for creating your own layout style. First take a look on the "layout.css" in the plugin directory. There are different sections:
    96 <ul><li>Each section descrips the layout of the different layout elements of the codes</li>
    97 
     96<ol><li>Each section descrips the layout of the different layout elements of the codes</li>
    9897<li>The other section descrips the "global" configurations of each element:
    99     <ul>
    100         <li>"geshisourcecolorer-lol" is the ID of the table of listings</li>
    101         <li>"geshisourcecolorer-line" is the class of the code line block</li>
    102         <li>"geshisourcecolorer-collapse-button" is the class name of the div container, which is shown if a code block is marked with "collapse=true"</li>
    103         <li>"geshisourcecolorer-tab" is the class name of the div, which is stored all div container of a tab view (each tab element is an unorded list)
    104             <ul>
    105                 <li>"tabmenu" is the container div, which shows the tab menu, it is always stored within the geshisourcecolorer-tab</li>
    106             </ul>
    107         </li>
    108         <li>"geshisourcecolorer" is the global class name of each code block / line (the code lines are stored as an ordered list on lines)
    109             <ul>
    110                 <li>"toolbar" is the class, which is always within a "geshisourcecolorer", which descripes the toolbar div container
    111                     <ul>
    112                         <li>"togglelinenumber" is the classname of the button on the toolbar for show / hide the line numbers</li>
    113                         <li>"copyclipboard" is the classname of the button on the toolbar for clipboard-copy</li>
    114                         <li>"sourcewindow" is the classname of the button for creating a blank-code-window</li>
    115                     </ul>
    116                 </li>
    117             </li>
    118         </li>
    119     </ul>
    120     These settings can be combined so you can change or overwrite the default values. In the default settings the collapse-button and the images of the toolbar buttons are
    121     fixed, so each code block / line has got the same layout. With this structure colors and other layout styles can be seperated.
    122 </li>
    123 
     98<ul><li>"geshisourcecolorer-lol" is the ID of the table of listings</li>
     99<li>"geshisourcecolorer-line" is the class of the code line block</li>
     100<li>"geshisourcecolorer-collapse-button" is the class name of the div container, which is shown if a code block is marked with "collapse=true"</li>
     101<li>"geshisourcecolorer-tab" is the class name of the div, which is stored all div container of a tab view (each tab element is an unorded list)
     102<ul><li>"tabmenu" is the container div, which shows the tab menu, it is always stored within the geshisourcecolorer-tab</li></ul>
     103</li><li>"geshisourcecolorer" is the global class name of each code block / line (the code lines are stored as an ordered list on lines)
     104<ul><li>"toolbar" is the class, which is always within a "geshisourcecolorer", which descripes the toolbar div container
     105<ul><li>"togglelinenumber" is the classname of the button on the toolbar for show / hide the line numbers</li>
     106<li>"copyclipboard" is the classname of the button on the toolbar for clipboard-copy</li>
     107<li>"sourcewindow" is the classname of the button for creating a blank-code-window</li>
     108</ul></li></li></li></ul>These settings can be combined so you can change or overwrite the default values. In the default settings the collapse-button and the images of the toolbar buttons are
     109fixed, so each code block / line has got the same layout. With this structure colors and other layout styles can be seperated.</li>
    124110<li>under the global options two style classes with different color layouts a are set:
    125     <ul>
    126         <li>"geshisourcecolorer-*-default" which is the class name of the default color style (white background, grey lines & hovereffects)</li>
    127         <li>"geshisourcecolorer-*-black" which is the class name of dark layout</li>
    128     </ul>
    129     You can change the coloring on the plugin settings (global) or you can add it with the "css_*" tags on each shortcut.
    130 </li>
    131 
    132 <li>The layout of the source code is depended on the style option and/or the language option, which is set by the shotcut. The shortcut options "style" and "lang" are used for the style definition (see the FAQ).
    133 The style is loaded in this order:
    134 <ul>
    135     <li>if the style parameter is set, this style will be used if exists, if not exists the default style is used</li>
    136     <li>if the style option not set or the style is not found, the lang value is used to find a style, if no style exists, the default style is used</li>
    137 </ul>
    138 To define the (language) styles, take a look into the plugin settings, exspecially the "codestyle" subsection. In this subsection each code style is defined. Each value is a CSS definition, so you can use
    139 any CSS element to configurate the source code parts.
    140 </li>
    141 </ul>
     111<ul><li>"geshisourcecolorer-*-default" which is the class name of the default color style (white background, grey lines & hovereffects)</li>
     112<li>"geshisourcecolorer-*-black" which is the class name of dark layout</li></ul>You can change the coloring on the plugin settings (global) or you can add it with the "css_*" tags on each shortcut.
     113</li><li>The layout of the source code is depended on the style option and/or the language option, which is set by the shotcut. The shortcut options "style" and "lang" are used for the style definition (see the FAQ).
     114The style is loaded in this order:<ul>
     115<li>if the style parameter is set, this style will be used if exists, if not exists the default style is used</li>
     116<li>if the style option not set or the style is not found, the lang value is used to find a style, if no style exists, the default style is used</li>
     117</ul>To define the (language) styles, take a look into the plugin settings, exspecially the "codestyle" subsection. In this subsection each code style is defined. Each value is a CSS definition, so you can use
     118any CSS element to configurate the source code parts.</li></ol>
    142119
    143120
  • geshi-source-colorer/trunk/readme.txt

    r599490 r599493  
    9494
    9595This section should be a short how-to for creating your own layout style. First take a look on the "layout.css" in the plugin directory. There are different sections:
    96 <ul><li>Each section descrips the layout of the different layout elements of the codes</li>
    97 
     96<ol><li>Each section descrips the layout of the different layout elements of the codes</li>
    9897<li>The other section descrips the "global" configurations of each element:
    99     <ul>
    100         <li>"geshisourcecolorer-lol" is the ID of the table of listings</li>
    101         <li>"geshisourcecolorer-line" is the class of the code line block</li>
    102         <li>"geshisourcecolorer-collapse-button" is the class name of the div container, which is shown if a code block is marked with "collapse=true"</li>
    103         <li>"geshisourcecolorer-tab" is the class name of the div, which is stored all div container of a tab view (each tab element is an unorded list)
    104             <ul>
    105                 <li>"tabmenu" is the container div, which shows the tab menu, it is always stored within the geshisourcecolorer-tab</li>
    106             </ul>
    107         </li>
    108         <li>"geshisourcecolorer" is the global class name of each code block / line (the code lines are stored as an ordered list on lines)
    109             <ul>
    110                 <li>"toolbar" is the class, which is always within a "geshisourcecolorer", which descripes the toolbar div container
    111                     <ul>
    112                         <li>"togglelinenumber" is the classname of the button on the toolbar for show / hide the line numbers</li>
    113                         <li>"copyclipboard" is the classname of the button on the toolbar for clipboard-copy</li>
    114                         <li>"sourcewindow" is the classname of the button for creating a blank-code-window</li>
    115                     </ul>
    116                 </li>
    117             </li>
    118         </li>
    119     </ul>
    120     These settings can be combined so you can change or overwrite the default values. In the default settings the collapse-button and the images of the toolbar buttons are
    121     fixed, so each code block / line has got the same layout. With this structure colors and other layout styles can be seperated.
    122 </li>
    123 
     98<ul><li>"geshisourcecolorer-lol" is the ID of the table of listings</li>
     99<li>"geshisourcecolorer-line" is the class of the code line block</li>
     100<li>"geshisourcecolorer-collapse-button" is the class name of the div container, which is shown if a code block is marked with "collapse=true"</li>
     101<li>"geshisourcecolorer-tab" is the class name of the div, which is stored all div container of a tab view (each tab element is an unorded list)
     102<ul><li>"tabmenu" is the container div, which shows the tab menu, it is always stored within the geshisourcecolorer-tab</li></ul>
     103</li><li>"geshisourcecolorer" is the global class name of each code block / line (the code lines are stored as an ordered list on lines)
     104<ul><li>"toolbar" is the class, which is always within a "geshisourcecolorer", which descripes the toolbar div container
     105<ul><li>"togglelinenumber" is the classname of the button on the toolbar for show / hide the line numbers</li>
     106<li>"copyclipboard" is the classname of the button on the toolbar for clipboard-copy</li>
     107<li>"sourcewindow" is the classname of the button for creating a blank-code-window</li>
     108</ul></li></li></li></ul>These settings can be combined so you can change or overwrite the default values. In the default settings the collapse-button and the images of the toolbar buttons are
     109fixed, so each code block / line has got the same layout. With this structure colors and other layout styles can be seperated.</li>
    124110<li>under the global options two style classes with different color layouts a are set:
    125     <ul>
    126         <li>"geshisourcecolorer-*-default" which is the class name of the default color style (white background, grey lines & hovereffects)</li>
    127         <li>"geshisourcecolorer-*-black" which is the class name of dark layout</li>
    128     </ul>
    129     You can change the coloring on the plugin settings (global) or you can add it with the "css_*" tags on each shortcut.
    130 </li>
    131 
    132 <li>The layout of the source code is depended on the style option and/or the language option, which is set by the shotcut. The shortcut options "style" and "lang" are used for the style definition (see the FAQ).
    133 The style is loaded in this order:
    134 <ul>
    135     <li>if the style parameter is set, this style will be used if exists, if not exists the default style is used</li>
    136     <li>if the style option not set or the style is not found, the lang value is used to find a style, if no style exists, the default style is used</li>
    137 </ul>
    138 To define the (language) styles, take a look into the plugin settings, exspecially the "codestyle" subsection. In this subsection each code style is defined. Each value is a CSS definition, so you can use
    139 any CSS element to configurate the source code parts.
    140 </li>
    141 </ul>
     111<ul><li>"geshisourcecolorer-*-default" which is the class name of the default color style (white background, grey lines & hovereffects)</li>
     112<li>"geshisourcecolorer-*-black" which is the class name of dark layout</li></ul>You can change the coloring on the plugin settings (global) or you can add it with the "css_*" tags on each shortcut.
     113</li><li>The layout of the source code is depended on the style option and/or the language option, which is set by the shotcut. The shortcut options "style" and "lang" are used for the style definition (see the FAQ).
     114The style is loaded in this order:<ul>
     115<li>if the style parameter is set, this style will be used if exists, if not exists the default style is used</li>
     116<li>if the style option not set or the style is not found, the lang value is used to find a style, if no style exists, the default style is used</li>
     117</ul>To define the (language) styles, take a look into the plugin settings, exspecially the "codestyle" subsection. In this subsection each code style is defined. Each value is a CSS definition, so you can use
     118any CSS element to configurate the source code parts.</li></ol>
    142119
    143120
Note: See TracChangeset for help on using the changeset viewer.