@charset "UTF-8";
/**
 * 
 * @authors yutent (yutent@doui.cc)
 * @date    2017-04-20 19:13:24
 * 
 */
@import 'var.scss';

.do-meditor-attach {width:630px;height:300px;cursor:default;color:nth($cd, 2);

  ::-webkit-scrollbar {width:5px;height:5px;background:nth($cp, 1);}
  ::-webkit-scrollbar:hover {background:nth($cp, 2);}
  ::-webkit-scrollbar-button {display:none;}
  ::-webkit-scrollbar-thumb {background:nth($cgr, 1);}
  ::-webkit-scrollbar-thumb:hover {background:nth($cgr, 2);}
    
  .tab-box {float:left;width:130px;height:300px;padding:10px 5px;text-align:center;background:nth($cp, 1);border-radius:5px;

    .item {display:block;width:100%;height:40px;line-height:40px;border-radius:3px;cursor:pointer;

      &.active {background:#fff;}
    }
  }


  .cont-box {position:relative;float:right;width:480px;height:auto;min-height:200px;

    .remote,
    .local {position:relative;width:92%;height:auto;margin:0 auto;}

    .remote {padding:30px 0;}
    .hide  {display:none;}

    .section {display:block;width:100%;height:auto;margin:15px 0;line-height:35px;

      .submit {float:right;width:30%;height:45px;line-height:45px;}
    }


    .select-file  {width:100%;height:35px;line-height:35px;
      
      .file  {float:left;width:100px;height:35px;border-radius:3px;background:nth($cp, 2);text-align:center;cursor:pointer;
        
        &:hover {background:nth($cp, 1);}
        &:active {background:nth($cp, 3);}
      }
      .tips  {display:inline-block;padding:0 10px;}
    }
 
    .upload-box {width:100%;height:auto;min-height:255px;padding-top:10px;

      .thead {width:100%;height:35px;line-height:35px;background:nth($cp, 1);}

      .col {overflow:hidden;float:left;height:30px;padding:0 5px;text-align:center;}
      .col:nth-child(1) {width:50%}
      .col:nth-child(2) {width:35%}
      .col:nth-child(3) {width:15%}

      .tbody {overflow:hidden;overflow-y:auto;width:100%;height:220px;
        p {display:block;width:100%;height:30px;line-height:30px;}
      }

      .insert {display:inline-block;padding:3px 5px;line-height:13px;background:nth($cp, 1);color:nth($cd, 2);cursor:pointer;}
      .red {color:#f30;}
    }

    .manager {overflow:hidden;overflow-y:auto;width:100%;height:300px;

      .list-box {width:100%;column-count:4;column-gap: 5;}
      .item {margin:0 0 10px;padding:5px;text-align:center;background:nth($cp, 1); break-inside: avoid;@include ts(background);
      
        &:hover {background:nth($cp, 3)}

        .thumb {display:block;width:100%;}
        .name {overflow:hidden;height:30px;line-height:30px; text-align:center;}
        img {width:100%;height:auto;}
        em {line-height:1;font-size:50px;}
      }
      
    }
  }

}