From 0f2652c8664ec0f4018f356b9cdb3d12ac3876b1 Mon Sep 17 00:00:00 2001
From: Florian Duros <florianduros@element.io>
Date: Thu, 13 Oct 2022 17:50:46 +0200
Subject: [PATCH] Change icon

---
 .../rooms/wysiwyg_composer/_FormattingButtons.pcss   | 12 ++++++------
 res/img/element-icons/room/composer/bold.svg         |  4 ++--
 res/img/element-icons/room/composer/italic.svg       |  4 ++--
 .../element-icons/room/composer/strike_through.svg   |  4 ----
 .../element-icons/room/composer/strikethrough.svg    |  4 ++++
 res/img/element-icons/room/composer/underline.svg    |  4 ++--
 .../rooms/wysiwyg_composer/FormattingButtons.tsx     |  2 +-
 7 files changed, 17 insertions(+), 17 deletions(-)
 delete mode 100644 res/img/element-icons/room/composer/strike_through.svg
 create mode 100644 res/img/element-icons/room/composer/strikethrough.svg

diff --git a/res/css/views/rooms/wysiwyg_composer/_FormattingButtons.pcss b/res/css/views/rooms/wysiwyg_composer/_FormattingButtons.pcss
index cedb2f4be0..36f84ae5f1 100644
--- a/res/css/views/rooms/wysiwyg_composer/_FormattingButtons.pcss
+++ b/res/css/views/rooms/wysiwyg_composer/_FormattingButtons.pcss
@@ -41,10 +41,10 @@ limitations under the License.
         &::before {
             content: '';
             position: absolute;
-            top: 8px;
-            left: 8px;
-            height: 12px;
-            width: 12px;
+            top: 6px;
+            left: 6px;
+            height: 16px;
+            width: 16px;
             background-color: $icon-button-color;
             mask-repeat: no-repeat;
             mask-size: contain;
@@ -95,8 +95,8 @@ limitations under the License.
         mask-image: url('$(res)/img/element-icons/room/composer/underline.svg');
     }
 
-    .mx_FormattingButtons_Button_strike-through::before {
-        mask-image: url('$(res)/img/element-icons/room/composer/strike_through.svg');
+    .mx_FormattingButtons_Button_strikethrough::before {
+        mask-image: url('$(res)/img/element-icons/room/composer/strikethrough.svg');
     }
 }
 
diff --git a/res/img/element-icons/room/composer/bold.svg b/res/img/element-icons/room/composer/bold.svg
index fa92101e51..4a5cb184cf 100644
--- a/res/img/element-icons/room/composer/bold.svg
+++ b/res/img/element-icons/room/composer/bold.svg
@@ -1,3 +1,3 @@
-<svg width="9" height="12" viewBox="0 0 9 12" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path fill-rule="evenodd" clip-rule="evenodd" d="M0 1C0 0.447715 0.447715 0 1 0H4.19231C6.09295 0 7.5 1.64388 7.5 3.5C7.5 4.25349 7.26813 4.97201 6.86549 5.55977C7.84346 6.1788 8.5 7.25485 8.5 8.5C8.5 10.4594 6.87427 12 4.92857 12H1C0.447715 12 0 11.5523 0 11V1ZM2 2V5H4.19231C4.84067 5 5.5 4.4053 5.5 3.5C5.5 2.5947 4.84067 2 4.19231 2H2ZM2 7V10H4.92857C5.82319 10 6.5 9.30206 6.5 8.5C6.5 7.69794 5.82319 7 4.92857 7H2Z" fill="#737D8C"/>
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M4 3C4 2.44772 4.44772 2 5 2H8.19231C10.093 2 11.5 3.64388 11.5 5.5C11.5 6.25349 11.2681 6.97201 10.8655 7.55977C11.8435 8.1788 12.5 9.25485 12.5 10.5C12.5 12.4594 10.8743 14 8.92857 14H5C4.44772 14 4 13.5523 4 13V3ZM6 4V7H8.19231C8.84067 7 9.5 6.4053 9.5 5.5C9.5 4.5947 8.84067 4 8.19231 4H6ZM6 9V12H8.92857C9.82319 12 10.5 11.3021 10.5 10.5C10.5 9.69794 9.82319 9 8.92857 9H6Z" fill="#8D97A5"/>
 </svg>
diff --git a/res/img/element-icons/room/composer/italic.svg b/res/img/element-icons/room/composer/italic.svg
index 5f162344f0..2299fc1fa2 100644
--- a/res/img/element-icons/room/composer/italic.svg
+++ b/res/img/element-icons/room/composer/italic.svg
@@ -1,3 +1,3 @@
-<svg width="8" height="13" viewBox="0 0 8 13" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M4.08599 1.60016L2.28071 10.4045H0.8C0.358172 10.4045 0 10.7627 0 11.2045C0 11.6464 0.358172 12.0045 0.8 12.0045H2.92107C2.92982 12.0047 2.93855 12.0047 2.94725 12.0045H5.06667C5.50849 12.0045 5.86667 11.6464 5.86667 11.2045C5.86667 10.7627 5.50849 10.4045 5.06667 10.4045H3.914L5.71927 1.60016H7.2C7.64183 1.60016 8 1.24199 8 0.800158C8 0.358331 7.64183 0.00015831 7.2 0.00015831H5.08171C5.0711 -5.33571e-05 5.06051 -5.22589e-05 5.04996 0.00015831H2.93333C2.4915 0.00015831 2.13333 0.358331 2.13333 0.800158C2.13333 1.24199 2.4915 1.60016 2.93333 1.60016H4.08599Z" fill="#8E99A4"/>
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8.08596 3.60016L6.28068 12.4045H4.79997C4.35814 12.4045 3.99997 12.7627 3.99997 13.2045C3.99997 13.6464 4.35814 14.0045 4.79997 14.0045H6.92104C6.92979 14.0047 6.93852 14.0047 6.94722 14.0045H9.06664C9.50846 14.0045 9.86664 13.6464 9.86664 13.2045C9.86664 12.7627 9.50846 12.4045 9.06664 12.4045H7.91397L9.71924 3.60016H11.2C11.6418 3.60016 12 3.24199 12 2.80016C12 2.35833 11.6418 2.00016 11.2 2.00016H9.08168C9.07107 1.99995 9.06048 1.99995 9.04993 2.00016H6.9333C6.49147 2.00016 6.1333 2.35833 6.1333 2.80016C6.1333 3.24199 6.49147 3.60016 6.9333 3.60016H8.08596Z" fill="#8D97A5"/>
 </svg>
