码迷,mamicode.com
首页 > 其他好文 > 详细

red-zhihu

时间:2017-09-11 23:01:03      阅读:207      评论:0      收藏:0      [点我收藏+]

标签:知乎   led   class   color   需要   红色   row   ble   ext   

red-zhihu

代码:

 

/**
*红色知乎
*知乎的样式太素了,搞得阅读时,寻找功能*按钮需要付出一些精力成本
*故尝试做一版红色版知乎,目的不在美观
*而在于高亮显示功能按钮:评论、收起等
*/

/*知乎头部logo*/

div.AppHeader-inner svg g path {
    fill: #ff0000
;
}

/*知乎默认蓝色按钮 改成红色*/

.Button--primary.Button--blue, .Button--primary.Button--blue:disabled {
    background: #ff0000;
    border: 1px solid #ff0000;
}

/*关注问题及回答问题按钮 单独纠正*/

div.QuestionButtonGroup button.Button.Button--primary.Button--blue {
    color: #ffffff;
    border: 1px solid #ff0000;
}

/*关注问题及回答问题按钮 单独纠正*/

div.QuestionButtonGroup button.Button--blue {
    color: #ff0000;
    border: 1px solid #ff0000;
}

/*问题评论按钮*/

div.QuestionHeader-Comment button.Button.Button--plain {
    color: #ff0000
;
}

/*问题详情 展开按钮*/

div.QuestionHeader-detail button.Button.QuestionRichText-more.Button--plain {
    color: #ff0000
;
}

/*问题详情 展开按钮 右侧箭头*/

div.QuestionHeader-detail button.Button.QuestionRichText-more.Button--plain svg g path {
    fill: #ff0000
;
}

/*问题评论按钮 左侧箭头*/

div.QuestionHeader-Comment button.Button.Button--plain svg g path {
    fill: #ff0000
;
}

/*问题详情 收起按钮 布局及文字颜色*/

div.QuestionHeader-actions button.Button.Button--plain {
    color: #ffffff;
    background: #ff0000;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 2px
;
}

/*问题详情 收起按钮 箭头颜色*/

div.QuestionHeader-actions button.Button.Button--plain svg g path {
    fill: #ffffff
;
}

/*答案正文展开 */

div.RichContent.is-collapsed.RichContent--unescapable button.Button.ContentItem-rightButton.Button--plain {
    color: #ff0000;
}

/*答案正文展开 右侧箭头*/

div.RichContent.is-collapsed.RichContent--unescapable button.Button.ContentItem-rightButton.Button--plain svg.Icon.ContentItem-arrowIcon.Icon--arrow g path {
    fill: #ff0000;
}

/*答案收起按钮 布局及背景颜色*/

button.Button.ContentItem-action.ContentItem-rightButton.Button--plain {
    padding-left: 10px;
    padding-right: 10px;
    background-color: #ff0000;
    border-left-width: 0;
    border-radius: 1px;
}

/*答案收起按钮 右侧箭头颜色*/

button.Button.ContentItem-rightButton.Button--plain {
    color: #ffffff;
}

/*评论按钮 文字颜色*/

div.ContentItem-actions>:nth-child(2) {
    color: #ff0000;
}

/*评论按钮 左侧小图标*/

svg.Icon.Icon--comment.Icon--left g path {
    fill: #ff0000;
}

/*评论收起按钮 背景及文字颜色*/

div.Comments.Comments--withEditor.Comments-withPagination button.Comments-Packup-Button {
    background: #ff0000;
    color: #ffffff;
}

/*评论收起按钮 右侧小箭头*/

svg.Icon.ContentItem-arrowIcon.is-active.Icon--arrow g path {
    fill: #ffffff;
}

/*答案 正文字号*/

div.RichContent-inner {
    font-size: 18px;
}

/*答案 正文字号 纠偏(这是缩略时字号,别动它)*/

div.RichContent.is-collapsed div.RichContent-inner {
    font-size: 15px;
}

 

 

代码使用方法:chrome插件Stylebot

 

red-zhihu

标签:知乎   led   class   color   需要   红色   row   ble   ext   

原文地址:http://www.cnblogs.com/ferron/p/7507027.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!