From 5e0dc3bf6331f1bf0173458c2e64ae9ae503085e Mon Sep 17 00:00:00 2001 From: Etienne Lemay Date: Thu, 7 Jul 2016 15:02:13 -0400 Subject: [PATCH] =?UTF-8?q?Don=E2=80=99t=20make=20emojis=20rounded=20Show?= =?UTF-8?q?=20:hover=20effect=20on=20:before=20element=20instead=20so=20th?= =?UTF-8?q?at=20the=20cursor=20is=20always=20on=20an=20emoji?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- css/emoji-picker.css | 21 ++++++++++++++++++--- 1 file changed, 18 insertions(+), 3 deletions(-) diff --git a/css/emoji-picker.css b/css/emoji-picker.css index 9a746fc..eadf3df 100644 --- a/css/emoji-picker.css +++ b/css/emoji-picker.css @@ -12,6 +12,10 @@ border-radius: 5px; } +.emoji-picker .emoji-picker-emoji { + padding: 6px; +} + .emoji-picker-bar:first-child { border-top-left-radius: 5px; border-top-right-radius: 5px; @@ -84,11 +88,18 @@ outline: 0; } -.emoji-picker-category .emoji-picker-emoji:hover { +.emoji-picker-category .emoji-picker-emoji:hover:before { + z-index: 0; + content: ""; + position: absolute; + top: 0; left: 0; + width: 100%; height: 100%; background-color: #f4f4f4; + border-radius: 100%; } .emoji-picker-category-label { + z-index: 2; position: relative; position: -webkit-sticky; top: 0; @@ -104,9 +115,13 @@ } .emoji-picker-emoji { + position: relative; display: inline-block; - padding: 6px; - border-radius: 100%; +} + +.emoji-picker-emoji span { + z-index: 1; + position: relative; } .emoji-picker-no-results {