bug#62562: 30.0.50; [PATCH] Some new SVG icons

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Yuan Fu]

[-- Attachment #1: Type: text/plain, Size: 706 bytes --]

X-Debbugs-CC: stefankangas@gmail.com

I really like the SVG icons Stefan K added to Customize, so I made some
more. These icons can be used for, eg, tab-bar, Customize, and warning
messages. (Especially for the warning message, right now it’s either an
emoji (⛔) or a black block (■).)

The naming is debatable. I want them to be in a subdir together, so they
are now in the "symbols" dir.

The ".16" is because some times an icon design is only suitable for a
particular size, similar to "optical sizing" in font design. Anyway, I
think being specific wouldn’t hurt; It’s easy to use the ".16" version
for other sizes like 32 or 64, but not so much the other way around.

Yuan


[-- Attachment #2: icons.patch --]
[-- Type: application/octet-stream, Size: 6226 bytes --]

From 57101530f3ae76d69049e8f872ecf9f2ca31c1bd Mon Sep 17 00:00:00 2001
From: Yuan Fu <casouri@gmail.com>
Date: Thu, 30 Mar 2023 21:58:05 -0700
Subject: [PATCH] Add some icons

(I don't want to write the commit message until we agree on the
naming.)
---
 etc/images/symbols/chevron.down.16.svg  | 3 +++
 etc/images/symbols/chevron.left.16.svg  | 3 +++
 etc/images/symbols/chevron.right.16.svg | 3 +++
 etc/images/symbols/chevron.up.16.svg    | 3 +++
 etc/images/symbols/cross.16.svg         | 4 ++++
 etc/images/symbols/cross.circle.16.svg  | 5 +++++
 etc/images/symbols/menu.16.svg          | 5 +++++
 etc/images/symbols/minus.16.svg         | 3 +++
 etc/images/symbols/minus.circle.16.svg  | 4 ++++
 etc/images/symbols/plus.16.svg          | 4 ++++
 etc/images/symbols/plus.circle.16.svg   | 5 +++++
 11 files changed, 42 insertions(+)
 create mode 100644 etc/images/symbols/chevron.down.16.svg
 create mode 100644 etc/images/symbols/chevron.left.16.svg
 create mode 100644 etc/images/symbols/chevron.right.16.svg
 create mode 100644 etc/images/symbols/chevron.up.16.svg
 create mode 100644 etc/images/symbols/cross.16.svg
 create mode 100644 etc/images/symbols/cross.circle.16.svg
 create mode 100644 etc/images/symbols/menu.16.svg
 create mode 100644 etc/images/symbols/minus.16.svg
 create mode 100644 etc/images/symbols/minus.circle.16.svg
 create mode 100644 etc/images/symbols/plus.16.svg
 create mode 100644 etc/images/symbols/plus.circle.16.svg

diff --git a/etc/images/symbols/chevron.down.16.svg b/etc/images/symbols/chevron.down.16.svg
new file mode 100644
index 00000000000..a74aafc74c4
--- /dev/null
+++ b/etc/images/symbols/chevron.down.16.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M14 6L8 11L2 6" stroke="black" stroke-width="2"/>
+</svg>
diff --git a/etc/images/symbols/chevron.left.16.svg b/etc/images/symbols/chevron.left.16.svg
new file mode 100644
index 00000000000..789d11dcd58
--- /dev/null
+++ b/etc/images/symbols/chevron.left.16.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10 2L5 8L10 14" stroke="black" stroke-width="2"/>
+</svg>
diff --git a/etc/images/symbols/chevron.right.16.svg b/etc/images/symbols/chevron.right.16.svg
new file mode 100644
index 00000000000..d9721c0892a
--- /dev/null
+++ b/etc/images/symbols/chevron.right.16.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6 2L11 8L6 14" stroke="black" stroke-width="2"/>
+</svg>
diff --git a/etc/images/symbols/chevron.up.16.svg b/etc/images/symbols/chevron.up.16.svg
new file mode 100644
index 00000000000..93d781102c8
--- /dev/null
+++ b/etc/images/symbols/chevron.up.16.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2 10L8 5L14 10" stroke="black" stroke-width="2"/>
+</svg>
diff --git a/etc/images/symbols/cross.16.svg b/etc/images/symbols/cross.16.svg
new file mode 100644
index 00000000000..81a8075177d
--- /dev/null
+++ b/etc/images/symbols/cross.16.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="M12 4L4 12" stroke="black" stroke-width="2"/>
+<path d="M12 12L4 4" stroke="black" stroke-width="2"/>
+</svg>
diff --git a/etc/images/symbols/cross.circle.16.svg b/etc/images/symbols/cross.circle.16.svg
new file mode 100644
index 00000000000..a14cf6f701c
--- /dev/null
+++ b/etc/images/symbols/cross.circle.16.svg
@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="8" cy="8" r="6" stroke="black" stroke-width="2"/>
+<path d="M11 11L5 5" stroke="black" stroke-width="2"/>
+<path d="M5 11L11 5" stroke="black" stroke-width="2"/>
+</svg>
diff --git a/etc/images/symbols/menu.16.svg b/etc/images/symbols/menu.16.svg
new file mode 100644
index 00000000000..27f6b7ce2ab
--- /dev/null
+++ b/etc/images/symbols/menu.16.svg
@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2 8H14" stroke="black" stroke-width="2"/>
+<path d="M2 4H14" stroke="black" stroke-width="2"/>
+<path d="M2 12H14" stroke="black" stroke-width="2"/>
+</svg>
diff --git a/etc/images/symbols/minus.16.svg b/etc/images/symbols/minus.16.svg
new file mode 100644
index 00000000000..ff0c97ef5a4
--- /dev/null
+++ b/etc/images/symbols/minus.16.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M13 8L3 8" stroke="black" stroke-width="2"/>
+</svg>
diff --git a/etc/images/symbols/minus.circle.16.svg b/etc/images/symbols/minus.circle.16.svg
new file mode 100644
index 00000000000..bec96048461
--- /dev/null
+++ b/etc/images/symbols/minus.circle.16.svg
@@ -0,0 +1,4 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="8" cy="8" r="6" stroke="black" stroke-width="2"/>
+<path d="M12 8H4" stroke="black" stroke-width="2"/>
+</svg>
diff --git a/etc/images/symbols/plus.16.svg b/etc/images/symbols/plus.16.svg
new file mode 100644
index 00000000000..5eee38de33c
--- /dev/null
+++ b/etc/images/symbols/plus.16.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="M13 8L3 8" stroke="black" stroke-width="2"/>
+<path d="M8 13V3" stroke="black" stroke-width="2"/>
+</svg>
diff --git a/etc/images/symbols/plus.circle.16.svg b/etc/images/symbols/plus.circle.16.svg
new file mode 100644
index 00000000000..93a69b97aeb
--- /dev/null
+++ b/etc/images/symbols/plus.circle.16.svg
@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="8" cy="8" r="6" stroke="black" stroke-width="2"/>
+<path d="M12 8H4" stroke="black" stroke-width="2"/>
+<path d="M8 12V4" stroke="black" stroke-width="2"/>
+</svg>
-- 
2.33.1

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Eli Zaretskii]

> Cc: stefankangas@gmail.com
> From: Yuan Fu <casouri@gmail.com>
> Date: Thu, 30 Mar 2023 22:52:02 -0700
> 
> I really like the SVG icons Stefan K added to Customize, so I made some
> more. These icons can be used for, eg, tab-bar, Customize, and warning
> messages. (Especially for the warning message, right now it’s either an
> emoji (⛔) or a black block (■).)
> 
> The naming is debatable. I want them to be in a subdir together, so they
> are now in the "symbols" dir.
> 
> The ".16" is because some times an icon design is only suitable for a
> particular size, similar to "optical sizing" in font design. Anyway, I
> think being specific wouldn’t hurt; It’s easy to use the ".16" version
> for other sizes like 32 or 64, but not so much the other way around.

Thanks.

Please rename the files so that they have only one period, in the
".svg" extension.  The rest should be dashes or underscores.  Also, I
think this deserves a NEWS entry.  And feel free to install this on
master.

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Yuan Fu]

