Fixes and extensions to adaptive contents page

thexerteproject · Aug 16, 2022 · 3bc67b5 · 3bc67b5
1 parent 68056ea
commit 3bc67b5
Show file tree

Hide file tree

Showing 6 changed files with 702 additions and 176 deletions.
diff --git a/modules/xerte/parent_templates/Nottingham/models_html5/adaptiveContent.css b/modules/xerte/parent_templates/Nottingham/models_html5/adaptiveContent.css
@@ -90,7 +90,7 @@ li.select-interaction.selected {
 }
 
 .summary {
-  width: 45%;
+  width: 40%;
   float: left;
 }
 
@@ -99,13 +99,13 @@ li.select-interaction.selected {
 }
 
 .graph-container {
-  width: 45%;
+  width: 60%;
   float: right;
   display: inline-flex;
 }
 
 .graph-container fieldset.noStyle {
-  width: 50%;
+  width: 100%;
   float: left;
 }
 
@@ -132,16 +132,8 @@ li.select-interaction.selected {
   }
 }
 
-.panel.legend {
-	width: 35% !important;
-}
-
-.panel.legend p{
-	font-size: 1.75vmin;
-}
-
-.graph-container-wide {
-  width: 100%;
+.panel.legend, .panel.legend p, .panel.legend ol, .panel.legend ul, .panel.legend li{
+	font-size: inherit;
 }
 
 .graph {
@@ -157,14 +149,38 @@ li.select-interaction.selected {
 }
 
 .graph-container{
-  width: 45%;
+  width: 60%;
+  margin-bottom: 2vmin;
+  margin-top: 2vmin;
+}
+
+.graph-container-wide {
+  width: 100%;
 }
 
 .container-print{
   display: flex;
   flex-direction: column;
 }
 
+#print-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.8);
+  z-index: 1;
+}
+
+#print-overlay-spinner {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    z-index: 2;
+}
+
 @media screen and (max-width: 1200px) {
   .graph-container {
     width: 95% !important;