.input-field {
       width: 100%;
       position: fixed;
       bottom: 0;
       left: 0;
       background-color: skyblue;

       .rong-editor {
           position: absolute;
           bottom: 0;
           width: 100%;
           border-top: 1px solid #CCC;
           background-color: #FFF;
       }

       .input-wapper {
           height: 55px;
           padding: 15rpx;
           box-sizing: border-box;

           .rong-editor-input {
               height: 58rpx;
               box-sizing: border-box;
               display: inline-block;
               position: absolute;
               left: 15rpx;
               right: 150rpx;
               background-color: #F3F3F3;
               margin: 0 10rpx;
               border-radius: 4rpx;
           }

           .rong-editor-input-180 {
               right: 185rpx;
           }

           .rong-editor-input:focus {
               border-bottom: 1px solid red;
           }

           .rong-icon {
               width: 26px;
               height: 26px;
               float: right;
               margin-right: 12rpx;
               margin-top: 4rpx;

               img {
                   width: 100%;
                   height: 100%;
               }
           }

       }

       .input-open {
           height: 185px;
           background-color: #F3F3F3;

           .rong-emojis-swiper {
               height: 185px !important;
               padding-left: 7px;
           }

           .rong-editor-emoji {
               width: 60rpx;
               height: 60rpx;
               display: inline-block;
               text-align: center;
               margin: 7px;
               font-size: 30px;
           }
       }

       .rong-editor-modules {
           height: 60px;
           width: 60px;
           border: 1px solid #d2d2d4;
           border-radius: 15px;
           background-color: #fff;
           padding: 10px 14px 10px 9px;
           box-sizing: border-box;
           margin: 20rpx 32rpx;
           float: left;
           position: relative;
       }

       .rong-editor-modules-solt {
           float: left;
           position: relative;
           margin: 20rpx 32rpx;
       }

       .rong-editor-module {
           position: absolute;
           top: 50%;
           left: 50%;
           transform: translate(-50%, -50%);
           height: 35px;
           width: 35px;
           background-repeat: no-repeat;
           background-size: cover;
           background-position: center;

       }

       .rong-editor-module-image {
           background-image: url('http://7xogjk.com1.z0.glb.clouddn.com/rc-mini-image.png');

           .file {
               width: 60px;
               height: 60px;
               // opacity: 0;
           }
       }

       .rong-editor-btn {
           margin-right: 20rpx;
           margin-top: 4rpx;
       }


       .rong-editor-btn-emojisent {
           float: right;
           font-size: 14px;
           background: #1BA3FC;
           border-radius: 6rpx;
           color: #FFF;
           margin-right: 10rpx;
           padding: 10rpx 18rpx;
           box-sizing: border-box;
           margin-top: 4rpx;
       }



       .rong-editor-module-file {
           background-image: url('http://gz.bcebos.com/v1/rongcloud-image/1__RC-2020-6-8_801_1591602970942118ba250-962e-466a-ae75-016c23462b45.png');
       }

   }