From 51c0fe66508fd02b746889588c766d5146e3abeb Mon Sep 17 00:00:00 2001
From: OVSharova <olga.sharova@onlyoffice.com>
Date: Mon, 28 Mar 2022 02:59:01 +0300
Subject: [PATCH] replace icon

---
 .../main/resources/help/de/editor.css         | 21 +++++++++++-
 .../main/resources/help/editor.css            | 20 ++++++++++-
 .../main/resources/help/en/editor.css         | 33 ++++++++++++++-----
 .../main/resources/help/es/editor.css         | 20 ++++++++++-
 .../main/resources/help/fr/editor.css         | 20 ++++++++++-
 .../main/resources/help/it/editor.css         | 20 ++++++++++-
 .../main/resources/help/ru/editor.css         | 20 ++++++++++-
 .../main/resources/help/de/editor.css         | 20 ++++++++++-
 .../main/resources/help/en/editor.css         | 20 ++++++++++-
 .../main/resources/help/es/editor.css         | 20 ++++++++++-
 .../main/resources/help/fr/editor.css         | 20 ++++++++++-
 .../main/resources/help/it/editor.css         | 20 ++++++++++-
 .../main/resources/help/ru/editor.css         | 20 ++++++++++-
 .../main/resources/help/de/editor.css         | 20 ++++++++++-
 .../main/resources/help/en/editor.css         | 20 ++++++++++-
 .../main/resources/help/es/editor.css         | 20 ++++++++++-
 .../main/resources/help/fr/editor.css         | 20 ++++++++++-
 .../main/resources/help/it/editor.css         | 20 ++++++++++-
 .../main/resources/help/ru/editor.css         | 20 ++++++++++-
 19 files changed, 368 insertions(+), 26 deletions(-)

diff --git a/apps/documenteditor/main/resources/help/de/editor.css b/apps/documenteditor/main/resources/help/de/editor.css
index 737db62dd..bdd53336b 100644
--- a/apps/documenteditor/main/resources/help/de/editor.css
+++ b/apps/documenteditor/main/resources/help/de/editor.css
@@ -121,7 +121,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -130,6 +130,25 @@ line-height: 1em;
 min-height: 14px;
 }
 
+
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/documenteditor/main/resources/help/editor.css b/apps/documenteditor/main/resources/help/editor.css
index 96352595e..ca6381455 100644
--- a/apps/documenteditor/main/resources/help/editor.css
+++ b/apps/documenteditor/main/resources/help/editor.css
@@ -96,7 +96,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -105,6 +105,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/documenteditor/main/resources/help/en/editor.css b/apps/documenteditor/main/resources/help/en/editor.css
index 9e6ba2c3f..ed548dffd 100644
--- a/apps/documenteditor/main/resources/help/en/editor.css
+++ b/apps/documenteditor/main/resources/help/en/editor.css
@@ -120,14 +120,31 @@ width: 80%;
 }
 
 .note
-{
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
-font-size: 11px;
-padding: 10px 20px 10px 37px;
-width: 90%;
-margin: 10px 0;
-line-height: 1em;
-min-height: 14px;
+{   background: #F4F4F4;
+    font-size: 11px;
+    padding: 10px 20px 10px 37px;
+    width: 90%;
+    margin: 10px 0;
+    line-height: 1em;
+    min-height: 14px;
+}
+
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
 }
 
 hr
