Adjusted layout of sub-samples.

2 files changed, 149 insertions, 55 deletions

diff --git a/demos/quickstart/protected/pages/Controls/Samples/TListBox/Home.page b/demos/quickstart/protected/pages/Controls/Samples/TListBox/Home.page
index 776fc073..28d0dc1a 100644
--- a/demos/quickstart/protected/pages/Controls/Samples/TListBox/Home.page
+++ b/demos/quickstart/protected/pages/Controls/Samples/TListBox/Home.page
@@ -2,31 +2,66 @@
 

 <h1>TListBox Samples</h1>

 

-<div class="samplepanel">

-<div class="sampletitle"><tt>Single</tt> Selection List Box</div>

-List box with default settings:<br/>

+<h2>List Boxes in Single Selection Mode</h2>

+

+<table class="sampletable">

+

+<tr>

+<td class="samplenote">

+List box with default settings:

+</td>

+<td class="sampleaction">

 <com:TListBox />

-<br/>

+</td>

+</tr>

 

-List box with initial items:<br/>

+<tr>

+<td class="samplenote">

+List box with initial items:

+</td>

+<td class="sampleaction">

 <com:TListBox>

   <com:TListItem Value="value 1" Text="item 1" />

   <com:TListItem Value="value 2" Text="item 2" Selected="true" />

   <com:TListItem Value="value 3" Text="item 3" />

   <com:TListItem Value="value 4" Text="item 4" />

 </com:TListBox>

-<br/>

+</td>

+</tr>

 

-List box with customized row number, color and font:<br/>

+<tr>

+<td class="samplenote">

+List box with customized row number, color and font:

+</td>

+<td class="sampleaction">

 <com:TListBox Rows="3" ForeColor="blue" Font.Size="14pt">

   <com:TListItem Value="value 1" Text="item 1" />

   <com:TListItem Value="value 2" Text="item 2" Selected="true" />

   <com:TListItem Value="value 3" Text="item 3" />

   <com:TListItem Value="value 4" Text="item 4" />

 </com:TListBox>

-<br/>

+</td>

+</tr>

+

+<tr>

+<td class="samplenote">

+Disabled list box:

+</td>

+<td class="sampleaction">

+<com:TListBox Enabled="false">

+  <com:TListItem Value="value 1" Text="item 1" />

+  <com:TListItem Value="value 2" Text="item 2" Selected="true" />

+  <com:TListItem Value="value 3" Text="item 3" />

+  <com:TListItem Value="value 4" Text="item 4" />

+</com:TListBox>

+</td>

+</tr>

 

-Auto postback list box:<br/>

+<tr>

+<td class="samplenote">

+Auto postback list box:

+</td>

+<td class="sampleaction">

 <com:TListBox AutoPostBack="true" SelectedIndexChanged="selectionChanged">

   <com:TListItem Value="value 1" Text="item 1" />

   <com:TListItem Value="value 2" Text="item 2" Selected="true" />

@@ -34,9 +69,14 @@ Auto postback list box:<br/>
   <com:TListItem Value="value 4" Text="item 4" />

 </com:TListBox>

 <com:TLabel ID="SelectionResult" ForeColor="red" />

-<br/>

+</td>

+</tr>

 

-List box's behavior upon postback:<br/>

+<tr>

+<td class="samplenote">

+List box's behavior upon postback:

+</td>

+<td class="sampleaction">

 <com:TListBox ID="ListBox1">

   <com:TListItem Value="value 1" Text="item 1" />

   <com:TListItem Value="value 2" Text="item 2" Selected="true" />

@@ -45,39 +85,61 @@ List box's behavior upon postback:<br/>
 </com:TListBox>

 <com:TButton Text="Submit" Click="buttonClicked"/>

 <com:TLabel ID="SelectionResult2" ForeColor="red" />

-<br/>

-</div>

+</td>

+</tr>

+

+</table>

+

 

-<div class="samplepanel">

-<div class="sampletitle"><tt>Multiple</tt> Selection List Box</div>

-<i>Use Shift + Left Click to change selection</i>

+<h2>List Boxes in Multiple Selection Mode</h2>

+<i>Use Shift + Mouse Click to change selection</i>

 <br/>

-List box with default settings:<br/>

+

+<table class="sampletable">

+

+<tr>

+<td class="samplenote">

+List box with default settings:

+</td>

+<td class="sampleaction">

 <com:TListBox SelectionMode="Multiple" />

-<br/>

+</td>

+</tr>

 

-List box with initial items:<br/>

+<tr>

+<td class="samplenote">

+List box with initial items:

+</td>

+<td class="sampleaction">

 <com:TListBox SelectionMode="Multiple">

   <com:TListItem Value="value 1" Text="item 1" />

   <com:TListItem Value="value 2" Text="item 2" Selected="true" />

   <com:TListItem Value="value 3" Text="item 3" />

   <com:TListItem Value="value 4" Text="item 4" Selected="true" />

 </com:TListBox>

-<br/>

+</td>

+</tr>

 

-Auto postback list box:<br/>

-<br/>

+<tr>

+<td class="samplenote">

+Auto postback list box:

+</td>

+<td class="sampleaction">

 <com:TListBox AutoPostBack="true" SelectionMode="Multiple" SelectedIndexChanged="multiSelectionChanged">

   <com:TListItem Value="value 1" Text="item 1" />

   <com:TListItem Value="value 2" Text="item 2" Selected="true" />

   <com:TListItem Value="value 3" Text="item 3" />

   <com:TListItem Value="value 4" Text="item 4" Selected="true" />

 </com:TListBox>

