Author: Ochikvina Date: 2011-01-25 11:49:29 -0500 (Tue, 25 Jan 2011) New Revision: 21221 Modified: management/design-4x/message/message.html management/design-4x/message/messages.html Log: Updated markups. Modified: management/design-4x/message/message.html =================================================================== --- management/design-4x/message/message.html 2011-01-25 16:47:41 UTC (rev 21220) +++ management/design-4x/message/message.html 2011-01-25 16:49:29 UTC (rev 21221) @@ -14,11 +14,12 @@ font-size:11px;/*generalSizeFont*/ } .rf-msg-mkr { + display:inline-block; + height:16px; padding-right:2px; - } - .rf-msg-mkr img{ vertical-align:middle; - } + width:16px; + } .rf-msg-lbl { vertical-align:middle; } @@ -27,6 +28,7 @@ .rf-msg-err{ } .rf-msg-err-mkr { + background:url(images/error.png) left center no-repeat; } .rf-msg-err-lbl { color:#ff0000; @@ -39,6 +41,7 @@ .rf-msg-ftl{ } .rf-msg-ftl-mkr { + background:url(images/fatal.png) left center no-repeat; } .rf-msg-ftl-lbl { color:#ff0000; @@ -47,6 +50,7 @@ .rf-msg-inf{ } .rf-msg-inf-mkr { + background:url(images/info.png) left center no-repeat; } .rf-msg-inf-lbl { color:#000000; @@ -55,6 +59,7 @@ .rf-msg-wrn{ } .rf-msg-wrn-mkr { + background:url(images/warning.png) left center no-repeat; } .rf-msg-wrn-lbl { color:#000000; @@ -65,9 +70,7 @@ <h1>ERROR Message</h1> <span class="rf-msg rf-msg-err"> - <span class="rf-msg-mkr rf-msg-err-mkr"> - <img src="images/error.png" alt="Message marker"/> - </span> + <span class="rf-msg-mkr rf-msg-err-mkr"></span> <span class="rf-msg-lbl rf-msg-err-lbl"> <span class="rf-msg-sum">Name: Validation Error: Value is less than allowable minimum of '3'.</span> <span class="rf-msg-des">Description</span> @@ -77,9 +80,7 @@ <h1>FATAL Message</h1> <span class="rf-msg rf-msg-ftl"> - <span class="rf-msg-mkr rf-msg-ftl-mkr"> - <img src="images/fatal.png" alt="Message marker"/> - </span> + <span class="rf-msg-mkr rf-msg-ftl-mkr"></span> <span class="rf-msg-lbl rf-msg-ftl-lbl"> <span class="rf-msg-sum">Fatal error!</span> <span class="rf-msg-des">Description</span> @@ -89,9 +90,7 @@ <h1>INFO Message</h1> <span class="rf-msg rf-msg-inf"> - <span class="rf-msg-mkr rf-msg-inf-mkr"> - <img src="images/info.png" alt="Message marker"/> - </span> + <span class="rf-msg-mkr rf-msg-inf-mkr"></span> <span class="rf-msg-lbl rf-msg-inf-lbl"> <span class="rf-msg-sum">Information!</span> <span class="rf-msg-des">Description</span> @@ -101,9 +100,7 @@ <h1>WARNING Message</h1> <span class="rf-msg rf-msg-wrn"> - <span class="rf-msg-mkr rf-msg-wrn-mkr"> - <img src="images/warning.png" alt="Message marker"/> - </span> + <span class="rf-msg-mkr rf-msg-wrn-mkr"></span> <span class="rf-msg-lbl rf-msg-wrn-lbl"> <span class="rf-msg-sum">Warning!</span> <span class="rf-msg-des">Description</span> Modified: management/design-4x/message/messages.html =================================================================== --- management/design-4x/message/messages.html 2011-01-25 16:47:41 UTC (rev 21220) +++ management/design-4x/message/messages.html 2011-01-25 16:49:29 UTC (rev 21221) @@ -19,8 +19,11 @@ padding:0; } .rf-msgs li{ - margin:5px 0; + margin:6px 0; } + .rf-msgs-lbl { + vertical-align:middle; + } .rf-msgs table{ padding:0 0 8px; } @@ -29,24 +32,26 @@ text-align:left; } .rf-msgs td{ - padding:2px 0; - vertical-align:middle; + padding:3px 0; } .rf-msgs-hdr{ font-weight:bold; } .rf-msgs-mkr{ + display:inline-block; + height:16px; + vertical-align:middle; + padding-right:2px; + width:16px; } td.rf-msgs-mkr{ padding-right:5px; } - .rf-msgs-mkr img { - vertical-align:middle; - } /* ERROR specific */ .rf-msgs-err{ } .rf-msgs-err-mkr { + background:url(images/error.png) left center no-repeat; } .rf-msgs-err-lbl { color:#ff0000; @@ -55,6 +60,7 @@ .rf-msgs-ftl{ } .rf-msgs-ftl-mkr { + background:url(images/fatal.png) left center no-repeat; } .rf-msgs-ftl-lbl { color:#ff0000; @@ -63,6 +69,7 @@ .rf-msgs-inf{ } .rf-msgs-inf-mkr { + background:url(images/info.png) left center no-repeat; } .rf-msgs-inf-lbl { color:#000000; @@ -71,6 +78,7 @@ .rf-msgs-wrn{ } .rf-msgs-wrn-mkr { + background:url(images/warning.png) left center no-repeat; } .rf-msgs-wrn-lbl { color:#000000; @@ -84,28 +92,28 @@ <div class="rf-msgs-hdr">Entered Data Status:</div> <ul> <li class="rf-msgs-err"> - <span class="rf-msgs-mkr rf-msgs-err-mkr"><img src="images/error.png" alt="Messages Marker"/></span> + <span class="rf-msgs-mkr rf-msgs-err-mkr"></span> <span class="rf-msgs-lbl rf-msgs-err-lbl"> <span class="rf-msgs-sum">Name: Validation Error: Value is required.</span> <span class="rf-msgs-des">Description.</span> </span> </li> <li class="rf-msgs-ftl"> - <span class="rf-msgs-mkr rf-msgs-ftl-mkr"><img src="images/fatal.png" alt="Messages Marker"/></span> + <span class="rf-msgs-mkr rf-msgs-ftl-mkr"></span> <span class="rf-msgs-lbl rf-msgs-ftl-lbl"> <span class="rf-msgs-sum">Fatal Error!</span> <span class="rf-msgs-des">Description.</span> </span> </li> <li class="rf-msgs-inf"> - <span class="rf-msgs-mkr rf-msgs-inf-mkr"><img src="images/info.png" alt="Messages Marker"/></span> + <span class="rf-msgs-mkr rf-msgs-inf-mkr"></span> <span class="rf-msgs-lbl rf-msgs-inf-lbl"> <span class="rf-msgs-sum">Information!</span> <span class="rf-msgs-des">Description.</span> </span> </li> <li class="rf-msgs-wrn"> - <span class="rf-msgs-mkr rf-msgs-wrn-mkr"><img src="images/warning.png" alt="Messages Marker"/></span> + <span class="rf-msgs-mkr rf-msgs-wrn-mkr"></span> <span class="rf-msgs-lbl rf-msgs-wrn-lbl"> <span class="rf-msgs-sum">Warning!</span> <span class="rf-msgs-des">Description.</span> @@ -125,28 +133,28 @@ </thead> <tbody> <tr class="rf-msgs-err"> - <td class="rf-msgs-mkr rf-msgs-err-mkr"><img src="images/error.png" alt="Messages Marker"/></td> + <td class="rf-msgs-mkr rf-msgs-err-mkr"></td> <td class="rf-msgs-lbl rf-msgs-err-lbl"> <span class="rf-msgs-sum">Name: Validation Error: Value is required.</span> <span class="rf-msgs-des">Description.</span> </td> </tr> <tr class="rf-msgs-ftl"> - <td class="rf-msgs-mkr rf-msgs-ftl-mkr"><img src="images/fatal.png" alt="Messages Marker"/></td> + <td class="rf-msgs-mkr rf-msgs-ftl-mkr"></td> <td class="rf-msgs-lbl rf-msgs-ftl-lbl"> <span class="rf-msgs-sum">Fatal Error!</span> <span class="rf-msgs-des">Description.</span> </td> </tr> <tr class="rf-msgs-inf"> - <td class="rf-msgs-mkr rf-msgs-inf-mkr"><img src="images/info.png" alt="Messages Marker"/></td> + <td class="rf-msgs-mkr rf-msgs-inf-mkr"></td> <td class="rf-msgs-lbl rf-msgs-inf-lbl"> <span class="rf-msgs-sum">Information!</span> <span class="rf-msgs-des">Description.</span> </td> </tr> <tr class="rf-msgs-wrn"> - <td class="rf-msgs-mkr rf-msgs-wrn-mkr"><img src="images/warning.png" alt="Messages Marker"/></td> + <td class="rf-msgs-mkr rf-msgs-wrn-mkr"></td> <td class="rf-msgs-lbl rf-msgs-wrn-lbl"> <span class="rf-msgs-sum">Warning!</span> <span class="rf-msgs-des">Description.</span>