豆瓣现代化 Modern Douban Sauce by jason-summer

/* ==UserStyle==
@name         豆瓣现代化 Modern Douban Sauce
@version      20230127.17.09
@namespace    userstyles.world/user/jason-summer
@description  本 css 样式能优化豆瓣简陋经典的网站，目前还在开发阶段，有很多bug，不建议尝试。
（我先占个位o(=•ェ•=)m）
@author       jason-summer
@license      No License
==/UserStyle== */
@-moz-document domain("douban.com") {
    /*主要是主页的优化*/
    /*
.nav .nav-logo {
    /*这个地方有bug，会影响豆瓣小组和豆瓣同城的logo*/
    /*这张logo是从手机网页版上找到的，缩小为原图大小的一半 72px 33px
    background-size: 50%;
    background-position: center;

    background-image: url(https://gitee.com/WhiteMountain/nothing-but-images/raw/master/download.png);
}
*/
    /*整个信息流的优化*/
    .stream-items .status-wrapper {
        /*    box-shadow: 0 1px 3px rgba(26, 26, 26, .1);*/
        /*    background: #f9f9f9;*/
        border-radius: 4px;
        /*侧栏官方圆角*/
        /*    margin: 10px*/
    }
    .status-item {
        /*    margin: 16px*/
    }
    .stream-items .status-wrapper:first-child {
        padding-top: 20px
    }

    .status-item .block {
        overflow: hidden;
        zoom: 1;
        padding: 16px 20px;
        background: #d6ebd6b5;
        /*#f2f7f6太淡，会分不清颜色*/
    }
    .status-item .mod .icon-topic {
        /*动态的话题*/
        background-color: #d6ebd6b5;
        /*调整图标位置*/
        background-position: center left 15px;
        border-radius: 4px;
        padding: 16px 20px;
        /*把文字和图表稍微向右移动*/
        padding-left: 35px!important;
    }
    .status-item .mod .article-pic img {
        border-radius: 4px;
        /*动态图片圆角*/
    }


    .status-item .mod .actions:not(.empty) a.btn:not(.lnk-reshare) {
        background: url(/f/sns/61977f4…/pics/sns/isay/isay_icons.3.svg) no-repeat, none;
    }



    .status-item .block .info:before {
        border-left: 2px solid #08bf08;
        /*书影音模块的导演介绍的左边竖条，为了配合底板颜色的改变*/
    }







    /*侧边栏*/
    .aside .mod {
        background: #f9f9f9;
        /* #f2f7f6 浅绿提醒色块;*/
        padding: 16px 0 16px 18px;
        border-radius: 4px;
        /*侧栏官方圆角*/
    }

    .status-item .block {
        border-radius: 4px;
        /*个人中心动态框*/
    }












    /*顶栏提醒的弹出列表*/
    #db-global-nav .top-nav-reminder .more-items {
        border-radius: 4px;
        box-shadow: 0 1px 3px rgba(26, 26, 26, .1)
    }

    #db-global-nav .top-nav-reminder .more-items .ft a {
        border-radius: 4px;
        /*“查看全部提醒”的阴影，需保持圆角一致*/
    }

    #db-global-nav .top-nav-doubanapp .more-items {
        border-radius: 4px;
        box-shadow: 0 1px 3px rgba(26, 26, 26, .1)
    }

    #db-global-nav .nav-user-account .more-items {
        box-shadow: 0 1px 3px rgba(26, 26, 26, .1)/*柔和的账号弹出列表阴影*/
    }

    .status-item .hd .usr-pic img {
        border-radius: 50%
    }



    /*顶栏颜色调整*/
    #db-global-nav {
        background-color: #0000/*#edf4ed顶栏背景色浅色备选，深色备选#072，目前首选#f9f9f9为白色顶栏。新发现#0000实现全透明*/
    }


    #db-global-nav a:hover,
    #db-global-nav a:link,
    #db-global-nav a:visited,
    #db-global-nav a:active {
        color: #000;
    }

    #db-global-nav .more-active .lnk-remind:link,
    #db-global-nav .more-active .lnk-remind:visited,
    #db-global-nav .more-active .lnk-remind:hover,
    #db-global-nav .more-active .lnk-remind:active {
        color: #08bf08;
    }

    #db-global-nav .top-nav-doubanapp.more-active .lnk-doubanapp:link,
    #db-global-nav .top-nav-doubanapp.more-active .lnk-doubanapp:visited,
    #db-global-nav .top-nav-doubanapp.more-active .lnk-doubanapp:hover,
    #db-global-nav .top-nav-doubanapp.more-active .lnk-doubanapp:active {
        color: #08bf08;
    }


    #db-global-nav .more-active .bn-more span {
        color: #08bf08;
    }




    /*底部切换页码改进*/
    .paginator a,
    .thispage,
    .break {
        border-radius: 50%
    }



    input.butt {
        float: right;
    }

    /*主页日期、点赞、评论、转发、删除按钮*/
    /*
    .status-item .mod .actions:not(.empty){
        padding:10px;
        margin:0;
        background-color:#159541;
        border-radius:4px;
    }*/
    .status-item .mod .created_at a {
        background-color: #999;
        color: #fff;
        line-height: 30px;
        padding: 0 10px;
        /*border: 1px solid;*/
        border-radius: 4px;
        cursor: pointer;
        text-align: center;
        display: inline-block;
        font-size: 14px;
    }



    a.btn.btn-action-reply.new-reply,
    a.btn.btn-key-like.btn-like,
    a.btn.btn-key-like.btn-unlike,
    a.btn.btn-key-reshare.btn-reshare.new-reshare,
    a.btn.btn-action-reply-delete {
        background-color: #d6ebd6b5!important;
        line-height: 30px;
        padding: 0 10px;
        /*border: 1px solid;*/
        border-radius: 4px;
        cursor: pointer;
        text-align: center;
        display: inline-block;
        font-size: 14px;
        color: #159541!important;
    }

    a.btn.btn-action-reply.new-reply:hover,
    a.btn.btn-key-like.btn-like:hover,
    a.btn.btn-key-like.btn-unlike:hover,
    a.btn.btn-key-reshare.btn-reshare.new-reshare:hover,
    a.btn.btn-action-reply-delete:hover {
        background-color: #d6ebd6!important;
        color: #159541!important;
    }

    .status-item .mod .actions:not(.empty) a.btn.btn-dislike,
    .status-item .mod .actions:not(.empty) a.btn.btn-unlike,
    .status-item .mod .actions:not(.empty) a.btn.btn-unreshare {
        background-color: #159541!important;
        color: #fff!important;
    }


    /*没写完
span.count.like-count {
    background-color: #072;
        line-height: 30px;
        color:#fff;
        border-radius: 4px;
        font-size: 14px;
        display: inline-block;




}*/
    /*评论区展开后的回应按钮*/
    .lite-comments .lite-comment-reply .lite-comment-reply-button,
    .lite-comments .lite-comments-permission .disabled {
        background-color: #d6ebd6b5;
        line-height: 30px;
        padding: 0 10px;
        /*border: 1px solid;*/
        border-radius: 4px;
        cursor: pointer;
        text-align: center;
        display: inline-block;
        font-size: 14px;
        color: #072;

        background-image: none;
        border: 0;
        height: 30px;
    }
    /*主页日期、点赞、评论、转发、删除按钮的更改就到这里*/
    a img {
        border-radius: 4px;
    }
}




