In trantor template
UI Browser Front end for Light2 Project based on Quasar/Vue
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

79 lines
2.1 KiB

  1. // QUASAR COMPONENT DEFAULT STYLING
  2. // ===================== Q FIELD COMPPONENT ============================
  3. $field-font-factor = 1.5 // relative to base font size
  4. $field-label-font-factor = 1 // relative to field font size
  5. $field-color = $secondary-5
  6. $field-text-color = white // $secondary-1
  7. $field-label-color = $secondary-1 // field-text-color
  8. $field-seperator-height = $secondary-5
  9. $field-focused-color = $field-color
  10. $field-focused-text-color = $field-text-color
  11. $field-dropdown-color = $field-text-color
  12. $field-dropdown-text-color = $field-color
  13. $field-disabled-opacity = 80% // percent 0-1 1 = none
  14. $field-check-color = $field-text-color
  15. // Classes
  16. .q-field__native
  17. rfs($rfs-base-font-size * $field-font-factor)
  18. color $field-text-color
  19. .q-checkbox__label
  20. input
  21. color $field-text-color
  22. .q-checkbox__label
  23. .q-field__label
  24. rfs($rfs-base-font-size * $field-font-factor)
  25. color $field-label-color
  26. &.no-pointer-events
  27. rfs($rfs-base-font-size * $field-font-factor * $field-label-font-factor)
  28. padding-bottom .8em // needs to be dynamic based on font size
  29. .q-field
  30. // margin .5em
  31. padding .2em 1em
  32. background $field-color
  33. &.q-field--focused
  34. .q-field__control
  35. background $field-focused-color
  36. color $field-focused-text-color
  37. .q-select__dropdown-icon
  38. .q-radio__inner
  39. color $field-text-color
  40. .q-checkbox__bg
  41. background $field-color
  42. color $field-text-color
  43. .q-checkbox__svg
  44. color $field-check-color
  45. &.q-chips-checkbox-select__options
  46. background $field-dropdown-color
  47. .q-checkbox__inner
  48. .q-checkbox__label
  49. color $field-dropdown-text-color
  50. .q-checkbox__bg
  51. background $field-dropdown-color
  52. color $field-dropdown-text-color
  53. .q-checkbox__svg
  54. color $field-dropdown-text-color
  55. &.q-select__options
  56. padding .2em
  57. .q-item
  58. background $field-dropdown-color
  59. .q-item__label
  60. color $field-dropdown-text-color
  61. .q-field__append
  62. color $field-label-color
  63. .q-field--disabled
  64. .q-field__control
  65. >div
  66. opacity $field-disabled-opacity !important
Default Body Inner Post