main.scss

@import "font";
@import "theme";
@import "layout";
@import "elements";
@import "viewer";

body {
  font-family: Roboto, "Helvetica Neue", sans-serif;
  margin: 0;
  //  overflow: hidden;
}

// material icons
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;

  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;

  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;

  /* Support for IE. */
  font-feature-settings: 'liga';
}

// The following styles will override material design!

// jdnconvertiblecalendar main style
.mat-datepicker-content {
  .mat-calendar {
    height: auto !important;
  }
}

.grid-card .mat-card-header > div.mat-card-header-text {
  margin: 0 0 !important;
}

app-color-value {

  .mat-form-field-flex,
  .color-picker-input {
    cursor: pointer !important;
  }

  .mat-form-field-label span {
    display: block;
    padding: 8px 4px;
    margin: 0 auto;
  }
}

// String literal input
// string literal textarea: overwrite material styling !important
.string-literal {
  &.short-text {
    .mat-form-field-infix {
      margin-left: 12px;
    }
  }

  &.long-text {
    .mat-button-toggle-appearance-standard {
      .mat-button-toggle-label-content {
        line-height: 36px !important;
        padding: 0 8px !important;
      }
    }

    // textarea
    .mat-form-field-wrapper {
      width: 100%;
      .mat-form-field-flex {
        border-left: 1px solid rgba(0, 0, 0, 0.12);
        min-height: calc(4 * 36px + 2px);

        .mat-form-field-infix {
          // negative values are not the best choice,
          // but with this margin-top the placeholder is at the
          // same position as in the short-text input
          margin: -12px auto auto 12px;
        }
      }
    }
  }
}

.mat-menu-panel.res-share-menu {
  max-width: 360px !important;
  padding: 6px !important;
}

.info-tooltip {
  white-space: pre-line;
}

.mat-form-field.without-border {
  .mat-form-field-underline {
    display: none;
}
}