.message .date { display: none; } @media (max-width: 576px) { /** .thread .media-body { min-width: 0; } .thread .media-body .subject { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } **/ a { color: #555555; } a:link { text-decoration: none; } a:visited { text-decoration: none; } a:hover { text-decoration: none; } a:active { text-decoration: none; } body { padding-top: 0; background: #ffffff; } .navbar { display: none; } #body>.container>.row>div { padding: 0; border: none; } .card { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; background-color: #fff; background-clip: border-box; border: 0; border-radius: 0.25rem; } .card-body { flex: 1 1 auto; padding: 9px 18px; } .message { padding-top: 5px; } .message p { margin: 0; line-height: 2; color: #525252; font-family: Helvetica Neue, NotoSansHans-Regular, AvenirNext-Regular, arial, Hiragino Sans GB, Microsoft Yahei, WenQuanYi Micro Hei, serif; } .message img { max-width: 100%; height: auto !important; border: 0px; border-radius: 3px; margin-bottom: 9px; } .message textarea { border: none; border-radius: 1rem; background: #f8f9fa; } .message textarea:focus { border-radius: 1rem; background: #f8f9fa; outline: none; border: 0; outline: none; } /* 主题列表 */ .card-threadlist { margin-top: 8rem; } .card-threadlist .card-header { display: none !important; } .card-threadlist a:visited { color: #666666; text-decoration: none; } .message .date { display: block; font-size: .8rem; margin-top: .5rem; } /* 移除全局页脚 */ #footer { display: none; } /* 附件 */ .message .fieldset>legend { display: none; } .message .fieldset::before { position: relative; top: -1.4rem; left: 0; content: "attach"; padding: 0 10px; font-size: 1rem; border-radius: .5rem; color: #ffffff; background-color: #FFBA10; } /* DEBUG - info */ .fieldset { padding: 8px; margin: 24px 0; border: none; border-radius: 2px; background: #f8f9fa; } .fieldset>p { color: #525252; } .fieldset>ul { list-style: none; padding: 0; margin: 0; color: #525252; } .debug::before { position: relative; top: -1.4rem; left: 0; content: "DEBUG"; padding: 0 10px; font-size: 1rem; border-radius: .5rem; color: #ffffff; background-color: #FFBA10; } } .card-thread .media .user_avatar { display: none; } .card-thread .card-body .media .media-body .a { display: none; } @media (max-width: 576px) { /* 主贴标题 */ .card-thread .card-body>.media { margin: 1rem 0; } .card-thread .card-body>.media>a { display: none; } .card-thread .card-body .media .media-body>h4 { margin-bottom: 0.8rem; } .card-thread .card-body .media .media-body>div>div { display: flex; flex-direction: row; } .card-thread .card-body .media .media-body>div>div:first-child>a { display: flex; align-items: center; } .card-thread .card-body .media .media-body>div>div>div { display: flex; flex-direction: column; } .card-thread .card-body .media .media-body .a { display: block; } .card-thread .card-body .media .media-body .a span.username { font-size: 1rem; } .card-thread .card-body .media .media-body .b span.username { display: none; } .card-thread .card-body .media .media-body .b span.date { margin-left: 0 !important; } /* 主贴分割线 */ .card-thread .card-body>hr { display: none; } .thread, .post { border-bottom: 0; padding: 0.8rem 0px; } /* 移除原有时间 */ .post .media-body .justify-content-between>div>span.date { display: none; } } /* 分页导航 */ @media (max-width: 576px) { .page-item:first-child .page-link { margin-left: 0; padding-left: 1rem; border-top-left-radius: .5rem; border-bottom-left-radius: .5rem; } .page-item:last-child .page-link { padding-right: 1rem; border-top-right-radius: .5rem; border-bottom-right-radius: .5rem; } .page-link { font-size: 1.2rem; position: relative; display: block; padding: 0.5rem 1rem; margin-left: -1px; line-height: 1.25; color: #555555; background-color: #fff; border: 1px solid #dee2e6; } .page-item.active .page-link { z-index: 1; color: #fff; background-color: #999999; border-color: #999999; } } /* Rw Nav */ nav.navbar { display: none; } @media (max-width: 576px) { nav.navbar { position: fixed; right: 0; left: 0; top: 0; z-index: 1030; border-width: 0 0 1px; min-height: 50px; margin-bottom: 20px; border: 1px solid transparent; display: flex; flex-direction: column; background-color: #ffffff; -webkit-transition: all 0.8s ease; transition: all 0.8s ease; } nav.navbar.shrink { min-height: 120px; } nav.navbar ul { display: flex; align-items: center; flex-direction: row; list-style: none; padding: 0; margin: 0; } nav.navbar>.a { opacity: 0; height: 0; -webkit-transition: all 0.8s ease; transition: all 0.8s ease; } nav.navbar>.b { width: 100%; overflow-x: scroll; overflow-y: hidden; white-space: nowrap; } nav.navbar>.b::-webkit-scrollbar {display:none} nav.navbar.shrink>.a { opacity: 1; height: 3rem; } nav.navbar .user {} nav.navbar .user img {} nav.navbar .search { flex: 8; padding: 0 12px; } nav.navbar .search div { width: 100%; min-width: 150px; height: 2.2rem; padding: 0 1rem; border-radius: 1.1rem; background: #eeeeee; border: 0; outline: none; } /** 暂时放弃输入框 nav.navbar .search input { width: 100%; min-width: 150px; height: 2.2rem; padding: 0 1rem; border-radius: 1.1rem; background: #eeeeee; border: 0; outline: none; } ::-webkit-input-placeholder { color: #ddd; text-align: center; } :-moz-placeholder { color: #ddd; text-align: center; } ::-moz-placeholder { color: #ddd; text-align: center; } :-ms-input-placeholder { color: #ddd; text-align: center; } */ nav.navbar .add { flex: 1; } nav.navbar .add a { display: block; height: 2.2rem; width: 2.2rem; padding: 0; text-align: center; border-radius: 1.1rem; line-height: 2.2rem; color: #ccc; background: #eeeeee; } nav.navbar .add .icon-edit:before { padding: 0; color: #555555; line-height: 2.2rem; } /* 返回按钮 */ .xn-back { display: block; width: 60%; } } /* USER */ #signin { display: flex; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 1031; background: rgba(255, 255, 255, .8); } /*设置移动效果*/ .card-threadlist .card-body { padding-left: 0; padding-right: 0; } .thread { padding-left: 18px; padding-right: 18px; transition:all 0.2s ; -webkit-transition:all 0.2s ; } .moveleft{ transform: translateX(-20px); -webkit-transform: translateX(-20px); position: relative; transition:all 0.2s ; -webkit-transition:all 0.2s ; } .moveleft::after { content: " "; position: absolute; right: -20px; display: block; background: #FFBA10; width: 20px; height: 100%; margin-top: -0.8rem; transition:all 0.2s ; -webkit-transition:all 0.2s ; }