@import '../../common';

.app{
  height:100%;
  padding:0;
  overflow: hidden;
  .close{
    cursor: pointer;
    float: right;
  }
  .sceneContainer {
    position: relative;
    border:1px solid $borderColor;
    rxstudio-scene{
      width: 100%;
      height: 100%;
      position: absolute;
    }
    .slider-container{
      width: 300px;
      right: 0;
      position: absolute;
      top: 0;
      background: white;
      z-index: 1;
    }
    button {
      border: none;
      border-radius: 50%;
      outline: none;
      position: absolute;
      z-index: 1;
      width: 3rem;
      height: 3rem;
      fill: #444;
      padding: 0.3rem;
      cursor: pointer;
      -webkit-transition: padding 0.3s;
      -moz-transition: padding 0.3s;
      -ms-transition: padding 0.3s;
      -o-transition: padding 0.3s;
      transition: padding 0.3s;
      &.showTimeSetting{
        right: 0;
        top: 0;
        padding: 4px;
        height: 1.6rem;
        box-sizing: border-box;
        width: 1.6rem;
        border-radius: 16px;
      }
      &.replay{
        right: 1rem;
        top: 1rem;
        i{
          font-size: 3rem;
        }
      }
      &.add{
        right: 1rem;
        bottom: 1rem;
      }
      &:hover{
        //color:lighten($primaryColor, 10%);
        fill:$primaryColor;
        padding: 0rem;
      }

    }
  }
  rxstudio-creation-menu{

  }
  rxstudio-property-inspector{
    overflow: auto;
  }
  rxstudio-status{
    height:20px;
  }
}


