catjs/src/libraries/cat/css/less/app.less

(Mobile) Web Automation Framework

/* tests marker */
.markedElement {
  border: 3px solid red !important;
}

/* catjs ui - iframe mode */
.catuiiframe {
  display: none;
}

/* catjs ui */
div.cat-status-container {

  max-width: 250px !important;
  width: 250px !important;
  height: 250px !important;
  top: 10px;
  right:15px;
  
  div#cat-status {

    height: 100%;
    overflow: hidden;
    opacity: .8;
    z-index: 1000000;
    position: absolute;
    right: 0;
    top: 0;
    margin: 0px;
    display: table;
    font-family: "Trebuchet MS", Arial;

    div#catlogo {

      z-index: 1000001;
      width: 50px;
      height: 47px;
      left: 3px;
      top: 3px;
      border: 1px solid transparent;
      background: transparent;
      background-image: url(data:image/png;base64,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);
      background-position: -2px -2px;
      background-size: 50px 50px;
      background-repeat: no-repeat;
      border-radius: 50%;
      position: absolute;

      -webkit-transition: opacity 1000ms;
      -moz-transition: opacity 1000ms;
      -ms-transition: opacity 1000ms;
      -o-transition: opacity 1000ms;
      transition: opacity 1000ms;

      cursor: pointer;
    }

    &.cat-dynamic {
      position: fixed;
      right: 15px;
    }

    &.cat-status-open {
      background-color: #efefef;
      max-width: 250px;
      width: 250px;
      height: 54px;
      border-radius: 26px 10px 10px 26px;
      -webkit-box-shadow: 0px 0px 5px 1px #cdc4c4;
      box-shadow: 0px 0px 5px 1px #cdc4c4;

    }

    &.cat-status-close {

    }

    #cat-status-content {

      padding: 5px 5px 5px 5px;
      margin-top: 0px;
      max-height: 250px;
      max-width: 250px;
      width: 250px;
      overflow: auto;

      .text {
        color: #858585;
        font-family: "Trebuchet MS", Arial;
        font-size: 11px;
        text-align: left;
      }

      .text-top {
        color: #858585;
        font-family: "Trebuchet MS", Arial;
        font-size: 13px;
        text-align: left;
      }

      .text-tips {
        color: #444444;
        font-family: "Trebuchet MS", Arial;
        font-size: 11px;
        position: absolute;
        right: 10px;
        top: 10px;
        text-align: left;
      }
    }

    div.text-tips {
      margin-top: 45px;
      padding-left: 10px;
      font-family: "Trebuchet MS", Arial;
      font-size: 18px;
      text-align: left;
    }

    .displayoff {
      opacity: 0;
      -webkit-transition: all .5s;
      -moz-transition: all .5s;
      -ms-transition: all .5s;
      -o-transition: all .5s;
      transition: all .5s;

    }

    .displayon {
      opacity: 1;
      -webkit-transition: all 1.5s;
      -moz-transition: all 1.5s;
      -ms-transition: all 1.5s;
      -o-transition: all 1.5s;
      transition: all 1.5s;

    }

    #catHeader {
      text-align: left !important;
      margin-left: 60px;
      text-align: center;
      margin-left: 60px;
      margin-top: 5px;
      font-size: 1.3em;
      font-family: "Trebuchet MS", Arial;
      font-size: 14px;

    }

    #catheadermask {
      font-family: "Trebuchet MS", Arial;
      font-size: 10px;
      color: #444444;
      white-space: nowrap;
      position: absolute;
      left: 12px;
      top: 45px;

      -webkit-transition: opacity 1000ms;
      -moz-transition: opacity 1000ms;
      -ms-transition: opacity 1000ms;
      -o-transition: opacity 1000ms;
      transition: opacity 1000ms;
    }

    ul#testList {

      list-style-type: none;

      li {
        margin-top: 5px;
        margin-bottom: 5px;
      }

      li.listImageCheck {
        list-style-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAACLUlEQVQ4T2NkoADUr1MWYyRXf8NaFRlGRsbjZBnQsFZNiYnx/4m///5zk2xAzQpVTVZ2xkP//v4X+ffnXyRJBtSuUTFkYWbcw872l+/rV8bNzWF3g4g2oHaViiUT8/9tYiJ/BV68YH7568N/9c70ex/BBtQv0bNgZmQ5zsL3yarK985x9ICtWi7nzMLCslZO9i//4wdMn779+u/XHffgIEgdI0xzXHA0w/Jd8779Y/zuV+17by/MkJrVcj7//zItUVH+z//6JcPXd+8Y53bEPciHyTM2LTX6r2f6h+Hrt88MhkrRDKt2L//I8I/BqyH07rHa1QoR/34zzDQ14eN7+erj/zu3Ge49ePhQa3UDwy+4AVlTRXnYWThvGJkyCzEz/+MUFVBmOHDk3geg2Lofv7+HmJnx8X35+oXh4rm/n378/m85OePRNWQvgsOgoF9AgImH75KhCZs4M/MfNi4OPobLF34z6BqwMnz/8ZnhxvV/Xz5/ZGjsS3vYgx4+8FhI65ES4eFluWRkxiHKxPyLJVL3PsPySwoMb1+z/H1w78+Z3rSHlkDN/3EaAJIAekeCk4XropYRhwgn+0+mf/84GM6f+v7h65e/OjOKnjzFluwx0kHWVClZThaW87rGvEK3b3wBhu3/5P7MR6tw5RlsCUlS15bXzCVacOnTW9+rVvW9BqWLf0D8E4i/AfF3IH4OjwUsJksDxdhVTbn5GP7+/nn73K+3QD4o2j5gcwUAONHakvtwwHYAAAAASUVORK5CYII=);
      }

      li.listImageCross {
        list-style-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAACP0lEQVQ4T41SS2tTQRg9k3uT3DxuSGuoidUuC0IlWlAQdaGoWPCBDfhaW/QXuBW3/gFfe4uLUUGhgmIXahbdSKlQ0J01TWtsbJuax83NvX4zcycJWYgD4U7mfOd8Z843DH3r69XYtGky7rp+YfxZ4/n/YEwXafK+2/ex8vAO+kX+hUkBUWAYjGdPTaH15RNiR8+j9PIpPM8vCDxE2OilG6gXX8M6cAzl93PwOsolE2SwEB89fQ6NxQ8AI00fSBy/gJUXs2KLscvX8efjq8Csj1j+BErv3lCdV2DLVxJ+bjIP5/s3IlONYIhF+6Frd+X29+w9eSztBjXW+EGUikVIB07H4LsyUUWkSlkTFEpD4iz4aoGNjSYiBjnQGdTbBs8Mh1WXgaVNaQOVqot42FUZ9E+h1iSRIYNEdEvtu6dYqXqwLUXWghJ9ezI9nUp6fCSt+w32VSlUNoGtHaNwZn6zJyDIiTiRU50gKRGCDmPgPuR5fctEvR6SIkyQo1GPZ1NOdwCaou/XNxiqUemub0fRarECmz+b9vdnaihXO7ASke4kmnUHuWFD/pdYnLBgMhpb/pWEdMAM8IkRJRK2TLSbriQv/bTBqP3EboVFoiacloswfdd2kvSOoMYoRDwGns+qQkFeXEsh5Kun7IGwXA8TZ0tlW2Wg7ytE2j7jk3u28bmcggm/m7TAXDB+KEfYKmGshwmBLP1MkcyjI/bU3pj5ZLXh3pxZqInH78jEAOvBYfviWNx8/KPhztxaqM0F5+5fa80bVA2wh0oAAAAASUVORK5CYII=);
      }

      li.listImageInfo {
        list-style-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAACRUlEQVQ4T2NkQANdXV0JjIyM8UDsgCz1////A0C8sKysbAGyOCOM097ersDCwrKen5/fwMrKikFWVpaBj48PLP3p0yeGx48fMxw7dozh48ePF/78+RNYWVn5ACQHNgCkmZWV9by2traAh4cHw8P3vxkO3fsKpH+BDZAXZGOwU+IG0qwMO3bsYLh69eqH379/G4IMARvQ3d19XkdHxwCkeeGZ9ww7bnwGayx2EGV4+O4Xw5pLH8F8Dw1ehngTQbAhV65cuVBaWmrICPKzgIDA/NTUVIYFp94xbL3+Ce7FbGsRhldf/jCsvvgBLuatyceQYCbEMHv2bIYPHz4kMgJt3+/p6enAJanKULzhCXqYMojxsIANQQa9ATIM357fZti+ffsBxp6env8g21dd/cWw+QrCJj8dAQYnNV6Gr7/+MVRveYpigC9QLkybDewKsAHFxcUMFZueMFx+9g2uUFeSk6HQSYLh1ec/QLnHKAboSnExdPjJMPT29iIMKF3/iOHSU4QB4MANlANrBMkhAz1pLrAc3ACQF5Zc+Maw9vw7FIV9wfJgftHahyjiwYZCDDEGXBAvwAKRXUyZIXnxHRSFE0MVwfz81fdRxOfGqjD8fHUXEojI0Thx3zOGVWfegBXbqfIxVHvJgtmt2x4zHLoNid4wExGGfCcpRDSC/YqUkPr3PGVYceoVg5E8D4qt5x5+YYgwE2ModJFGTUggVehJ+dbL7wybL75luPkCEqjqElwMvvrCDGrinNiTMswQsjMTsltJzc4Ak1AmaHPwABkAAAAASUVORK5CYII=);
      }

      li.listImageSummary {

      }

      li.listImageSummary {
        .text-top {
          font-size: 16px !important;
          margin-left: -18px;
        }
      }

    }

    .tests {
      font-size: 12px;
    }

    #tests_status {

      .test_succeeded {
        font-size: 14px;
        color: green;
      }

      .test_failed {
        font-size: 14px;
        color: red;
      }
    }
  }
  
  div.fadeMe {
    opacity: 0.3;
    background: #000;
    width: 100%;
    height: 100%;
    z-index: 10;
    top: 0;
    left: 0;
    position: fixed;
  }

}