// app global css
// from https://github.com/quasarframework/quasar/tree/dev/ui/src/css


@import "../../node_modules/rfs/stylus"

$rfs-base-font-size = 1.25rem
// $rfs-font-size-unit = rem
$rfs-breakpoint = 1400px
// $rfs-breakpoint-unit = px
// $rfs-factor = 10
// $rfs-rem-value = 16
$rfs-two-dimensional = true
// $rfs-class = false

$field-font-factor = 1.3
$field-label-font-factor = 1

.q-field__native
.q-item__label
  rfs($rfs-base-font-size * $field-font-factor)

.q-field__label
   &.no-pointer-events
     rfs($rfs-base-font-size * $field-font-factor)

.q-field__label
   rfs($rfs-base-font-size * $field-label-font-factor)
   padding-bottom .3em // needs to be dynamic based on font size

.q-field__control
   // height +??px // needs to be computed based on font size.


.q-page-container
  background $accent
  display: flex;
  justify-content: center;
.q-page
   width 80%
.q-field
  padding 0
.q-input
.q-select
  background white
  padding 0 .2em
  margin .2em
.response
  .q-textarea
  .q-input
    background $secondary
    padding 0 1em
.q-item
   padding 0
   margin 0
.greyedout
  opacity 0.5
input
  fontsize-12