From b8ee886d0b2397221d0297e86b6d1ea6b7434547 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=A9r=C3=A9mie=20Astori?= Date: Sun, 20 Mar 2016 16:55:13 -0400 Subject: [PATCH 1/3] Blur shadow and add small radius of context menu box --- client/css/style.css | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/client/css/style.css b/client/css/style.css index 31cad81e..614554ed 100644 --- a/client/css/style.css +++ b/client/css/style.css @@ -1216,8 +1216,9 @@ button, min-width: 160px; font-size: 14px; background-color: #fff; - box-shadow: 0 1px 2px rgba(0, 0, 0, .1); - border: 1px solid rgba(61, 70, 77, .1); + box-shadow: 0 3px 12px rgba(0, 0, 0, .15); + border: 1px solid rgba(0, 0, 0, .15); + border-radius: 2px; } .context-menu-item:first-child { From 4f7f862a5583bb4e4415c7fb9d8b081120de3a73 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=A9r=C3=A9mie=20Astori?= Date: Sun, 20 Mar 2016 17:03:39 -0400 Subject: [PATCH 2/3] Add a specific item divider for the context menu, allowing some margin --- client/css/style.css | 10 +++++++--- client/js/lounge.js | 1 + client/views/contextmenu_divider.tpl | 1 + 3 files changed, 9 insertions(+), 3 deletions(-) create mode 100644 client/views/contextmenu_divider.tpl diff --git a/client/css/style.css b/client/css/style.css index 614554ed..b439a1be 100644 --- a/client/css/style.css +++ b/client/css/style.css @@ -1221,15 +1221,19 @@ button, border-radius: 2px; } -.context-menu-item:first-child { - border-bottom: 1px solid rgba(61, 70, 77, .1); +.context-menu-divider { + height: 1px; + margin: 6px 0; + background-color: rgba(0, 0, 0, .1); } .context-menu-item { cursor: pointer; display: block; - padding: 6px 8px; + padding: 4px 8px; color: #333; + margin-top: 6px; + margin-bottom: 6px; } .context-menu-item:hover { diff --git a/client/js/lounge.js b/client/js/lounge.js index 2593424c..7dfa56d8 100644 --- a/client/js/lounge.js +++ b/client/js/lounge.js @@ -533,6 +533,7 @@ $(function() { text: target.data("title"), data: target.data("target") }); + output += render("contextmenu_divider"); output += render("contextmenu_item", { class: "close", text: target.hasClass("lobby") ? "Disconnect" : target.hasClass("query") ? "Close" : "Leave", diff --git a/client/views/contextmenu_divider.tpl b/client/views/contextmenu_divider.tpl new file mode 100644 index 00000000..19316d55 --- /dev/null +++ b/client/views/contextmenu_divider.tpl @@ -0,0 +1 @@ +
  • From f8807df2dcf81071d26f838742664b5dde9aad20 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?J=C3=A9r=C3=A9mie=20Astori?= Date: Sun, 20 Mar 2016 17:10:10 -0400 Subject: [PATCH 3/3] Use a white-bg X for closing and smooth icons in context menu --- client/css/style.css | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/client/css/style.css b/client/css/style.css index b439a1be..4d92b17c 100644 --- a/client/css/style.css +++ b/client/css/style.css @@ -1244,6 +1244,8 @@ button, font-family: FontAwesome; width: 20px; display: inline-block; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; } .context-menu-user:before { @@ -1255,7 +1257,7 @@ button, } .context-menu-close:before { - content: "\f057"; + content: "\f00d"; } /**