Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Branch: master
Fetching contributors…

Cannot retrieve contributors at this time

281 lines (227 sloc) 13.217 kB
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>RMSforms Example Page</title>
<!-- <link rel="stylesheet" type="text/css" href="css/rmsforms.css">-->
<link rel="stylesheet/less" href="css/rmsforms.css" type="text/css">
<script src="javascript/less.js" type="text/javascript"></script>
<!-- <link rel="stylesheet" type="text/css" href="http://www.rmsjr.com/RMSforms/RMSforms-v0.5.css"> -->
</head>
<body>
<div class="formContainer">
<span class="requiredDesignation required">Designates Required Fields</span>
<form action="">
<h2>Vertical Form 1a <em>(DEFAULT FORM)</em> :: Vertical &lt;Li&gt;, Horizontal &lt;Label&gt;, Horizontal &lt;Input&gt; :: <em>class = form</em></h2>
<fieldset>
<legend>This is a legend</legend>
<ul class="form">
<li><label>label</label><input type="text" /><span class="leftIcon status-ok"></span><span class="leftNote">This is a note</span></li>
<li class="required"><label>label</label><input type="text" /><span class="bottomNote offset1">This is a note</span></li>
<li><label>label</label><select><option></option></select></li>
<li><label>label</label><input type="radio" /></li>
<li><label>label</label><input type="checkbox" /></li>
<li><label>This is a label that is long enough to go onto three lines</label><textarea rows="5" cols="40"></textarea></li>
<li><input class="button" type="button" value="Submit"/></li>
</ul>
</fieldset>
<h2>Vertical Form 1b :: Vertical &lt;Li&gt;, Horizontal &lt;Label&gt; (Text Align Right), Horizontal &lt;Input&gt; :: <em>class = form tar</em></h2>
<fieldset>
<legend>This is a legend</legend>
<ul class="form tar">
<li><label>label</label><input type="text" /><span class="leftNote">This is a note</span></li>
<li class="required"><label>label</label><input type="text" /><span class="bottomNote offset1">This is a note</span></li>
<li><label>label</label><select><option></option></select></li>
<li><label>label</label>
<input type="radio" />
</li>
<li><label>label</label><input type="checkbox" /> </li>
<li><label>This is a label that is long enough to go onto three lines</label><textarea rows="5" cols="40"></textarea></li>
</ul>
</fieldset>
<h2>Vertical Form 2 :: <em>V</em>ertical &lt;Li&gt;, <em>V</em>ertical &lt;Label&gt;, <em>V</em>ertical &lt;Input&gt;:: <em>modifier class = "vvv"</em></h2>
<fieldset>
<legend>This is a legend</legend>
<ul class="form vvv">
<li><label>label</label><input type="text" /><span class="leftNote">This is a note</span></li>
<li class="required"><label>label</label><input type="text" /><span class="bottomNote">This is a note</span></li>
<li><label>label</label><select><option></option></select></li>
<li><label>label</label><input type="radio" /></li>
<li><label>label</label><input type="checkbox" /></li>
<li><label>label</label><textarea rows="5" cols="40"></textarea></li>
</ul>
</fieldset>
<h2>Horizontal Form 1 :: <em>H</em>orizontal &lt;Li&gt;, <em>V</em>ertical &lt;Label&gt;, <em>V</em>ertical &lt;Input&gt; :: <em> modifier class = "hvv"</em></h2>
<fieldset>
<legend>This is a legend</legend>
<ul class="form hvv">
<li><label class="h"><em>label with label modifier = "h"</em></label><input type="text" /><span class="leftNote">This is a note</span></li>
<li class="required"><label>label</label><input type="text" /><span class="bottomNote">This is a note</span></li>
<li><label>label</label><select><option></option></select></li>
<li><label>label</label><input type="radio"/></li>
<li><label>label</label><input type="checkbox" /></li>
<li><label>label</label><textarea rows="5" cols="40"></textarea></li>
</ul>
</fieldset>
<h2>Horizontal Form 2 :: <em>H</em>orizontal &lt;Li&gt;, <em>I</em>nline &lt;Label&gt;, <em>I</em>nline &lt;Input&gt; :: <em>modifier class = "hii"</em></h2>
<fieldset>
<legend>This is a legend</legend>
<ul class="form hii">
<li><label>label</label><input type="text" /><span class="leftNote">This is a note</span></li>
<li class="required"><label>label</label><input type="text" /><span class="bottomNote">This is a note</span></li>
<li><label>label</label><select><option></option></select></li>
<li><label>label</label><input type="radio"/></li>
<li><label>label</label><input type="checkbox" /></li>
<li><label class="v"><em>label with label modifier = "v"</em></label><textarea rows="5" cols="40"></textarea></li>
</ul>
</fieldset>
<h2>Horizontal Form 3 :: <em>H</em>orizontal &lt;Li&gt;, <em>H</em>orizontal &lt;Label&gt;, <em>H</em>orizontal &lt;Input&gt; :: <em>modifier class = "hhh"</em></h2>
<fieldset>
<legend>This is a legend</legend>
<ul class="form hhh tar">
<li><label>label</label><input type="text" /><span class="leftNote">This is a note</span></li>
<li><label>label</label><input type="text" /><span class="bottomNote offset2">This is a note</span></li>
<li><label>label</label><select><option></option></select></li>
<li><label>label</label><input type="radio"/></li>
<li><label>label</label><input type="checkbox" /></li>
<li class="cb"><label class="v"><em>label with label modifier = "v"</em></label><textarea rows="5" cols="40"></textarea></li>
</ul>
</fieldset>
<h2>Multiple Vertical Forms Layed Out Horizonally :: <em>outer ul class = "form hvv"</em></h2>
<fieldset>
<legend>This is a legend</legend>
<ul class="form hvv">
<li>
<label>FORM 1:<br/><em>modifier class = vii</em></label>
<ul class="vii " >
<li><label>label</label><select><option>label</option></select></li>
<li><label>label</label><select><option>label</option></select></li>
<li><label>label</label><select><option>label</option></select></li>
<li><label>label</label><input type="text" /></li>
<li><label>label</label><input type="checkbox" /></li>
</ul>
</li>
<li>
<label>FORM 2:<br/><em>modifier class = vhh</em></label>
<ul class="vhh">
<li><label>label</label><input type="text" /><span class="leftNote">this is a note<br/>that is more than <br/> two lines </span></li>
<li><label>labeldd </label><input type="text" /></li>
<li><label>Tedst</label><input type="text" /></li>
<li><label>label</label><input type="text" /></li>
<li><label>label</label><input type="text" /></li>
</ul></li>
<li>
<label>FORM 3:<br/><em>modifier class = vvv </em></label>
<ul class="vvv">
<li><label>label</label><input type="text" /><span class="leftNote">This is a note</span></li>
<li><label>label</label><input type="text" /><span class="bottomNote">This is a note</span></li>
<li><label>label</label><input type="text" /></li>
<li><label>label</label><input type="text" /></li>
<li><label>label</label><input type="text" /></li>
<li><label>label</label><input type="text" /></li>
<li><label>label</label><input type="text" /></li>
<li><label>This is a long label over a textarea</label><textarea rows="5" cols="40"></textarea></li>
</ul>
</li>
</ul>
</fieldset>
<h2>Multiple Horizontal Forms Layed Out Vertically</h2>
<fieldset>
<legend>This is a legend</legend>
<ul class="form">
<li>
<label>FORM 1: <br/><em>modifier class = "hvv"</em></label>
<ul class="hvv required" >
<li><label>label</label><input type="checkbox" /></li>
<li><label>Long label within a horizontal form</label><select><option>label</option></select></li>
<li><label>label</label><input type="text" /></li>
<li><label>label</label><input type="text" /></li>
</ul>
</li>
<li>
<label>FORM 2: <br/><em>modifier class = "hii"</em></label>
<ul class="hii required">
<li><label>label</label><input type="checkbox" /></li>
<li><label>label</label><select><option>label</option></select></li>
<li>
<label>label</label>
<input type="text" /></li>
<li><label>label</label><input type="text" /></li>
</ul>
</li>
<li>
<label>FORM 3: <br/><em>modifer class = "hhh"</em></label>
<ul class="hhh required">
<li><label>label</label><input type="checkbox" /></li>
<li><label>label</label><select><option>label</option></select></li>
<li><label>label</label><input type="text" /><span class="bottomNote offset2">this is a note</span></li>
<li><label>label</label><input type="text" /></li>
</ul>
</li>
</ul>
</fieldset>
<h2>Multi Select Box</h2>
<fieldset>
<legend>This is a legend</legend>
<ul class="form hvv">
<li>
<label>Hey, this is a multi select box <br/><em>Modifier class = "vhh"</em></label>
<div class="multiSelect">
<ul class="form vhh ">
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li class="required"><input type="checkbox" /><label>label label label label label label </label></li>
<li><input type="checkbox" /><label>label</label></li>
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label label label label label label label label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
</ul>
</div>
</li>
<li>
<label>So Is this <br/><em>Modifier class = "vii"</em></label>
<div class="multiSelect" >
<ul class="form vii ">
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li class="required"><input type="checkbox" /><label>label label label label label label label label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>Tes fds fds fds fsdfdsfds fsfdsfdsf ds dst</label></li>
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
<li class="required"><input type="checkbox" /><label>label</label></li>
<li><input type="checkbox" /><label>label</label></li>
</ul>
</div>
</li>
</ul>
</fieldset>
</form>
</div>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.