Eli Zaretskii <eliz@gnu.org> writes:

>> Cc: stefankangas@gmail.com
>> From: Yuan Fu <casouri@gmail.com>
>> Date: Thu, 30 Mar 2023 22:52:02 -0700
>> 
>> I really like the SVG icons Stefan K added to Customize, so I made some
>> more. These icons can be used for, eg, tab-bar, Customize, and warning
>> messages. (Especially for the warning message, right now it’s either an
>> emoji (⛔) or a black block (■).)
>> 
>> The naming is debatable. I want them to be in a subdir together, so they
>> are now in the "symbols" dir.
>> 
>> The ".16" is because some times an icon design is only suitable for a
>> particular size, similar to "optical sizing" in font design. Anyway, I
>> think being specific wouldn’t hurt; It’s easy to use the ".16" version
>> for other sizes like 32 or 64, but not so much the other way around.
>
> Thanks.
>
> Please rename the files so that they have only one period, in the
> ".svg" extension.  The rest should be dashes or underscores.  Also, I
> think this deserves a NEWS entry.  And feel free to install this on
> master.

Done. I didn’t add any news entries yet since I have some further plans.

I wonder if there could be a command like list-icon-images that shows users
the icon images they can use?

Also CC’ing Juri, since I think maybe tab-bar can take advantage of some
of these icons :-)

