github.com/outbrain/consul@v1.4.5/ui-v2/app/styles/components/modal-dialog/layout.scss (about) 1 %modal-dialog > div > div { 2 @extend %modal-window; 3 } 4 %with-modal { 5 overflow: hidden; 6 } 7 %modal-dialog { 8 z-index: 10000; 9 position: fixed; 10 left: 0; 11 top: 0; 12 width: 100%; 13 height: 100%; 14 } 15 %modal-control, 16 %modal-control + * { 17 display: none; 18 } 19 %modal-control:checked + * { 20 display: block; 21 } 22 %modal-dialog > label { 23 position: absolute; 24 top: 0; 25 left: 0; 26 width: 100%; 27 height: 100%; 28 } 29 %modal-dialog > div { 30 display: flex; 31 align-items: center; 32 justify-content: center; 33 height: 100%; 34 } 35 %modal-window.overflowing { 36 overflow: auto; 37 height: 100%; 38 } 39 %modal-window { 40 max-width: 855px; 41 position: relative; 42 z-index: 1; 43 } 44 %modal-window > * { 45 padding-left: 15px; 46 padding-right: 15px; 47 } 48 %modal-window > div { 49 padding: 20px 23px; 50 } 51 %modal-window > footer, 52 %modal-window > header { 53 padding-top: 12px; 54 padding-bottom: 10px; 55 } 56 %modal-window table { 57 height: 150px !important; 58 } 59 %modal-window tbody { 60 max-height: 100px; 61 } 62 %modal-window > header { 63 position: relative; 64 } 65 %modal-window > header [for='modal_close'] { 66 float: right; 67 text-indent: -9000px; 68 width: 23px; 69 height: 23px; 70 }