💄 adding anchors for easy linking

This commit is contained in:
Samuel Berthe 2021-01-26 23:31:54 +01:00
parent 0ee7f1266f
commit 12a54bcbd4
No known key found for this signature in database
GPG key ID: 64863511FFBD0E3C

View file

@ -2,6 +2,22 @@
ul { ul {
list-style: none; list-style: none;
} }
a.anchor {
font-size: 15px;
vertical-align: middle;
color: darkblue;
display: inline-block;
padding-bottom: 5px;
margin-right: 5px;
opacity: 0;
transition: opacity 0.4s;
}
h2:hover a.anchor,
h3:hover a.anchor,
h4:hover a.anchor {
opacity: 1;
}
</style> </style>
<div style="padding: 20px 20px 10px 20px; border: solid grey 1px; border-radius: 10px;"> <div style="padding: 20px 20px 10px 20px; border: solid grey 1px; border-radius: 10px;">
@ -31,6 +47,7 @@
<li> <li>
{% assign serviceId = service.name | replace: " ", "-" | downcase %} {% assign serviceId = service.name | replace: " ", "-" | downcase %}
<h2 id="{{ serviceId }}"> <h2 id="{{ serviceId }}">
<a class="anchor" href="#{{ serviceId }}">#</a>
{{ groupIndex }}. {{ groupIndex }}.
{{ serviceIndex }}. {{ serviceIndex }}.
{{ service.name }} {{ service.name }}
@ -63,7 +80,8 @@
{% assign ruleIndex = forloop.index %} {% assign ruleIndex = forloop.index %}
{% assign comments = rule.comments | strip | newline_to_br | split: '<br />' %} {% assign comments = rule.comments | strip | newline_to_br | split: '<br />' %}
<li> <li>
<h4> <h4 id="rule-{{ serviceId }}-{{ ruleIndex }}">
<a class="anchor" href="#rule-{{ serviceId }}-{{ ruleIndex }}">#</a>
{{ groupIndex}}.{{ serviceIndex }}.{{ ruleIndex }}. {{ groupIndex}}.{{ serviceIndex }}.{{ ruleIndex }}.
{{ rule.name }} {{ rule.name }}
</h4> </h4>