IEEE.org     |     IEEE Xplore Digital Library     |     IEEE Standards     |     IEEE Spectrum     |     More Sites

Commit c357aacf authored by Amy Rose's avatar Amy Rose
Browse files

prevent layout flicker when loading pages

parent 0d855689
Pipeline #786 passed with stage
in 3 minutes and 22 seconds
......@@ -13,7 +13,7 @@ breadcrumbs:
path: "{{ page.url }}"
---
<div id="project-content" style="display: none;">
<div id="project-content" class="hidden">
{% comment %}
Divs to be filled in by the project.js script
{% endcomment %}
......@@ -42,7 +42,7 @@ breadcrumbs:
be loaded. Please enable JavaScript to see project information.
</p>
</noscript>
<div id="loading-error" style="display: none;">
<div id="loading-error" class="hidden">
<p class="error">
Sorry, there was a problem loading the information for this project.
Please try again later. <br/>
......
......@@ -5,6 +5,7 @@
background-position: center;
width: 100%;
height: 350px;
min-height: 350px;
display: grid;
align-items: end;
......
......@@ -6,6 +6,10 @@ body {
font-family: "Roboto", "Arial", sansserif;
}
main {
min-height: 100vh;
}
/* Headers */
main h1 {
color: white;
......
......@@ -2,6 +2,11 @@
/* TODO */
.hidden {
display: none;
}
#project-metrics {
display: flex;
flex-direction: row;
......
......@@ -36,7 +36,7 @@ function fetch_data() {
function unhide_div(div_id) {
const div = document.getElementById(div_id);
div.removeAttribute("style"); // remove display: none
div.classList.remove("hidden"); // remove hidden
}
function populate(data) {
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment