Fix bootstrap modal scrollbar bag

engine/actions/action_signin.go

@@ -7,6 +7,6 @@ import (
 func action_signin(e *Action) {
 	action := e.R.FormValue("action")
 	(*e.W).Write([]byte(fmt.Sprintf(`
-		alert('Action: %s');
+		ModalShowMsg('Login Action', 'Hello from web server (%s)');
 	`, action)))
 }

engine/wrapper/resources/scripts/assets.cp.scripts.js

@@ -1,4 +1,20 @@
+(function($) {
+	$.fn.hasScrollBar = function() {
+		return this.get(0).scrollHeight > this.get(0).clientHeight;
+	}
+})(jQuery);
+
+function DetectBodyScroll() {
+	var body = $('body');
+	if($(body).hasScrollBar()) {
+		$(body).removeClass('no-scroll');
+	} else {
+		$(body).addClass('no-scroll');
+	}
+}
+
 function ModalSysMsg(title, html) {
+	DetectBodyScroll();
 	var dialog = $('#sys-modal-msg');
 	$('#sysModalMsgLabel').text(title);
 	$('#sysModalMsgBody').html(html);
@@ -11,6 +27,13 @@ function ModalShowMsg(title, message) {
 }
 
 $(document).ready(function() {
+	// Fix body scroll
+	$(window).resize(function() {
+		DetectBodyScroll();
+	});
+	DetectBodyScroll();
+
+	// Ajax forms
 	$('form').each(function() {
 		$(this).submit(function(e) {
 			var form = $(this);

engine/wrapper/resources/scripts/assets.cp.scripts.js.go

@@ -1,7 +1,23 @@
 package scripts
 
 var File_assets_cp_scripts_js = []byte(`
+(function($) {
+	$.fn.hasScrollBar = function() {
+		return this.get(0).scrollHeight > this.get(0).clientHeight;
+	}
+})(jQuery);
+
+function DetectBodyScroll() {
+	var body = $('body');
+	if($(body).hasScrollBar()) {
+		$(body).removeClass('no-scroll');
+	} else {
+		$(body).addClass('no-scroll');
+	}
+}
+
 function ModalSysMsg(title, html) {
+	DetectBodyScroll();
 	var dialog = $('#sys-modal-msg');
 	$('#sysModalMsgLabel').text(title);
 	$('#sysModalMsgBody').html(html);
@@ -14,6 +30,13 @@ function ModalShowMsg(title, message) {
 }
 
 $(document).ready(function() {
+	// Fix body scroll
+	$(window).resize(function() {
+		DetectBodyScroll();
+	});
+	DetectBodyScroll();
+
+	// Ajax forms
 	$('form').each(function() {
 		$(this).submit(function(e) {
 			var form = $(this);

engine/wrapper/resources/styles/assets.cp.styles.css

@@ -1,3 +1,8 @@
+/* Bootstrap scroll fix */
+body.no-scroll {
+	padding-right: 0px !important;
+}
+
 /* Login/MySQL form */
 body.cp-login,
 body.cp-mysql {

engine/wrapper/resources/styles/assets.cp.styles.css.go

@@ -1,3 +1,3 @@
 package styles
 
-var File_assets_cp_styles_css = []byte(`body.cp-login,body.cp-mysql{height:100%;display:-ms-flexbox;display:-webkit-box;display:flex;-ms-flex-align:center;-ms-flex-pack:center;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;padding-top:40px;padding-bottom:40px;background-color:#f5f5f5}.cp-login .form-signin,.cp-mysql .form-signin{width:100%;max-width:330px;padding:15px;margin:0 auto}.cp-login .form-signin label,.cp-mysql .form-signin label{cursor:pointer}.cp-login .form-signin .form-control,.cp-mysql .form-signin .form-control{position:relative;box-sizing:border-box;height:auto;padding:10px;font-size:16px}.cp-login .form-signin .form-control:focus,.cp-mysql .form-signin .form-control:focus{z-index:2}.cp-login .form-signin input[type="email"]{margin-bottom:-1px;border-bottom-right-radius:0;border-bottom-left-radius:0}.cp-login .form-signin input[type="password"]{margin-bottom:10px;border-top-left-radius:0;border-top-right-radius:0}`)
+var File_assets_cp_styles_css = []byte(`body.no-scroll{padding-right:0!important}body.cp-login,body.cp-mysql{height:100%;display:-ms-flexbox;display:-webkit-box;display:flex;-ms-flex-align:center;-ms-flex-pack:center;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;padding-top:40px;padding-bottom:40px;background-color:#f5f5f5}.cp-login .form-signin,.cp-mysql .form-signin{width:100%;max-width:330px;padding:15px;margin:0 auto}.cp-login .form-signin label,.cp-mysql .form-signin label{cursor:pointer}.cp-login .form-signin .form-control,.cp-mysql .form-signin .form-control{position:relative;box-sizing:border-box;height:auto;padding:10px;font-size:16px}.cp-login .form-signin .form-control:focus,.cp-mysql .form-signin .form-control:focus{z-index:2}.cp-login .form-signin input[type="email"]{margin-bottom:-1px;border-bottom-right-radius:0;border-bottom-left-radius:0}.cp-login .form-signin input[type="password"]{margin-bottom:10px;border-top-left-radius:0;border-top-right-radius:0}`)