jquery ui dialog with redmond design

by nickadeemus2002

HTML

<link rel="stylesheet" href="http://code.jquery.com/ui/1.8.21/themes/base/jquery-ui.css">
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css">
<p><a href="#" id="show-modal">click me to show the modal box</a></p>
<div id="newVisit" title="new visit dialog">
    <h1>Hello!</h1>
    <p>This is the new visit dialog with the a .redmond style p tag</p>
    
</div>

CSS

.redmond h1{padding:10px;background-color:#585858;color:#fff;}
.redmond p{color:#ff0000;font-weight:bold;}

JavaScript

$(function () { 
 $('#newVisit').dialog({ 
     modal: true, 
     autoOpen: false, 
     draggable: true, 
     width: 'auto', 
     height: 'auto', 
     title: "Add New Visit" })
     .parent('.ui-dialog').wrap('<div class="redmond"></div>');        

    $('#show-modal').click(function(){
         $('#newVisit').dialog('open');        
    });    
});