From 9894d9e9b7115ffe39c201fe5e23c4a22eab3afd Mon Sep 17 00:00:00 2001
From: wen-2018 <42974891+wen-2018@users.noreply.github.com>
Date: Tue, 17 Dec 2024 10:30:00 -0400
Subject: [PATCH 1/2] update about page hero section to use reduced padding
 icons

---
 .../templates/mozorg/about/includes/m24/manifesto.html    | 8 ++++----
 media/css/m24/feature.scss                                | 5 +++--
 media/img/icons/m24-large/bell.svg                        | 3 ---
 media/img/icons/m24-large/dollar.svg                      | 3 ---
 media/img/icons/m24-large/glasses.svg                     | 3 ---
 media/img/icons/m24-large/pencil.svg                      | 3 ---
 media/img/icons/m24-reduced-padding/bell.svg              | 1 +
 media/img/icons/m24-reduced-padding/dollar.svg            | 1 +
 media/img/icons/m24-reduced-padding/glasses.svg           | 1 +
 media/img/icons/m24-reduced-padding/pencil.svg            | 1 +
 10 files changed, 11 insertions(+), 18 deletions(-)
 delete mode 100644 media/img/icons/m24-large/bell.svg
 delete mode 100644 media/img/icons/m24-large/dollar.svg
 delete mode 100644 media/img/icons/m24-large/glasses.svg
 delete mode 100644 media/img/icons/m24-large/pencil.svg
 create mode 100644 media/img/icons/m24-reduced-padding/bell.svg
 create mode 100644 media/img/icons/m24-reduced-padding/dollar.svg
 create mode 100644 media/img/icons/m24-reduced-padding/glasses.svg
 create mode 100644 media/img/icons/m24-reduced-padding/pencil.svg

