From 21b205564dd4a6602a29b48fb314c4d3d5130ef6 Mon Sep 17 00:00:00 2001
From: xue <>
Date: Sat, 31 Dec 2005 00:51:20 +0000
Subject: Adjusted layout of sub-samples.
---
.../pages/Controls/Samples/TListBox/Home.page | 117 ++++++++++++++++-----
.../pages/Controls/Samples/TTextBox/Home.page | 87 ++++++++++-----
demos/quickstart/themes/Simple/style.css | 23 +++-
3 files changed, 171 insertions(+), 56 deletions(-)
(limited to 'demos')
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
diff --git a/demos/quickstart/themes/Simple/style.css b/demos/quickstart/themes/Simple/style.css
index 31fb71f4..c854e23a 100644
--- a/demos/quickstart/themes/Simple/style.css
+++ b/demos/quickstart/themes/Simple/style.css
@@ -174,4 +174,25 @@ tt {
border-bottom:1px solid silver;
font-weight:bold;
margin-bottom:5px;
-}
\ No newline at end of file
+}
+
+.sampletable {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+.sampletable td {
+ border: 1px solid silver;
+ padding: 5px;
+ vertical-align: top;
+}
+
+td.samplenote {
+ width: 300px;
+ text-align: right;
+ background: #BFE4FF;
+}
+
+td.sampleaction {
+ background: #ffffee;
+}
--
cgit v1.2.3