quasar-framework/src/ie-compat/ie.ios.styl

Build responsive SPA, SSR, PWA, Hybrid Mobile Apps and Electron apps, all simultaneously using the same codebase

ie_style = @block
  /* Inputs */
  .q-if > .q-if-inner
    flex-basis auto
    display inline-flex
    > div
      > .q-input-target
        flex-basis auto
      > input.q-input-target
        min-width 3rem
        flex-basis 0% !important
  .q-input-target:before
    display block
  .q-if-label-spacer
    width 0

  /* QEditor */
  .q-editor-toolbar
    .q-btn-group.row.inline
      display block
      white-space nowrap

  /* Min Height */
  .q-toolbar
  .q-actionsheet-title
  .q-field-label-inner
    height 0px

  /* QCarousel */
  .q-carousel-slide
    max-width 100%

  /* QAlert */
  .row > .col
    &.q-alert-content
      flex-basis auto

  /* QSlider, QRange */
  .q-slider-handle
    > .q-chip.inline.row
      display table

  /* QBtn */
  a.q-btn:not(.q-btn-round)
    height 0px
  .q-btn
    .q-btn-inner
      flex-basis auto
    &:active
    &.active
      .q-btn-inner
        margin -1px 1px 1px -1px
      &.q-btn-push
        .q-btn-inner
          margin 1px 1px -1px -1px
        &.disabled
          .q-btn-inner
            margin -1px 1px 1px -1px
  .q-btn-group > .q-btn.q-btn-push:not(.disabled)
    &:active .q-btn-inner
    &.active .q-btn-inner
      margin 0

  /* QChip */
  .q-chip:not(.q-chip-small):not(.q-chip-dense) .q-chip-main
    line-height $chip-height
  .q-btn .q-chip
    display inline-block
  .q-tab .q-chip .q-chip-main
    line-height normal

  /* QFab */
  .q-fab-actions
    &.q-fab-left
    &.q-fab-right
      display block
      white-space nowrap

  /* QList */
  .q-item-main
    min-width 1px

  /* QLayout Drawer Mini*/
  .q-layout-drawer-mini .q-item
    padding-left 0
    padding-right 0

  /* QModalLayout */
  .q-modal-layout
    min-height 80vh !important
    overflow hidden

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none)
  {ie_style}

@supports (-ms-ime-align:auto)
  {ie_style}