@-moz-document domain("douban.com") {
    /*豆瓣小组*/
    .profile-entry img {
        border-radius: 50%;
    }
}

@-moz-document url-prefix("https://www.douban.com/people/") {
    /*这个部分用来矫正和首页不太一样的个人中心的页面*/
    .aside .mod {
        background: #f9f9f9;
        /* #f2f7f6 浅绿提醒色块;*/
        padding: 0 0 0 0;
        /*矫正个人中心畸形的侧边栏*/
    }

    div.stream-items {
        background: #f9f9f9;
        padding: 16px 0 16px 18px;
        border-radius: 4px;
    }

    #photo .photo-btns,
    #note .lnk-create {
        float: left;
        top: 8px;
        right: 20px;
    }
    #doulist .lnk-create {
        /*创建豆列列表按钮因为边距调整错位*/
        top: 16px;
        /*让它下降到内边距里的位置*/
        float: right;
        /*这个按钮让它靠右浮动*/
    }



    #user_guide {
        /*介绍你自己的引导框，下列为官方样式用以参考*/
        background: #f8f8f8;
        color: #666666;
        padding: 8px 20px;
        margin: 0 0 40px 0;
        border-radius: 4px;
    }

    div#movie.sort,
    div#book.sort,
    div#review.sort,
    div#music.sort,
    div#apps.sort,
    div#game.sort,
    div#note.sort,
    div#photo.sort,
    div#minisite.sort,
    div#drama.sort,
    div#board.sort {
        box-shadow: 0 1px 3px rgb(26 26 26 / 10%);
        background: #f9f9f9;
        border-radius: 4px;
        padding: 8px 20px;
        margin: 0 0 40px 0;
    }
    .obssin .aob {
        margin: 0 0 20px 30px
    }


    /*个人中心 这tm页面真畸形，侧边栏*/
    #doulist {
        background: #f9f9f9;
        padding: 16px 0 16px 18px;
        border-radius: 4px;
    }
    #group {
        background: #f9f9f9;
        padding: 16px 0 16px 18px;
        border-radius: 4px;
    }
    #friend {
        background: #f9f9f9;
        margin: 16px 0 0 0;
        padding: 16px 0 16px 18px;
        border-radius: 4px;
    }
    .rev-link {
        background: #f9f9f9;
        margin: 16px 0 0 0;
        padding: 16px 0 16px 18px;
        border-radius: 4px;
    }
    /*这是侧边的几行文字，但是会导致个人中心已看内容错位
.pl2 {
    background: #f9f9f9;
    margin: 16px 0 0 0;
    padding: 16px 0 16px 18px;
    border-radius: 4px;
}
*/
}

