From 88726cf29aa825da0a40927e76eb74e3858da026 Mon Sep 17 00:00:00 2001 From: Fabio Caccamo Date: Wed, 13 Sep 2023 15:51:05 +0200 Subject: [PATCH 1/6] Fix wrong context-menu items vertical margins. --- src/fontra/client/web-components/menu-panel.js | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/fontra/client/web-components/menu-panel.js b/src/fontra/client/web-components/menu-panel.js index b7223925f..0570e8324 100644 --- a/src/fontra/client/web-components/menu-panel.js +++ b/src/fontra/client/web-components/menu-panel.js @@ -66,6 +66,14 @@ class MenuPanel extends SimpleElement { color: #8080a0; } + .context-menu-item:first-of-type { + margin-top: 0.5em; + } + + .context-menu-item:last-of-type { + margin-bottom: 0.5em; + } + .context-menu-item.enabled { color: inherit; } From c8cf704ecf336b6b554dd1ef1e2f8d65b7fd902d Mon Sep 17 00:00:00 2001 From: Fabio Caccamo Date: Wed, 13 Sep 2023 15:55:32 +0200 Subject: [PATCH 2/6] Reduce items padding left. --- src/fontra/client/web-components/menu-panel.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/fontra/client/web-components/menu-panel.js b/src/fontra/client/web-components/menu-panel.js index 0570e8324..2dd110ae4 100644 --- a/src/fontra/client/web-components/menu-panel.js +++ b/src/fontra/client/web-components/menu-panel.js @@ -62,7 +62,7 @@ class MenuPanel extends SimpleElement { display: grid; grid-template-columns: 1em auto; gap: 0em; - padding: 0.1em 0.8em 0.1em 0.5em; /* top, right, bottom, left */ + padding: 0.1em 0.8em 0.1em 0.0em; /* top, right, bottom, left */ color: #8080a0; } From dfbfaf97af64d90292daa4b6f1e88cb383b79c5f Mon Sep 17 00:00:00 2001 From: Fabio Caccamo Date: Thu, 14 Sep 2023 14:48:53 +0200 Subject: [PATCH 3/6] Reduce items vertical spacing. --- src/fontra/client/web-components/menu-panel.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/fontra/client/web-components/menu-panel.js b/src/fontra/client/web-components/menu-panel.js index 2dd110ae4..cc8b01609 100644 --- a/src/fontra/client/web-components/menu-panel.js +++ b/src/fontra/client/web-components/menu-panel.js @@ -62,7 +62,7 @@ class MenuPanel extends SimpleElement { display: grid; grid-template-columns: 1em auto; gap: 0em; - padding: 0.1em 0.8em 0.1em 0.0em; /* top, right, bottom, left */ + padding: 0.05em 0.8em 0.05em 0.0em; /* top, right, bottom, left */ color: #8080a0; } From 4e28add53363e6912d4c7b968ac91dc8491beb83 Mon Sep 17 00:00:00 2001 From: Fabio Caccamo Date: Thu, 14 Sep 2023 14:52:32 +0200 Subject: [PATCH 4/6] Revert "Reduce items vertical spacing." This reverts commit dfbfaf97af64d90292daa4b6f1e88cb383b79c5f. --- src/fontra/client/web-components/menu-panel.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/fontra/client/web-components/menu-panel.js b/src/fontra/client/web-components/menu-panel.js index cc8b01609..2dd110ae4 100644 --- a/src/fontra/client/web-components/menu-panel.js +++ b/src/fontra/client/web-components/menu-panel.js @@ -62,7 +62,7 @@ class MenuPanel extends SimpleElement { display: grid; grid-template-columns: 1em auto; gap: 0em; - padding: 0.05em 0.8em 0.05em 0.0em; /* top, right, bottom, left */ + padding: 0.1em 0.8em 0.1em 0.0em; /* top, right, bottom, left */ color: #8080a0; } From 1c9bc614a3dd2da038f5d2ad0b770651a0e0f7a8 Mon Sep 17 00:00:00 2001 From: Fabio Caccamo Date: Thu, 14 Sep 2023 15:17:34 +0200 Subject: [PATCH 5/6] Adjust divider spacing. --- src/fontra/client/web-components/menu-panel.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/fontra/client/web-components/menu-panel.js b/src/fontra/client/web-components/menu-panel.js index 2dd110ae4..46a766f9c 100644 --- a/src/fontra/client/web-components/menu-panel.js +++ b/src/fontra/client/web-components/menu-panel.js @@ -56,6 +56,7 @@ class MenuPanel extends SimpleElement { border: none; border-top: 1px solid #80808080; height: 1px; + margin: 0.4em 0 0.35em 0; } .context-menu-item { From 231c235c13c66d042a90b91d0259e33ebf6eedb6 Mon Sep 17 00:00:00 2001 From: Just van Rossum Date: Thu, 14 Sep 2023 15:36:11 +0200 Subject: [PATCH 6/6] Use menu container class instead of fiddling with first and last item-of-type; fine tune margins/padding, revert left padding change --- src/fontra/client/web-components/menu-panel.js | 18 +++++++----------- 1 file changed, 7 insertions(+), 11 deletions(-) diff --git a/src/fontra/client/web-components/menu-panel.js b/src/fontra/client/web-components/menu-panel.js index 46a766f9c..4e0f847ad 100644 --- a/src/fontra/client/web-components/menu-panel.js +++ b/src/fontra/client/web-components/menu-panel.js @@ -52,29 +52,25 @@ class MenuPanel extends SimpleElement { cursor: default; } + .menu-container { + margin: 0.2em 0em 0.3em 0em; /* top, right, bottom, left */ + } + .menu-item-divider { border: none; border-top: 1px solid #80808080; height: 1px; - margin: 0.4em 0 0.35em 0; + margin: 0.3em 0 0.2em 0; } .context-menu-item { display: grid; grid-template-columns: 1em auto; gap: 0em; - padding: 0.1em 0.8em 0.1em 0.0em; /* top, right, bottom, left */ + padding: 0.1em 0.8em 0.1em 0.5em; /* top, right, bottom, left */ color: #8080a0; } - .context-menu-item:first-of-type { - margin-top: 0.5em; - } - - .context-menu-item:last-of-type { - margin-bottom: 0.5em; - } - .context-menu-item.enabled { color: inherit; } @@ -97,7 +93,7 @@ class MenuPanel extends SimpleElement { this.style = "display: none;"; this.position = position; this.positionContainer = positionContainer; - this.menuElement = html.div({ tabindex: 0 }); + this.menuElement = html.div({ class: "menu-container", tabindex: 0 }); // No context menu on our context menu please: this.menuElement.oncontextmenu = (event) => event.preventDefault();