Octopress评论方本框的样式问题

1.4k 词

作者:糖果

前几天改octopress的样式,发现评论框的样式没了,变成了普通的表单。然后,想用vimdiff在vps上比较一下,发现新版的css就行一行,没有经过格式化,再小伙伴们的支持下,用chrome把css格式化了,然后在老版的css找到了评论文本框的样式,添加到新的css文件中。

#respond input, #respond textarea {
    background-color: #fff;
    border: 5px solid rgba(128, 128, 160, 0.15);
    padding: 10px;
    font-family: "PT Serif", "Georgia", "Helvetica Neue", Arial, sans-serif;
    color: #4b4b4b;
    font-size: 24px;
    -webkit-border-radius: 5px;
    margin-bottom: 15px;
    margin-top: -10px;
}

#respond input:focus, #respond textarea:focus {
    border: 5px solid #efefef;
    background-color: rgba(255, 255, 255, 1);
}


#respond .submit {
    border: none;
    cursor: pointer;
    color: #666;
    font-size: 24px;
    background-color: #7ac000;
    padding: 5px 36px 8px 36px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.6);
    border-bottom: 1px solid rgba(0, 0, 0, 0.4);
    border-top: 1px solid rgba(255, 255, 255, 0.6);
    background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0.23, #999),
    color-stop(0.62, #ccc)
    );
    background: -moz-linear-gradient(
    center bottom,
    #999 23%,
    #ccc 62%
    );
}


#respond .submit:hover {
    color: #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.4);
    background-color: #666;
    background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0.23, #666),
    color-stop(0.62, #999)
    );
    background: -moz-linear-gradient(
    center bottom,
    #666 23%,
    #999 62%
    );
}


#respond .submit:active {
    position: relative;
    top: 1px;
}

后记:
这个博客主题的样式网格使用的是Octopress,外管部分,内容部分使用的是Markdown样式的。