quasar/ui/src/components/select/QSelect.styl at v1 · hipertracker/quasar · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
.q-select
  &--without-input
    .q-field__control
      cursor: pointer
  &--with-input
    .q-field__control
      cursor: text

  .q-field__input
    min-width: 50px !important
    cursor: text

    &--padding
      padding-left: 4px

  &__focus-target,
  &__autocomplete-input
    position: absolute
    outline: 0 !important
    width: 0
    height: 0
    padding: 0
    border: 0
    opacity: 0

  &__dropdown-icon
    cursor: pointer
    transition: transform .28s

  &.q-field--readonly
    .q-field__control, .q-select__dropdown-icon
      cursor: default

  &__dialog
    width: 90vw !important
    max-width: 90vw !important
    max-height: calc(100vh - 70px) !important
    background: #fff
    display: flex
    flex-direction: column

    > .scroll
      position: relative
      background: inherit

// addressbar always gets shown, so need to slim this down
body.mobile:not(.native-mobile) .q-select__dialog
  max-height: calc(100vh - 108px) !important

body.platform-android

  &.native-mobile .q-dialog__inner--top .q-select__dialog
    max-height: calc(100vh - 24px) !important

  &:not(.native-mobile) .q-dialog__inner--top .q-select__dialog
    max-height: calc(100vh - 80px) !important

body.platform-ios

  &.native-mobile .q-dialog__inner--top
    > div
      border-radius: $generic-border-radius

    .q-select__dialog--focused
      max-height: 47vh !important

  &:not(.native-mobile) .q-dialog__inner--top .q-select__dialog--focused
    max-height: 50vh !important