mapicgc-gl-js 0.0.38 → 0.0.39

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/docu_Map.md CHANGED
Binary file
@@ -1,5 +1,4 @@
1
1
  <html>
2
-
3
2
  <head>
4
3
  <meta charset='utf-8' />
5
4
  <title>Exemple llibreria mapicgc-gl-js</title>
@@ -7,13 +6,11 @@
7
6
  <script src="../dist/mapicgc-gl.umd.js"></script>
8
7
  <link href="../dist/mapicgc-gl.css" rel="stylesheet" />
9
8
  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
10
-
11
9
  <style>
12
10
  body {
13
11
  margin: 0;
14
12
  padding: 0;
15
13
  }
16
-
17
14
  #map {
18
15
  position: absolute;
19
16
  top: 0;
@@ -21,7 +18,6 @@
21
18
  width: 100%;
22
19
  height: 100%
23
20
  }
24
-
25
21
  .map {
26
22
  position: absolute;
27
23
  top: 0;
@@ -29,7 +25,6 @@
29
25
  width: 100%;
30
26
  height: 100%
31
27
  }
32
-
33
28
  #menu {
34
29
  position: absolute;
35
30
  z-index: 1000;
@@ -43,7 +38,6 @@
43
38
  -moz-box-shadow: 5px 5px 5px -5px rgba(0, 0, 0, 0.75);
44
39
  box-shadow: 5px 5px 5px -5px rgba(0, 0, 0, 0.75);
45
40
  }
46
-
47
41
  #div_pitch {
48
42
  position: absolute;
49
43
  right: 10px;
@@ -51,7 +45,6 @@
51
45
  width: 30px;
52
46
  z-index: 100;
53
47
  }
54
-
55
48
  .sliderClass {
56
49
  position: absolute;
57
50
  left: 10px;
@@ -67,32 +60,24 @@
67
60
  }
68
61
  </style>
69
62
  </head>
70
-
71
63
  <body>
72
64
  <div id='menu'>
73
- <input id='topografic' type='radio' name='rtoggle' value='topografic' >
65
+ <input id='TOPO' type='radio' name='rtoggle' value="TOPO">
74
66
  <label for='topografic'>Mapa estàndard</label><br>
75
-
76
- <input id='ortofoto' type='radio' name='rtoggle' checked='checked' value='ortofoto'>
67
+ <input id='ORTO3D' type='radio' name='rtoggle' checked='checked' value='ORTO3D'>
77
68
  <label for='ortofoto'>Ortofoto</label><br>
78
-
79
- <input id='limits' type='radio' name='rtoggle' value='limits'>
69
+ <input id='ADMIN' type='radio' name='rtoggle' value='ADMIN'>
80
70
  <label for='limits'>Limits</label><br>
81
-
82
- <input id='fosc' type='radio' name='rtoggle' value='fosc'>
71
+ <input id='DARK' type='radio' name='rtoggle' value='DARK'>
83
72
  <label for='fosc'>fosc</label>
84
73
  </div>
85
-
86
74
  <div id="comparison-container">
87
75
  <div id="before" class="map"></div>
88
76
  <div id="after" class="map"></div>
89
77
  </div>
90
78
  <script>
91
79
  console.info(window);
92
-
93
-
94
80
  console.info(mapicgcgl.Layers);
95
-
96
81
  const map1 = new mapicgcgl.Map({
97
82
  container: 'before',
98
83
  style: mapicgcgl.Styles.TOPO,
@@ -103,7 +88,6 @@
103
88
  pitch: 0,
104
89
  attributionControl: false
105
90
  });
106
-
107
91
  const map2 = new mapicgcgl.Map({
108
92
  container: 'after',
109
93
  style: mapicgcgl.Styles.ORTO,
@@ -114,34 +98,17 @@
114
98
  pitch: 0,
115
99
  attributionControl: false
116
100
  });
117
-
118
-
119
- //var container =document.getElementById('comparison-container');
120
-
121
101
  var container = "#comparison-container";
122
-
123
- var map = new mapicgcgl.CompareMaps(map1, map2, container, {
124
- // Set this to enable comparing two maps by mouse movement:
125
- // m ousemove: true
126
- });
127
-
128
-
129
-
102
+ var map = new mapicgcgl.CompareMaps(map1, map2, container, {});
130
103
  const layerList = document.getElementById('menu');
