overlay-parent.css

Basic styling for the Overlay module.

File

drupal/core/modules/overlay/css/overlay-parent.css
View source
  1. 

  2. /**

  3.  * @file

  4.  * Basic styling for the Overlay module.

  5.  */

  6. 

  7. html.overlay-open,

  8. html.overlay-open body {

  9.   height: 100%;

  10.   overflow: hidden;

  11. }

  12. 

  13. #overlay-container,

  14. .overlay-modal-background,

  15. .overlay-element {

  16.   height: 100%;

  17.   left: 0;

  18.   position: absolute;

  19.   top: 0;

  20.   width: 100%;

  21.   z-index: 500;

  22. }

  23. 

  24. .overlay-modal-background {

  25.   /* Using a transparent png renders faster than using opacity */

  26.   background: transparent url(../images/background.png) repeat;

  27. }

  28. 

  29. .overlay-element {

  30.   background: transparent;

  31.   left: -200%;

  32.   z-index: 501;

  33. }

  34. .overlay-element.overlay-active {

  35.   left: 0;

  36. }

  37. 

  38. html.overlay-open .displace-top,

  39. html.overlay-open .displace-bottom {

  40.   z-index: 600;

  41. }

  42. 

  43. /**

  44.  * Within the overlay parent, the message about disabling the overlay is for

  45.  * screen-reader users only. It is always kept invisible with the

  46.  * element-invisible class, and removed from the tab order. Overlay-child.css

  47.  * contains styling for the same message appearing within the overlay, and

  48.  * intended for sighted users.

  49.  */

  50. #overlay-disable-message {

  51.   display: none;

  52. }

  53. html.overlay-open #overlay-disable-message {

  54.   display: block;

  55. }