Use a consistent color system

1. Renames color names in palette. Using names such as "primary" and
"secondary" that are in consistent with designs such as material,
bootstrap and metro UI palettes. It adds `color-` prefix on color
variables in line with Vue Design System.
2. Introduces necessary changes to follow the system color system
   everywhere without using any other color:
     - It changes tooltip background from black to darker primary
     colors.
     - It overrides unset styles from tree component
     - It ensures footer has same color as top menu.
3. Removes opacity CSS changes to have better control on choices. To
   achieve that:
     - It introduces new "light" variants of main colors
     - It switches to colors with different variants (e.g. in Dialogs it
       uses primary color as button as it has variants that can be
       activated on hover meanwhile on-surface color is single).
4. Styles a tags (anchor elements) globally for consistency

src/presentation/components/Code/TheCodeArea.vue

@@ -157,8 +157,7 @@ function getDefaultCode(language: ScriptingLanguage): string {
   height: 100%;
   overflow: auto;
   &__highlight {
-    background-color: $accent;
-    opacity: 0.2; // having procent fails in production (minified) build
+    background-color: $color-secondary-light;
     position: absolute;
   }
 }