diff options
Diffstat (limited to 'demos/quickstart/protected/pages/Advanced/Themes.page')
| -rw-r--r-- | demos/quickstart/protected/pages/Advanced/Themes.page | 24 |
1 files changed, 19 insertions, 5 deletions
diff --git a/demos/quickstart/protected/pages/Advanced/Themes.page b/demos/quickstart/protected/pages/Advanced/Themes.page index 40030bd5..ba5585e7 100644 --- a/demos/quickstart/protected/pages/Advanced/Themes.page +++ b/demos/quickstart/protected/pages/Advanced/Themes.page @@ -29,15 +29,29 @@ This will apply the 'Blue' skin to the button. Note, the initial property values To use the javascript files and CSS files contained in a theme, a <tt>THead</tt> control must be placed on the page template. This is because the theme will register those files with the page and <tt>THead</tt> is the right place to load those files.
</p>
+<h2>Theme Storage</h2>
+<p>
+All themes by default must be placed under the <tt>[AppEntryPath]/themes</tt> directory, where <tt>AppEntryPath</tt> refers to the directory containing the application entry script. If you want to use a different directory, configure the <tt>BasePath</tt> and <tt>BaseUrl</tt> properties of the <tt>System.Web.UI.TThemeManager</tt> module in application configuration,
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source">
+<service id="page" class="TPageService">
+ <modules>
+ <module id="theme"
+ class="System.Web.UI.TThemeManager"
+ BasePath="mythemes"
+ BaseUrl="mythemes" />
+ </modules>
+</service>
+</com:TTextHighlighter>
+
<h2>Creating Themes</h2>
<p>
-Creating a theme involves creating the theme directory and writing skin files (and possibly javascript and CSS files). All themes by default must be placed under the <tt>[WebAppEntryPath]/themes</tt> directory, where <tt>WebAppEntryPath</tt> refers to the directory containing the application entry script. If you want to use a different directory, configure the <tt>BasePath</tt> and <tt>BaseUrl</tt> properties of the <tt>System.Web.UI.TThemeManager</tt> module.
-</p>
-<p>
-The format of skin files are the same as that of control template files. Since skin files do not define parent-child presentational relationship among controls, you cannot place a component tag within another. And any static texts between component tags are discarded. To define the aforementioned 'Blue' skin for <tt>TButton</tt>, write the following in a skin file,
+Creating a theme involves creating the theme directory and writing skin files (and possibly javascript and CSS files). The name of skin files must be terminated with <tt>.skin</tt>. The format of skin files are the same as that of control template files. Since skin files do not define parent-child presentational relationship among controls, you cannot place a component tag within another. And any static texts between component tags are discarded. To define the aforementioned 'Blue' skin for <tt>TButton</tt>, write the following in a skin file,
</p>
<com:TTextHighlighter Language="prado" CssClass="source">
<com:TButton SkinID="Blue" BackColor="blue" />
</com:TTextHighlighter>
-
+<p>
+As aforementioned, you can put several skins within a single skin file, or split them into several files. A commonly used strategy is that each skin file only contains skins for one type of controls. For example, <tt>Button.skin</tt> would contain skins only for the <tt>TButton</tt> control type.
+</p>
</com:TContent>
\ No newline at end of file |