@-moz-document url-prefix("https://movie.douban.com/") {
    /*豆瓣电影*/
    div.subjectwrap.clearfix {
        background: #d6ebd6b5;
        margin: 4px;
    }
    div.subject.clearfix {
        left: 5px;
        position: relative;
        padding-top: 20px
    }

    .gact a:link,
    a.gact:link {
        color: #555;
    }
    .gact a:hover,
    a.gact:hover {
        color: #FFFFFF;
        font-size: 12px;
        border-left: 1px solid #c2e4c2;
        border-top: 1px solid #c2e4c2;
        border-right: 1px solid #a9e9a9;
        border-bottom: 1px solid #a9e9a9;
        background-color: #08bf08;
        text-align: center;
    }

    .subject #mainpic {
        /*div.subject.clearfix*/
        /*transform: scale(0.95);*/
    }
    #interest_sectl {
        padding: 0 0 0 5px;
        color: #555;
        border-left: 2px solid #08bf08;
        /*transform: scale(0.95);*/
        position: relative;
        margin-top: 20px;
    }

    #interest_sectl .rating_betterthan {
        position: relative;
        padding: 5px 0;
        border-top: 2px solid #08bf08;
        color: #555;
        margin-top: 0;
    }
}

@-moz-document domain("douban.com") {
    /*这里用来做一些测试，目前主要是测试顶栏*/
    html body {
        padding-top: 48px;
        /* menu height */
    }

    #db-global-nav .global-nav-items div {
        /*顶栏*/
        z-index: 100000000;
 ...