diff --git a/templates/user/activity.twig b/templates/user/activity.twig index 33e28d24f9bbb2e8c09a06754b19307d0b0099e5..1ca5ef544ed5ae4c7a33f77a79855ce4be138974 100644 --- a/templates/user/activity.twig +++ b/templates/user/activity.twig @@ -36,13 +36,11 @@ <ul><li>{{ activity.getClientIpAddress|default(' / ') }}</li></ul> <strong>{{ 'Information transfered to service'|trans }}</strong> - <ul> - {% for name, value in activity.getUser.getAttributes %} - <span class="label"> - {{ name|trans }}: {{ value|join(', ') }} - </span> - {% endfor %} - </ul> + {% for name, value in activity.getUser.getAttributes %} + <span class="label"> + {{ name|trans }}: {{ value|join(', ') }} + </span> + {% endfor %} </div> </td> </tr> diff --git a/templates/user/connected-organizations.twig b/templates/user/connected-organizations.twig index d75ad10f4fdfa90c0b7037e2d83ed0b6f5aa76a1..502e97f432199a4a5bc61b1652df9dd48e5b3f16 100644 --- a/templates/user/connected-organizations.twig +++ b/templates/user/connected-organizations.twig @@ -36,13 +36,13 @@ </ul> <strong>{{ 'Information transfered to service'|trans }}</strong> - <ul> - {% for name, value in connectedServiceProvider.getUser.getAttributes %} - <span class="label"> - {{ name|trans }}: {{ value|join(', ') }} - </span> - {% endfor %} - </ul> + + {% for name, value in connectedServiceProvider.getUser.getAttributes %} + <span class="label"> + {{ name|trans }}: {{ value|join(', ') }} + </span> + {% endfor %} + <strong>{{ 'Login details'|trans }}</strong> <ul> diff --git a/templates/user/personal-data.twig b/templates/user/personal-data.twig index b51b082f2dee33c11a86a46a9e0784ecde5dda20..2458b1ab4ba4fa1467e5deb1040f0786143fbfb1 100644 --- a/templates/user/personal-data.twig +++ b/templates/user/personal-data.twig @@ -25,7 +25,11 @@ <tr> <td> {{ name|trans }} - <a href="#"><img src="{{ asset('css/src/icons/i.svg', 'accounting') }}" alt="Info icon"></a> + <div class="popup" onclick="doPopup('popup-{{ name }}')"> + <img src="{{ asset('css/src/icons/i.svg', 'accounting') }}" alt="Info icon"/> + {% set helpid = 'help-attribute-' ~ name %} + <span class="popuptext" id="popup-{{ name }}">{{ helpid|trans }}</span> + </div> </td> <td><span class="label">{{ value }}</span></td> </tr> diff --git a/www/assets/css/src/default.css b/www/assets/css/src/default.css index f887107d8443182b71bc1b728a84bdbc80faba26..114cfffff67917249119d19540ae8d227a54440a 100644 --- a/www/assets/css/src/default.css +++ b/www/assets/css/src/default.css @@ -127,14 +127,12 @@ display: inline-flex; flex-direction: column; flex-wrap: wrap; - align-items: left; justify-content: flex-end; } nav li { margin-left: 0.5em; margin-right: 0.5em; - color: var(--alt-color); } nav > ul > li { @@ -146,7 +144,6 @@ } nav > ul > li > a { - color: var(--banner-font-family); text-decoration: none; display: flex; flex-direction: row; @@ -338,6 +335,46 @@ display: block; } + /* ======================= */ + /* Popup */ + /* ======================= */ + + .popup { + position: relative; + display: inline-block; + cursor: pointer; + } + + .popup .popuptext { + visibility: hidden; + width: 160px; + background-color: var(--heading-text-c); + color: #fff; + text-align: center; + border-radius: 6px; + padding: 8px 0; + position: absolute; + z-index: 1; + bottom: 125%; + left: 50%; + margin-left: -80px; + } + + .popup .popuptext::after { + content: ""; + position: absolute; + top: 100%; + left: 50%; + margin-left: -5px; + border-width: 5px; + border-style: solid; + border-color: var(--heading-text-c) transparent transparent transparent; + } + + .popup .show { + visibility: visible; + } + /* ======================= */ /* Footer */ /* ======================= */