Correct usage and implementations of readonly and disabled in textfields

[DeNic0la]

Currently, a lot of text fields are disabled when the logged-in user does not have write permission for the field. This looks like this: The current implementation results in hardly readable text that can't be selected or copied.

Generic components affected by this issue

• frontend/src/components/form/
  • api/
    • ApiCheckbox.vue
    • ApiColorPicker.vue
    • ApiDatePicker.vue
    • ApiRichtext.vue
    • ApiSelect.vue
    • ApiSortable.vue
    • ApiSwitch.vue
    • ApiTextarea.vue
    • ApiTextField.vue
    • ApiTimePicker.vue
  • base/
    • ECheckbox.vue
    • EColorPicker.vue
    • EDatePicker.vue
    • ERichtext.vue
    • ESelect.vue
    • ESwitch.vue
    • ETextarea.vue
    • ETextField.vue

Requirements:

• The listed components all support/allow readonly and disabled property
• Components listed should have the outline style if !readonly && outlined
• All usages of the property disabled on components listed, should use readonly instead

This should look like this: