background for datespopup + closes menu on open

client/components/dates_popup/dates_popup.css

@@ -1,10 +1,12 @@
 #dates-popup{
     width: 100%;
+    height: 100%;
     z-index: 52;
     position: absolute;
     top: 0;
-    left : 0;
     box-sizing: border-box;
+    margin-top: 30px;
+    background-color: rgba(0, 0, 0, 0.2);
 }
 
 #dates-popup-container{

client/components/states_indicator/dates/dates.js

@@ -1,8 +1,7 @@
 class DateIndicator extends HTMLElement{
-    constructor(timestamp, goToNowCallback, jumpCallback){
+    constructor(timestamp){
         super();
         this.formattedDate = this.timestampToString(timestamp);
-        this.datePopup = new DatesPopup(goToNowCallback, jumpCallback);
     }
 
     dayNumberToName(dayNumber){
@@ -39,13 +38,9 @@ class DateIndicator extends HTMLElement{
         this.getElementsByClassName("date-indicator")[0].textContent = this.formattedDate;
     }
 
-    showPopup(){
-        this.datePopup.show();
-    }
 
     connectedCallback(){
         this.render();
-        this.getElementsByClassName("date-indicator")[0].onclick = () => {this.showPopup();};
     }
 
     render(){
@@ -55,7 +50,6 @@ class DateIndicator extends HTMLElement{
                 ${this.formattedDate}
             </div>
         `        
-        this.appendChild(this.datePopup);
     }
 }