tweb/public/style-mobile.css

114 lines
13 KiB
CSS

@media only screen and (max-width: 720px){.chats-container .search-group-recent.search-group{padding:2px 0 0}}
@media only screen and (max-width: 720px){.chats-container .input-search{margin-left:16px}}
@media only screen and (max-width: 720px){.chats-container li{padding-bottom:0px}}
@media only screen and (max-width: 720px){.chats-container li>.rp{padding:9px 12px 0 9px !important;border-radius:0;margin:0;overflow:hidden}}
@media only screen and (max-width: 720px){.chats-container .search-group{margin-bottom:0}}
@media only screen and (max-width: 720px){.chats-container .search-group__name{padding:0 9px 0 16px;font-size:15px}}
@media only screen and (max-width: 720px){.chats-container .search-group-contacts{padding:7px 0 0px}}
@media only screen and (max-width: 720px){.chats-container .search-group-contacts .search-group__name{padding-bottom:0}}
@media only screen and (max-width: 720px){.contacts-container li,.search-group-contacts li{padding:0}}
@media only screen and (max-width: 720px){.contacts-container .user-caption,.search-group-contacts .user-caption{padding:0px 4px 0px 14px}}
@media only screen and (max-width: 720px){.contacts-container p,.search-group-contacts p{height:26px}}
@media only screen and (max-width: 720px){#bubble-contextmenu>div{padding:0 60px 0 16px}}
@media only screen and (max-width: 720px){#topbar.is-audio-shown+#bubbles,#topbar.is-pinned-shown:not(.hide-pinned)+#bubbles{margin-top:52px}#topbar.is-pinned-shown:not(.hide-pinned):not(.is-audio-shown) .pinned-message{display:flex}}
@media only screen and (max-width: 720px){#topbar .chat-mute-button,#topbar .chat-search-button{display:none}}
@media only screen and (max-width: 720px){#topbar .chat-more-button .btn-menu{top:29px}}
@media only screen and (max-width: 720px){#topbar .chat-more-button{margin-left:0}}
@media only screen and (max-width: 720px){#topbar .content{max-width:208px}}
@media only screen and (max-width: 720px){#topbar .person{margin-left:10px}}
@media only screen and (max-width: 720px){#chat-input .chat-input-container{padding:0 .5rem .5rem}}
@media only screen and (max-width: 720px){#chat-input .record-ripple{width:300px;height:300px;top:-124px;left:-124px}}
@media only screen and (max-width: 720px){#im-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}}
@media only screen and (max-width: 720px){.chat-container .input-message{min-height:46px;padding:0.5px .5rem}}
@media only screen and (max-width: 720px){.chat-container .pinned-message{position:absolute !important;top:100%;width:100% !important;background:#fff;left:0;max-height:100% !important;height:52px;padding:1rem}.chat-container .pinned-message-subtitle{line-height:13px !important;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;max-width:280px}}
@media only screen and (max-width: 720px){.chat-container .pinned-container{box-shadow:0px 1px 3px 0px rgba(0,0,0,0.15)}.chat-container .pinned-container:before{width:100%;content:" ";height:52px;left:0;top:0;position:absolute;box-shadow:inset 0px 1px 2px 0px rgba(0,0,0,0.15)}}
@media only screen and (max-width: 720px){.chat-container .pinned-container .pinned-message-close.tgico-close,.chat-container .pinned-container .pinned-audio-close.tgico-close,.chat-container .pinned-container .pinned-audio-ico.tgico-close{font-size:1.4rem;right:9px;visibility:visible}}
@media only screen and (max-width: 720px){.chat-container .pinned-audio{height:52px;padding-left:58px;background:#fff;width:100%;position:absolute;left:0;top:100%}}
@media only screen and (max-width: 720px){.chat-container .pinned-audio-ico{margin-left:20px}}
@media only screen and (max-width: 720px){#bubbles>.scrollable{padding:0 .5rem}}
@media only screen and (max-width: 720px){#bubbles-inner.is-chat .is-in .bubble__container{max-width:calc(100% - 3rem);margin-left:45px}}
@media only screen and (max-width: 720px){#bubbles-go-down{width:2.875rem;height:2.875rem}}
@media only screen and (max-width: 720px){#bubbles-go-down{right:.5rem}}
@media only screen and (max-width: 720px){.quiz-hint .container{padding:10px 18px 12px 54px;margin:0 10px;font-size:14px}}
@media only screen and (max-width: 720px){.bubble{max-width:min(calc(100% - 46px), 696px)}html.is-mac .bubble{-webkit-user-select:none;-webkit-touch-callout:none}}
@media only screen and (max-width: 720px){.bubble.is-first-unread{max-width:unset}}
@media only screen and (max-width: 720px){.bubble.is-reply.emoji-big .reply,.bubble.is-reply.sticker .reply{padding:8px 6px 8px 8px;max-width:94px}}
@media only screen and (max-width: 720px){.bubble .message.audio-message .audio{height:59px;padding-left:47px}}
@media only screen and (max-width: 720px){.bubble .message.audio-message .audio-details{margin-top:-1px}}
@media only screen and (max-width: 720px){.bubble .message.audio-message .audio-ico{margin-top:1px;margin-left:2px}}
@media only screen and (max-width: 720px){.bubble .message.audio-message .media-progress{width:unset}}
@media only screen and (max-width: 720px){.bubble .message.document-message .document{padding-left:44px}}
@media only screen and (max-width: 720px){.bubble.is-in.is-reply.emoji-big .reply,.bubble.is-in.is-reply.sticker .reply{left:calc(100% + 1px)}}
@media only screen and (max-width: 720px){.bubble.is-in{margin-right:auto}.bubble.is-out{margin-left:auto}}
@media only screen and (max-width: 720px){poll-element{min-width:240px}}
@media only screen and (max-width: 720px){poll-element .poll-title{max-width:88%}}
@media only screen and (max-width: 720px){.sidebar-header{padding:7.5px 8px}}
@media only screen and (max-width: 720px){.sidebar-header__title{padding-left:24px}}
@media only screen and (max-width: 720px){#column-left .sidebar-header__btn-container .btn-menu{margin-top:-4px}}
@media only screen and (max-width: 720px){#column-left .sidebar-tools-button .btn-menu .archived-count{font-size:14px;font-weight:600}}
@media only screen and (max-width: 720px){#column-left .search-group-people .rp{width:77px;max-width:77px}}
@media only screen and (max-width: 720px){#column-left .search-group-people .user-caption{max-width:56px}}
@media only screen and (max-width: 720px){#column-left .search-group-people .search-group-scrollable{margin-left:-7px;margin-top:4px}}
@media only screen and (max-width: 720px){#column-left .item-main .sidebar-content .btn-corner{transform:translateY(0px);position:fixed !important}}
@media only screen and (max-width: 720px){#column-left .item-main .sidebar-content .btn-menu-toggle{width:54px;height:54px;bottom:14px;right:14px}}
@media only screen and (max-width: 720px){.new-channel-container .input-wrapper,.new-group-container .input-wrapper,.edit-profile-container .input-wrapper{width:100%;padding:0 16px}}
@media only screen and (max-width: 720px){.settings-container .profile-button{padding:0.75rem 0.625rem;height:48px;margin:0 0 2px 0;border-radius:0}}
@media only screen and (max-width: 720px){.settings-container .profile-buttons{margin-top:0.6875rem}}
@media only screen and (max-width: 720px){.edit-profile-container .caption{padding-right:24px}}
@media only screen and (max-width: 720px){.chat-folders-container .sidebar-left-h2,.edit-folder-container .sidebar-left-h2{padding:7px 16px 15px 16px}}
@media only screen and (max-width: 720px){.chat-folders-container .category{padding:7px 16px 11px 16px}}
@media only screen and (max-width: 720px){.edit-folder-container .input-wrapper{width:100%;padding:0 16px}.edit-folder-container .input-field input{height:50px}}
@media only screen and (max-width: 720px){.edit-folder-container .sidebar-left-h2{width:100%;padding:21px 16px 8px 16px}}
@media only screen and (max-width: 720px){.folder-list li .rp{padding:8px 12px !important}}
@media only screen and (max-width: 720px){.folder-categories .checkbox [type="checkbox"]+span{padding-left:38px}}
@media only screen and (max-width: 720px){.folder-category-button{padding:13px 16px 10px 16px}}
@media only screen and (max-width: 720px){.included-chats-container .sidebar-left-h2{padding:6px 16px 8px 16px}}
@media only screen and (max-width: 720px){.included-chats-container .selector ul li>.rp{margin:0 !important}}
@media only screen and (max-width: 720px){.search-group-recent li{padding-top:0}}
@media only screen and (max-width: 720px){.search-group-recent .user-caption{margin-top:-2px}}
@media only screen and (max-width: 720px){.search-group-recent p span.user-title{font-weight:500}}
@media only screen and (max-width: 720px){.search-group-recent .dialog-avatar{width:46px;height:46px}}
@media only screen and (max-width: 720px){.search-group-recent li>.rp{height:62px}}
@media only screen and (max-width: 720px){.search-group-recent.search-group.search-group-contacts ul{margin-top:-2px}}
@media only screen and (max-width: 720px){.search-group.search-group-contacts ul,.search-group.search-group-messages ul{margin-top:7px}}
@media only screen and (max-width: 720px){.search-group.search-group-messages{margin-top:-6px}}
@media only screen and (max-width: 720px){.profile-subtitle{margin-top:3px}}
@media only screen and (max-width: 720px){.profile-row{padding-left:71px}}
@media only screen and (max-width: 720px){.profile-row:before{left:15px}}
@media only screen and (max-width: 720px){.profile-row-label{line-height:1.6}}
@media only screen and (max-width: 720px){.profile-avatar{margin:0 auto 10px;width:100px;height:100px}}
@media only screen and (max-width: 720px){.profile-tabs-content #content-media{padding:7.5px 7.5px 7.5px 6.5px}}
@media only screen and (max-width: 720px){.media-viewer{background:#000}}
@media only screen and (max-width: 720px){.media-viewer-userpic{display:none}}
@media only screen and (max-width: 720px){.media-viewer-buttons{display:none}}
@media only screen and (max-width: 720px){.media-viewer-switcher{width:4rem}}
@media only screen and (max-width: 720px){.media-viewer-whole .menu-mobile-close{position:absolute;left:20px;top:8px}.media-viewer-whole .btn-menu-toggle{position:fixed;right:8px;top:8px;z-index:5;opacity:0;transition:opacity .2s 0s,visibility 0s .2s}.media-viewer-whole .btn-menu-toggle.menu-open{color:#fff;background-color:rgba(112,117,121,0.2) !important}}
@media only screen and (max-width: 720px){.time{padding:7px 0px 9px 0px}}
@media only screen and (max-width: 720px){.emoji-dropdown .tabs-container .sticker-category .category-items>div{height:75px;justify-self:center;padding:0;min-width:64px;width:100%}}
@media only screen and (max-width: 720px){.emoji-dropdown .emoji-padding.active .menu-horizontal li{flex:unset;padding:0}.emoji-dropdown .emoji-padding.active .category-items>span{width:40px;height:40px;justify-self:center}.emoji-dropdown .emoji-padding.active .category-title{padding:12px 6px 6px 10px}.emoji-dropdown .emoji-padding.active .scrollable{padding:0}.emoji-dropdown .emoji-padding.active .emoji-category .category-items{grid-column-gap:unset;grid-template-columns:repeat(8, 1fr)}}
@media only screen and (max-width: 720px){.menu-horizontal__stripe{display:none}}
@media only screen and (max-width: 720px){.selector ul li>.rp{margin:0}}
@media only screen and (max-width: 720px){.popup-stickers .sticker-set-stickers{grid-template-columns:repeat(4, 1fr)}}
@media only screen and (max-width: 720px){#auth-pages .btn-primary{height:50px}}
@media only screen and (max-width: 720px){#auth-pages .subtitle{font-size:14px}}
@media only screen and (max-width: 720px){#auth-pages .input-wrapper{margin-top:41px;width:100%;padding:0 16px}}
@media only screen and (max-width: 720px){#auth-pages .page-password .input-wrapper{margin-top:31px}}
@media only screen and (max-width: 720px){.page-signQR .auth-image{width:166px;height:166px}}
@media only screen and (max-width: 720px){.page-signUp .auth-image{margin-bottom:24px}}
@media only screen and (max-width: 720px){.page-signUp #signUp{margin-top:100px}}
@media only screen and (max-width: 720px){.page-chats .main-column{width:100%}.page-chats .main-column:not(.active){display:none}}
@media only screen and (max-width: 720px){h4{font-size:20px;margin:2px 0 8px}}
@media only screen and (max-width: 720px){.btn-menu-item{padding:0 30px 0 16px;height:50px}}
@media only screen and (max-width: 720px){avatar-element{font-size:14px}}
@media only screen and (max-width: 720px){.c-ripple__circle{-webkit-animation-duration:.2s;animation-duration:.2s;transition-duration:.1s;border-radius:15%}}
@media only screen and (max-width: 720px){.document-ico,.document-download,.audio-ico,.audio-download{height:36px;width:36px}}
@media only screen and (max-width: 720px){.document .preloader-container,.audio .preloader-container{width:30px;height:30px}}
@media only screen and (max-width: 720px){.audio{padding-left:45px}}
@media only screen and (max-width: 720px){.audio-toggle,.audio-download{font-size:24px !important}}
@media only screen and (max-width: 720px){.audio-time,.audio-subtitle{margin-top:1px;font-size:12px}}
@media only screen and (max-width: 720px){.input-field input{height:50px}}
@media only screen and (max-width: 720px){.checkbox-field{margin-bottom:27px}}
@media only screen and (max-width: 720px){.auth-image{width:120px;height:120px}}
@media only screen and (max-width: 720px){.phone-edit{margin-top:-14px}}
@media only screen and (max-width: 720px){.btn-circle{height:46px;width:46px}}
@media only screen and (max-width: 720px){.profile-content #content-audio .preloader-container{width:40px;height:40px;top:10px;left:3px}}