nik/FreedomBox
1
0
Fork 0
mirror of https://github.com/freedombox/FreedomBox.git synced 2026-04-01 09:30:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

ui: Fix flash of notifications popdown during page load

Browse Source 
- Notifications dropdown is shown briefly before page load. After the page load,
it disappears. This is quite annoying and happens due to the following reason.

  - We add .no-js class to <html> tag and later remove using Javascript.

  - We load most of our Javascirpt using 'defer' attribute leading display of
  layout of content before Javascript is loaded.

  - We also wait for DOMContentLoaded event to fire before removing the .no-js
  class on <html> element.

- Solve the problem by adding special class to notifications dropdown to ensure
that it is not shown even when Javascript is not available.

- There might be a better fix to the problem.

Signed-off-by: Sunil Mohan Adapa <sunil@medhas.org>
Reviewed-by: Veiko Aasa <veiko17@disroot.org>
This commit is contained in:
Sunil Mohan Adapa 2024-12-09 09:04:54 -08:00 committed by Veiko Aasa
parent ab0e127378
commit be7910e901
No known key found for this signature in database
GPG Key ID: 478539CAE680674E
2 changed files with 2 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
plinth/templates/notifications.html
View File

@ -8,7 +8,7 @@
{% load static %}
{% if notifications %}
<div class="notifications collapse">
<div class="notifications collapse no-no-js">
<ul>
{% for note in notifications %}
<li class="notification notification-{{ note.severity }}">

2
static/themes/default/css/main.css
View File

@ -495,7 +495,7 @@ footer {
}
/* No-JS fallbacks for collapsible content */
.no-js .collapse {
.no-js .collapse:not(.no-no-js) {
display: block;
}