yuyue/static/css/allform.css

.flex{display: flex;}
.disabled {
    pointer-events: none;
    filter: alpha(opacity=50); /*IE滤镜，透明度50%*/
    -moz-opacity: 0.5; /*Firefox私有，透明度50%*/
    opacity: 0.5; /*其他，透明度50%*/
}
.label_title{font-size: 14px;font-weight: bold;line-height: 20px;}
.diyphone{min-width: 375px;background: #fff;height: calc(100vh - 56px);margin-right: 20px;overflow-y: auto;}
.page_content{margin-top: 20px;}
.page-title{font-size: 16px;font-weight: bold;line-height: 22px;padding-bottom: 20px;text-align: center;background: #fff;}
.phone-body{width: 375px;height: auto;min-height: 100%;transform: scale(0.8);-webkit-transform-origin: top;}
.phone-top{height: 64px;background: #fff;background-size: 100% auto;text-align: center;cursor: pointer;
    display: block;text-overflow: ellipsis;position: relative;border: 1px solid #f7f7f7;}
.phone-title{position: absolute;z-index: 100;font-family: PingFang SC;font-style: normal;
    font-weight: 600;font-size: 18px;line-height: 25px;display: -webkit-box;display: -ms-flexbox;
    display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;text-align: center;
    color: #212121;left: 50%;-webkit-transform: translate(-50%, 0);transform: translate(-50%, 0);bottom: 8px;}
.phone-main{min-height: 610px;background-color:#f7f7f7;}
.phone-main-content-box{padding: 12px;}
.phone-main-content{background-color: #ffffff;border-radius: 6px;padding-bottom: 16px;}

.form-config{-webkit-box-flex: 1;-ms-flex: 1;flex: 1;height: calc(100vh - 56px);overflow-y: auto;background-color: #ffffff;
    padding: 20px 20px 0 0;min-width: 1000px;;}
.form-item-adder{display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;margin-right: -10px;}
.form-item-adder .btn {padding: 0 10px 10px 0;}
.form-item-adder .btn .ivu-btn {
    width: 82px;height: 82px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0;
    background: #f4f6f8;border-radius: 2px;border: none;position: relative;}
.form-item-adder .btn .ivu-btn span {
    font-family: PingFang SC;font-style: normal;font-weight: bold;font-size: 14px;
    line-height: 20px;color: #636669;display: -webkit-box;display: -ms-flexbox;display: flex;
    -webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;
}
.form-item-adder .btn .ivu-btn .btn-shade {
    position: absolute;top: 0;bottom: 0;left: 0;
    right: 0;background: rgba(0,0,0,0.7);border-radius: 2px;
    color: #FFFFFF;display: none;-webkit-box-align: center;-ms-flex-align: center;
    align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;
    font-size: 14px;font-weight: bold;line-height: 20px;}
.form-item-adder .btn .ivu-btn:hover .btn-shade {display: -webkit-box;display: -ms-flexbox;display: flex;}
.form-item-adder .btn i.layui-icon{color: #2d8cf0;}
.form-item-adder .btn img{width: 24px;height: 24px;font-size: 24px;text-align: center;
    line-height: 24px;margin: 11px auto;color: #2d8cf0;}
.form-items li{border: 1px solid #f3f3f3;padding: 20px;margin: 5px 0px;}
.form-items .action-items{display: -webkit-box;display: -ms-flexbox;display: flex;}
.form-items .action-title{width: 80px;vertical-align: middle;margin: auto;}
.form-items .action-title .title{line-height: 35px;font-size: 14px;font-weight: bold;}
.form-items .input-title{width: 200px;vertical-align: middle;margin: auto;}
.form-items .input-remark{width: 300px;}
.form-items .input-max{width: 300px;}
.form-items .input-required{width: 80px;text-align: center;vertical-align: middle;margin: auto;}
.form-items .input-delete{margin-top: 3px;vertical-align: middle;margin: auto;}
.form-items .middle-content{width: 620px;}
.form-items .input-middle-item{margin-bottom: 10px;}
.form-items .input-middle-item a{color: #2d8cf0;}
.form-items .action-title,.form-items .input-title,.form-items .input-remark,.form-items .input-max,.form-items .input-required,.form-items .input-delete{margin-right: 10px;}

.phone-item{padding: 10px 12px 0 12px;}
.phone-item .template_item{min-width: 80px;font-size: 14px;line-height: 20px;word-break: break-all;}
.phone-item .template_item .item_title{}
.phone-item .template_item .item_required{color:red;margin-left: 5px;}
.phone-item .template_tip{font-size: 12px;line-height: 17px;padding-top: 4px;color: #969696;word-break: break-all;}
.phone-item .tempalte_content{padding: 10px 0;}
.phone-item .tempalte_content .image-add{
    display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: vertical;-webkit-box-direction: normal;
    -ms-flex-direction: column;flex-direction: column;-webkit-box-align: center;-ms-flex-align: center;
    align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;
    width: 70px;height: 70px;border: 1px dashed #E6E7EB;border-radius: 2px;color: #969696;cursor: pointer;
}
.phone-item .tempalte_content .image-add .add{font-size: 20px;}
.phone-item .tempalte_content .item-input{border: 1px solid #E6E7EB;font-size: 14px;line-height: 20px;width: 100%;resize: none;padding: 10px 12px;}
.phone-item .tempalte_content .item-input-textarea{height: 80px;}
.phone-item .tempalte_content .radio-item{padding: 5px 0 5px 12px;border-bottom: 1px solid #E6E7EB;}
.phone-item .tempalte_content .m-radio-box{border: 1px solid #E6E7EB;border-radius: 2px;margin-top: 8px;}
.phone-item .tempalte_content .date_item{position: relative;}
.phone-item .tempalte_content .date_icon{position: absolute;top: 10px; right: 10px;}