[IMP] web_editor: mark dirty text to translate with the translated color

The content to translate is yellow and the translated content is green
in page translation mode. When the user starts translating a paragraph
it stayed yellow, making it difficult to see the remaining content to
translate when translating a big page.

This commit colors the dirty text in a paler green so that the user can
see the distinction.

addons/web_editor/static/src/less/web_editor.ui.less

@@ -70,12 +70,17 @@
     margin: 10px;
     padding: 4px;
 }
-html[lang] > body.editor_enable{
-    [data-oe-translation-state] {
-        background: rgba(255, 255, 90, 0.5) !important;
+html[lang] > body.editor_enable [data-oe-translation-state] {
+    @o-color-content-to-translate: rgb(255, 255, 90);
+    @o-color-translated-content: rgb(120, 215, 110);
+
+    background: fade(@o-color-content-to-translate, 50%)!important;
+
+    &[data-oe-translation-state="translated"] {
+        background: fade(@o-color-translated-content, 50%)!important;
     }
-    [data-oe-translation-state="translated"] {
-        background: rgba(120, 215, 110, 0.5) !important;
+    &.o_dirty {
+        background: fade(@o-color-translated-content, 25%)!important;
     }
 }