131
104
  const inputs = layerList.getElementsByTagName('input');
132
-
133
105
  function switchLayer(layer) {
134
- const layerId = layer.target.id;
106
+ const layerId = mapicgcgl.Styles[layer.target.id];
135
107
  map1.setStyle(layerId);
136
108
  }
137
-
138
109
  for (let i = 0; i < inputs.length; i++) {
139
110
  inputs[i].onclick = switchLayer;
140
111
  }
141
-
142
-
143
-
144
112
  </script>
145
113
  </body>
146
-
147
114
  </html>
@@ -0,0 +1,115 @@
1
+ <html>
2
+ <head>
3
+ <meta charset='utf-8' />
4
+ <title>Exemple llibreria mapicgc-gl-js</title>
5
+ <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
6
+ <script src="../dist/mapicgc-gl.umd.js"></script>
7
+ <link href="../dist/mapicgc-gl.css" rel="stylesheet" />
8
+ <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
9
+ <style>
10
+ body {
11
+ margin: 0;
12
+ padding: 0;
13
+ }
14
+ #map {
15
+ position: absolute;
16
+ top: 0;
17
+ bottom: 0;
18
+ width: 100%;
19
+ height: 100%
20
+ }
21
+ .map {
22
+ position: absolute;
23
+ top: 0;
24
+ bottom: 0;
25
+ width: 100%;
26
+ height: 100%
27
+ }
28
+ #menu {
29
+ position: absolute;
30
+ z-index: 1000;
31
+ background: #fff;
32
+ padding: 10px;
33
+ font-family: 'Open Sans', sans-serif;
34
+ top: 5px;
35
+ left: 5px;
36
+ border-radius: 7px;
37
+ -webkit-box-shadow: 5px 5px 5px -5px rgba(0, 0, 0, 0.75);
38
+ -moz-box-shadow: 5px 5px 5px -5px rgba(0, 0, 0, 0.75);
39
+ box-shadow: 5px 5px 5px -5px rgba(0, 0, 0, 0.75);
40
+ }
41
+ #div_pitch {
42
+ position: absolute;
43
+ right: 10px;
44
+ top: 142px;
45
+ width: 30px;
46
+ z-index: 100;
47
+ }
48
+ .sliderClass {
49
+ position: absolute;
50
+ left: 10px;
51
+ top: 79px;
52
+ width: 130px;
53
+ z-index: 100;
54
+ display: none;
55
+ background-color: white;
56
+ padding: 10px;
57
+ border-radius: 4px;
58
+ font-size: 0.85em;
59
+ opacity: 0.9;
60
+ }
61
+ </style>
62
+ </head>
63
+ <body>
64
+ <div id='menu'>
65
+ <input id='TOPO' type='radio' name='rtoggle' value="TOPO">
66
+ <label for='topografic'>TOPO</label><br>
67
+ <input id='ORTO' type='radio' name='rtoggle' value='ORTO'>
68
+ <label for='ortofoto'>ORTO</label><br>
69
+ <input id='ORTO3D' type='radio' name='rtoggle' checked='checked' value='ORTO3D'>
70
+ <label for='ortofoto'>ORTO3D</label><br>
71
+ <input id='ADMIN' type='radio' name='rtoggle' value='ADMIN'>
72
+ <label for='limits'>ADMIN</label><br>
73
+ <input id='DARK' type='radio' name='rtoggle' value='DARK'>
74
+ <label for='fosc'>DARK</label>
75
+ </div>
76
+
77
+ <div id="map" class="map"></div>
78
+
79
+ <script>
80
+ console.info(window);
81
+ console.info(mapicgcgl.Layers);
82
+ const map1 = new mapicgcgl.Map({
83
+ container: 'map',
84
+ style: mapicgcgl.Styles.ORTO3D,
85
+ center: [1.1464, 41.706],
86
+ zoom: 7.4,
87
+
88
+ hash: true,
89
+ pitch: 0,
90
+ attributionControl: false
91
+ });
92
+
93
+ map1.on("load", ()=>{
94
+
95
+
96
+
97
+ })
98
+
99
+
100
+
101
+
102
+ const layerList = document.getElementById('menu');
103
+ const inputs = layerList.getElementsByTagName('input');
104
+ function switchLayer(layer) {
105
+
106
+ console.info(mapicgcgl.Styles[layer.target.id]);
107
+ const layerId = mapicgcgl.Styles[layer.target.id];
108
+ map1.setStyle(layerId);
109
+ }
110
+ for (let i = 0; i < inputs.length; i++) {
111
+ inputs[i].onclick = switchLayer;
112
+ }
113
+ </script>
114
+ </body>
115
+ </html>
package/nodeDeploy.js CHANGED
@@ -1,7 +1,8 @@
1
1
  const SftpClient = require("ssh2-sftp-client");