diff --git a/apps/documenteditor/main/resources/help/es/editor.css b/apps/documenteditor/main/resources/help/es/editor.css
index 737db62dd..2133d8370 100644
--- a/apps/documenteditor/main/resources/help/es/editor.css
+++ b/apps/documenteditor/main/resources/help/es/editor.css
@@ -121,7 +121,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -130,6 +130,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/documenteditor/main/resources/help/fr/editor.css b/apps/documenteditor/main/resources/help/fr/editor.css
index 737db62dd..2133d8370 100644
--- a/apps/documenteditor/main/resources/help/fr/editor.css
+++ b/apps/documenteditor/main/resources/help/fr/editor.css
@@ -121,7 +121,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -130,6 +130,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/documenteditor/main/resources/help/it/editor.css b/apps/documenteditor/main/resources/help/it/editor.css
index 2a6d8149d..d05205136 100644
--- a/apps/documenteditor/main/resources/help/it/editor.css
+++ b/apps/documenteditor/main/resources/help/it/editor.css
@@ -100,7 +100,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -109,6 +109,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/documenteditor/main/resources/help/ru/editor.css b/apps/documenteditor/main/resources/help/ru/editor.css
index 71dc0e267..ad8186615 100644
--- a/apps/documenteditor/main/resources/help/ru/editor.css
+++ b/apps/documenteditor/main/resources/help/ru/editor.css
@@ -121,7 +121,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -130,6 +130,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/presentationeditor/main/resources/help/de/editor.css b/apps/presentationeditor/main/resources/help/de/editor.css
index 136e9dea3..3522727c4 100644
--- a/apps/presentationeditor/main/resources/help/de/editor.css
+++ b/apps/presentationeditor/main/resources/help/de/editor.css
@@ -111,7 +111,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -120,6 +120,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/presentationeditor/main/resources/help/en/editor.css b/apps/presentationeditor/main/resources/help/en/editor.css
index c736610c3..c560e9819 100644
--- a/apps/presentationeditor/main/resources/help/en/editor.css
+++ b/apps/presentationeditor/main/resources/help/en/editor.css
@@ -111,7 +111,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -120,6 +120,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/presentationeditor/main/resources/help/es/editor.css b/apps/presentationeditor/main/resources/help/es/editor.css
index 136e9dea3..3522727c4 100644
--- a/apps/presentationeditor/main/resources/help/es/editor.css
+++ b/apps/presentationeditor/main/resources/help/es/editor.css
@@ -111,7 +111,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -120,6 +120,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/presentationeditor/main/resources/help/fr/editor.css b/apps/presentationeditor/main/resources/help/fr/editor.css
index 7e2cb3bec..7ef863d12 100644
--- a/apps/presentationeditor/main/resources/help/fr/editor.css
+++ b/apps/presentationeditor/main/resources/help/fr/editor.css
@@ -111,7 +111,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -120,6 +120,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/presentationeditor/main/resources/help/it/editor.css b/apps/presentationeditor/main/resources/help/it/editor.css
index eb27bbd22..9df9b6e12 100644
--- a/apps/presentationeditor/main/resources/help/it/editor.css
+++ b/apps/presentationeditor/main/resources/help/it/editor.css
@@ -90,7 +90,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -99,6 +99,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/presentationeditor/main/resources/help/ru/editor.css b/apps/presentationeditor/main/resources/help/ru/editor.css
index c736610c3..c560e9819 100644
--- a/apps/presentationeditor/main/resources/help/ru/editor.css
+++ b/apps/presentationeditor/main/resources/help/ru/editor.css
@@ -111,7 +111,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -120,6 +120,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/spreadsheeteditor/main/resources/help/de/editor.css b/apps/spreadsheeteditor/main/resources/help/de/editor.css
index 7e2cb3bec..7ef863d12 100644
--- a/apps/spreadsheeteditor/main/resources/help/de/editor.css
+++ b/apps/spreadsheeteditor/main/resources/help/de/editor.css
@@ -111,7 +111,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -120,6 +120,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/spreadsheeteditor/main/resources/help/en/editor.css b/apps/spreadsheeteditor/main/resources/help/en/editor.css
index c736610c3..c560e9819 100644
--- a/apps/spreadsheeteditor/main/resources/help/en/editor.css
+++ b/apps/spreadsheeteditor/main/resources/help/en/editor.css
@@ -111,7 +111,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -120,6 +120,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/spreadsheeteditor/main/resources/help/es/editor.css b/apps/spreadsheeteditor/main/resources/help/es/editor.css
index 7e2cb3bec..7ef863d12 100644
--- a/apps/spreadsheeteditor/main/resources/help/es/editor.css
+++ b/apps/spreadsheeteditor/main/resources/help/es/editor.css
@@ -111,7 +111,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -120,6 +120,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/spreadsheeteditor/main/resources/help/fr/editor.css b/apps/spreadsheeteditor/main/resources/help/fr/editor.css
index 136e9dea3..3522727c4 100644
--- a/apps/spreadsheeteditor/main/resources/help/fr/editor.css
+++ b/apps/spreadsheeteditor/main/resources/help/fr/editor.css
@@ -111,7 +111,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -120,6 +120,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/spreadsheeteditor/main/resources/help/it/editor.css b/apps/spreadsheeteditor/main/resources/help/it/editor.css
index eb27bbd22..9df9b6e12 100644
--- a/apps/spreadsheeteditor/main/resources/help/it/editor.css
+++ b/apps/spreadsheeteditor/main/resources/help/it/editor.css
@@ -90,7 +90,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -99,6 +99,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;
diff --git a/apps/spreadsheeteditor/main/resources/help/ru/editor.css b/apps/spreadsheeteditor/main/resources/help/ru/editor.css
index c736610c3..c560e9819 100644
--- a/apps/spreadsheeteditor/main/resources/help/ru/editor.css
+++ b/apps/spreadsheeteditor/main/resources/help/ru/editor.css
@@ -111,7 +111,7 @@ width: 80%;
 
 .note
 {
-background: #F4F4F4 url(../images/help.png) no-repeat 7px 5px;
+background: #F4F4F4;
 font-size: 11px;
 padding: 10px 20px 10px 37px;
 width: 90%;
@@ -120,6 +120,24 @@ line-height: 1em;
 min-height: 14px;
 }
 
+.note:before {
+    width: 18px;
+    height: 18px;
+    background: #83888D;
+    font-weight: 900;
+    content: "!";
+    text-align: center;
+    font-size: 16px;
+    border-radius: 50%;
+    color: white;
+    display: inline-block;
+    line-height: 18px;
+    float: left;
+    position: relative;
+    left: -20px;
+    top: -3px;
+}
+
 hr
 {
 height: 1px;