.popover { width: auto; } .popover-content { padding: 5px 0px; } .popover-title { overflow-x: hidden; text-overflow: ellipsis; text-align: center; font-size: inherit; line-height: inherit; } .popover-title:empty { display: none; } .popover_info { text-align: center; } .popover hr { margin-top: 5px; margin-bottom: 5px; } .popover-left, .popover-right { max-width: 200px; } .streams_popover .sp-container { background: white; cursor: pointer; border: none; } .sp-container { z-index: 100; } .colorpicker-container .sp-container input { -webkit-box-sizing: initial; -moz-box-sizing: inherit; -ms-box-sizing: inherit; box-sizing: initial; width: calc(100% - 13px); } .streams_popover .sp-palette-container { border-right: none; } .streams_popover .colorpicker-container { display: inline-block; margin-right: 10px; } .streams_popover .popover_sub_unsub_button { margin-top: 0px; float: none; } ul.sender_info_popover i { display: inline-block; width: 14px; text-align: center; margin-right: 3px; } ul.actions_popover i { display: inline-block; width: 14px; text-align: center; margin-right: 3px; } .user_popover { width: 240px; top: 100px!important; margin: -14px; padding: 0; } .user_popover .popover-title { padding: 0; } .user_popover .popover_info li { word-wrap: break-word; } .popover-avatar .popover-inner { width: 240px; } .popover-avatar { height: 240px; width: 240px; background-size: cover; background-position: center; position: relative; } .message-info-popover { padding: 0; } .message-info-popover .popover-title { padding: 0; } @media (max-width: 768px) { .message-info-popover { display: flex !important; justify-content: center; align-items: center; /* these are to override JS embedded inline styles. */ top: 0px !important; left: 0px !important; margin: 0 !important; width: 100vw; height: 100vh; background-color: hsla(0, 0%, 0%, 0.7); border-radius: 0px; border: none; pointer-events: none; } .message-info-popover .popover-inner { background-color: #fff; pointer-events: all; } .popover-flex { position: absolute; top: 0 !important; left: 0 !important; width: 100vw; height: 100vh; display: flex !important; justify-content: center; align-items: center; background-color: rgba(0, 0, 0, 0.7); z-index: 103; opacity: 0; pointer-events: none; transition: all 0.3s ease; } .popover-flex.fade.in { opacity: 1; pointer-events: all; } .popover-flex .popover { display: inline-block; } .emoji-info-popover { position: static; margin-right: 0; } } .popover_user_presence { display: inline-block; float: initial; position: relative; top: 1px; }