diff --git a/res/img/element-icons/room/composer/strike_through.svg b/res/img/element-icons/room/composer/strike_through.svg
deleted file mode 100644
index 5d1119bd9b..0000000000
--- a/res/img/element-icons/room/composer/strike_through.svg
+++ /dev/null
@@ -1,4 +0,0 @@
-<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M7.93167 2.76958C7.48979 1.88101 6.58375 1.47362 5.58232 1.58148C4.03349 1.74829 3.62648 2.94831 3.81497 3.72822C4.02118 4.58143 4.69765 4.91317 5.89252 5.21717H11.28C11.6776 5.21717 12 5.56757 12 5.99981C12 6.43204 11.6776 6.78244 11.28 6.78244H0.72C0.322355 6.78244 0 6.43204 0 5.99981C0 5.56757 0.322355 5.21717 0.72 5.21717H2.90308C2.69392 4.91824 2.52701 4.55948 2.42223 4.12592C2.0021 2.38757 3.03605 0.282791 5.44033 0.0238381C6.85635 -0.128674 8.41032 0.440447 9.19844 2.02524C9.38753 2.40548 9.25724 2.88035 8.90743 3.08589C8.55763 3.29143 8.12076 3.14981 7.93167 2.76958Z" fill="#8E99A4"/>
-<path d="M8.28458 8.08683H9.77971C9.92538 8.87051 9.8142 9.70668 9.36651 10.4212C8.74261 11.4169 7.57984 12 5.98987 12C3.38435 12 2.18628 10.3895 1.94151 9.32405C1.84516 8.90469 2.07981 8.47984 2.4656 8.37511C2.8514 8.27038 3.24225 8.52544 3.3386 8.9448C3.41285 9.268 4.00136 10.4347 5.98987 10.4347C7.27118 10.4347 7.90296 9.97636 8.17634 9.54006C8.42836 9.13783 8.47197 8.60621 8.28458 8.08683Z" fill="#8E99A4"/>
-</svg>
diff --git a/res/img/element-icons/room/composer/strikethrough.svg b/res/img/element-icons/room/composer/strikethrough.svg
new file mode 100644
index 0000000000..0ed63b2139
--- /dev/null
+++ b/res/img/element-icons/room/composer/strikethrough.svg
@@ -0,0 +1,4 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.93167 4.76958C9.48979 3.88101 8.58375 3.47362 7.58232 3.58148C6.03349 3.74829 5.62648 4.94831 5.81497 5.72822C6.02118 6.58143 6.69765 6.91317 7.89252 7.21717H13.28C13.6776 7.21717 14 7.56757 14 7.99981C14 8.43204 13.6776 8.78244 13.28 8.78244H2.72C2.32235 8.78244 2 8.43204 2 7.99981C2 7.56757 2.32235 7.21717 2.72 7.21717H4.90308C4.69392 6.91824 4.52701 6.55948 4.42223 6.12592C4.0021 4.38757 5.03605 2.28279 7.44033 2.02384C8.85635 1.87133 10.4103 2.44045 11.1984 4.02524C11.3875 4.40548 11.2572 4.88035 10.9074 5.08589C10.5576 5.29143 10.1208 5.14981 9.93167 4.76958Z" fill="#8D97A5"/>
+<path d="M10.2846 10.0868H11.7797C11.9254 10.8705 11.8142 11.7067 11.3665 12.4212C10.7426 13.4169 9.57984 14 7.98987 14C5.38435 14 4.18628 12.3895 3.94151 11.324C3.84516 10.9047 4.07981 10.4798 4.4656 10.3751C4.8514 10.2704 5.24225 10.5254 5.3386 10.9448C5.41285 11.268 6.00136 12.4347 7.98987 12.4347C9.27118 12.4347 9.90296 11.9764 10.1763 11.5401C10.4284 11.1378 10.472 10.6062 10.2846 10.0868Z" fill="#8D97A5"/>
+</svg>
diff --git a/res/img/element-icons/room/composer/underline.svg b/res/img/element-icons/room/composer/underline.svg
index f9f8dc7fc1..b74e562ec8 100644
--- a/res/img/element-icons/room/composer/underline.svg
+++ b/res/img/element-icons/room/composer/underline.svg
@@ -1,3 +1,3 @@
-<svg width="10" height="12" viewBox="0 0 10 12" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M5.19333 9.3C7.21333 9.04 8.66667 7.22667 8.66667 5.19333V0.833333C8.66667 0.373333 8.29333 0 7.83333 0C7.37333 0 7 0.373333 7 0.833333V5.26667C7 6.38 6.24667 7.39333 5.15333 7.61333C3.65333 7.92667 2.33333 6.78 2.33333 5.33333V0.833333C2.33333 0.373333 1.96 0 1.5 0C1.04 0 0.666667 0.373333 0.666667 0.833333V5.33333C0.666667 7.71333 2.75333 9.61333 5.19333 9.3ZM0 11.3333C0 11.7 0.3 12 0.666667 12H8.66667C9.03333 12 9.33333 11.7 9.33333 11.3333C9.33333 10.9667 9.03333 10.6667 8.66667 10.6667H0.666667C0.3 10.6667 0 10.9667 0 11.3333Z" fill="#8E99A4"/>
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.19333 11.3C10.2133 11.04 11.6667 9.22667 11.6667 7.19333V2.83333C11.6667 2.37333 11.2933 2 10.8333 2C10.3733 2 10 2.37333 10 2.83333V7.26667C10 8.38 9.24667 9.39333 8.15333 9.61333C6.65333 9.92667 5.33333 8.78 5.33333 7.33333V2.83333C5.33333 2.37333 4.96 2 4.5 2C4.04 2 3.66667 2.37333 3.66667 2.83333V7.33333C3.66667 9.71333 5.75333 11.6133 8.19333 11.3ZM3 13.3333C3 13.7 3.3 14 3.66667 14H11.6667C12.0333 14 12.3333 13.7 12.3333 13.3333C12.3333 12.9667 12.0333 12.6667 11.6667 12.6667H3.66667C3.3 12.6667 3 12.9667 3 13.3333Z" fill="#8D97A5"/>
 </svg>
diff --git a/src/components/views/rooms/wysiwyg_composer/FormattingButtons.tsx b/src/components/views/rooms/wysiwyg_composer/FormattingButtons.tsx
index b82fce5201..9106fd3f62 100644
--- a/src/components/views/rooms/wysiwyg_composer/FormattingButtons.tsx
+++ b/src/components/views/rooms/wysiwyg_composer/FormattingButtons.tsx
@@ -64,6 +64,6 @@ export function FormattingButtons({ wysiwyg, formattingStates }: FormattingButto
         <Button isActive={formattingStates.bold === 'reversed'} label={_td("Bold")} keyCombo={{ ctrlOrCmdKey: true, key: 'b' }} onClick={() => wysiwyg.bold()} className="mx_FormattingButtons_Button_bold" />
         <Button isActive={formattingStates.italic === 'reversed'} label={_td('Italic')} keyCombo={{ ctrlOrCmdKey: true, key: 'i' }} onClick={() => wysiwyg.italic()} className="mx_FormattingButtons_Button_italic" />
         <Button isActive={formattingStates.underline === 'reversed'} label={_td('Underline')} keyCombo={{ ctrlOrCmdKey: true, key: 'u' }} onClick={() => wysiwyg.underline()} className="mx_FormattingButtons_Button_underline" />
-        <Button isActive={formattingStates.strikeThrough === 'reversed'} label={_td('Strike through')} onClick={() => wysiwyg.strikeThrough()} className="mx_FormattingButtons_Button_strike-through" />
+        <Button isActive={formattingStates.strikeThrough === 'reversed'} label={_td('Strikethrough')} onClick={() => wysiwyg.strikeThrough()} className="mx_FormattingButtons_Button_strikethrough" />
     </div>;
 }