Merge pull request #1063 from hackforla/mattyweb/issue1060

Mattyweb/issue1060
hackforla · Mar 29, 2021 · 917f365 · 917f365
2 parents 41e7aa8 + 3f776ee
commit 917f365
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 7 deletions.
diff --git a/server/dash/dashboards/types_map.py b/server/dash/dashboards/types_map.py
@@ -65,7 +65,6 @@ def display_choropleth(selected_value):
         color_continuous_scale=px.colors.sequential.YlOrRd,
         labels=LABELS,
         projection="mercator",
-        height=1000,
     )
     # show only the relevant map
     fig.update_geos(
@@ -74,16 +73,17 @@ def display_choropleth(selected_value):
     )
     # crops/zooms it
     fig.update_layout(
+        autosize=True,
         margin={"r": 0, "t": 0, "l": 0, "b": 0},
     )
     # move the scale to bottom left
     fig.update_coloraxes(
         # showscale=False
-        colorbar_x=0.25,
-        colorbar_y=0.25,
-        colorbar_ypad=15,
+        colorbar_x=0.225,
+        colorbar_y=0.225,
+        # colorbar_ypad=10,
         colorbar_lenmode="fraction",
-        colorbar_len=0.25,
+        colorbar_len=0.3,
     )
     apply_figure_style(fig)
     return fig, "visible-graph"
diff --git a/server/dash/static/reports.css b/server/dash/static/reports.css
@@ -2,7 +2,7 @@ body {
   color: #ececec;
   background-color: #0f181f;
   font-family: 'Robota, Gill Sans', 'Gill Sans MT', sans-serif;
-  font-size: 11pt;
+  font-size: 1em;
   font-weight: 300;
 }
 h1 {
@@ -13,13 +13,23 @@ h1 {
 .hidden-graph {
   visibility: hidden;
 }
+#choropleth > .svg-container {
+  margin-left: auto;
+  margin-right: auto;
+}
+#choropleth > .js-plotly-plot .plotly div {
+  margin-left: auto;
+  margin-right: auto;
+}    
 .dash-dropdown {
   margin: 20pt;
   color: #0f181f;
 }
 .dash-links a {
+  display: flex;
+  font-size: 1.2em;
+  padding: 12pt 10pt;
   color: white;
-  padding: 5px;
 }
 ._dash-loading {
   display: none;
@@ -60,4 +70,7 @@ h1 {
   .half-graph {
     flex: 1;
   }
+  #choropleth {
+    height: 800px;
+  }
 }