From bc958a3f7ba2bc68b4ce07cf6badc261cf408dff Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Lorenz=20H=C3=BCbschle-Schneider?= Date: Sun, 20 Jul 2014 11:40:23 +0100 Subject: [PATCH] Fix modal so that it reliably works on all plattforms --- css/glowingbear.css | 56 ++++++++++++++++++++++++++++++++++----------- index.html | 1 + 2 files changed, 44 insertions(+), 13 deletions(-) diff --git a/css/glowingbear.css b/css/glowingbear.css index 56dff4b..f8bc96f 100644 --- a/css/glowingbear.css +++ b/css/glowingbear.css @@ -360,29 +360,54 @@ table.notimestampseconds td.time span.seconds { } .gb-modal { - position: absolute; - left: 0px; - width:100%; - height: 100%; - z-index: 1000; - background-color:rgba(0, 0, 0, 0.5) + z-index: 1000; + height: 100%; + overflow-y: scroll; + position: absolute; + top: 0; + left: 0; + width: 100%; } + .gb-modal[data-state=hidden] { - transition: .2s ease-in-out, top .2s ease-in; - transition-delay: 0.1s, 0s; - top: -150px; + transition: .2s ease-in-out; visibility: hidden; opacity: 0; } .gb-modal[data-state=visible] { - transition: .2s ease-in-out, top .3s ease-out; - transition-delay: 0s, 0.1s; - top: 0px; - height: 200%; + transition: .2s ease-in-out; visibility: visible; opacity: 1; } + +.gb-modal[data-state=hidden] .modal-dialog { + transition: top .3s ease-in; + top: -150px; +} + +.gb-modal[data-state=visible] .modal-dialog { + transition: top .3s ease-out; + top: 0px; +} +.gb-modal .backdrop { + z-index: 999; + position: fixed; + top: 0; + height: 100%; + width: 100%; + overflow: none; + background-color:rgba(0, 0, 0, 0.5) +} +.gb-modal .modal-dialog { + z-index: 1001; + position: absolute; + margin-left: auto; + margin-right: auto; + left: 0; + right: 0; + top: 35px; +} .gb-modal[ng-click], .gb-modal div[ng-click] { cursor: default; } @@ -552,6 +577,11 @@ h2 span, h2 small { padding: 0px !important; } + .gb-modal .modal-dialog { + margin: 20px 2%; + width: 96%; + } + /* a different colour is too irregular on mobile */ .repeated-time .cof-chat_time, .repeated-time .cof-chat_time_delimiters { diff --git a/index.html b/index.html index f168188..ffcd456 100644 --- a/index.html +++ b/index.html @@ -264,6 +264,7 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
+