From c40372a0209549eed0ea764c5a0697fbd0adf2c2 Mon Sep 17 00:00:00 2001
From: Danielle McLean <dani@00dani.me>
Date: Tue, 1 May 2018 14:15:37 +1000
Subject: [PATCH] Add cute little Tipper.js tooltips to the profiles on the
 home h-card

---
 home/templates/home/index.html               |  5 +++++
 lemonauth/static/lemonauth/css/indie.styl    |  2 --
 lemonauth/templates/lemonauth/indie.html     |  4 ++--
 lemoncurry/static/lemoncurry/css/layout.styl | 10 +++++++---
 4 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/home/templates/home/index.html b/home/templates/home/index.html
index 9340ef1..b039d09 100644
--- a/home/templates/home/index.html
+++ b/home/templates/home/index.html
@@ -63,3 +63,8 @@
 	{% endfor %}
 </ol>
 {% endblock %}
+{% block foot %}
+<script type="text/javascript">
+	tippy('.profiles [title]', {arrow: true});
+</script>
+{% endblock %}
diff --git a/lemonauth/static/lemonauth/css/indie.styl b/lemonauth/static/lemonauth/css/indie.styl
index ee7a853..4c64399 100644
--- a/lemonauth/static/lemonauth/css/indie.styl
+++ b/lemonauth/static/lemonauth/css/indie.styl
@@ -5,10 +5,8 @@
 .tippy-tooltip
 	&.success-theme
 		color $base0B
-		background-color $base03
 	&.warning-theme
 		color $base0A
-		background-color $base03
 .verified-success
 	color $base0B
 .verified-warning
diff --git a/lemonauth/templates/lemonauth/indie.html b/lemonauth/templates/lemonauth/indie.html
index 94a346b..cfe6615 100644
--- a/lemonauth/templates/lemonauth/indie.html
+++ b/lemonauth/templates/lemonauth/indie.html
@@ -14,11 +14,11 @@
 			{% if app %}{{ app.name | first }}{% endif %}
 			{% if app %}({% endif %}<a class="u-url code{% if not app %} p-name{% endif %}" href="{{ params.client_id }}">{{ params.client_id }}</a>{% if app %}){% endif %}?
 			{% if verified %}
-			<span data-tooltip data-tippy-theme="success" data-tippy-html="#verified-success">
+			<span data-tooltip data-tippy-theme="dark success" data-tippy-html="#verified-success">
 				<i class="fas fa-check-circle verified-success"></i>
 			</span>
 			{% else %}
-			<span data-tooltip data-tippy-theme="warning" data-tippy-html="#verified-warning">
+			<span data-tooltip data-tippy-theme="dark warning" data-tippy-html="#verified-warning">
 				<i class="fas fa-question-circle verified-warning"></i>
 			</span>
 			{% endif %}
diff --git a/lemoncurry/static/lemoncurry/css/layout.styl b/lemoncurry/static/lemoncurry/css/layout.styl
index 5d7705d..64c3913 100644
--- a/lemoncurry/static/lemoncurry/css/layout.styl
+++ b/lemoncurry/static/lemoncurry/css/layout.styl
@@ -33,9 +33,13 @@ code, pre, .code, .pre
 		text-decoration none
 		line-height 1
 
-.tippy-popper[x-placement^=top] .tippy-tooltip
-	.tippy-arrow
-		border-top-color $base03
+for placement in top bottom left right
+	.tippy-popper[x-placement^={placement}] .tippy-tooltip.dark-theme .tippy-arrow
+		border-{placement}-color $base03
+
+.tippy-tooltip.dark-theme
+	background-color $base03
+	color $base04
 
 body
 	display flex