diff --git a/bedrock/mozorg/templates/mozorg/about/includes/m24/manifesto.html b/bedrock/mozorg/templates/mozorg/about/includes/m24/manifesto.html
index 045011a7154..f40ed035657 100644
--- a/bedrock/mozorg/templates/mozorg/about/includes/m24/manifesto.html
+++ b/bedrock/mozorg/templates/mozorg/about/includes/m24/manifesto.html
@@ -43,7 +43,7 @@ <h2 class="m24-c-feature-title">{{ ftl('m24-about-together-we-can') }}</h2>
     {% call picto(
       base_el='li',
       image=resp_img(
-        url='img/icons/m24-large/bell.svg',
+        url='img/icons/m24-reduced-padding/bell.svg',
         optional_attributes={
           'class': 'mzp-c-picto-image',
           'loading': 'lazy'
@@ -59,7 +59,7 @@ <h2 class="m24-c-feature-title">{{ ftl('m24-about-together-we-can') }}</h2>
     {% call picto(
       base_el='li',
       image=resp_img(
-        url='img/icons/m24-large/glasses.svg',
+        url='img/icons/m24-reduced-padding/glasses.svg',
         optional_attributes={
           'class': 'mzp-c-picto-image',
           'loading': 'lazy',
@@ -75,7 +75,7 @@ <h2 class="m24-c-feature-title">{{ ftl('m24-about-together-we-can') }}</h2>
     {% call picto(
       base_el='li',
       image=resp_img(
-        url='img/icons/m24-large/pencil.svg',
+        url='img/icons/m24-reduced-padding/pencil.svg',
         optional_attributes={
           'class': 'mzp-c-picto-image',
           'loading': 'lazy'
@@ -91,7 +91,7 @@ <h2 class="m24-c-feature-title">{{ ftl('m24-about-together-we-can') }}</h2>
     {% call picto(
       base_el='li',
       image=resp_img(
-        url='img/icons/m24-large/dollar.svg',
+        url='img/icons/m24-reduced-padding/dollar.svg',
         optional_attributes={
           'class': 'mzp-c-picto-image',
           'loading': 'lazy'
diff --git a/media/css/m24/feature.scss b/media/css/m24/feature.scss
index 0f9339d696f..ae90a7c8b70 100644
--- a/media/css/m24/feature.scss
+++ b/media/css/m24/feature.scss
@@ -60,8 +60,8 @@
     text-wrap-style: balance;
 
     .mzp-c-picto-image {
-        height: 48px;
-        width: 48px;
+        height: 24px;
+        width: auto;
     }
 
     p {
@@ -76,6 +76,7 @@
 @media #{$mq-md} {
     .mzp-c-picto-image {
         margin-bottom: $spacer-sm;
+        height: 48px;
     }
 }
 
diff --git a/media/img/icons/m24-large/bell.svg b/media/img/icons/m24-large/bell.svg
deleted file mode 100644
index d9223e6ceca..00000000000
--- a/media/img/icons/m24-large/bell.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48">
-  <path fill="#000" d="M37.39 30.478v3.481H25.74v-3.481h5.449v-9.23c0-3.972-3.225-7.204-7.189-7.204s-7.189 3.232-7.189 7.204v9.23h5.448v3.481H10.61v-3.481h2.72v-9.23c0-5.892 4.787-10.686 10.671-10.686 5.884 0 10.67 4.794 10.67 10.686v9.23h2.72Zm-11.65 3.481h-3.48v3.482h3.48V33.96Z"/>
-</svg>
diff --git a/media/img/icons/m24-large/dollar.svg b/media/img/icons/m24-large/dollar.svg
deleted file mode 100644
index 7fdaeceadf3..00000000000
--- a/media/img/icons/m24-large/dollar.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48">
-  <path fill="#000" d="M25.743 17.742v-3.77c3.19.784 5.562 3.745 5.562 7.172h-3.481c0-1.48-.847-2.767-2.081-3.402Zm-5.567 9.145h-3.482c0 3.429 2.376 6.313 5.567 7.096V30.29a3.827 3.827 0 0 1-2.085-3.404Zm8.409-3.686c-1.326-.701-2.913-.962-4.448-1.214-3.441-.565-3.961-.953-3.961-1.994 0-.886.286-1.503.9-1.942.316-.225.718-.402 1.185-.525v-3.553c-1.243.2-2.333.62-3.208 1.244-1.543 1.103-2.359 2.754-2.359 4.776 0 1.928.91 3.413 2.632 4.295 1.256.643 2.776.893 4.246 1.134 3.497.575 4.252.992 4.252 2.352 0 .922-.314 1.615-.96 2.119a3.57 3.57 0 0 1-1.121.568v3.522c1.25-.225 2.359-.64 3.262-1.345 1.483-1.156 2.3-2.883 2.3-4.863 0-2.051-.94-3.633-2.72-4.574ZM22.26 33.983v3.49h3.482v-3.49H22.26Zm3.482-20.01v-3.45H22.26v3.45h3.482Z"/>
-</svg>
diff --git a/media/img/icons/m24-large/glasses.svg b/media/img/icons/m24-large/glasses.svg
deleted file mode 100644
index 348ef9627a0..00000000000
--- a/media/img/icons/m24-large/glasses.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48"  viewBox="0 0 48 48">
-  <path fill="#000" d="M36.967 24.43h3.503c-.223 4.083-3.628 7.337-7.766 7.337-4.283 0-7.767-3.484-7.767-7.766v-.268h-1.874V24c0 4.282-3.484 7.766-7.766 7.766-4.139 0-7.543-3.254-7.767-7.338h3.503a4.29 4.29 0 0 0 4.264 3.857A4.29 4.29 0 0 0 19.582 24v-3.348a.938.938 0 0 0-.938-.937H11.95a.938.938 0 0 0-.937.937v.295H7.53v-.295a4.424 4.424 0 0 1 4.42-4.419h6.694a4.424 4.424 0 0 1 4.4 4.017h1.912a4.424 4.424 0 0 1 4.4-4.017h6.695a4.424 4.424 0 0 1 4.42 4.42v.294h-3.482v-.295a.938.938 0 0 0-.938-.937h-6.695a.938.938 0 0 0-.937.937V24a4.29 4.29 0 0 0 4.285 4.285 4.29 4.29 0 0 0 4.263-3.857Zm3.503-3.482v3.481h3.482v-3.481H40.47Zm-36.421 0v3.481H7.53v-3.481H4.05Z"/>
-</svg>
diff --git a/media/img/icons/m24-large/pencil.svg b/media/img/icons/m24-large/pencil.svg
deleted file mode 100644
index af0676b0f83..00000000000
--- a/media/img/icons/m24-large/pencil.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48"  viewBox="0 0 48 48">
-  <path fill="#000" d="M35.92 28.696 17.848 10.625l-6.89 6.887L29.03 35.583l8.011 1.122-1.121-8.01Zm-5.252 3.601L15.883 17.513l1.965-1.965 14.785 14.785.32 2.284-2.285-.32Zm-11.275-1.891v3.482h-3.416v-3.482h3.416Zm0 3.482h6.527v3.481h-6.527v-3.481Zm-8.434 0h5.018v3.481h-5.018v-3.481Z"/>
-</svg>
diff --git a/media/img/icons/m24-reduced-padding/bell.svg b/media/img/icons/m24-reduced-padding/bell.svg
new file mode 100644
index 00000000000..d5a769e9c2b
--- /dev/null
+++ b/media/img/icons/m24-reduced-padding/bell.svg
@@ -0,0 +1 @@
+<svg width="14" height="15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="M13.4957 10.4577v1.7408H7.671v-1.7408h2.724V5.84282c0-1.98618-1.61243-3.60203-3.59437-3.60203-1.98197 0-3.5944 1.61585-3.5944 3.60203v4.61488h2.72398v1.7408H.105469v-1.7408H1.46544V5.84282C1.46544 2.89678 3.8588.5 6.8006.5c2.94181 0 5.3352 2.39678 5.3352 5.34282v4.61488h1.3599ZM7.671 12.1985H5.93021l-.00001 1.7408h1.74079l.00001-1.7408Z" fill="#000"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.105469 .5)" d="M0 0h13.39v14H0z"/></clipPath></defs></svg>
\ No newline at end of file
diff --git a/media/img/icons/m24-reduced-padding/dollar.svg b/media/img/icons/m24-reduced-padding/dollar.svg
new file mode 100644
index 00000000000..bfb8413746b
--- /dev/null
+++ b/media/img/icons/m24-reduced-padding/dollar.svg
@@ -0,0 +1 @@
+<svg width="8" height="15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="M5.05942 4.10949V2.22462c1.59466.39188 2.78117 1.87197 2.78117 3.5858H6.09986c0-.74044-.42335-1.38344-1.04044-1.70093ZM2.27589 8.68156H.535156c0 1.71464 1.187684 3.15694 2.783484 3.54794v-1.8458c-.61834-.3171-1.04275-.96079-1.04275-1.70214Zm4.20434-1.84297c-.66251-.35034-1.45633-.48074-2.22399-.60682-1.72047-.28259-1.98035-.47653-1.98035-.99677 0-.44326.14313-.75194.45046-.97147.15752-.11251.35869-.20054.59229-.26213V2.22462c-.62161.09978-1.16664.30997-1.60407.62242C.942983 3.39818.535156 4.22391.535156 5.235c0 .96371.455033 1.70622 1.315904 2.14723.62791.32168 1.38799.44651 2.12307.56726 1.74826.28716 2.12573.49598 2.12573 1.17606 0 .46097-.15689.80739-.47967 1.05905-.15434.1203-.34443.2156-.56077.2841v1.7608c.62532-.1125 1.17939-.32 1.631-.6721.74169-.5782 1.15017-1.4418 1.15017-2.43185 0-1.02548-.47041-1.81628-1.36036-2.28696ZM3.31864 12.2295v1.7455h1.74078v-1.7455H3.31864ZM5.05942 2.22462V.5H3.31864v1.72462h1.74078Z" fill="#000"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.535156 .5)" d="M0 0h7.31v14H0z"/></clipPath></defs></svg>
\ No newline at end of file
diff --git a/media/img/icons/m24-reduced-padding/glasses.svg b/media/img/icons/m24-reduced-padding/glasses.svg
new file mode 100644
index 00000000000..bcb5db5c1e1
--- /dev/null
+++ b/media/img/icons/m24-reduced-padding/glasses.svg
@@ -0,0 +1 @@
+<svg width="21" height="15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="M16.6144 7.59742h1.7515c-.1116 2.04191-1.8139 3.66898-3.8832 3.66898-2.1412 0-3.8832-1.74204-3.8832-3.88322v-.1339h-.9371v.1339c0 2.14118-1.742 3.88322-3.88318 3.88322-2.0693 0-3.77159-1.62707-3.88318-3.66898h1.75148c.10783 1.08114 1.02266 1.9282 2.1317 1.9282 1.18135 0 2.14244-.96109 2.14244-2.14244V5.70939c0-.25841-.21024-.46866-.46866-.46866H4.10543c-.25841 0-.46866.21025-.46866.46866v.1473H1.89604v-.1473c0-1.21825.99114-2.20939 2.20939-2.20939H7.453c1.15052 0 2.09798.88412 2.19985 2.00854h.95625C10.7109 4.38412 11.6584 3.5 12.8089 3.5h3.3476c1.2182 0 2.2094.99114 2.2094 2.20939v.1473h-1.7407v-.1473c0-.25841-.2103-.46866-.4687-.46866h-3.3476c-.2584 0-.4686.21025-.4686.46866v1.67379c0 1.18135.9611 2.14244 2.1424 2.14244 1.109 0 2.0239-.84706 2.1317-1.9282Zm1.7515-1.74073v1.74073h1.7408V5.85669h-1.7408Zm-18.210627 0v1.74073H1.89604V5.85669H.155273Z" fill="#000"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.155273 .5)" d="M0 0h19.95v14H0z"/></clipPath></defs></svg>
\ No newline at end of file
diff --git a/media/img/icons/m24-reduced-padding/pencil.svg b/media/img/icons/m24-reduced-padding/pencil.svg
new file mode 100644
index 00000000000..52eedfbdbe0
--- /dev/null
+++ b/media/img/icons/m24-reduced-padding/pencil.svg
@@ -0,0 +1 @@
+<svg width="14" height="15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="M12.9756 9.53532 3.94001.5.495117 3.94357 9.53102 12.9792l4.00548.5607-.5609-4.00458ZM10.3497 11.336 2.95715 3.94378l.98265-.98227 7.3928 7.39259.1599 1.1419-1.1428-.16Zm-5.63727-.9455v1.7408H3.00438v-1.7408h1.70805Zm0 1.7408h3.26328v1.7407H4.71243v-1.7407Zm-4.217313 0H3.00438v1.7407H.495117v-1.7407Z" fill="#000"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.495117 .5)" d="M0 0h13.04v14H0z"/></clipPath></defs></svg>
\ No newline at end of file

From 12a95640f19ff20325f0c91dbf3d4087884b5452 Mon Sep 17 00:00:00 2001
From: wen-2018 <42974891+wen-2018@users.noreply.github.com>
Date: Tue, 17 Dec 2024 12:54:42 -0400
Subject: [PATCH 2/2] add viewBox for svgs and styles tweaks

---
 media/css/m24/feature.scss                      | 10 ++--------
 media/img/icons/m24-reduced-padding/bell.svg    |  2 +-
 media/img/icons/m24-reduced-padding/dollar.svg  |  2 +-
 media/img/icons/m24-reduced-padding/glasses.svg |  2 +-
 media/img/icons/m24-reduced-padding/pencil.svg  |  2 +-
 5 files changed, 6 insertions(+), 12 deletions(-)

diff --git a/media/css/m24/feature.scss b/media/css/m24/feature.scss
index ae90a7c8b70..de3535e1524 100644
--- a/media/css/m24/feature.scss
+++ b/media/css/m24/feature.scss
@@ -60,8 +60,9 @@
     text-wrap-style: balance;
 
     .mzp-c-picto-image {
-        height: 24px;
+        height: 30px;
         width: auto;
+        margin: $spacer-sm 0 $spacer-md;
     }
 
     p {
@@ -73,13 +74,6 @@
     font-size: 24px;
 }
 
-@media #{$mq-md} {
-    .mzp-c-picto-image {
-        margin-bottom: $spacer-sm;
-        height: 48px;
-    }
-}
-
 @media #{$mq-lg} {
     .mzp-c-picto {
         max-width: grid(6);
diff --git a/media/img/icons/m24-reduced-padding/bell.svg b/media/img/icons/m24-reduced-padding/bell.svg
index d5a769e9c2b..b72522ed5c6 100644
--- a/media/img/icons/m24-reduced-padding/bell.svg
+++ b/media/img/icons/m24-reduced-padding/bell.svg
@@ -1 +1 @@
-<svg width="14" height="15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="M13.4957 10.4577v1.7408H7.671v-1.7408h2.724V5.84282c0-1.98618-1.61243-3.60203-3.59437-3.60203-1.98197 0-3.5944 1.61585-3.5944 3.60203v4.61488h2.72398v1.7408H.105469v-1.7408H1.46544V5.84282C1.46544 2.89678 3.8588.5 6.8006.5c2.94181 0 5.3352 2.39678 5.3352 5.34282v4.61488h1.3599ZM7.671 12.1985H5.93021l-.00001 1.7408h1.74079l.00001-1.7408Z" fill="#000"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.105469 .5)" d="M0 0h13.39v14H0z"/></clipPath></defs></svg>
\ No newline at end of file
+<svg width="14" height="15" viewBox="0 0 14 15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="M13.4957 10.4577v1.7408H7.671v-1.7408h2.724V5.84282c0-1.98618-1.61243-3.60203-3.59437-3.60203-1.98197 0-3.5944 1.61585-3.5944 3.60203v4.61488h2.72398v1.7408H.105469v-1.7408H1.46544V5.84282C1.46544 2.89678 3.8588.5 6.8006.5c2.94181 0 5.3352 2.39678 5.3352 5.34282v4.61488h1.3599ZM7.671 12.1985H5.93021l-.00001 1.7408h1.74079l.00001-1.7408Z" fill="#000"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.105469 .5)" d="M0 0h13.39v14H0z"/></clipPath></defs></svg>
diff --git a/media/img/icons/m24-reduced-padding/dollar.svg b/media/img/icons/m24-reduced-padding/dollar.svg
index bfb8413746b..536f2d3d5b0 100644
--- a/media/img/icons/m24-reduced-padding/dollar.svg
+++ b/media/img/icons/m24-reduced-padding/dollar.svg
@@ -1 +1 @@
-<svg width="8" height="15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="M5.05942 4.10949V2.22462c1.59466.39188 2.78117 1.87197 2.78117 3.5858H6.09986c0-.74044-.42335-1.38344-1.04044-1.70093ZM2.27589 8.68156H.535156c0 1.71464 1.187684 3.15694 2.783484 3.54794v-1.8458c-.61834-.3171-1.04275-.96079-1.04275-1.70214Zm4.20434-1.84297c-.66251-.35034-1.45633-.48074-2.22399-.60682-1.72047-.28259-1.98035-.47653-1.98035-.99677 0-.44326.14313-.75194.45046-.97147.15752-.11251.35869-.20054.59229-.26213V2.22462c-.62161.09978-1.16664.30997-1.60407.62242C.942983 3.39818.535156 4.22391.535156 5.235c0 .96371.455033 1.70622 1.315904 2.14723.62791.32168 1.38799.44651 2.12307.56726 1.74826.28716 2.12573.49598 2.12573 1.17606 0 .46097-.15689.80739-.47967 1.05905-.15434.1203-.34443.2156-.56077.2841v1.7608c.62532-.1125 1.17939-.32 1.631-.6721.74169-.5782 1.15017-1.4418 1.15017-2.43185 0-1.02548-.47041-1.81628-1.36036-2.28696ZM3.31864 12.2295v1.7455h1.74078v-1.7455H3.31864ZM5.05942 2.22462V.5H3.31864v1.72462h1.74078Z" fill="#000"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.535156 .5)" d="M0 0h7.31v14H0z"/></clipPath></defs></svg>
\ No newline at end of file
+<svg width="8" height="15" viewBox="0 0 8 15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="M5.05942 4.10949V2.22462c1.59466.39188 2.78117 1.87197 2.78117 3.5858H6.09986c0-.74044-.42335-1.38344-1.04044-1.70093ZM2.27589 8.68156H.535156c0 1.71464 1.187684 3.15694 2.783484 3.54794v-1.8458c-.61834-.3171-1.04275-.96079-1.04275-1.70214Zm4.20434-1.84297c-.66251-.35034-1.45633-.48074-2.22399-.60682-1.72047-.28259-1.98035-.47653-1.98035-.99677 0-.44326.14313-.75194.45046-.97147.15752-.11251.35869-.20054.59229-.26213V2.22462c-.62161.09978-1.16664.30997-1.60407.62242C.942983 3.39818.535156 4.22391.535156 5.235c0 .96371.455033 1.70622 1.315904 2.14723.62791.32168 1.38799.44651 2.12307.56726 1.74826.28716 2.12573.49598 2.12573 1.17606 0 .46097-.15689.80739-.47967 1.05905-.15434.1203-.34443.2156-.56077.2841v1.7608c.62532-.1125 1.17939-.32 1.631-.6721.74169-.5782 1.15017-1.4418 1.15017-2.43185 0-1.02548-.47041-1.81628-1.36036-2.28696ZM3.31864 12.2295v1.7455h1.74078v-1.7455H3.31864ZM5.05942 2.22462V.5H3.31864v1.72462h1.74078Z" fill="#000"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.535156 .5)" d="M0 0h7.31v14H0z"/></clipPath></defs></svg>
diff --git a/media/img/icons/m24-reduced-padding/glasses.svg b/media/img/icons/m24-reduced-padding/glasses.svg
index bcb5db5c1e1..dba67d6a884 100644
--- a/media/img/icons/m24-reduced-padding/glasses.svg
+++ b/media/img/icons/m24-reduced-padding/glasses.svg
@@ -1 +1 @@
-<svg width="21" height="15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="M16.6144 7.59742h1.7515c-.1116 2.04191-1.8139 3.66898-3.8832 3.66898-2.1412 0-3.8832-1.74204-3.8832-3.88322v-.1339h-.9371v.1339c0 2.14118-1.742 3.88322-3.88318 3.88322-2.0693 0-3.77159-1.62707-3.88318-3.66898h1.75148c.10783 1.08114 1.02266 1.9282 2.1317 1.9282 1.18135 0 2.14244-.96109 2.14244-2.14244V5.70939c0-.25841-.21024-.46866-.46866-.46866H4.10543c-.25841 0-.46866.21025-.46866.46866v.1473H1.89604v-.1473c0-1.21825.99114-2.20939 2.20939-2.20939H7.453c1.15052 0 2.09798.88412 2.19985 2.00854h.95625C10.7109 4.38412 11.6584 3.5 12.8089 3.5h3.3476c1.2182 0 2.2094.99114 2.2094 2.20939v.1473h-1.7407v-.1473c0-.25841-.2103-.46866-.4687-.46866h-3.3476c-.2584 0-.4686.21025-.4686.46866v1.67379c0 1.18135.9611 2.14244 2.1424 2.14244 1.109 0 2.0239-.84706 2.1317-1.9282Zm1.7515-1.74073v1.74073h1.7408V5.85669h-1.7408Zm-18.210627 0v1.74073H1.89604V5.85669H.155273Z" fill="#000"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.155273 .5)" d="M0 0h19.95v14H0z"/></clipPath></defs></svg>
\ No newline at end of file
+<svg width="21" height="15" viewBox="0 0 21 15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="M16.6144 7.59742h1.7515c-.1116 2.04191-1.8139 3.66898-3.8832 3.66898-2.1412 0-3.8832-1.74204-3.8832-3.88322v-.1339h-.9371v.1339c0 2.14118-1.742 3.88322-3.88318 3.88322-2.0693 0-3.77159-1.62707-3.88318-3.66898h1.75148c.10783 1.08114 1.02266 1.9282 2.1317 1.9282 1.18135 0 2.14244-.96109 2.14244-2.14244V5.70939c0-.25841-.21024-.46866-.46866-.46866H4.10543c-.25841 0-.46866.21025-.46866.46866v.1473H1.89604v-.1473c0-1.21825.99114-2.20939 2.20939-2.20939H7.453c1.15052 0 2.09798.88412 2.19985 2.00854h.95625C10.7109 4.38412 11.6584 3.5 12.8089 3.5h3.3476c1.2182 0 2.2094.99114 2.2094 2.20939v.1473h-1.7407v-.1473c0-.25841-.2103-.46866-.4687-.46866h-3.3476c-.2584 0-.4686.21025-.4686.46866v1.67379c0 1.18135.9611 2.14244 2.1424 2.14244 1.109 0 2.0239-.84706 2.1317-1.9282Zm1.7515-1.74073v1.74073h1.7408V5.85669h-1.7408Zm-18.210627 0v1.74073H1.89604V5.85669H.155273Z" fill="#000"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.155273 .5)" d="M0 0h19.95v14H0z"/></clipPath></defs></svg>
diff --git a/media/img/icons/m24-reduced-padding/pencil.svg b/media/img/icons/m24-reduced-padding/pencil.svg
index 52eedfbdbe0..4d698834d3e 100644
--- a/media/img/icons/m24-reduced-padding/pencil.svg
+++ b/media/img/icons/m24-reduced-padding/pencil.svg
@@ -1 +1 @@
-<svg width="14" height="15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="M12.9756 9.53532 3.94001.5.495117 3.94357 9.53102 12.9792l4.00548.5607-.5609-4.00458ZM10.3497 11.336 2.95715 3.94378l.98265-.98227 7.3928 7.39259.1599 1.1419-1.1428-.16Zm-5.63727-.9455v1.7408H3.00438v-1.7408h1.70805Zm0 1.7408h3.26328v1.7407H4.71243v-1.7407Zm-4.217313 0H3.00438v1.7407H.495117v-1.7407Z" fill="#000"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.495117 .5)" d="M0 0h13.04v14H0z"/></clipPath></defs></svg>
\ No newline at end of file
+<svg width="14" height="15" viewBox="0 0 14 15" fill="none" xmlns="http://www.w3.org/2000/svg"><g clip-path="url(#a)"><path d="M12.9756 9.53532 3.94001.5.495117 3.94357 9.53102 12.9792l4.00548.5607-.5609-4.00458ZM10.3497 11.336 2.95715 3.94378l.98265-.98227 7.3928 7.39259.1599 1.1419-1.1428-.16Zm-5.63727-.9455v1.7408H3.00438v-1.7408h1.70805Zm0 1.7408h3.26328v1.7407H4.71243v-1.7407Zm-4.217313 0H3.00438v1.7407H.495117v-1.7407Z" fill="#000"/></g><defs><clipPath id="a"><path fill="#fff" transform="translate(.495117 .5)" d="M0 0h13.04v14H0z"/></clipPath></defs></svg>