-<br/>

 <com:TLabel ID="MultiSelectionResult" ForeColor="red" />

-<br/>

+</td>

+</tr>

 

-List box's behavior upon postback:<br/>

+<tr>

+<td class="samplenote">

+List box's behavior upon postback:

+</td>

+<td class="sampleaction">

 <com:TListBox ID="ListBox2" SelectionMode="Multiple">

   <com:TListItem Value="value 1" Text="item 1" />

   <com:TListItem Value="value 2" Text="item 2" Selected="true" />

@@ -87,6 +149,9 @@ List box's behavior upon postback:<br/>
 <com:TButton Text="Submit" Click="buttonClicked2" />

 <br/>

 <com:TLabel ID="MultiSelectionResult2" ForeColor="red" />

+</td>

+</tr>

+

+</table>

 

-</div>

 </com:TContent>
\ No newline at end of file
diff --git a/demos/quickstart/protected/pages/Controls/Samples/TTextBox/Home.page b/demos/quickstart/protected/pages/Controls/Samples/TTextBox/Home.page
index fd030996..4a9b58a3 100644
--- a/demos/quickstart/protected/pages/Controls/Samples/TTextBox/Home.page
+++ b/demos/quickstart/protected/pages/Controls/Samples/TTextBox/Home.page
@@ -2,18 +2,19 @@
 

 <h1>TTextBox Samples</h1>

 

-<div class="samplepanel">

-<div class="sampletitle">SingleLine and Password Text Boxes</div>

+<h2>SingeLine Text Boxes</h2>

 

+<table class="sampletable">

+

+<tr><td class="samplenote">

 Text box with default settings:

+</td><td class="sampleaction">

 <com:TTextBox />

-<br/>

-

-Password text box:

-<com:TTextBox TextMode="Password" />

-<br/>

+</td></tr>

 

+<tr><td class="samplenote">

 Text box with customized color, font, columns, maximum length:

+</td><td class="sampleaction">

 <com:TTextBox

 	Text="text"

 	ForeColor="yellow"

@@ -22,72 +23,100 @@ Text box with customized color, font, columns, maximum length:
 	Columns="4"

 	MaxLength="6"

 />

-<br/>

+</td></tr>

 

-Text box with vCard support:<br/>

+<tr><td class="samplenote">

+Text box with vCard support:

+</td><td class="sampleaction">

 First Name: <com:TTextBox AutoCompleteType="FirstName" />

 Last Name: <com:TTextBox AutoCompleteType="LastName" />

-<br/>

+</td></tr>

 

+<tr><td class="samplenote">

 Disabled text box:

+</td><td class="sampleaction">

 <com:TTextBox Text="disabled" Enabled="false" />

-<br/>

+</td></tr>

 

+<tr><td class="samplenote">

 Read-only text box:

+</td><td class="sampleaction">

 <com:TTextBox Text="read only" ReadOnly="true" />

-<br/>

+</td></tr>

 

+<tr><td class="samplenote">

 Auto postback text box:

+</td><td class="sampleaction">

 <com:TTextBox

 	Text="change me"

 	AutoPostBack="true"

 	TextChanged="textChanged" />

-<br/>

+</td></tr>

 

+<tr><td class="samplenote">

 Text box's behavior upon postback:

+</td><td class="sampleaction">

 <com:TTextBox ID="TextBox1" Text="text" />

 <com:TButton Text="Submit" Click="submitText" />

+</td></tr>

+

+</table>

+

+<h2>Password Text Boxes</h2>

+

+Password: <com:TTextBox TextMode="Password" />

 

-</div>

 

-<div class="samplepanel">

-<div class="sampletitle">MultiLine Text Boxes</div>

+<h2>MultiLine Text Boxes</h2>

 

-Text box with default settings:<br/>

+<table class="sampletable">

+

+<tr><td class="samplenote">

+Text box with default settings:

+</td><td class="sampleaction">

 <com:TTextBox TextMode="MultiLine" />

-<br/>

+</td></tr>

 

-Text box with customized dimensions, font and content:<br/>

+<tr><td class="samplenote">

+Text box with customized dimensions, font and content:

+</td><td class="sampleaction">

 <com:TTextBox TextMode="MultiLine" Rows="6" Columns="60" Font.Italic="true">

-<prop:Text>

+  <prop:Text>

 This is a multiline text box.

 In HTML, it is displayed as a textarea.

-</prop:Text>

+  </prop:Text>

 </com:TTextBox>

-<br/>

+</td></tr>

 

-Disabled text box:<br/>

+<tr><td class="samplenote">

+Disabled text box:

+</td><td class="sampleaction">

 <com:TTextBox

 	TextMode="MultiLine"

 	Text="disabled"

 	Enabled="false" />

-<br/>

+</td></tr>

 

-Read-only text box with text-wrapping disabled:<br/>

+<tr><td class="samplenote">

+Read-only text box with text-wrapping disabled:

+</td><td class="sampleaction">

 <com:TTextBox

 	TextMode="MultiLine"

 	Text="This is a read-only text box with text-wrapping disabled."

 	ReadOnly="true"

 	Wrap="false"/>

-<br/>

+</td></tr>

 

-Auto postback text box:<br/>

+<tr><td class="samplenote">

+Auto postback text box:

+</td><td class="sampleaction">

 <com:TTextBox

 	TextMode="MultiLine"

 	Text="change me"

 	AutoPostBack="true"

 	TextChanged="textChanged" />

-<br/>

-</div>

+</td></tr>

+

+</table>

 

 </com:TContent>
\ No newline at end of file