[richfaces-svn-commits] JBoss Rich Faces SVN: r5096 - management/design/comboBox/markup.

Fri Dec 28 15:13:58 EST 2007

Author: nbelaevski
Date: 2007-12-28 15:13:58 -0500 (Fri, 28 Dec 2007)
New Revision: 5096

Added:
   management/design/comboBox/markup/comboBoxNick1.html
Log:
draft for combo box design

Added: management/design/comboBox/markup/comboBoxNick1.html
===================================================================

--- management/design/comboBox/markup/comboBoxNick1.html	                        (rev 0)
+++ management/design/comboBox/markup/comboBoxNick1.html	2007-12-28 20:13:58 UTC (rev 5096)
@@ -0,0 +1,69 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
+
+<html>
+<head>  
+	<title>Untitled</title>
+<style>
+.cb_width{ width : 150px;}
+.cb_font{ font-size : 11px/*generalSizeFont*/; font-family : arial/*generalFamilyFont*/; color : #000000/*generalTextColor*/} 
+.cb_shell{ position : relative;}
+.cb_field{ position : absolute; top : 0px; left : 0; padding-right :20px; padding-left :3px; margin : 0px; border : 2px solid #c0c0c0; background-image: url(SpinnerFieldGradient.gif); background-position:left top;
+background-repeat:repeat-x; border-color: #BED6F8 rgb(255, 255, 255) #BED6F8 rgb(190, 214, 248); } /*panelBorderColor*/
+.cb_strut{ position : relative; visibility : hidden;  margin : 0px; padding : 2px;}
+.cb_button{ position : absolute; top : 0px; right : 0; width : 17px; margin : 0px; border : 1px solid #c0c0c0; border-color: #BED6F8 rgb(190, 214, 248) #BED6F8 rgb(190, 214, 248); } /*panelBorderColor*/
+.cb_button_bg{ background : url(images/bg_btn.png) top  repeat-x #C7D7EC;} /*gradient - from generalBackgroundColor to tabBackgroundColor, background-color - tabBackgroundColor*/
+.cb_button_bg_press{ background : url(images/bg_press.png) repeat-x bottom #C7D7EC} /*gradient - from tabBackgroundColor to generalBackgroundColor, background-color - tabBackgroundColor*/
+.cb_button_arrow{  background : url(images/down.gif) center  no-repeat; cursor : pointer;}
+
+.cb_list_cord{ position : relative; font-size : 0px;d!isplay : none}/*DDL is hidden!!!!!*/
+.cb_list_position{ position : absolute; top:-5px; left:0px;}
+.cb_list_decoration{border : 1px solid #BED6F8  /*panelBorderColor*/;  padding : 0px; background : #FFFFFF; /*tableBackgroundColor*/}
+.cb_list_scroll{ overflow : auto; overflow-x : hidden; height : 100;}
+.cb_option{ padding : 2px; white-space : nowrap;}
+.cb_select{ padding : 1px; width : 100%; background-color: #DFE8F6; border : 1px dotted #a3bae9;/*generalTextColor*/}
+</style>	
+</head>
+
+<body style="margin : 30px">
+
+<input class="cb_font cb_width">
+	<input type="Text" value="Input text or select option" class="cb_width cb_font cb_field" style="position: static">
+	<input type="Text" value="1px border" class="cb_width cb_font cb_field" style="border-width: 1px; position: static">
+
+<select class="cb_font cb_width">
+	<option>Item<option>
+	<option>Item<option>
+	<option>Item<option>
+	<option>Item<option>
+	<option>Item<option>
+</select>
+				<br><br>
+<div class="cb_width cb_font cb_shell">
+	<input type="Text" value="Input text or select option" class="cb_width cb_font cb_field">
+	<input readonly="" type="Text" value="" class="cb_button cb_font cb_button_bg">
+	<input readonly="" type="Text" value="" class="cb_button cb_font cb_button_arrow">
+	<input type="Text"class="cb_width cb_strut cb_font"><div class="cb_list_cord">
+		<div class="cb_list_position cb_width">
+			<div class="cb_list_decoration">
+				<div class="cb_list_scroll">
+					<div class="cb_option cb_font">Option 1</div>
+					<div class="cb_option cb_font">Option 2</div>
+					<div class="cb_option cb_font">Option 3</div>
+					<div class="cb_option cb_font">Option 4</div>
+					<div class="cb_option cb_font cb_select">Opt</div>
+					<div class="cb_option cb_font">Option 6</div>
+					<div class="cb_option cb_font">Option 7</div>
+					<div class="cb_option cb_font">Option 8</div>
+					<div class="cb_option cb_font">Option 9</div>
+					<div class="cb_option cb_font">Option 0</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</div>
+
+
+
+
+</body>
+</html>


