diff --git a/css/legacy/dialog.css b/css/legacy/dialog.css
index 47ed385bcb..e08b482b92 100644
--- a/css/legacy/dialog.css
+++ b/css/legacy/dialog.css
@@ -6,14 +6,15 @@ div.dialog_wrapper {
 	display: none;
 	z-index: 90;
 	background-color: #FFF;
-	border: 3px solid #222;
-	box-shadow:1px 1px 5px #777;
-	-moz-box-shadow: 1px 1px 5px #777;
-	-webkit-box-shadow: 1px 1px 5px #777;
+	box-shadow:1px 1px 8px #444;
+	-moz-box-shadow: 1px 1px 8px #444;
+	-webkit-box-shadow: 1px 1px 8px #444;
 	
 	border-radius: 5px;
 	-moz-border-radius: 5px;
-	-webkit-border-radius: 5px;	
+	-webkit-border-radius: 5px;
+	
+	overflow: hidden;
 }
 
 div.dialog_head {
@@ -37,7 +38,7 @@ div.dialog_back {
 	left: 0px;
 	bottom: 0px;
 	right: 0px;
-	background-color: #EEE;
+	background-color: #aaa;
 	opacity: 0.6;
 	z-index: 50;
 	text-align: center;
diff --git a/css/ui/views.css b/css/ui/views.css
index 949ec0b44c..98ae471d8f 100644
--- a/css/ui/views.css
+++ b/css/ui/views.css
@@ -17,6 +17,7 @@ div.appframe-titlebar {
 	background: linear-gradient(top,  #eeeeee 0%,#cccccc 100%); /* W3C */
 	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
 	border-bottom: 1px solid #ccc;
+	min-height: 1.2em;
 }
 
 div.appframe-toolbar {
diff --git a/js/legacy/widgets/form/form_dialog.js b/js/legacy/widgets/form/form_dialog.js
index 5905d7c1bb..20a7a0be8a 100644
--- a/js/legacy/widgets/form/form_dialog.js
+++ b/js/legacy/widgets/form/form_dialog.js
@@ -32,7 +32,6 @@ _f.FrmDialog = function() {
 
 	var d = new Dialog(640, null, 'Edit Row');
 	this.body = $a(d.body, 'div', 'dialog_frm');
-	$y(d.body, {backgroundColor:'#EEE'});
 	d.done_btn_area = $a(d.body, 'div', '', {margin:'8px'});
 
 	// done button
@@ -90,7 +89,11 @@ _f.FrmDialog = function() {
 		// call onhide
 		if(me.cur_frm.cscript.hide_dialog) {
 			me.cur_frm.cscript.hide_dialog();
-		}	
+		}
+		
+		// hide the form
+		console.log(me.cur_frm.wrapper);
+		$(me.cur_frm.page_layout.wrapper).toggle(false);
 	}
 	this.dialog = d;
 }
@@ -98,7 +101,6 @@ _f.FrmDialog = function() {
 // called from table edit
 _f.edit_record = function(dt, dn) {
 	if(!_f.frm_dialog) {
-		// make by twin
 		_f.frm_dialog = new _f.FrmDialog();		
 	}
 	var d = _f.frm_dialog;
@@ -114,13 +116,16 @@ _f.edit_record = function(dt, dn) {
 				f.parent_doctype = cur_frm.doctype;
 				f.parent_docname = cur_frm.docname;
 			}
-
+			
 			d.cur_frm = f;
 			d.dn = dn;
 			d.table_form = f.meta.istable;
 
 			// show the form
 			f.refresh(dn);
+
+			$(f.page_layout.wrapper).removeClass('layout-wrapper')
+				.removeClass('layout-wrapper-background').toggle(true);
 			
 			d.dialog.show();				
 		})
diff --git a/js/wn/ui/dialog.js b/js/wn/ui/dialog.js
index 90f9e70402..c76603e7ac 100644
--- a/js/wn/ui/dialog.js
+++ b/js/wn/ui/dialog.js
@@ -114,25 +114,15 @@ wn.widgets.Dialog = function(opts) {
 	
 	this.make_head = function() {
 		var me = this;
-		this.head = $a(this.wrapper, 'div', 'dialog_head');
-
-		var t = make_table(this.head,1,2,'100%',['100%','16px'],{padding:'2px'});
-
-		$y($td(t,0,0),{paddingLeft:'16px',fontWeight:'bold',fontSize:'14px',textAlign:'center'});
-		$y($td(t,0,1),{textAlign:'right'});	
-
-		var img = $a($td(t,0,01),'img','',{cursor:'pointer'});
-		img.src='lib/images/icons/close.gif';
-
-		this.title_text = $td(t,0,0);
+		this.appframe = new wn.views.AppFrame(this.wrapper);
+		this.appframe.$titlebar.find('.close').unbind('click').click(function() {
+			if(me.oncancel)me.oncancel(); me.hide();
+		});
 		this.set_title(this.opts.title);
-
-		img.onclick = function() { if(me.oncancel)me.oncancel(); me.hide(); }
-		this.cancel_img = img;		
 	}
 	
 	this.set_title = function(t) {
-		this.title_text.innerHTML = t ? t : '';
+		this.appframe.$titlebar.find('.appframe-title').html(t || '');
 	}
 	
 	this.set_postion = function() {
@@ -182,7 +172,7 @@ wn.widgets.Dialog = function(opts) {
 	}
 		
 	this.no_cancel = function() {
-		$dh(this.cancel_img);
+		this.appframe.$titlebar.find('.close').toggle(false);
 	}
 
 	if(opts) this.make();
diff --git a/js/wn/views/appframe.js b/js/wn/views/appframe.js
index 19b1375a3e..b18ce5eaa4 100644
--- a/js/wn/views/appframe.js
+++ b/js/wn/views/appframe.js
@@ -4,8 +4,9 @@ wn.views.AppFrame = Class.extend({
 		this.$w = $('<div></div>').appendTo(parent);
 		
 		this.$titlebar = $('<div class="appframe-titlebar">\
-				<span class="close">&times;</span>\
-			</div>').appendTo(this.$w);
+			<span class="appframe-title"></span>\
+			<span class="close">&times;</span>\
+		</div>').appendTo(this.$w);
 
 		this.$w.find('.close').click(function() {
 			window.history.back();