[richfaces-svn-commits] JBoss Rich Faces SVN: r12932 - in management/design/realWorldDemo/html: images/shell and 1 other directory.

Author: admitriev Date: 2009-03-12 09:28:45 -0400 (Thu, 12 Mar 2009) New Revision: 12932 Added: management/design/realWorldDemo/html/search_result_albums.html management/design/realWorldDemo/html/search_result_photos.html management/design/realWorldDemo/html/search_result_users.html Modified: management/design/realWorldDemo/html/images/shell/avatar_w_default.png management/design/realWorldDemo/html/pabm3.css Log: Modified: management/design/realWorldDemo/html/images/shell/avatar_w_default.png =================================================================== (Binary files differ) Modified: management/design/realWorldDemo/html/pabm3.css =================================================================== --- management/design/realWorldDemo/html/pabm3.css 2009-03-12 10:57:04 UTC (rev 12931) +++ management/design/realWorldDemo/html/pabm3.css 2009-03-12 13:28:45 UTC (rev 12932) @@ -17,21 +17,21 @@ a{color : #DF6400;} -.preview_box_album_80 {width : 100px; position : relative; float : left; margin : 0px 10px 10px 0px;} +.preview_box_album_80 {width : 100px; position : relative; float : left; margin : 0px 10px 15px 0px;} .preview_box_album_80 img.pr_album_bg {width : 100px; height : 100px; position : absolute;} .preview_box_album_80 table{position : relative; width : 100px; height : 100px; text-align : center; vertical-align : middle; border-collapse : collapse;} .preview_box_album_80 table img{margin: 0px 0px 2px 0px; border : 1px solid #FFFFFF;} .preview_box_album_80 div.album_name {text-align : center; overflow : hidden; width : 100px; white-space : nowrap; margin-top : 3px; text-overflow: ellipsis; height : 14px;} .preview_box_album_80 div.album_data {text-align : center; overflow : hidden; width : 100px; white-space : nowrap; text-overflow: ellipsis; color : #666666; font-size : 10px; height : 14px} -.preview_box_album_120 {width : 140px; position : relative; float : left; margin : 0px 10px 10px 0px;} +.preview_box_album_120 {width : 140px; position : relative; float : left; margin : 0px 10px 15px 0px;} .preview_box_album_120 img.pr_album_bg {width : 140px; height : 140px; position : absolute;} .preview_box_album_120 table{position : relative; width : 140px; height : 140px; text-align : center; vertical-align : middle; border-collapse : collapse;} .preview_box_album_120 table img{margin: 0px 0px 2px 0px; border : 1px solid #FFFFFF;} .preview_box_album_120 div.album_name {text-align : center; overflow : hidden; width : 140px; white-space : nowrap; margin-top : 3px; text-overflow: ellipsis; height : 14px;} .preview_box_album_120 div.album_data {text-align : center; overflow : hidden; width : 140px; white-space : nowrap; text-overflow: ellipsis; color : #666666; font-size : 10px; height : 14px} -.preview_box_album_160 {width : 180px; position : relative; float : left; margin : 0px 10px 10px 0px;} +.preview_box_album_160 {width : 180px; position : relative; float : left; margin : 0px 10px 15px 0px;} .preview_box_album_160 img.pr_album_bg {width : 180px; height : 180px; position : absolute;} .preview_box_album_160 table{position : relative; width : 180px; height : 180px; text-align : center; vertical-align : middle; border-collapse : collapse;} .preview_box_album_160 table img{margin: 0px 0px 1px 1px; border : 1px solid #FFFFFF;} @@ -40,21 +40,21 @@ -.preview_box_photo_80 {width : 100px; position : relative; float : left; margin : 0px 10px 10px 0px;} +.preview_box_photo_80 {width : 100px; position : relative; float : left; margin : 0px 10px 15px 0px;} .preview_box_photo_80 img.pr_photo_bg {width : 100px; height : 100px; position : absolute;} .preview_box_photo_80 table{position : relative; width : 100px; height : 100px; text-align : center; vertical-align : middle; border-collapse : collapse;} .preview_box_photo_80 table img{margin: 0px 0px 0px 0px; border : 1px solid #FFFFFF;} .preview_box_photo_80 div.photo_name {text-align : center; overflow : hidden; width : 100px; white-space : nowrap; margin-top : 3px; text-overflow: ellipsis; height : 14px;} .preview_box_photo_80 div.photo_data {text-align : center; overflow : hidden; width : 100px; white-space : nowrap; text-overflow: ellipsis; color : #666666; font-size : 10px; height : 14px} -.preview_box_photo_120 {width : 140px; position : relative; float : left; margin : 0px 10px 10px 0px;} +.preview_box_photo_120 {width : 140px; position : relative; float : left; margin : 0px 10px 15px 0px;} .preview_box_photo_120 img.pr_photo_bg {width : 140px; height : 140px; position : absolute;} .preview_box_photo_120 table{position : relative; width : 140px; height : 140px; text-align : center; vertical-align : middle; border-collapse : collapse;} .preview_box_photo_120 table img{margin: 0px 0px 0px 0px; border : 1px solid #FFFFFF;} .preview_box_photo_120 div.photo_name {text-align : center; overflow : hidden; width : 140px; white-space : nowrap; margin-top : 3px; text-overflow: ellipsis; height : 14px;} .preview_box_photo_120 div.photo_data {text-align : center; overflow : hidden; width : 140px; white-space : nowrap; text-overflow: ellipsis; color : #666666; font-size : 10px; height : 14px} -.preview_box_photo_160 {width : 180px; position : relative; float : left; margin : 0px 10px 10px 0px;} +.preview_box_photo_160 {width : 180px; position : relative; float : left; margin : 0px 10px 15px 0px;} .preview_box_photo_160 img.pr_photo_bg {width : 180px; height : 180px; position : absolute;} .preview_box_photo_160 table{position : relative; width : 180px; height : 180px; text-align : center; vertical-align : middle; border-collapse : collapse;} .preview_box_photo_160 table img{margin: 0px 0px 0px 0px; border : 1px solid #FFFFFF;} Added: management/design/realWorldDemo/html/search_result_albums.html =================================================================== --- management/design/realWorldDemo/html/search_result_albums.html (rev 0) +++ management/design/realWorldDemo/html/search_result_albums.html 2009-03-12 13:28:45 UTC (rev 12932) @@ -0,0 +1,720 @@ +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> + +<html> +<head> + <title>Untitled</title> + <link rel="STYLESHEET" type="text/css" href="pabm3.css"> +</head> + +<body> + +<table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%"> + <tr> + <td colspan="2"> + <div class="top_part"> + <div class="header_box"> + <a href="#"><img src="images/shell/logo_top.gif" width="290" height="79" alt="" border="0" style="position : absolute;"></a> + <div class="auth_box"> + <table cellpadding="0" cellspacing="0" border="0"> + <tr> + + <td class="auth_data"> + Welcome, <span>Jhon Smith</span> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + </tr> + </table> + </div> + + <div class="about_toolbar"> + <table cellpadding="0" cellspacing="0" border="0"> + <tr> + + <td class="about_toolbar_item"> + <a href="#">User guide</a> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + <td class="about_toolbar_item"> + <a href="#">F.A.Q.</a> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + <td class="about_toolbar_item"> + <a href="#">About Demo at JBossWiki</a> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + <td class="about_toolbar_item"> + <a href="#">About Demo at JBossForum</a> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + </tr> + </table> + </div> + </div> + <div style="height : 37px; position : relative; background : url(images/shell/general_panelbar_bg.gif) repeat-x #A84807; padding-left : 15px; "> + <table height="37px" cellpadding="0" cellspacing="0" border="0" style="float:left"> + <tr> + + <td valign="middle"> + <img src="images/shell/general_panelbar_bullet.gif" width="11" height="15" alt="" border="0"><br> + </td> + <td style="vertical-align : top; padding : 7px 5px 0px 14px"> + <div> + <div style="height : 23px; float : left; width : 8px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_photo.png" width="31" height="23" alt="" border="0"> + </div> + <div style="height : 23px; float : left; background : url(images/shell/informer_bg.png) top left no-repeat; color : #FFFFFF; padding : 4px 0px 0px 3px; white-space : nowrap;"> + <a href="#" style="font-size : 11px; font-weight : bold; color : #ffffff; text-decoration : none;">My Album:</a> + </div> + <div style="height : 23px; float : left; width : 10px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_bg.png" width="163" height="23" alt="" border="0" style="position : absolute; top : 0px; right : 0px"> + </div> + </div> + + </td> + + </tr> + </table> + <table height="37px" cellpadding="0" cellspacing="0" border="0" style="float:left"> + <tr> + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <div style="cursor : pointer;"> + <div style="height : 23px; float : left;"> + <img src="images/shell/informer_shelf.png" width="31" height="23" alt="" border="0"> + </div> + <div style="height : 23px; float : left; background : url(images/shell/informer_bg.png) top left no-repeat; color : #FFFFFF; padding : 4px 0px 0px 0px;"> + 234 + </div> + <div style="height : 23px; float : left; width : 10px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_bg.png" width="163" height="23" alt="" border="0" style="position : absolute; top : 0px; right : 0px"> + </div> + </div> + </td> + + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <div style="cursor : pointer;"> + <div style="height : 23px; float : left;"> + <img src="images/shell/informer_album.png" width="31" height="23" alt="" border="0"> + </div> + <div style="height : 23px; float : left; background : url(images/shell/informer_bg.png) top left no-repeat; color : #FFFFFF; padding : 4px 0px 0px 0px;"> + 234 + </div> + <div style="height : 23px; float : left; width : 10px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_bg.png" width="163" height="23" alt="" border="0" style="position : absolute; top : 0px; right : 0px"> + </div> + </div> + </td> + + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <div style="cursor : pointer;"> + <div style="height : 23px; float : left;"> + <img src="images/shell/informer_photo.png" width="31" height="23" alt="" border="0"> + </div> + <div style="height : 23px; float : left; background : url(images/shell/informer_bg.png) top left no-repeat; color : #FFFFFF; padding : 4px 0px 0px 0px;"> + 234 + </div> + <div style="height : 23px; float : left; width : 10px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_bg.png" width="163" height="23" alt="" border="0" style="position : absolute; top : 0px; right : 0px"> + </div> + </div> + </td> + + </tr> + </table> + <img src="images/shell/general_panelbar_bullet.gif" width="11" height="15" alt="" border="0" style="float:left; margin : 11px 15px 0px 15px;"> + <table height="37px" cellpadding="0" cellspacing="0" border="0" style="float:left"> + <tr> + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <a href="#"><img src="images/shell/icon_add_shelf.png" width="37" height="23" alt="" border="0"></a><br> + </td> + + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <a href="#"><img src="images/shell/icon_add_album.png" width="37" height="23" alt="" border="0"></a><br> + </td> + + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <a href="#"><img src="images/shell/icon_add_photo.png" width="37" height="23" alt="" border="0"></a><br> + </td> + + </tr> + </table> + <img src="images/shell/general_panelbar_bullet.gif" width="11" height="15" alt="" border="0" style="float:left; margin : 11px 15px 0px 15px;"> + </div> + </div> + </td> + </tr> + <tr> + <td height="100%" valign="top"> + <div style="background : url(images/shell/general_panel_bg.gif) right top repeat-y; height : 100%;"> + <div style="height : 15px; background : url(images/shell/general_panel_header_bg.gif) right top; font-size : 1px;"> + <img src="images/shell/spacer.gif" width="300" height="1" alt="" border="0"> + </div> + + <div style="padding : 15px 35px 15px 15px;"> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/tree_icon_minus.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_shelf.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Shelf name'll be here. Maximal lenght is no limits :: <a href="#"><strong>7</strong> new</a> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name'll be here. Maximal lenght is no limits + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px; background : #f1f1f1; border : 1px solid #FFFFFF"> + <strong>Album name'll be here. Maximal lenght is no limits</strong> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name'll be here. + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name :: <a href="#"><strong>7</strong> new</a> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name'll be here. + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name'll be here. Maximal lenght is no limits + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/tree_icon_plus.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_shelf.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Shelf name'll be here. Maximal lenght is no limits :: <a href="#"><strong>7</strong> new</a> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/tree_icon_plus.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_shelf.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Shelf name'll be here :: <a href="#"><strong>7</strong> new</a> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/tree_icon_plus.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_shelf.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Shelf name + </td> + </tr> + </table> + + + </div> + + </div> + </td> + <td height="100%" width="100%" valign="top""> + <div style="background : url(images/shell/general_panel_bg.gif) right top repeat-y; height : 100%;"> + <div style="height : 15px; background : url(images/shell/general_panel_header_bg.gif) right top; font-size : 1px;"> + + </div> + <div class="content_box"> + + <table style="border-collapse : collapse; margin-bottom : 15px" cellpadding="0"> + <tr> + <td> + <h1 style="margin-bottom : 4px">Albums search result</h1> + </td> + <td style="padding-left : 20px"> + |&nbsp;&nbsp;<a href="#">Photos search result</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="#">Users search result</a>&nbsp;&nbsp;| + </td> + </tr> + </table> + <span style="color : #666666">Search criteria: <strong>tags, albums, photos</strong></span><br> + <div style="font-size : 1px; height : 5px"></div> + <span style="color : #666666">Keywords: <a href="#">breathtaking</a>, <a href="#">bright</a>, <a href="#">clouds</a>, <a href="#">cloudy</a>, <a href="#">day</a>, <a href="#">grass</a>, <a href="#">lens flare</a>, <a href="#">low angle</a>, <a href="#">view</a>, <a href="#">nature</a>, <a href="#">nobody</a>, <a href="#">outdoor</a>, <a href="#">peaceful</a>, <a href="#">picturesque</a>, <a href="#">serenity</a>, <a href="#">sky</a>, <a href="#">sunny</a>, <a href="#">sun</a>, <a href="#">sunshine</a></span> + + + <div style="margin : 30px 0px 0px 0px;"> + <div> + Preview size: inputNumberSlider + </div> + </div> + <br><br> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + <div class="preview_box_album_120"> + <img class="pr_album_bg" src="images/shell/frame_album_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="album_name"> + Album name'll be here + </div> + <div class="album_data"> + 3 Mar 2009 | 290 photos + </div> + <div class="album_data"> + <a href="#">Author full name</a> + </div> + </div> + + + + <div style="width : 90%; height : 10px; float : left;">&nbsp;&nbsp;&nbsp;<div> + + + </div> + + </div> + </td> + </tr> + <tr> + <td colspan="2"> + <div style="height : 82px; position : relative; background : url(images/shell/footer_bg.gif) repeat-x #000000;"> + <img src="images/shell/logo_bottom.gif" width="160" height="55" alt="" border="0" style="position : absolute; right : 0px; top : 27px"> + <div style="position : absolute; left : 8px; top : 51px"> + <table cellpadding="0" cellspacing="0" border="0"> + <tr> + + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + <td style="vertical-align : top; padding : 0px 15px 0px 8px"> + <a href="#" style="font-size : 11px; color : #ffffff; text-decoration : none;"> Terms And Conditions</a> + </td> + + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + <td style="vertical-align : top; padding : 0px 15px 0px 8px"> + <a href="#" style="font-size : 11px; color : #ffffff; text-decoration : none;">Privacy Statement</a> + </td> + + </tr> + </table> + </div> + </div> + </td> + </tr> +</table> + +<form style="margin : 0px"> + <div style="height : 65px; width: 339px; position : absolute; top : 64px; right : 0px; margin-right : 0px;"> + <img src="images/shell/search_bg.png" width="339" height="65" alt="" border="0" style="position : absolute; top : 0px; left: 0px"> + <div style="position : absolute; color : #FFFFFF; font-weight : bold; top : 22px; left : 20px"> + Search + </div> + <div style="position : absolute; color : #FFFFFF; font-weight : bold; top : 21px; left : 277px"> + Find + </div> + <input type="Text" style="width : 176px; height : 17px; border : 0px; position : absolute; top : 20px; left : 73px; background : none; font-weight : bold;"> + <input type="Image" src="images/shell/spacer.gif" border="0" style="width : 61px; height : 18px; position : absolute; top : 20px; left : 261px;"> + <div style="position : absolute; top : 41px; left : 197px"> + <a href="#" style="color : #FFFFFF; text-decoration : none">Options&nbsp;<img src="images/shell/bull_arr_down.gif" width="7" height="7" alt="" border="0"> </a> + </div> + </div> + <div style="height : 90px; width: 327px; position : absolute; top : 107px; right : 5px; background : none; display : none; overflow : hidden;"> + <img src="images/shell/search_option_bg.png" width="327" height="153" alt="" border="0" style="position : absolute; bottom : 0px; left: 0px"> + <div style="position : absolute; color : white; top : 7px; left : 45px"> + in&nbsp;<input type="checkbox">in My Album&nbsp;&nbsp;&nbsp;<input type="checkbox">in Shared Albums + </div> + <div style="position : absolute; color : white; top : 32px; padding-top : 3px; left : 38px; border-top : 1px solid #383838"> + for&nbsp;<input type="checkbox">Tags&nbsp;&nbsp;<input type="checkbox">Photos&nbsp;&nbsp;<input type="checkbox">Albums&nbsp;&nbsp;<input type="checkbox">Users + </div> + <div style="position : absolute; top : 70px; left : 163px"> + <a href="#" style="color : #FFFFFF; text-decoration : none">Hide options&nbsp;<img src="images/shell/bull_arr_up.gif" width="7" height="7" alt="" border="0"> </a> + </div> + </div> +</form> + +<div style="height : 52px; width: 79px; position : absolute; top : 0px; left : 278px; visibility : vidden;"> + <img src="images/shell/ai.png" width="52" height="79" alt="" border="0" style="position : absolute; top : 0px; left: 0px"> + <img src="images/shell/ai.gif" width="26" height="26" alt="" border="0" style="position : absolute; top : 26px; left: 13px"> +</div> +</body> +</html> Added: management/design/realWorldDemo/html/search_result_photos.html =================================================================== --- management/design/realWorldDemo/html/search_result_photos.html (rev 0) +++ management/design/realWorldDemo/html/search_result_photos.html 2009-03-12 13:28:45 UTC (rev 12932) @@ -0,0 +1,846 @@ +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> + +<html> +<head> + <title>Untitled</title> + <link rel="STYLESHEET" type="text/css" href="pabm3.css"> +</head> + +<body> + +<table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%"> + <tr> + <td colspan="2"> + <div class="top_part"> + <div class="header_box"> + <a href="#"><img src="images/shell/logo_top.gif" width="290" height="79" alt="" border="0" style="position : absolute;"></a> + <div class="auth_box"> + <table cellpadding="0" cellspacing="0" border="0"> + <tr> + + <td class="auth_data"> + Welcome, <span>Jhon Smith</span> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + </tr> + </table> + </div> + + <div class="about_toolbar"> + <table cellpadding="0" cellspacing="0" border="0"> + <tr> + + <td class="about_toolbar_item"> + <a href="#">User guide</a> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + <td class="about_toolbar_item"> + <a href="#">F.A.Q.</a> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + <td class="about_toolbar_item"> + <a href="#">About Demo at JBossWiki</a> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + <td class="about_toolbar_item"> + <a href="#">About Demo at JBossForum</a> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + </tr> + </table> + </div> + </div> + <div style="height : 37px; position : relative; background : url(images/shell/general_panelbar_bg.gif) repeat-x #A84807; padding-left : 15px; "> + <table height="37px" cellpadding="0" cellspacing="0" border="0" style="float:left"> + <tr> + + <td valign="middle"> + <img src="images/shell/general_panelbar_bullet.gif" width="11" height="15" alt="" border="0"><br> + </td> + <td style="vertical-align : top; padding : 7px 5px 0px 14px"> + <div> + <div style="height : 23px; float : left; width : 8px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_photo.png" width="31" height="23" alt="" border="0"> + </div> + <div style="height : 23px; float : left; background : url(images/shell/informer_bg.png) top left no-repeat; color : #FFFFFF; padding : 4px 0px 0px 3px; white-space : nowrap;"> + <a href="#" style="font-size : 11px; font-weight : bold; color : #ffffff; text-decoration : none;">My Album:</a> + </div> + <div style="height : 23px; float : left; width : 10px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_bg.png" width="163" height="23" alt="" border="0" style="position : absolute; top : 0px; right : 0px"> + </div> + </div> + + </td> + + </tr> + </table> + <table height="37px" cellpadding="0" cellspacing="0" border="0" style="float:left"> + <tr> + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <div style="cursor : pointer;"> + <div style="height : 23px; float : left;"> + <img src="images/shell/informer_shelf.png" width="31" height="23" alt="" border="0"> + </div> + <div style="height : 23px; float : left; background : url(images/shell/informer_bg.png) top left no-repeat; color : #FFFFFF; padding : 4px 0px 0px 0px;"> + 234 + </div> + <div style="height : 23px; float : left; width : 10px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_bg.png" width="163" height="23" alt="" border="0" style="position : absolute; top : 0px; right : 0px"> + </div> + </div> + </td> + + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <div style="cursor : pointer;"> + <div style="height : 23px; float : left;"> + <img src="images/shell/informer_album.png" width="31" height="23" alt="" border="0"> + </div> + <div style="height : 23px; float : left; background : url(images/shell/informer_bg.png) top left no-repeat; color : #FFFFFF; padding : 4px 0px 0px 0px;"> + 234 + </div> + <div style="height : 23px; float : left; width : 10px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_bg.png" width="163" height="23" alt="" border="0" style="position : absolute; top : 0px; right : 0px"> + </div> + </div> + </td> + + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <div style="cursor : pointer;"> + <div style="height : 23px; float : left;"> + <img src="images/shell/informer_photo.png" width="31" height="23" alt="" border="0"> + </div> + <div style="height : 23px; float : left; background : url(images/shell/informer_bg.png) top left no-repeat; color : #FFFFFF; padding : 4px 0px 0px 0px;"> + 234 + </div> + <div style="height : 23px; float : left; width : 10px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_bg.png" width="163" height="23" alt="" border="0" style="position : absolute; top : 0px; right : 0px"> + </div> + </div> + </td> + + </tr> + </table> + <img src="images/shell/general_panelbar_bullet.gif" width="11" height="15" alt="" border="0" style="float:left; margin : 11px 15px 0px 15px;"> + <table height="37px" cellpadding="0" cellspacing="0" border="0" style="float:left"> + <tr> + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <a href="#"><img src="images/shell/icon_add_shelf.png" width="37" height="23" alt="" border="0"></a><br> + </td> + + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <a href="#"><img src="images/shell/icon_add_album.png" width="37" height="23" alt="" border="0"></a><br> + </td> + + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <a href="#"><img src="images/shell/icon_add_photo.png" width="37" height="23" alt="" border="0"></a><br> + </td> + + </tr> + </table> + <img src="images/shell/general_panelbar_bullet.gif" width="11" height="15" alt="" border="0" style="float:left; margin : 11px 15px 0px 15px;"> + </div> + </div> + </td> + </tr> + <tr> + <td height="100%" valign="top"> + <div style="background : url(images/shell/general_panel_bg.gif) right top repeat-y; height : 100%;"> + <div style="height : 15px; background : url(images/shell/general_panel_header_bg.gif) right top; font-size : 1px;"> + <img src="images/shell/spacer.gif" width="300" height="1" alt="" border="0"> + </div> + + <div style="padding : 15px 35px 15px 15px;"> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/tree_icon_minus.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_shelf.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Shelf name'll be here. Maximal lenght is no limits :: <a href="#"><strong>7</strong> new</a> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name'll be here. Maximal lenght is no limits + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px; background : #f1f1f1; border : 1px solid #FFFFFF"> + <strong>Album name'll be here. Maximal lenght is no limits</strong> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name'll be here. + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name :: <a href="#"><strong>7</strong> new</a> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name'll be here. + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name'll be here. Maximal lenght is no limits + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/tree_icon_plus.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_shelf.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Shelf name'll be here. Maximal lenght is no limits :: <a href="#"><strong>7</strong> new</a> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/tree_icon_plus.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_shelf.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Shelf name'll be here :: <a href="#"><strong>7</strong> new</a> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/tree_icon_plus.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_shelf.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Shelf name + </td> + </tr> + </table> + + + </div> + + </div> + </td> + <td height="100%" width="100%" valign="top""> + <div style="background : url(images/shell/general_panel_bg.gif) right top repeat-y; height : 100%;"> + <div style="height : 15px; background : url(images/shell/general_panel_header_bg.gif) right top; font-size : 1px;"> + + </div> + <div class="content_box"> + + <table style="border-collapse : collapse; margin-bottom : 15px" cellpadding="0"> + <tr> + <td> + <h1 style="margin-bottom : 4px">Photos search result</h1> + </td> + <td style="padding-left : 20px"> + |&nbsp;&nbsp;<a href="#">Albums search result</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="#">Users search result</a>&nbsp;&nbsp;| + </td> + </tr> + </table> + <span style="color : #666666">Search criteria: <strong>tags, albums, photos</strong></span><br> + <div style="font-size : 1px; height : 5px"></div> + <span style="color : #666666">Keywords: <a href="#">breathtaking</a>, <a href="#">bright</a>, <a href="#">clouds</a>, <a href="#">cloudy</a>, <a href="#">day</a>, <a href="#">grass</a>, <a href="#">lens flare</a>, <a href="#">low angle</a>, <a href="#">view</a>, <a href="#">nature</a>, <a href="#">nobody</a>, <a href="#">outdoor</a>, <a href="#">peaceful</a>, <a href="#">picturesque</a>, <a href="#">serenity</a>, <a href="#">sky</a>, <a href="#">sunny</a>, <a href="#">sun</a>, <a href="#">sunshine</a></span> + + <div style="margin : 30px 0px 0px 0px;"> + <div style="float : right" onclick="window.location.href='#'" style="cursor : pointer"> + <img src="images/shell/tree_icon_slid.png" width="27" height="16" alt="" border="0" style="vertical-align : bottom; margin-right : 5px">Slideshow + </div> + <div> + Preview size: inputNumberSlider + </div> + </div> + <br><br> +<style> + +</style> + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/examples/photo_200.jpg" width="120" height="90" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + Photo name'll be here + </div> + <div class="photo_data"> + 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">Author full name</a> + </div> + </div> + + + + + + + <div style="width : 90%; height : 10px; float : left;">&nbsp;&nbsp;&nbsp;<div> + + + </div> + + </div> + </td> + </tr> + <tr> + <td colspan="2"> + <div style="height : 82px; position : relative; background : url(images/shell/footer_bg.gif) repeat-x #000000;"> + <img src="images/shell/logo_bottom.gif" width="160" height="55" alt="" border="0" style="position : absolute; right : 0px; top : 27px"> + <div style="position : absolute; left : 8px; top : 51px"> + <table cellpadding="0" cellspacing="0" border="0"> + <tr> + + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + <td style="vertical-align : top; padding : 0px 15px 0px 8px"> + <a href="#" style="font-size : 11px; color : #ffffff; text-decoration : none;"> Terms And Conditions</a> + </td> + + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + <td style="vertical-align : top; padding : 0px 15px 0px 8px"> + <a href="#" style="font-size : 11px; color : #ffffff; text-decoration : none;">Privacy Statement</a> + </td> + + </tr> + </table> + </div> + </div> + </td> + </tr> +</table> + +<form style="margin : 0px"> + <div style="height : 65px; width: 339px; position : absolute; top : 64px; right : 0px; margin-right : 0px;"> + <img src="images/shell/search_bg.png" width="339" height="65" alt="" border="0" style="position : absolute; top : 0px; left: 0px"> + <div style="position : absolute; color : #FFFFFF; font-weight : bold; top : 22px; left : 20px"> + Search + </div> + <div style="position : absolute; color : #FFFFFF; font-weight : bold; top : 21px; left : 277px"> + Find + </div> + <input type="Text" style="width : 176px; height : 17px; border : 0px; position : absolute; top : 20px; left : 73px; background : none; font-weight : bold;"> + <input type="Image" src="images/shell/spacer.gif" border="0" style="width : 61px; height : 18px; position : absolute; top : 20px; left : 261px;"> + <div style="position : absolute; top : 41px; left : 197px"> + <a href="#" style="color : #FFFFFF; text-decoration : none">Options&nbsp;<img src="images/shell/bull_arr_down.gif" width="7" height="7" alt="" border="0"> </a> + </div> + </div> + <div style="height : 90px; width: 327px; position : absolute; top : 107px; right : 5px; background : none; display : none; overflow : hidden;"> + <img src="images/shell/search_option_bg.png" width="327" height="153" alt="" border="0" style="position : absolute; bottom : 0px; left: 0px"> + <div style="position : absolute; color : white; top : 7px; left : 45px"> + in&nbsp;<input type="checkbox">in My Album&nbsp;&nbsp;&nbsp;<input type="checkbox">in Shared Albums + </div> + <div style="position : absolute; color : white; top : 32px; padding-top : 3px; left : 38px; border-top : 1px solid #383838"> + for&nbsp;<input type="checkbox">Tags&nbsp;&nbsp;<input type="checkbox">Photos&nbsp;&nbsp;<input type="checkbox">Albums&nbsp;&nbsp;<input type="checkbox">Users + </div> + <div style="position : absolute; top : 70px; left : 163px"> + <a href="#" style="color : #FFFFFF; text-decoration : none">Hide options&nbsp;<img src="images/shell/bull_arr_up.gif" width="7" height="7" alt="" border="0"> </a> + </div> + </div> +</form> + +<div style="height : 52px; width: 79px; position : absolute; top : 0px; left : 278px; visibility : vidden;"> + <img src="images/shell/ai.png" width="52" height="79" alt="" border="0" style="position : absolute; top : 0px; left: 0px"> + <img src="images/shell/ai.gif" width="26" height="26" alt="" border="0" style="position : absolute; top : 26px; left: 13px"> +</div> +</body> +</html> Added: management/design/realWorldDemo/html/search_result_users.html =================================================================== --- management/design/realWorldDemo/html/search_result_users.html (rev 0) +++ management/design/realWorldDemo/html/search_result_users.html 2009-03-12 13:28:45 UTC (rev 12932) @@ -0,0 +1,815 @@ +<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> + +<html> +<head> + <title>Untitled</title> + <link rel="STYLESHEET" type="text/css" href="pabm3.css"> +</head> + +<body> + +<table cellpadding="0" cellspacing="0" border="0" width="100%" height="100%"> + <tr> + <td colspan="2"> + <div class="top_part"> + <div class="header_box"> + <a href="#"><img src="images/shell/logo_top.gif" width="290" height="79" alt="" border="0" style="position : absolute;"></a> + <div class="auth_box"> + <table cellpadding="0" cellspacing="0" border="0"> + <tr> + + <td class="auth_data"> + Welcome, <span>Jhon Smith</span> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + </tr> + </table> + </div> + + <div class="about_toolbar"> + <table cellpadding="0" cellspacing="0" border="0"> + <tr> + + <td class="about_toolbar_item"> + <a href="#">User guide</a> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + <td class="about_toolbar_item"> + <a href="#">F.A.Q.</a> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + <td class="about_toolbar_item"> + <a href="#">About Demo at JBossWiki</a> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + <td class="about_toolbar_item"> + <a href="#">About Demo at JBossForum</a> + </td> + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + + </tr> + </table> + </div> + </div> + <div style="height : 37px; position : relative; background : url(images/shell/general_panelbar_bg.gif) repeat-x #A84807; padding-left : 15px; "> + <table height="37px" cellpadding="0" cellspacing="0" border="0" style="float:left"> + <tr> + + <td valign="middle"> + <img src="images/shell/general_panelbar_bullet.gif" width="11" height="15" alt="" border="0"><br> + </td> + <td style="vertical-align : top; padding : 7px 5px 0px 14px"> + <div> + <div style="height : 23px; float : left; width : 8px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_photo.png" width="31" height="23" alt="" border="0"> + </div> + <div style="height : 23px; float : left; background : url(images/shell/informer_bg.png) top left no-repeat; color : #FFFFFF; padding : 4px 0px 0px 3px; white-space : nowrap;"> + <a href="#" style="font-size : 11px; font-weight : bold; color : #ffffff; text-decoration : none;">My Album:</a> + </div> + <div style="height : 23px; float : left; width : 10px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_bg.png" width="163" height="23" alt="" border="0" style="position : absolute; top : 0px; right : 0px"> + </div> + </div> + + </td> + + </tr> + </table> + <table height="37px" cellpadding="0" cellspacing="0" border="0" style="float:left"> + <tr> + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <div style="cursor : pointer;"> + <div style="height : 23px; float : left;"> + <img src="images/shell/informer_shelf.png" width="31" height="23" alt="" border="0"> + </div> + <div style="height : 23px; float : left; background : url(images/shell/informer_bg.png) top left no-repeat; color : #FFFFFF; padding : 4px 0px 0px 0px;"> + 234 + </div> + <div style="height : 23px; float : left; width : 10px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_bg.png" width="163" height="23" alt="" border="0" style="position : absolute; top : 0px; right : 0px"> + </div> + </div> + </td> + + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <div style="cursor : pointer;"> + <div style="height : 23px; float : left;"> + <img src="images/shell/informer_album.png" width="31" height="23" alt="" border="0"> + </div> + <div style="height : 23px; float : left; background : url(images/shell/informer_bg.png) top left no-repeat; color : #FFFFFF; padding : 4px 0px 0px 0px;"> + 234 + </div> + <div style="height : 23px; float : left; width : 10px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_bg.png" width="163" height="23" alt="" border="0" style="position : absolute; top : 0px; right : 0px"> + </div> + </div> + </td> + + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <div style="cursor : pointer;"> + <div style="height : 23px; float : left;"> + <img src="images/shell/informer_photo.png" width="31" height="23" alt="" border="0"> + </div> + <div style="height : 23px; float : left; background : url(images/shell/informer_bg.png) top left no-repeat; color : #FFFFFF; padding : 4px 0px 0px 0px;"> + 234 + </div> + <div style="height : 23px; float : left; width : 10px; overflow : hidden; position : relative;"> + <img src="images/shell/informer_bg.png" width="163" height="23" alt="" border="0" style="position : absolute; top : 0px; right : 0px"> + </div> + </div> + </td> + + </tr> + </table> + <img src="images/shell/general_panelbar_bullet.gif" width="11" height="15" alt="" border="0" style="float:left; margin : 11px 15px 0px 15px;"> + <table height="37px" cellpadding="0" cellspacing="0" border="0" style="float:left"> + <tr> + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <a href="#"><img src="images/shell/icon_add_shelf.png" width="37" height="23" alt="" border="0"></a><br> + </td> + + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <a href="#"><img src="images/shell/icon_add_album.png" width="37" height="23" alt="" border="0"></a><br> + </td> + + <td style="vertical-align : top; padding : 7px 2px 0px 0px"> + <a href="#"><img src="images/shell/icon_add_photo.png" width="37" height="23" alt="" border="0"></a><br> + </td> + + </tr> + </table> + <img src="images/shell/general_panelbar_bullet.gif" width="11" height="15" alt="" border="0" style="float:left; margin : 11px 15px 0px 15px;"> + </div> + </div> + </td> + </tr> + <tr> + <td height="100%" valign="top"> + <div style="background : url(images/shell/general_panel_bg.gif) right top repeat-y; height : 100%;"> + <div style="height : 15px; background : url(images/shell/general_panel_header_bg.gif) right top; font-size : 1px;"> + <img src="images/shell/spacer.gif" width="300" height="1" alt="" border="0"> + </div> + + <div style="padding : 15px 35px 15px 15px;"> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/tree_icon_minus.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_shelf.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Shelf name'll be here. Maximal lenght is no limits :: <a href="#"><strong>7</strong> new</a> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name'll be here. Maximal lenght is no limits + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px; background : #f1f1f1; border : 1px solid #FFFFFF"> + <strong>Album name'll be here. Maximal lenght is no limits</strong> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name'll be here. + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name :: <a href="#"><strong>7</strong> new</a> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name'll be here. + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/spacer.gif" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_album.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Album name'll be here. Maximal lenght is no limits + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/tree_icon_plus.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_shelf.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Shelf name'll be here. Maximal lenght is no limits :: <a href="#"><strong>7</strong> new</a> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/tree_icon_plus.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_shelf.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Shelf name'll be here :: <a href="#"><strong>7</strong> new</a> + </td> + </tr> + </table> + <table style="border-collapse : collapse; margin-bottom : 7px;" cellpadding="0"> + <tr> + <td valign="top"> + <img src="images/shell/tree_icon_plus.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top"> + <img src="images/shell/tree_icon_shelf.png" width="25" height="16" alt="" border="0"><br> + </td> + <td valign="top" style="padding-left : 4px"> + Shelf name + </td> + </tr> + </table> + + + </div> + + </div> + </td> + <td height="100%" width="100%" valign="top""> + <div style="background : url(images/shell/general_panel_bg.gif) right top repeat-y; height : 100%;"> + <div style="height : 15px; background : url(images/shell/general_panel_header_bg.gif) right top; font-size : 1px;"> + + </div> + <div class="content_box"> + + <table style="border-collapse : collapse; margin-bottom : 15px" cellpadding="0"> + <tr> + <td> + <h1 style="margin-bottom : 4px">Users search result</h1> + </td> + <td style="padding-left : 20px"> + |&nbsp;&nbsp;<a href="#">Albums search result</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="#">Photos search result</a>&nbsp;&nbsp;| + </td> + </tr> + </table> + <span style="color : #666666">Search criteria: <strong>tags, albums, photos</strong></span><br> + <div style="font-size : 1px; height : 5px"></div> + <span style="color : #666666">Keywords: <a href="#">breathtaking</a>, <a href="#">bright</a>, <a href="#">clouds</a>, <a href="#">cloudy</a>, <a href="#">day</a>, <a href="#">grass</a>, <a href="#">lens flare</a>, <a href="#">low angle</a>, <a href="#">view</a>, <a href="#">nature</a>, <a href="#">nobody</a>, <a href="#">outdoor</a>, <a href="#">peaceful</a>, <a href="#">picturesque</a>, <a href="#">serenity</a>, <a href="#">sky</a>, <a href="#">sunny</a>, <a href="#">sun</a>, <a href="#">sunshine</a></span> + + + <br><br><br><br> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_w_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_w_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_w_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_w_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_w_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_w_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_w_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_w_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_w_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + <div class="preview_box_photo_120"> + <img class="pr_photo_bg" src="images/shell/frame_photo_200.png" border="0"> + <table cellpadding="0"> + <tr> + <td> + <a href="#"><img src="images/shell/avatar_w_default.png" width="80" height="80" alt="" border="0"></a><br> + </td> + </tr> + </table> + <div class="photo_name"> + <strong>Person full name</strong> + </div> + <div class="photo_data"> + Reg. 3 Mar 2009 + </div> + <div class="photo_data"> + <a href="#">20 albums</a>&nbsp;|&nbsp;<a href="#">290 photos</a> + </div> + </div> + + + + <div style="width : 90%; height : 10px; float : left;">&nbsp;&nbsp;&nbsp;<div> + + + </div> + + </div> + </td> + </tr> + <tr> + <td colspan="2"> + <div style="height : 82px; position : relative; background : url(images/shell/footer_bg.gif) repeat-x #000000;"> + <img src="images/shell/logo_bottom.gif" width="160" height="55" alt="" border="0" style="position : absolute; right : 0px; top : 27px"> + <div style="position : absolute; left : 8px; top : 51px"> + <table cellpadding="0" cellspacing="0" border="0"> + <tr> + + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + <td style="vertical-align : top; padding : 0px 15px 0px 8px"> + <a href="#" style="font-size : 11px; color : #ffffff; text-decoration : none;"> Terms And Conditions</a> + </td> + + <td valign="middle"> + <img src="images/shell/bullet.gif" width="3" height="15" alt="" border="0"><br> + </td> + <td style="vertical-align : top; padding : 0px 15px 0px 8px"> + <a href="#" style="font-size : 11px; color : #ffffff; text-decoration : none;">Privacy Statement</a> + </td> + + </tr> + </table> + </div> + </div> + </td> + </tr> +</table> + +<form style="margin : 0px"> + <div style="height : 65px; width: 339px; position : absolute; top : 64px; right : 0px; margin-right : 0px;"> + <img src="images/shell/search_bg.png" width="339" height="65" alt="" border="0" style="position : absolute; top : 0px; left: 0px"> + <div style="position : absolute; color : #FFFFFF; font-weight : bold; top : 22px; left : 20px"> + Search + </div> + <div style="position : absolute; color : #FFFFFF; font-weight : bold; top : 21px; left : 277px"> + Find + </div> + <input type="Text" style="width : 176px; height : 17px; border : 0px; position : absolute; top : 20px; left : 73px; background : none; font-weight : bold;"> + <input type="Image" src="images/shell/spacer.gif" border="0" style="width : 61px; height : 18px; position : absolute; top : 20px; left : 261px;"> + <div style="position : absolute; top : 41px; left : 197px"> + <a href="#" style="color : #FFFFFF; text-decoration : none">Options&nbsp;<img src="images/shell/bull_arr_down.gif" width="7" height="7" alt="" border="0"> </a> + </div> + </div> + <div style="height : 90px; width: 327px; position : absolute; top : 107px; right : 5px; background : none; display : none; overflow : hidden;"> + <img src="images/shell/search_option_bg.png" width="327" height="153" alt="" border="0" style="position : absolute; bottom : 0px; left: 0px"> + <div style="position : absolute; color : white; top : 7px; left : 45px"> + in&nbsp;<input type="checkbox">in My Album&nbsp;&nbsp;&nbsp;<input type="checkbox">in Shared Albums + </div> + <div style="position : absolute; color : white; top : 32px; padding-top : 3px; left : 38px; border-top : 1px solid #383838"> + for&nbsp;<input type="checkbox">Tags&nbsp;&nbsp;<input type="checkbox">Photos&nbsp;&nbsp;<input type="checkbox">Albums&nbsp;&nbsp;<input type="checkbox">Users + </div> + <div style="position : absolute; top : 70px; left : 163px"> + <a href="#" style="color : #FFFFFF; text-decoration : none">Hide options&nbsp;<img src="images/shell/bull_arr_up.gif" width="7" height="7" alt="" border="0"> </a> + </div> + </div> +</form> + +<div style="height : 52px; width: 79px; position : absolute; top : 0px; left : 278px; visibility : vidden;"> + <img src="images/shell/ai.png" width="52" height="79" alt="" border="0" style="position : absolute; top : 0px; left: 0px"> + <img src="images/shell/ai.gif" width="26" height="26" alt="" border="0" style="position : absolute; top : 26px; left: 13px"> +</div> +</body> +</html>