gh/components/main/index.less
.app-main{
    margin-top: 20px;
    h3{
        text-align: center;
        font-size: 25px;
        color: #6289ad
    }
    h4{
        margin-top: 25px;
        font-size: 18px;
        color: #6289ad
    }
    h5{
        margin-top: 20px;
        font-size: 16px;
        color: #6289ad
    }
    .desc{
        margin-top: 15px;
        code{
            background: #f8f8f8;
            color: #333;
            padding: 5px;
        }
    }
    .code-area{
        position: relative;
        width: 100%;
        height: auto;
        border: 1px solid #dce7f4;
        border-radius: 4px;
        margin-top: 20px;
        padding: 0;
        &>div{
            margin-top: 40px; 
            display: inline-block;
            vertical-align: middle
        }
        .area-left{
            width: 75%;
            margin-left: 10px;
        }
        .area-right{
            width: 21%;
            margin-left: 10px;
            pre{
                background: #f8f8f8;
                padding: 15px 10px;
                color: #6289ad;
                line-height: 20px
            }
        }
        .original-code{
            width: 90%;
            margin: 25px 45px -10px;
            pre{
                background: #f8f8f8;
                padding: 15px 10px;
            }
        }
        .show-code{
            width: 100%;
            cursor: pointer;
            text-align: center;
            border-top: 1px solid #dce7f4;
            padding-top: 10px;
            padding-bottom: 10px;
            color: #6289ad;
            font-weight: 500;
            font-size: 18px;
            &:hover{
                background-color: #dce7f4;
                color: #fff;
            }
        }
    }
}