Update docs/source/css.rst

This commit is contained in:
AcuGIS 2024-05-27 10:18:10 +00:00
parent 6dd53ff177
commit 20edda0524
1 changed files with 19 additions and 33 deletions

View File

@ -1,50 +1,36 @@
CSS
=======
Color Scheme
------------------
Quartz provides CSS overrides at map level.
The default color scheme is set by /var/www/qwc2/html/assets/css/colorschemes.css
To override the default CSS, enter your CSS into the Map CSS box on the map edit page.
You can edit this file or copy it and create a new file.
If you create a new file, you must modify the config.json accordingly to your new css.
.. image:: images/CSS.png
Application CSS
------------------
An override CSS file is contained at /var/www/qwc2/html/assets/css/qwc2.css
Example: Image Sizing
--------------------------------
Entries will be loaded last and therefore over ride other CSS elements.
To change pop-up image sizing, you can use something like below.
Note: Make sure that assets/css/qwc2.css is included in index.html.
.. code-block:: css
Logo
----------------------
.leaflet-popup-content > table img {width: 300px;}
.leaflet-popup-content > img { width: 300px;}
QWC2 logos are located at /var/www/qwc2/html/assets/img/
Thumbnails
----------------------
Example: Modal Info Box
------------------------------------------
To change Modal Info Box, you can use something like below.
.. code-block:: css
.modal-content {
position: relative;
display: flex;
flex-direction: column;
width: fit-content;
pointer-events: auto;
background-clip: padding-box;
border-radius: 20px;
outline: 0;
background-color: cadetblue;
color: #fff;
}
There is no need to add "!important" to CSS elements as map.css is loaded last and has precendence.
Map thumbnails in the end user panel are set via the Map page.
The default thumbnails are located at
/var/www/qwc2/html/assets/genmapthumbs
If you add new thumbnails, you must update this in your themesConig.json