Browse Source

Add cute little Tipper.js tooltips to the profiles on the home h-card

pull/1/head
Danielle McLean 4 years ago
parent
commit
c40372a020
Signed by: 00dani GPG Key ID: 8EB789DDF3ABD240
  1. 5
      home/templates/home/index.html
  2. 2
      lemonauth/static/lemonauth/css/indie.styl
  3. 4
      lemonauth/templates/lemonauth/indie.html
  4. 10
      lemoncurry/static/lemoncurry/css/layout.styl

5
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 %}

2
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

4
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 %}

10
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

Loading…
Cancel
Save