Yuan

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Yuan Fu]

[-- Attachment #1: Type: text/plain, Size: 367 bytes --]

> 
> Done. I didn’t add any news entries yet since I have some further plans.
> 
> I wonder if there could be a command like list-icon-images that shows users
> the icon images they can use?
> 
> Also CC’ing Juri, since I think maybe tab-bar can take advantage of some
> of these icons :-)

Here are the icons (the color is applied by face property):


[-- Attachment #2: Screenshot 2023-04-01 at 1.08.45 AM.png --]
[-- Type: image/png, Size: 20743 bytes --]

[-- Attachment #3: Type: text/plain, Size: 6 bytes --]



Yuan

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Juri Linkov]

>> Done. I didn’t add any news entries yet since I have some further plans.
>> 
>> I wonder if there could be a command like list-icon-images that shows users
>> the icon images they can use?
>> 
>> Also CC’ing Juri, since I think maybe tab-bar can take advantage of some
>> of these icons :-)
>
> Here are the icons (the color is applied by face property):

Thanks, the new icons look really nice.  I'll add them to the tab-bar.

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Eli Zaretskii]

> From: Yuan Fu <casouri@gmail.com>
> Date: Sat, 1 Apr 2023 12:38:39 -0700
> Cc: Stefan Kangas <stefankangas@gmail.com>,
>  62562@debbugs.gnu.org,
>  Juri Linkov <juri@linkov.net>
> 
> I wonder if there could be a command like list-icon-images that shows users
> the icon images they can use?

Isn't that what image-dired does?

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Yuan Fu]

> On Apr 2, 2023, at 12:06 AM, Eli Zaretskii <eliz@gnu.org> wrote:
> 
>> From: Yuan Fu <casouri@gmail.com>
>> Date: Sat, 1 Apr 2023 12:38:39 -0700
>> Cc: Stefan Kangas <stefankangas@gmail.com>,
>> 62562@debbugs.gnu.org,
>> Juri Linkov <juri@linkov.net>
>> 
>> I wonder if there could be a command like list-icon-images that shows users
>> the icon images they can use?
> 
> Isn't that what image-dired does?

I was thinking of a discovery command, which shows package authors what icon images they can use out-of-the-box, and maybe show the path pass to create-image. They could simply go to image-load-path and call image-dired, but that assumes some degree of familiarity with Emacs and how we use icon images.

