Blog Decoration CSS

This post records the decoration in this blog for backup. Using markdown with these decoration to write blog is awesome!

1. Code Block

pre {
    border:1px dashed #E1E1E1;
    color:#333344;
    background:#FAFAFA;
    overflow:auto;
    padding:0.5em;
}
code {
    font:$(body.code);
    line-height:28px;
}

2. Blcokquote

blockquote {
    background  : #f9f9f9;
    border-left : 10px solid #ccc;
    margin      : 1.5em 10px;
    padding     : .5em 10px;
    quotes      : "\201C""\201D""\2018""\2019";
}

3. Github Ribbon

.ribbon {
    background-color          : #a00;
    overflow                  : hidden;
    z-index                   : 1;
    position                  : absolute;
    right                     : -3em;
    top                       : 2.5em;
    -moz-transform            : rotate(45deg);
    -webkit-transform         : rotate(45deg);
    -moz-box-shadow           : 0 0 1em #888;
    -webkit-box-shadow        : 0 0 1em #888;
}
.ribbon a {
    border          : 1px solid #faa;
    color           : #fff;
    display         : block;
    font            : bold 81.25% 'Helvetiva Neue', Helvetica, Arial, sans-serif;
    margin          : 0.05em 0 0.075em 0;
    padding         : 0.5em 3.5em;
    text-align      : center;
    text-decoration : none;
    text-shadow     : 0 0 0.5em #444;
}

-- EOF --