limelight气泡泡 by lhcfl

/* ==UserStyle==
@name           limelight.moe - 2022/8/22 16:55:51
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    A new userstyle
@author         Me
==/UserStyle== */

@-moz-document domain("limelight.moe") {

    :root {
        --msg-bkg: rgba(var(--secondary-rgb), 0.95)
    }
    .posts-wrapper {
/*         background-color: var(--msg-bkg); */
        padding:10px 0 0 10px;
        border-radius:10px;
    }
    .posts-wrapper .small-action {
        margin:2px 0;
        border:none;
        padding:0;
        box-shadow:none;
        background: transparent;
        
    }
    .small-action.topic-post-visited .topic-post-visited-line{
        margin: 5px 0 10px 50px;
    }
    
    .posts-wrapper .small-action .small-action-desc.timegap {
        padding:2px;
    }
   
    
     .posts-wrapper .topic-body {
        background-color: var(--msg-bkg);
        margin-left:13px;
        box-shadow:none;
        border:1px solid var(--primary-low-mid) !important;
        border-radius: 0 20px 20px 20px;
        padding:0;
        margin-top:0px;
        margin-bottom:9px;
        width:auto;
        max-width:680px;
        padding-bottom: 8px;
    } 
    
     .posts-wrapper .topic-body:hover {
        min-width:250px;
    } 
    
    .posts-wrapper .current-user-post .topic-body {
        
        background-image: linear-gradient(to bottom right,rgba(var(--tertiary-rgb), 0.1),rgba(var(--tertiary-rgb), 0.1))
    }
    @media (max-width: 810px) {
        .posts-wrapper .topic-body {
            max-width: calc(100% - 80px) !important;
        }
    }
    
    .post-notice.returning-user {
        margin-bottom:10px;
        padding: 0;
        background-color:transparent;
        border:none;
    }
    
    
    .posts-wrapper .topic-body .topic-meta-data {
        margin:0;
        font-size: 16px;
        padding: 5px 15px 0 15px;
        background-color: transparent;
        border: none;
    }
    .posts-wrapper .topic-body .contents {
        padding: 0;
        margin:0;
        border: none;
    }
    .posts-wrapper .topic-body .cooked {
        padding: 0 15px;
        margin:0;
        font-size: 16px;
    }
    .posts-wrapper .topic-body p {
        margin:0;
    }
    .post-menu-area {
        margin: 0;
    }
    .posts-wrapper .topic-avatar {
        margin-top:-13px; 
        border:none;
/*       曲线救国   */
    }
    
    .posts-wrapper .post-actions {
        margin:0;
    }
   
    
    .posts-wrapper .topic-body nav.post-controls {
        font-size: 100%;
        
    }
    
    @keyframes action-show{
        0%{
            opacity:0;
        }
        100% {
            opacity:1;
        }
    }
    @keyframes title-show{
        0%{
            max-width: 0;
        }
        100% {
            max-width: 500px;
        }
    }
    .posts-wrapper .topic-body nav.post-controls .actions {
        display:none;
        font-size: 80%;
        position: absolute;
/*         bottom:-7px; */
        bottom:-40px;
        border:1px solid var(--primary-low-mid);
        right:15px;
        border-radius: 15px;
        background: var(--secondary);
        z-index:-1;
        animation: action-show 0.2s ease-out;
    }
    
    .posts-wrapper .topic-body:hover nav.post-controls .actions{
        display: inline-flex;
        font-size: 80%;
        z-index:2
    }
    
    .posts-wrapper .topic-body .second.full-name, .posts-wrapper .topic-body .user-title {
        display: none;
        animation: title-show 1s ease-out;
    }
    
    .posts-wrapper .topic-body:hover .second.full-name, .posts-wrapper .topic-body:hover .user-title {
        display: inline-block;
    }
   
    
    .posts-wrapper section.post-menu-area .widget-button.btn-flat.show-replies, .posts-wrapper section.post-menu-area .widget-button.btn-flat.reply{
        border-radius:100px;
    }
    

    
    
    
    
    
    
    
    .mobile-view .posts-wrapper {
        padding: 0;
    }
    .mobile-view .posts-wrapper .topic-body {
        margin-left:44px;
        width: fit-content !important;
        min-width: 0;
        max-width: calc(100% - 60px) !important;
    }
     .mobile-view .posts-wrapper .topic-avatar {
        margin-left:-5px;
        margin-top:0px;
        transform: scale(90%);
    }
    
 
    .mobile-view .posts-wrapper .topic-body .topic-meta-data .names{
        display: flex;
        flex-wrap: nowrap; 
        align-items: center;
        width: fit-content;
        font-size:16px;
        
    }
    
    
    
    .mobile-view .posts-wrapper .topic-body .topic-meta-data .names span{
        font-size: var(--font-0);
        margin-right: 8px;
        display: inline-block;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        vertical-align: middle;
    }
    
    
    
    .mobile-view .posts-wrapper .topic-body .topic-meta-data .names .first.username, .mobile-view .posts-wrapper .topic-body .topic-meta-data .names .second.full-name {
        display: inline-block;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        vertical-align: middle;
        margin:0;
        flex-basis: auto;
        
    }
    
    
    
    .mobile-view .user-title{
        display:none !important;
    }
    .posts-wrapper .topic-body .topic-meta-data .post-infos{
        font-size:10px;
    }
    .posts-wrapper .topic-body .topic-meta-data .post-infos img{
        width:20px;
        height:20px;
    }
    .mobile-view .posts-wrapper .topic-body .contents {
        
        clear:none;
    }
    .mobile-view .posts-wrapper .topic-post article {
        padding:0;
        border:none;
    }
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
}