diff --git a/src/mibew/styles/chats/default/chat.css b/src/mibew/styles/chats/default/chat.css index 98ad29e2..d3533ba9 100644 --- a/src/mibew/styles/chats/default/chat.css +++ b/src/mibew/styles/chats/default/chat.css @@ -506,7 +506,6 @@ ul li { #invitation-messages-region { height: 150px; min-height: 150px; - width: 388px; overflow-y: auto; padding: 0; font-weight: normal; @@ -576,11 +575,17 @@ ul li { #logo img { max-width: 100%; } + #invitation-messages-region { + max-width: 100%; + } } -/* additional trick for desktops */ +/* additional tricks for desktops */ @media (min-width: 501px) { #footer { width: 400px; } + #invitation-messages-region { + width: 388px; + } } diff --git a/src/mibew/styles/invitations/default/invite.css b/src/mibew/styles/invitations/default/invite.css index 5a9a4d36..0f30d581 100644 --- a/src/mibew/styles/invitations/default/invite.css +++ b/src/mibew/styles/invitations/default/invite.css @@ -36,7 +36,6 @@ position: fixed !important; bottom: 5px !important; right: 5px !important; - width: 400px !important; z-index: 100 !important; border-radius: 10px !important; -webkit-border-radius: 10px !important; @@ -97,7 +96,6 @@ max-width: 100px !important; } #mibew-invitation-frame { - width: 388px !important; height: 150px !important; overflow: hidden !important; border: 1px solid #bbc4c4 !important; @@ -140,3 +138,24 @@ background: -ms-linear-gradient(#e9f6fc, #c6e5f6) !important; background: linear-gradient(#e9f6fc, #c6e5f6) !important; } + +/* responsive design for mobile devices */ +@media only screen and (max-width: 500px) { + #mibew-invitation-popup { + max-width: 100% !important; + } + #mibew-invitation-frame { + max-width: 100% !important; + } +} + +/* additional trick for desktops */ +@media (min-width: 501px) { + #mibew-invitation-popup { + width: 400px !important; + } + + #mibew-invitation-frame { + width: 388px !important; + } +}