@c8y/style/styles/welcome.less

Styles for Cumulocity IoT applications

c8y-dashboard-gridstack.welcome {
  .grid-stack {
    height: auto !important;
  }
  .grid-stack-item.ui-draggable-disabled:not(.grid-floater) {
    position: relative;
    top: inherit; // padding-left: (@grid-gutter-width / 2);
    height: auto; // padding-right: (@grid-gutter-width / 2);
    .grid-stack-item-content {
      position: static;
      .card-header-actions:after {
        display: none;
      }
      .card-inner-scroll {
        overflow: visible;
        height: auto;
        &:before,
        &:after {
          display: none;
        }
        > * {
          margin-bottom: 0;
        }
        .card-group-block > .card {
          border-radius: 0;
          background-color: @component-background-default;
        }
        .quicklinks > .card {
          flex: 1 0 120px;
          min-width: 120px;
          @media (min-width: @screen-sm-min) {
            flex: 1 0 230px;
            min-width: 230px;
          }
          .card-block {
            width: 100%;
          }
        }
      }
    }
  }
  .grid-floater iframe:not(.twitter-timeline) {
    width: 100% !important;
    height: 100% !important;
  }
  .grid-floater .grid-stack-item-content {
    margin: 0 !important;
    margin-right: 15px !important;
  }

  @media (max-width: @screen-xs-max) {
    .grid-floater.ui-draggable-disabled {
      display: none;
    }
  }
}

[ng-controller='HelpAndSupportCtrl'] {
  display: flex;
  flex-flow: row wrap;
  > .card {
    flex: 0 0 33.33333%;
    @media (min-width: @screen-sm-min) {
      flex: 0 0 25%;
    }
    @media (min-width: @screen-md-min) {
      flex: 1 0 14.28571429%;
    }
  }
}

a.help-and-support-doc {
  padding-bottom: 100%;
  min-height: 130px;
  width: 100%;
  > div {
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    padding: 20px 10px 0;
    img {
      margin-bottom: 10px;
      max-width: 24px;
      max-height: 24px;
    }
    p {
      color: @brand-primary;
      font-size: 85%;
    }
  }
}

.quick-link-bgcolor-a,
.quick-link-bgcolor-b .quick-link-bgcolor-c,
.quick-link-bgcolor-d,
.quick-link-bgcolor-e,
.quick-link-bgcolor-f {
  position: relative;
  border: 0 !important;
  &::before {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: @black;
    content: '';
    opacity: 0.05;

    .transition(opacity 0.25s ease);
  }
  &:hover {
    &::before {
      opacity: 0;
    }
  }
}

.welcome-dont-show {
  margin-top: -15px;
  padding: 5px 0;
  @media (min-width: @screen-sm-min) {
    margin-top: -24px;
    margin-bottom: 27px;
  }
  @media (min-width: @grid-float-breakpoint) {
    padding: 5px 15px;
  }
}