@cdc/map 4.24.11 → 4.24.12-2

package/src/scss/filters.scss

@@ -1,6 +1,5 @@
 .cdc-open-viz-module .cdc-map-inner-container .filters-section,
 .cove .cdc-map-inner-container .filters-section {
-
   &__title {
     margin: 15px 0;
   }
@@ -20,11 +19,9 @@
 
   @include breakpoint(md) {
     display: flex;
-    gap: 30px;
     flex-wrap: wrap;
   }
 
-
   label:not(:empty) {
     margin-right: 0.4em;
   }

package/src/scss/main.scss

@@ -47,7 +47,6 @@
 
 .cdc-map-inner-container {
   @import './map';
-  @import './datatable';
   flex-grow: 1;
   text-rendering: geometricPrecision;
   color: #202020;

package/src/scss/map.scss

@@ -86,25 +86,10 @@ $medium: 768px;
       transition: 0.2s all;
     }
   }
-  // make logo smaller on mobile
-  @media screen and (max-width: $small) {
-    .map-logo {
-      position: absolute;
-      bottom: 4em; // needed to align to top of Territories
-      right: 1em;
-      z-index: 3;
-      width: 50px; // make it smaller
-    }
-  }
-  // everything else but mobile
-  @media screen and (min-width: $small) {
-    .map-logo {
-      position: absolute;
-      bottom: 2em;
-      right: 1em;
-      z-index: 3;
-      width: 75px;
-    }
+  .map-logo {
+    display: block;
+    margin: 0 0 0 auto;
+    max-height: 35px;
   }
 }
 
@@ -116,61 +101,25 @@ $medium: 768px;
   }
 }
 
-// for Territories label in one col and Territory blocks wrapping in 2nd column
-.two-col {
-  display: flex;
-  margin-top: 0;
-
-  justify-content: flex-start;
-  > label {
-    margin-top: 0;
-    display: inline-block;
-  }
-}
-
 .territories-label {
   color: black;
-  margin: 2em 5px 2em 1em;
   font-size: 1.1em;
   display: block;
+  margin-top: 15px;
 }
 
 // Cities and Territories
 .territories {
-  margin: 2em 200px 2em 0;
-  font-size: 1.1em;
-  width: 100%;
-  display: block;
-  align-items: center;
-  > span {
-    margin-left: 1em;
-    margin-right: 0.5em;
-  }
+  gap: 0.5em;
   svg {
     max-width: 35px;
     min-width: 25px;
-    margin-left: 0.5em;
     transition: 0.3s all;
+
     text {
       font-size: 0.95em;
     }
   }
-
-  &--mobile {
-    @extend .territories;
-    width: 60%;
-    svg {
-      margin-bottom: 0.5em;
-    }
-  }
-
-  &--tablet {
-    @extend .territories;
-    width: 70%;
-    svg {
-      margin-bottom: 0.5em;
-    }
-  }
 }
 
 .zoom-controls {
@@ -380,5 +329,8 @@ canvas {
 }
 
 .data-table-container {
-  margin: 5px 0px !important;
+  margin: 20px 0px 0px;
+  &.download-link-above {
+    margin-top: 0;
+  }
 }

package/src/types/MapConfig.ts

@@ -1,6 +1,8 @@
 import { ComponentThemes } from '@cdc/core/types/ComponentThemes'
 import { Visualization } from '@cdc/core/types/Visualization'
 import { EditorColumnProperties } from '@cdc/core/types/EditorColumnProperties'
+import { Version } from '@cdc/core/types/Version'
+import { VizFilter } from '@cdc/core/types/VizFilter'
 
 export type MapVisualSettings = {
   /** minBubbleSize - Minimum Circle Size when the map has a type of bubble */
@@ -33,6 +35,7 @@ type PatternSelection = {
   label: string
   // size of pattern
   size: 'small' | 'medium' | 'large'
+  color: string
   contrastCheck: boolean
 }
 
@@ -79,7 +82,7 @@ export type MapConfig = Visualization & {
   }
   dataUrl: string
   runtimeDataUrl: string
-  filters: any[]
+  filters: VizFilter[]
   general: {
     allowMapZoom: boolean
     convertFipsCodes: boolean
@@ -163,5 +166,8 @@ export type MapConfig = Visualization & {
   }
   hexMap: HexMapSettings
   filterBehavior: string
+  filterIntro: string
   visual: MapVisualSettings
+  // version of the map
+  version: Version
 }

package/src/types/MapContext.ts

@@ -24,6 +24,7 @@ export type MapContext = {
   isEditor
   isFilterValueSupported: boolean
   loadConfig
+  logo: string
   navigationHandler
   position
   resetLegendToggles