2
2
  const dotenv = require("dotenv");
3
3
  const fs = require('fs');
4
-
4
+ //import SftpClient from "ssh2-sftp-client";
5
+ //import dotenv from "dotenv";
5
6
  dotenv.config();
6
7
 
7
8
  const inFilePath = `${process.env.FTP_LOCA_PATH}${process.env.FILE_JS_UMD}`;
@@ -13,7 +14,7 @@ const renamedFilePath = `${process.env.FTP_LOCA_PATH}${process.env.FILE_JS}`;
13
14
  console.error('Error copying file:', err);
14
15
  } else {
15
16
  console.log('File copied and renamed successfully.');
16
- // deploy()
17
+ deploy()
17
18
  }
18
19
  });
19
20
 
package/nodeSetConfig.js CHANGED
@@ -11,6 +11,8 @@ const defaultOptions = require('./src/configNode.js');
11
11
  const stylePath = path.join('./src/constants/', 'Styles.js');
12
12
  const terrainPath = path.join('./src/constants/', 'Terrains.js');
13
13
  const layersPath = path.join('./src/constants/', 'Layers.js');
14
+ const xmldom = require('xmldom');; // 'xmldom' doesn't 'export' the DOMParser
15
+ const WMSCapabilities = require("wms-capabilities");
14
16
 
15
17
  const https = require('https');
16
18
 
