Add cute little Tipper.js tooltips to the profiles on the home h-card
This commit is contained in:
parent
ffd0d3384e
commit
c40372a020
4 changed files with 14 additions and 7 deletions
|
@ -63,3 +63,8 @@
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</ol>
|
</ol>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
{% block foot %}
|
||||||
|
<script type="text/javascript">
|
||||||
|
tippy('.profiles [title]', {arrow: true});
|
||||||
|
</script>
|
||||||
|
{% endblock %}
|
||||||
|
|
|
@ -5,10 +5,8 @@
|
||||||
.tippy-tooltip
|
.tippy-tooltip
|
||||||
&.success-theme
|
&.success-theme
|
||||||
color $base0B
|
color $base0B
|
||||||
background-color $base03
|
|
||||||
&.warning-theme
|
&.warning-theme
|
||||||
color $base0A
|
color $base0A
|
||||||
background-color $base03
|
|
||||||
.verified-success
|
.verified-success
|
||||||
color $base0B
|
color $base0B
|
||||||
.verified-warning
|
.verified-warning
|
||||||
|
|
|
@ -14,11 +14,11 @@
|
||||||
{% if app %}{{ app.name | first }}{% endif %}
|
{% 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 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 %}
|
{% 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>
|
<i class="fas fa-check-circle verified-success"></i>
|
||||||
</span>
|
</span>
|
||||||
{% else %}
|
{% 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>
|
<i class="fas fa-question-circle verified-warning"></i>
|
||||||
</span>
|
</span>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
|
@ -33,9 +33,13 @@ code, pre, .code, .pre
|
||||||
text-decoration none
|
text-decoration none
|
||||||
line-height 1
|
line-height 1
|
||||||
|
|
||||||
.tippy-popper[x-placement^=top] .tippy-tooltip
|
for placement in top bottom left right
|
||||||
.tippy-arrow
|
.tippy-popper[x-placement^={placement}] .tippy-tooltip.dark-theme .tippy-arrow
|
||||||
border-top-color $base03
|
border-{placement}-color $base03
|
||||||
|
|
||||||
|
.tippy-tooltip.dark-theme
|
||||||
|
background-color $base03
|
||||||
|
color $base04
|
||||||
|
|
||||||
body
|
body
|
||||||
display flex
|
display flex
|
||||||
|
|
Loading…
Reference in a new issue