CSS documentation

While one can fine tune the the color and layout of Vertigis Studio Web application using the InjectCSS workflow activity, the challenge is figuring out what CSS classes and IDs are being used and what they control. Using the web developer tools and a lot of trial and error, one take the following code and alter its style:

.gcx-map-ui-bottom-end > div.gcx-text > div.GcxMarkdown > p {
  margin: 0px;
  padding-left: 10px;
  padding-right: 5px;
  font-family: var(--DNR_TITLE_FONT);
  font-size: 2.2rem;
  color: var(--Primary_Dark_Blue);
  background-color: #bdc5db96;
  text-shadow: 0px 0px 7px white;
}

Resulting in a new style:

In addition, there are over 80 CSS color variables that one can overwrite: https://developers.vertigisstudio.com/docs/web/configuration-theme#theme-color-reference

The "request" is have a list of what all the common CSS classes and variables are and what they are meant for, and possibly giving a couple of examples of how to implement them, as I've outlined above.

Comments