Yuan

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Juri Linkov]

[-- Attachment #1: Type: text/plain, Size: 462 bytes --]

> I wonder if there could be a command like list-icon-images that shows users
> the icon images they can use?

I'm using `t' (dired-toggle-marks) on all files in Dired in an image dir,
then `C-t C-t' (image-dired-dired-toggle-marked-thumbs).

> Also CC’ing Juri, since I think maybe tab-bar can take advantage of some
> of these icons :-)

After adapting new icons to tab-bar they look nice.
I invite everyone to try out this patch to see
how good they look:


[-- Attachment #2: tab-bar-symbols.patch --]
[-- Type: text/x-diff, Size: 1915 bytes --]

diff --git a/lisp/tab-bar.el b/lisp/tab-bar.el
index 7c3069ca269..044fdc852e0 100644
--- a/lisp/tab-bar.el
+++ b/lisp/tab-bar.el
@@ -162,7 +162,7 @@ tab-bar--load-buttons
   (declare-function icons--register "icons")
   (unless (iconp 'tab-bar-new)
     (define-icon tab-bar-new nil
-      `((image "tabs/new.xpm"
+      `((image "symbols/plus_16.svg" "tabs/new.xpm"
                :margin ,tab-bar-button-margin
                :ascent center)
         ;; (emoji "➕")
@@ -175,7 +175,7 @@ tab-bar--load-buttons
 
   (unless (iconp 'tab-bar-close)
     (define-icon tab-bar-close nil
-      `((image "tabs/close.xpm"
+      `((image "symbols/cross_16.svg" "tabs/close.xpm"
                :margin ,tab-bar-button-margin
                :ascent center)
         ;; (emoji " ❌")
@@ -189,7 +189,10 @@ tab-bar--load-buttons
 
   (unless (iconp 'tab-bar-menu-bar)
     (define-icon tab-bar-menu-bar nil
-      '(;; (emoji "🍔")
+      `((image "symbols/menu_16.svg"
+               :margin ,tab-bar-button-margin
+               :ascent center)
+        ;; (emoji "🍔")
         (symbol "☰")
         (text "Menu" :face tab-bar-tab-inactive))
       "Icon for the menu bar."
@@ -2133,7 +2142,7 @@ tab-bar-history-mode
 
         (unless (iconp 'tab-bar-back)
           (define-icon tab-bar-back nil
-            `((image "tabs/left-arrow.xpm"
+            `((image "symbols/chevron_left_16.svg" "tabs/left-arrow.xpm"
                      :margin ,tab-bar-button-margin
                      :ascent center)
               (text " < "))
@@ -2143,7 +2152,7 @@ tab-bar-history-mode
 
         (unless (iconp 'tab-bar-forward)
           (define-icon tab-bar-forward nil
-            `((image "tabs/right-arrow.xpm"
+            `((image "symbols/chevron_right_16.svg" "tabs/right-arrow.xpm"
                      :margin ,tab-bar-button-margin
                      :ascent center)
               (text " > "))

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Juri Linkov]

[-- Attachment #1: Type: text/plain, Size: 422 bytes --]

>> Also CC’ing Juri, since I think maybe tab-bar can take advantage of some
>> of these icons :-)
>
> After adapting new icons to tab-bar they look nice.
> I invite everyone to try out this patch to see
> how good they look:

Actually, now buttons are too saturated and attract too much attention,
so here is a better appearance where they are dimmed by the shadow face,
and corresponding code changes that allow this:


[-- Attachment #2: tab-bar-symbols-shadow.patch --]
[-- Type: text/x-diff, Size: 3238 bytes --]

diff --git a/lisp/tab-bar.el b/lisp/tab-bar.el
index 7c3069ca269..c42917d51a0 100644
--- a/lisp/tab-bar.el
+++ b/lisp/tab-bar.el
@@ -162,7 +162,8 @@ tab-bar--load-buttons
   (declare-function icons--register "icons")
   (unless (iconp 'tab-bar-new)
     (define-icon tab-bar-new nil
-      `((image "tabs/new.xpm"
+      `((image "symbols/plus_16.svg" "tabs/new.xpm"
+               :face shadow
                :margin ,tab-bar-button-margin
                :ascent center)
         ;; (emoji "➕")
@@ -175,7 +176,8 @@ tab-bar--load-buttons
 
   (unless (iconp 'tab-bar-close)
     (define-icon tab-bar-close nil
-      `((image "tabs/close.xpm"
+      `((image "symbols/cross_16.svg" "tabs/close.xpm"
+               :face shadow
                :margin ,tab-bar-button-margin
                :ascent center)
         ;; (emoji " ❌")
@@ -189,7 +191,10 @@ tab-bar--load-buttons
 
   (unless (iconp 'tab-bar-menu-bar)
     (define-icon tab-bar-menu-bar nil
-      '(;; (emoji "🍔")
+      `((image "symbols/menu_16.svg"
+               :margin ,tab-bar-button-margin
+               :ascent center)
+        ;; (emoji "🍔")
         (symbol "☰")
         (text "Menu" :face tab-bar-tab-inactive))
       "Icon for the menu bar."
@@ -717,16 +722,17 @@ tab-bar-tab-name-format-function
   :version "28.1")
 
 (defun tab-bar-tab-name-format-default (tab i)
-  (let ((current-p (eq (car tab) 'current-tab)))
-    (propertize
-     (concat (if tab-bar-tab-hints (format "%d " i) "")
-             (alist-get 'name tab)
-             (or (and tab-bar-close-button-show
-                      (not (eq tab-bar-close-button-show
-                               (if current-p 'non-selected 'selected)))
-                      tab-bar-close-button)
-                 ""))
-     'face (funcall tab-bar-tab-face-function tab))))
+  (let* ((current-p (eq (car tab) 'current-tab))
+         (name (concat (if tab-bar-tab-hints (format "%d " i) "")
+                       (alist-get 'name tab)
+                       (or (and tab-bar-close-button-show
+                                (not (eq tab-bar-close-button-show
+                                         (if current-p 'non-selected 'selected)))
+                                tab-bar-close-button)
+                           ""))))
+    (add-face-text-property
+     0 (length name) (funcall tab-bar-tab-face-function tab) t name)
+    name))
 
 (defcustom tab-bar-format '(tab-bar-format-history
                             tab-bar-format-tabs
@@ -2133,7 +2146,7 @@ tab-bar-history-mode
 
         (unless (iconp 'tab-bar-back)
           (define-icon tab-bar-back nil
-            `((image "tabs/left-arrow.xpm"
+            `((image "symbols/chevron_left_16.svg" "tabs/left-arrow.xpm"
                      :margin ,tab-bar-button-margin
                      :ascent center)
               (text " < "))
@@ -2143,7 +2156,7 @@ tab-bar-history-mode
 
         (unless (iconp 'tab-bar-forward)
           (define-icon tab-bar-forward nil
-            `((image "tabs/right-arrow.xpm"
+            `((image "symbols/chevron_right_16.svg" "tabs/right-arrow.xpm"
                      :margin ,tab-bar-button-margin
                      :ascent center)
               (text " > "))

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Yuan Fu]

> On Apr 2, 2023, at 11:37 PM, Juri Linkov <juri@linkov.net> wrote:
> 
>>> Also CC’ing Juri, since I think maybe tab-bar can take advantage of some
>>> of these icons :-)
>> 
>> After adapting new icons to tab-bar they look nice.
>> I invite everyone to try out this patch to see
>> how good they look:
> 
> Actually, now buttons are too saturated and attract too much attention,
> so here is a better appearance where they are dimmed by the shadow face,
> and corresponding code changes that allow this:

Looks nice! BTW, how could I apply a mouse-face to the buttons in the tab-bar? I poked around and mouse-face doesn’t seem to take an effect?

Yuan

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Juri Linkov]

>> Actually, now buttons are too saturated and attract too much attention,
>> so here is a better appearance where they are dimmed by the shadow face,
>> and corresponding code changes that allow this:
>
> Looks nice! BTW, how could I apply a mouse-face to the buttons in the
> tab-bar? I poked around and mouse-face doesn’t seem to take an effect?

Currently mouse-face is not supported neither by define-icon not by tab-bar.

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Yuan Fu]

> On Apr 3, 2023, at 9:23 AM, Juri Linkov <juri@linkov.net> wrote:
> 
>>> Actually, now buttons are too saturated and attract too much attention,
>>> so here is a better appearance where they are dimmed by the shadow face,
>>> and corresponding code changes that allow this:
>> 
>> Looks nice! BTW, how could I apply a mouse-face to the buttons in the
>> tab-bar? I poked around and mouse-face doesn’t seem to take an effect?
> 
> Currently mouse-face is not supported neither by define-icon not by tab-bar.

Ah, I see. How are the buttons implemented then? If I move my pointer on top of it, it shows the “pressed” face. I’m trying to style the buttons on the tab-bar.

Yuan

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Juri Linkov]

>>> Looks nice! BTW, how could I apply a mouse-face to the buttons in the
>>> tab-bar? I poked around and mouse-face doesn’t seem to take an effect?
>>
>> Currently mouse-face is not supported neither by define-icon not by tab-bar.
>
> Ah, I see.  How are the buttons implemented then?  If I move my
> pointer on top of it, it shows the “pressed” face.  I’m trying to
> style the buttons on the tab-bar.

Mouse pointer hovering is handled in 'note_tab_bar_highlight' by using
DRAW_IMAGE_SUNKEN.  But you could try to style the image attributes
such as :margin and :ascent in define-icon.

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Juri Linkov]

[-- Attachment #1: Type: text/plain, Size: 1828 bytes --]

>>>> Looks nice! BTW, how could I apply a mouse-face to the buttons in the
>>>> tab-bar? I poked around and mouse-face doesn’t seem to take an effect?
>>>
>>> Currently mouse-face is not supported neither by define-icon not by tab-bar.
>>
>> Ah, I see.  How are the buttons implemented then?  If I move my
>> pointer on top of it, it shows the “pressed” face.  I’m trying to
>> style the buttons on the tab-bar.
>
> Mouse pointer hovering is handled in 'note_tab_bar_highlight' by using
> DRAW_IMAGE_SUNKEN.  But you could try to style the image attributes
> such as :margin and :ascent in define-icon.

The tab line has a different implementation - with own problems.

Currently when the icon from tabs/close.xpm is used, then hovering
the mouse pointer changes the background of this image to the
background color of mouse-face.

But when the new image symbols/cross_16.svg is used, then on hovering
the original background color is preserved in the svg image, not replaced
with the background color of mouse-face.

I have no idea why there is such idiosyncrasy for svg images
with transparent background.

If this is not an important detail then below is a patch that
adds the new svg images to the tab line as well.

Another problem is that by default the foreground of new svg images
is black.  To tone down the black color, add-face-text-property
was added to tab-bar-tab-name-format-default to use the shadow face
in the previous patch.

The same way to support grayed color for icons on the tab line the
following patch uses add-face-text-property in
tab-line-tab-name-format-default.

The third problem was that using 'define-icon' broke the tab-line
auto-scrolling feature, because for some reason 'define-icon'
sets 'rear-nonsticky' to t.  So the fix below is to override it
and set 'rear-nonsticky' to nil.


[-- Warning: decoded text below may be mangled, UTF-8 assumed --]
[-- Attachment #2: tab-line-symbols-shadow.patch --]
[-- Type: text/x-diff, Size: 5303 bytes --]

diff --git a/lisp/tab-line.el b/lisp/tab-line.el
index 1958f12975f..ca990726cbc 100644
--- a/lisp/tab-line.el
+++ b/lisp/tab-line.el
@@ -185,12 +205,19 @@ tab-line-new-button-show
   :group 'tab-line
   :version "27.1")
 
+(define-icon tab-line-new nil
+  `((image "symbols/plus_16.svg" "tabs/new.xpm"
+           :face shadow
+           :margin (2 . 0)
+           :ascent center)
+    (text " + "))
+  "Icon for creating a new tab."
+  :version "30.1"
+  :help-echo "New tab")
+
 (defvar tab-line-new-button
-  (propertize " + "
-              'display '(image :type xpm
-                               :file "tabs/new.xpm"
-                               :margin (2 . 0)
-                               :ascent center)
+  (propertize (icon-string 'tab-line-new)
+              'rear-nonsticky nil
               'keymap tab-line-add-map
               'mouse-face 'tab-line-highlight
               'help-echo "Click to add tab")
@@ -213,34 +240,53 @@ tab-line-close-button-show
   :group 'tab-line
   :version "27.1")
 
+(define-icon tab-line-close nil
+  `((image "symbols/cross_16.svg" "tabs/close.xpm"
+           :face shadow
+           :margin (2 . 0)
+           :ascent center)
+    (text " x"))
+  "Icon for closing the clicked tab."
+  :version "30.1"
+  :help-echo "Click to close tab")
+
 (defvar tab-line-close-button
-  (propertize " x"
-              'display '(image :type xpm
-                               :file "tabs/close.xpm"
-                               :margin (2 . 0)
-                               :ascent center)
+  (propertize (icon-string 'tab-line-close)
+              'rear-nonsticky nil ;; important to not break auto-scroll
               'keymap tab-line-tab-close-map
               'mouse-face 'tab-line-close-highlight
               'help-echo "Click to close tab")
   "Button for closing the clicked tab.")
 
+(define-icon tab-line-left nil
+  `((image "symbols/chevron_left_16.svg" "tabs/left-arrow.xpm"
+           :face shadow
+           :margin (2 . 0)
+           :ascent center)
+    (text " <"))
+  "Icon for scrolling horizontally to the left."
+  :version "30.1")
+
 (defvar tab-line-left-button
-  (propertize " <"
-              'display '(image :type xpm
-                               :file "tabs/left-arrow.xpm"
-                               :margin (2 . 0)
-                               :ascent center)
+  (propertize (icon-string 'tab-line-left)
+              'rear-nonsticky nil
               'keymap tab-line-left-map
               'mouse-face 'tab-line-highlight
               'help-echo "Click to scroll left")
   "Button for scrolling horizontally to the left.")
 
+(define-icon tab-line-right nil
+  `((image "symbols/chevron_right_16.svg" "tabs/right-arrow.xpm"
+           :face shadow
+           :margin (2 . 0)
+           :ascent center)
+    (text "> "))
+  "Icon for scrolling horizontally to the right."
+  :version "30.1")
+
 (defvar tab-line-right-button
-  (propertize "> "
-              'display '(image :type xpm
-                               :file "tabs/right-arrow.xpm"
-                               :margin (2 . 0)
-                               :ascent center)
+  (propertize (icon-string 'tab-line-right)
+              'rear-nonsticky nil
               'keymap tab-line-right-map
               'mouse-face 'tab-line-highlight
               'help-echo "Click to scroll right")
@@ -484,21 +541,27 @@ tab-line-tab-name-format-default
       (setf face (funcall fn tab tabs face buffer-p selected-p)))
     (apply 'propertize
            (concat (propertize (string-replace "%" "%%" name) ;; (bug#57848)
+                               'face face
                                'keymap tab-line-tab-map
                                'help-echo (if selected-p "Current tab"
                                             "Click to select tab")
                                ;; Don't turn mouse-1 into mouse-2 (bug#49247)
                                'follow-link 'ignore)
-                   (or (and (or buffer-p (assq 'buffer tab) (assq 'close tab))
-                            tab-line-close-button-show
-                            (not (eq tab-line-close-button-show
-                                     (if selected-p 'non-selected 'selected)))
-                            tab-line-close-button)
-                       ""))
+                   (let ((close (or (and (or buffer-p (assq 'buffer tab)
+                                             (assq 'close tab))
+                                         tab-line-close-button-show
+                                         (not (eq tab-line-close-button-show
+                                                  (if selected-p 'non-selected
+                                                    'selected)))
+                                         tab-line-close-button)
+                                    "")))
+                     (setq close (copy-sequence close))
+                     ;; Don't overwrite the icon face
+                     (add-face-text-property 0 (length close) face t close)
+                     close))
            `(
              tab ,tab
              ,@(if selected-p '(selected t))
-             face ,face
              mouse-face tab-line-highlight))))
 
 (defun tab-line-format-template (tabs)

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Juri Linkov]

close 62562 30.0.50
thanks

>>>>> Looks nice! BTW, how could I apply a mouse-face to the buttons in the
>>>>> tab-bar? I poked around and mouse-face doesn’t seem to take an effect?
>>>>
>>>> Currently mouse-face is not supported neither by define-icon not by tab-bar.
>>>
>>> Ah, I see.  How are the buttons implemented then?  If I move my
>>> pointer on top of it, it shows the “pressed” face.  I’m trying to
>>> style the buttons on the tab-bar.
>>
>> Mouse pointer hovering is handled in 'note_tab_bar_highlight' by using
>> DRAW_IMAGE_SUNKEN.  But you could try to style the image attributes
>> such as :margin and :ascent in define-icon.
>
> The tab line has a different implementation

Now changes to use new icons in the tab-bar and tab-line
are pushed to master.  We have plenty of time to test
these changes before the next release.

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Yuan Fu]

> On Aug 27, 2023, at 10:27 AM, Juri Linkov <juri@linkov.net> wrote:
> 
> close 62562 30.0.50
> thanks
> 
>>>>>> Looks nice! BTW, how could I apply a mouse-face to the buttons in the
>>>>>> tab-bar? I poked around and mouse-face doesn’t seem to take an effect?
>>>>> 
>>>>> Currently mouse-face is not supported neither by define-icon not by tab-bar.
>>>> 
>>>> Ah, I see.  How are the buttons implemented then?  If I move my
>>>> pointer on top of it, it shows the “pressed” face.  I’m trying to
>>>> style the buttons on the tab-bar.
>>> 
>>> Mouse pointer hovering is handled in 'note_tab_bar_highlight' by using
>>> DRAW_IMAGE_SUNKEN.  But you could try to style the image attributes
>>> such as :margin and :ascent in define-icon.
>> 
>> The tab line has a different implementation
> 
> Now changes to use new icons in the tab-bar and tab-line
> are pushed to master.  We have plenty of time to test
> these changes before the next release.

Great!

Yuan

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Rudolf Adamkovič via Bug reports for GNU Emacs, the Swiss army knife of text editors]

Yuan Fu <casouri@gmail.com> writes:

>> Now changes to use new icons [...] are pushed to master.
>
> Great!

Yuan, the new icons look *fantastic* on
macOS/hiDPI.  Great work!  Thank you.

Rudy
-- 
"Music is the mathematics of the sense, mathematics is the music of the reason."
-- James Joseph Sylvester, 1814-1897

Rudolf Adamkovič <salutis@me.com> [he/him]
Studenohorská 25
84103 Bratislava
Slovakia

bug#62562: 30.0.50; [PATCH] Some new SVG icons

[Juri Linkov]

>>> Now changes to use new icons [...] are pushed to master.
>>
>> Great!
>
> Yuan, the new icons look *fantastic* on
> macOS/hiDPI.  Great work!  Thank you.

Now I tested the new icons on hiDPI,
and indeed they look great.  Thanks Yuan.

Also I noticed that some icons on the tab bar/line
required changing their height to the full line height.
So now tab icons are fixed in the commit 30decd1d977.