@@ -48,7 +50,7 @@ function camelize(str) {
48
50
 
49
51
  async function getVectorLimitsLayers() {
50
52
  try {
51
- const response = await axios.get('https://tilemaps.icgc.cat/tileserver/limits-tilejsonV3.json');
53
+ const response = await axios.get('https://tilemaps.icgc.cat/vt/limits-tilejsonV3.json');
52
54
  const tileJson = response.data;
53
55
 
54
56
 
@@ -115,7 +117,7 @@ async function getVectorLimitsLayers() {
115
117
  }
116
118
 
117
119
 
118
- async function getWMSLayers() {
120
+ async function getVectorLayers() {
119
121
  try {
120
122
 
121
123
 
@@ -124,16 +126,18 @@ async function getVectorLimitsLayers() {
124
126
  { key: 'altimetria', layer:"", url: "https://betaserver.icgc.cat/tileserver3/tileserver.php/alti_bt5m/{z}/{x}/{y}.pbf"},
125
127
  { key: 'toponimia',layer:"", url: "https://betaserver.icgc.cat/tileserver3/tileserver.php/redtopo/{z}/{x}/{y}.pbf"},
126
128
  ]
127
- wmsLayersOptions = test
128
- console.info('Dades WMS Layers actualitzats' );
129
+ vectorLayersOptions = test
130
+ console.info('Dades vector Layers actualitzats' )
131
+
129
132
  } catch (error) {
130
- console.error('Error fetching wms-layers:', error.message);
133
+
134
+ console.error('Error fetching vector-layers:', error.message);
131
135
  }
132
136
 
133
137
  }
134
138
 
135
139
 
136
- async function getVectorLayers() {
140
+ async function getWMSLayers() {
137
141
  try {
138
142
  let layerRelleu = 'relleu'
139
143
  let layerGeologia = 'geologia'
@@ -143,16 +147,17 @@ async function getVectorLimitsLayers() {
143
147
  let test= [
144
148
  { key: 'relleu', layer:"", url: `https://tilemaps.icgc.cat/mapfactory/wmts/${layerRelleu}/CAT3857/{z}/{x}/{y}.png`},
145
149
  { key: 'geologia', layer:"", url: `https://tilemaps.icgc.cat/mapfactory/wmts/${layerGeologia}/MON3857NW/{z}/{x}/{y}.png`},
146
- { key: 'osm', layer:"", url:`https://tilemaps.icgc.cat/mapfactory/wmts/${layerOsm}/CAT3857_15/{z}/{x}/{y}.png`},
147
- { key:"cims", layer:"", url:`"https://geoserveis.icgc.cat/icc_100cims/wms/service?REQUEST=GetMap&SERVICE=WMS&VERSION=1.1.1&LAYERS=${layerCims}&STYLES=&FORMAT=image/png&BGCOLOR=0xFFFFFF&TRANSPARENT=TRUE&SRS=EPSG:25831&BBOX=137118.923076923,4488408.75,650959.076923077,4749634.75&WIDTH=895&HEIGHT=455`},
150
+ { key: 'administratiu', layer:"", url:`http://geoserveis.icgc.cat/servei/catalunya/mapa-base/wmts/administratiu/MON3857NW/{z}/{x}/{y}.png`},
151
+ { key: 'simplificat', layer:"", url:`http://geoserveis.icgc.cat/servei/catalunya/mapa-base/wmts/simplificat/MON3857NW/{z}/{x}/{y}.png`},
152
+ { key:"cims", layer:"", url:`https://geoserveis.icgc.cat/icc_100cims/wms/service?REQUEST=GetMap&SERVICE=WMS&VERSION=1.1.1&LAYERS=${layerCims}&STYLES=&FORMAT=image/png&BGCOLOR=0xFFFFFF&TRANSPARENT=TRUE&SRS=EPSG:25831&BBOX=137118.923076923,4488408.75,650959.076923077,4749634.75&WIDTH=895&HEIGHT=455`},
148
153
  { key: 'cobertesSol', layer:"", url: `http://geoserveis.icgc.cat/servei/catalunya/cobertes-sol/wms?REQUEST=GetMap&SERVICE=WMS&VERSION=1.3.0&LAYERS=${layerCobertesSol}&STYLES=&FORMAT=image/png&BGCOLOR=0xFFFFFF&TRANSPARENT=TRUE&CRS=EPSG:25831&BBOX=374110.828167253,4639230.79853085,452621.120632226,4703578.45000215&WIDTH=1020&HEIGHT=836`},
149
154
  ]
150
- vectorLayersOptions = test
151
- console.info('Dades vector Layers actualitzats' );
152
-
155
+ ;
156
+ wmsLayersOptions = test
157
+ console.info('Dades WMS Layers actualitzats' );
153
158
 
154
159
  } catch (error) {
155
- console.error('Error fetching vector-layers:', error.message);
160
+ console.error('Error fetching wms-layers:', error.message);
156
161
  }
157
162
 
158
163
  }
@@ -163,7 +168,8 @@ async function getVectorLimitsLayers() {
163
168
 
164
169
  let test= [
165
170
  { key: "TOPO", url: "https://geoserveis.icgc.cat/contextmaps/icgc_mapa_estandard_general.json",image: "https://visors.icgc.cat/contextmaps/imatges_estil/icgc_mapa_estandard.png" },
166
- { key: "ORTO", url: "https://geoserveis.icgc.cat/contextmaps/icgc_orto_hibrida.json" , image: "https://visors.icgc.cat/contextmaps/imatges_estil/icgc_orto_hibrida.png"},
171
+ { key: "ORTO", url: "https://geoserveis.icgc.cat/contextmaps/icgc_orto_estandard.json" , image: "https://visors.icgc.cat/contextmaps/imatges_estil/icgc_orto_hibrida.png"},
172
+ { key: "ORTO3D", url: "https://tilemaps.icgc.cat/cdn/styles/icgc_orto_3d.json" , image: "https://visors.icgc.cat/contextmaps/imatges_estil/icgc_orto_hibrida.png"},
167
173
  { key: "ADMIN", url: "https://geoserveis.icgc.cat/contextmaps/icgc_delimitacio_limits_administratius.json" , image: "https://visors.icgc.cat/contextmaps/imatges_estil/icgc_delimitacio_limits_administratius.png"},
168
174
  { key: "DARK", url: "https://geoserveis.icgc.cat/contextmaps/icgc_mapa_base_fosc.json" , image: "https://visors.icgc.cat/contextmaps/imatges_estil/icgc_mapa_base_fosc.png"},
169
175
  { key: "LIGHT", url: "https://geoserveis.icgc.cat/contextmaps/icgc_mapa_base_gris.json", image: "https://visors.icgc.cat/contextmaps/imatges_estil/icgc_mapa_base_gris.png" },
@@ -184,8 +190,8 @@ async function getVectorLimitsLayers() {
184
190
  try {
185
191
 
186
192
  let test= [
187
- {name: "ICGC5M", url: "https://tilemaps.icgc.cat/tileserver/tileserver.php/terreny-5m-30m-rgb-extent/{z}/{x}/{y}.png"},
188
- {name: "WORLD3M", url: "https://tilemaps.icgc.cat/tileserver/tileserver.php/terreny_icgc_2m_rgb/{z}/{x}/{y}.png"}
193
+ {name: "ICGC5M", url: "https://tilemaps.icgc.cat/tileserver/tileserver/terreny-5m-30m-rgb-extent/{z}/{x}/{y}.png"},
194
+ {name: "WORLD30M", url: "https://s3.amazonaws.com/elevation-tiles-prod/terrarium/{z}/{x}/{y}.png", encoding: "terrarium",}
189
195
 
190
196
  ]
191
197
  terrainOptions = test
@@ -228,12 +234,14 @@ function replace(){
228
234
  const updatedConfigNode = `
229
235
  const urlImages = "https://visors.icgc.cat/contextmaps/imatges_estil/";
230
236
  const urlStyles = "https://geoserveis.icgc.cat/contextmaps/";
237
+ const geocoderUrl = "https://eines.icgc.cat/geocodificador/autocompletar?text=";
231
238
  const defaultOptions = ${stringifyWithoutQuotes(defaultOptions, null, 2)};
232
239
  \nmodule.exports = defaultOptions;
233
240
  `;
234
241
  const updatedConfig = `
235
242
  const urlImages = "https://visors.icgc.cat/contextmaps/imatges_estil/";
236
243
  const urlStyles = "https://geoserveis.icgc.cat/contextmaps/";
244
+ const geocoderUrl = "https://eines.icgc.cat/geocodificador/autocompletar?text=";
237
245
  const defaultOptions = ${stringifyWithoutQuotes(defaultOptions, null, 2)};
238
246
  \nexport default defaultOptions;
239
247
  `;
@@ -348,8 +356,8 @@ for (const key in originalWmsLayers) {
348
356
  const layersConfig = `
349
357
  const Orto = ${stringifyWithoutQuotes(convertedOrtoLayers, null, 2)};
350
358
  const VectorAdmin = ${stringifyWithoutQuotes(convertedVectorICGCLayers, null, 2)};
351
- const WMS = ${stringifyWithoutQuotes(convertedVectorLayers, null, 2)};
352
- const Vector = ${stringifyWithoutQuotes(convertedWmsLayers, null, 2)};
359
+ const Vector = ${stringifyWithoutQuotes(convertedVectorLayers, null, 2)};
360
+ const WMS = ${stringifyWithoutQuotes(convertedWmsLayers, null, 2)};
353
361
  \nexport default {Orto,VectorAdmin, WMS, Vector};
354
362
  `;
355
363
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "mapicgc-gl-js",
3
3
  "homepage": "https://autogitlab.icgc.local/geostarters/icgc/mapicgc/mapicgc-gl-js",
4
- "version": "0.0.38",
4
+ "version": "0.0.39",
5
5
  "description": "mapicgc-gl-js",
6
6
  "author": "ICGC",
7
7
  "main": "dist/mapicgc-gl.js",
@@ -30,12 +30,20 @@
30
30
  "jsdom": "^24.0.0",
31
31
  "npm-run-all": "^4.1.5",
32
32
  "package-json-versionify": "^1.0.4",
33
+ "path": "^0.12.7",
33
34
  "rollup-plugin-polyfill": "^4.2.0",
34
35
  "ssh2-sftp-client": "^9.0.4",
35
36
  "vite": "^5.0.12",
36
- "vite-plugin-node-polyfills": "^0.19.0"
37
+ "vite-plugin-node-polyfills": "^0.19.0",
38
+ "wms-capabilities": "^0.6.0",
39
+ "xml2js": "^0.6.2",
40
+ "yarn": "^1.22.21"
37
41
  },
38
42
  "dependencies": {
43
+ "@deck.gl/core": "~8.9.32",
44
+ "@deck.gl/geo-layers": "~8.9.32",
45
+ "@deck.gl/mapbox": "~8.9.32",
46
+ "@loaders.gl/3d-tiles": "~3.4.13",
39
47
  "@maplibre/maplibre-gl-compare": "^0.5.0",
40
48
  "@maplibre/maplibre-gl-geocoder": "^1.5.0",
41
49
  "@turf/turf": "^6.5.0",
@@ -44,8 +52,6 @@
44
52
  "flatgeobuf": "^3.27.2",
45
53
  "maplibre-gl": "^3.6.2",
46
54
  "maplibre-gl-measures": "^0.0.14",
47
- "path": "^0.12.7",
48
- "xml2js": "^0.6.2",
49
- "yarn": "^1.22.21"
55
+ "xmldom": "^0.6.0"
50
56
  }
51
57
  }
@@ -751,7 +751,46 @@ a.maplibregl-ctrl-logo.maplibregl-compact {
751
751
  border-radius: 3px;
752
752
  width: auto;
753
753
  color: #fff;
754
+ overflow-y: auto;
755
+ max-height: 500px;
756
+ overflow-x: hidden;
754
757
  }
758
+ .filter-group::-webkit-scrollbar {
759
+ width: 8px; /* Tamaño del scroll en vertical */
760
+ height: 8px; /* Tamaño del scroll en horizontal */
761
+ display: block; /* Ocultar scroll */
762
+ }
763
+
764
+ /* Ponemos un color de fondo y redondeamos las esquinas del thumb */
765
+ .filter-group::-webkit-scrollbar-thumb {
766
+ background: #ccc;
767
+ border-radius: 4px;
768
+ }
769
+
770
+ /* Cambiamos el fondo y agregamos una sombra cuando esté en hover */
771
+ .filter-group::-webkit-scrollbar-thumb:hover {
772
+ background: #daac56;
773
+ box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2);
774
+ }
775
+
776
+ /* Cambiamos el fondo cuando esté en active */
777
+ .filter-group::-webkit-scrollbar-thumb:active {
778
+ background-color: #d8b97f;
779
+ }
780
+ /* Ponemos un color de fondo y redondeamos las esquinas del track */
781
+ .filter-group::-webkit-scrollbar-track {
782
+ background: #e1e1e1;
783
+ border-radius: 4px;
784
+ }
785
+
786
+ /* Cambiamos el fondo cuando esté en active o hover */
787
+ .filter-group::-webkit-scrollbar-track:hover,
788
+ .filter-group::-webkit-scrollbar-track:active {
789
+ background: #d4d4d4;
790
+ }
791
+
792
+
793
+
755
794
 
756
795
  .filter-group input[type='checkbox']:first-child + label {
757
796
  border-radius: 3px 3px 0 0;
@@ -767,21 +806,21 @@ a.maplibregl-ctrl-logo.maplibregl-compact {
767
806
  }
768
807
 
769
808
  .filter-group input[type='checkbox'] + label {
770
- background-color: #3386c0;
809
+ background-color: #798e9f;
771
810
  display: block;
772
811
  cursor: pointer;
773
- padding: 10px;
812
+ padding: 7px;
774
813
  border-bottom: 1px solid rgba(0, 0, 0, 0.25);
775
814
  }
776
815
 
777
816
  .filter-group input[type='checkbox'] + label {
778
- background-color: #3386c0;
817
+ background-color: #798e9f;
779
818
  text-transform: capitalize;
780
819
  }
781
820
 
782
821
  .filter-group input[type='checkbox'] + label:hover,
783
822
  .filter-group input[type='checkbox']:checked + label {
784
- background-color: #4ea0da;
823
+ background-color: #798e9f;
785
824
  }
786
825
 
787
826
  .filter-group input[type='checkbox']:checked + label:before {
@@ -1466,4 +1505,19 @@ h4::selection {
1466
1505
  font-size: 16px;
1467
1506
  text-align: center;
1468
1507
  }
1469
- }
1508
+ #titleDivMenu{
1509
+ height: 25px;
1510
+ background-color:rgb(214 132 0);
1511
+ min-width: 130px;
1512
+ text-align: -webkit-center;
1513
+ }
1514
+
1515
+ #titleDivMenuSub{
1516
+ height: 25px;
1517
+ background-color: #7e8765;
1518
+ padding-left: 24px;
1519
+ /* min-width: 130px; */
1520
+ /* text-align: -webkit-center; */
1521
+ }
1522
+
1523
+ }