#611

#611

#618

#592

The directive for dynamic backgroudn color was outdated. Directive is 
removed and problem is solved via CSS custom variable.

#561

- Remove all Roboto files

Since there is just one font, this setting can be safely ignored. This 
is easier than sanitizing all elements.

- Reformat styles

- If this property is set, the input of more characters than specified
in maxLength is prevented
- It also prevents the insertion of text.

- Reduce redundant code
- Prepare implementation of input limitations

- Remove prefix 'on'

This way elements can handle their logic themselves without having to
rely on outside utility classes.

Also restructure files in common in a more logical way.

- Split text field and drop list, so they can have differing props
- Improve their dimension default values
- Improve alignment of all cloze children components
- Add dynamic width parameter of toggle buttons to dimension properties
panel. Therefore the postion tab can always be shown and no longer needs
a condition.

- Use `inputmode` 'none' to hide the virtual keyboard of the os
- Use DeviceService to detect if the player is running
on a mobile device

Rename KeyboardComponent to KeypadComponent
Rename KeyboardService to KeypadService
Split LayoutComponent into LayoutPlayerComponent and
LayoutPagesComponent
Prepare the introduction of an additional keyboard

Instead, use Textfied component with the property isClozeChild

Remove duplicate code

- Use the attributes autocapitalize, autocorrect, spellcheck
- Replace [value]="elementModel.value" with
value="{{elementModel.value}}" to prevent lint errors

- Units and element are now built via the factory. This ensures only the
  wanted properties are present. All others are discarded.
- Since the sanatizer is supposed to check the unit defintion version
  it is used by player and editor and therefore put in common.
  This in turn makes it necessary to put the JSON resolver settings
  in the root-TSConfig file.
- Renamed a couple of properties to have clearer names.

Remove manipulations from elementModel
- Refactor drop list component
- Use of initial values for audio and video playback time

Defining the validators not in the elements anymore, but when creating
the forms

- Unify font and surface props
- Use intersection type for additional properties
- Also rework editor props panel to properly create the combined 
properties recursively, passing the results to its child panel (tabs).
New algorithm works without lodash, therefore the package is removed.

This removes all the classes and goes back to simple interfaces for
unit, pages etc and all elements. This makes creating them easier and
cleaner.
Things like specific needs when setting element properties and most
importantly compatibility handling is done by a special service module,
that knows all the elements and how to repair old their potentially
outdated definitions.

Remove the wrapper divs in each element component and add the
'fixed-size-content-wrapper' class to the element overlays
of player and editor

The previous solution, which uses a top position of 50%, did not work on
iPad

This is done according to the Angular best practices and minimizes
namespace collisions when using other packages which might use the same
selectors.

Technically the selectors are not even becessary since we use an Angular
component factory to create element components but it is still useful
for the DOM element naming, for debugging purposes for example.

The problem being solved is that compound-sub-elements must not have
all the properties other elements have. For exampe positioning info.
Sub-Elements are positioned inline. To avoid having similar class
inheritance structures for positioned and inline elements, we use
interface. Positioning is done via interface and is therefore optional.

Those optional properties are kept in an object in a variable. This
allows to hide specifics from element classes and removes the need to
initialize all the fields in every class using the interface.
The elements mostly care about their own specific properties anyway.

The same technique is used for font and surface elements. Here we also
don't want to initialize all the styles in every class.

Changing values of element properties works like before. Just set the
property as if it would be a direkt prop of the element. The element
itself puts the value in the currect sub-object (positioningProps,
fontProps etc).

For reading the values there is a similar method, but it is not used
anywhere by now. Since the properties panel operates on the raw values
anyway (refer CombinedProperties) and for element components this would
mean calling a function in the template, which caused change detection
to run the function very often and is therefore bad practice.

Additional notes and refactorings:
- Restructure all files in common. UIElements in the same folder etc.
- Move all interfaces to the UIElement file. This avoids circular
  imports, which would be needed to allow PositionedElement to extend
  UIElement.
- Interface initializers also handle reading values in the old form.
- Add PositionedElement for use in canvas overlays. This is a UIElement
  with guaranteed postionProps.
- Don't export all Material packages from common, only the ones
  used in player and editor. The rest is only used in common and
  does not need to be exported.

The issue here is the alignment if dropLists and text fields. They are 
supposed to be exactly in line with the text which is very complicated 
with Material components, which are heavily nested and contain several 
sub-elements which need to be changed - removing margins, paddings and 
other position related styles.

Setting on type button avoids that click events are evaluated from
the surrounding form

This allows to use them in template bindings. Used in compound elements.