DataBridge 2: css issue with messageContainer and black_overlay
If I have a long list on a page and click on delete button, is necessary to scroll down the page to see the pop-up message (see screenshots in attachment).
To fix I have changed these instructions, from:
----------
.black_overlay { display: none; position: absolute; top: 0%; left: 0%; width: 100%; height: 100%; background-color: black; z-index: 1001; -moz-opacity: 0.8; opacity: .80; filter: alpha(opacity=80); }
.messageContainer { display: none; position: absolute; top: 0; width: 100%; z-index: 1002; text-align: center; height: 100%; #position: relative; overflow: hidden; }
---------
to:
---------
.black_overlay { display: none; position: fixed; top: 0%; left: 0%; width: 100%; height: 100%; background-color: black; z-index: 10001; -moz-opacity: 0.8; opacity: .80; filter: alpha(opacity=80); }
.messageContainer { display: none; position: fixed; top: 0; left: 0; width: 100%; z-index: 10002; text-align: center; height: 100%; #position: fixed; overflow: hidden; }
---------
I have changed "absolute" with "fixed" for "position", add "left:0" for messageContainer and z-index with more high value (e.g. to avoid conflict with the sidebars that usually use the same values).
I also suggest you to change icons for the buttons "delete/update/detail" with svg (or use font-awesome), with retina/uhd display is better.
Finally, the css styles generated from DataBridge are too old, flat design is now the new standard... see Bootstrap 4 to understand what I mean for "flat design" (maybe could be a great idea if you create a style compatible with bootstrap).
