Skip to content

Commit

Permalink
Merge pull request #3984 from mdouchin/ui_improvement_for_3_7
Browse files Browse the repository at this point in the history 
UI improvement for 3 7
  • Loading branch information
@rldhont
rldhont authored Nov 30, 2023
2 parents ad4d787 + e573cbd commit abc431e
Show file tree
Hide file tree
Showing 7 changed files with 713 additions and 70 deletions.
11 changes: 10 additions & 1 deletion assets/src/legacy/attributeTable.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -484,7 +484,8 @@ var lizAttributeTable = function() {
var canPopup = false
if( config.layers[lname]
&& config.layers[lname]['popup'] == 'True'
&& config.layers[lname]['geometryType'] != 'none'
// We should NOT deactivate popup for non-spatial layers, as it can be very useful
// && config.layers[lname]['geometryType'] != 'none'
&& config.layers[lname]['geometryType'] != 'unknown'
){
canPopup = true;
Expand Down Expand Up @@ -666,6 +667,7 @@ var lizAttributeTable = function() {
}

// Bind click on detail button
// It just toggles the right panel visibility
if( canPopup ){
$('#attribute-layer-'+ cleanName + ' button.btn-detail-attributeTable')
.click(function(){
Expand Down Expand Up @@ -1685,6 +1687,11 @@ var lizAttributeTable = function() {
};
}

/**
*
* @param {string} aName The layer name
* @param {string} aTable The HTML table selector
*/
function bindTableLineClick(aName, aTable){
$(aTable +' tr').click(function() {

Expand All @@ -1711,6 +1718,8 @@ var lizAttributeTable = function() {

lizMap.getFeaturePopupContent( aName, feat, function(data){
$('#attribute-table-panel-' + parentLayerCleanName ).html(data);
// Add the missing Bootstrap classes
$('#attribute-table-panel-' + parentLayerCleanName + ' table').addClass('table table-condensed table-striped table-bordered');

// Trigger event
lizMap.events.triggerEvent('lizmappopupdisplayed_inattributetable'
Expand Down
16 changes: 16 additions & 0 deletions assets/src/legacy/edition.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,20 @@
var lizEdition = function() {

/**
* Prevent the user from quitting the page
* when and editing session is active.
*
* @param {Event} event
*/
const beforeUnloadHandler = (event) => {
if (lizMap.editionPending) {
event.preventDefault();
event.returnValue = '';
}
}
window.addEventListener('beforeunload', beforeUnloadHandler);


function FeatureEditionData(layerID, feature, relation) {
/** @var {string} QGIS layer id */
this.layerId = layerID;
Expand Down Expand Up @@ -1005,6 +1020,7 @@ OpenLayers.Geometry.pointOnSegment = function(point, segment) {
},
'geolocation.position'
);

} else {
$('#edition').parent().remove();
$('#button-edition').remove();
Expand Down
77 changes: 58 additions & 19 deletions lizmap/www/assets/css/dataviz/dataviz.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ Toolbar buttons
*/

#dataviz h3 .icon {
background-image: url(dataviz-icon-white.png);
background-image: url(dataviz-icon-dark.png);
background-position: 0 0;
}

Expand All @@ -37,20 +37,21 @@ Toolbar buttons
}

#dataviz-main.bottom-content div.menu-content{
background-color: #F0F0F0 !important;
background-color: var(--color-background-primary-content) !important;
border:none !important;
}

#dataviz-main.bottom-content div.menu-content p{
padding: 5px;
font-size: 0.8em;
}
/* Title "Dataviz" of the bottom dock */
#nav-tab-dataviz-main > a{
background: none !important;
border: none;
color: white;
color: var(--color-text-primary);
margin-top: 10px;
font-weight: bold;
font-weight: 500;
}
#dataviz-content > h3{
margin-left:0px;
Expand All @@ -64,9 +65,13 @@ Toolbar buttons
/*
DARK THEME
*/
#dataviz-content.dark h3 .icon {
background-image: url(dataviz-icon-white.png);
background-position: 0 0;
}
#dataviz-content.dark div.menu-content {
background: rgb(74, 74, 74) !important;
color: white;
color: var(--color-contrasted-text);
}
#dataviz-content.dark h3 {
font-weight: bold !important;
Expand All @@ -75,7 +80,7 @@ DARK THEME
#dataviz-content.dark g text.legendtext,
#dataviz-content.dark g.xtick text,
#dataviz-content.dark g.ytick text{
fill: white !important;
fill: var(--color-contrasted-text) !important;
}

/*
Expand All @@ -89,12 +94,11 @@ Diagram height, 450px by default*/
/*
TABS AND GROUPS
*/
/* Edition style */
#dataviz ul.nav-tabs {
border-bottom: 1px solid gray;
border-bottom: 1px solid var(--color-contrasted-elements-light);
}
#dataviz .nav-tabs > li > a {
color: white;
color: var(--color-text-primary);
padding: 5px;
border: none;
}
Expand All @@ -106,9 +110,8 @@ TABS AND GROUPS
#dataviz .nav-tabs > li > a:focus {
background: none;
border: none;
/* border-bottom: 3px solid #0094d6; */
border-bottom: 3px solid white;
color: white;
border-bottom: 3px solid var(--color-contrasted-elements);
color: var(--color-text-primary);
cursor: pointer;
}

Expand All @@ -117,32 +120,68 @@ TABS AND GROUPS
#dataviz .nav-tabs > li.active > a:focus {
background: none;
border: none;
border-bottom: 3px solid white;
color: white;
border-bottom: 3px solid var(--color-contrasted-elements);
color: var(--color-text-primary);
cursor: auto;
}
/* In bottom-dock, do not use a thick border bottom */
#bottom-dock #nav-tab-dataviz-main > a {
border: none;
}

#dataviz div.tab-pane {
border-left: 1px solid gray;
border-right: 1px solid gray;
border-bottom: 1px solid gray;
border-left: 1px solid var(--color-contrasted-elements-light);
border-right: 1px solid var(--color-contrasted-elements-light);
border-bottom: 1px solid var(--color-contrasted-elements-light);
padding: 5px;
}

#dataviz legend {
color: white;
color: var(--color-text-primary);
border-bottom: none;
padding: 5px;
width: unset;
max-width: 100%;
margin-bottom: 0px;
font-weight: normal !important;
font-size: 1em;
}

#dataviz fieldset {
padding: 10px;
padding-top: 0px;
margin: 0px 5px;
border: 1px solid lightgray;
border: 1px solid var(--color-contrasted-elements);
border-radius: 5px;
background: rgba(255, 255, 255, 0.2);
}

/* Dataviz in bottom-dock */
#bottom-dock #dataviz ul.nav-tabs {
border: none;
}
#bottom-dock div.dataviz_plot_container,
#right-dock div.dataviz_plot_container
{
border: 1px solid lightgray;
margin-top: 10px;
}

#bottom-dock div.dataviz_plot_container h3,
#right-dock div.dataviz_plot_container h3
{
margin-left: 0px !important;
border-bottom: 1px solid lightgray;
}
#bottom-dock #dataviz-content.light span.icon {
background-image: url("dataviz-icon-dark.png");
}


/* Some plotly adaptations */
/* deactivated because it moves the plotly toolbar */
.js-plotly-plot .plotly
/* ,.js-plotly-plot .plotly div */
{
margin: 0 auto;
}
51 changes: 34 additions & 17 deletions lizmap/www/assets/css/map.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -98,10 +98,6 @@ button.btn-primary:hover > [class*=" icon-"] {
display:none;
}

#headermenu .dropdown-menu > li > a{
color:white;
}

/* mapmenu */
#mapmenu {
position:absolute;
Expand Down Expand Up @@ -381,11 +377,15 @@ ul.nav.nav-tabs {
right:5px;
width: 32px;
height: 32px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-arrow-left-square' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M15 2a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2zM0 2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2zm11.5 5.5a.5.5 0 0 1 0 1H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5z'/%3E%3C/svg%3E");
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='black' class='bi bi-arrow-left-square' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M15 2a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2zM0 2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2zm11.5 5.5a.5.5 0 0 1 0 1H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5z'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}

#dock-close:hover {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-left-square' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M15 2a1 1 0 0 0-1-1H2a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V2zM0 2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2zm11.5 5.5a.5.5 0 0 1 0 1H5.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L5.707 7.5H11.5z'/%3E%3C/svg%3E");
}

#right-dock div.tabbable {
height: 100%;
margin-top: 5px;
Expand Down Expand Up @@ -525,14 +525,20 @@ SubDock

#bottom-dock-window-buttons {
display:none;
position:absolute;
position:fixed;
bottom:0px;
padding:2px;
}
#bottom-dock.visible #bottom-dock-window-buttons {
display:block;
}

#bottom-dock.half-transparent {
opacity: 1;
height: 48%;
}
#bottom-dock.half-transparent #bottom-dock-window-buttons {
display: block;
}

#bottom-dock-tabs {
display:none;
Expand Down Expand Up @@ -1507,6 +1513,7 @@ lizmap-print .flex {

#switcher-layers-actions {
background-color: inherit;
margin-top: 5px;
margin-bottom: 1px;
padding-right: 10px;
text-align: right;
Expand Down Expand Up @@ -2122,7 +2129,7 @@ lizmap-mouse-position > div.coords-unit > select{
#map-content .lizmapPopupContent h4,
#popupcontent .lizmapPopupContent h4{
margin: 0px;
color : white !important;
color : white;
font-size: 1em;
padding: 2px;
padding-left: 5px;
Expand Down Expand Up @@ -2308,9 +2315,9 @@ lizmap-mouse-position > div.coords-unit > select{

#edition-form-container h3 {
color: black;
background-color: lightgrey;
background-color: transparent;
line-height: 20px;
font-size: 1em;
font-size: 1.2em;
padding: 1px 5px;
margin-bottom: 4px;
}
Expand Down Expand Up @@ -2366,7 +2373,6 @@ lizmap-mouse-position > div.coords-unit > select{

.edition-tabs .nav-pills > .active > a, .edition-tabs .nav-pills > .active > a:hover, .edition-tabs .nav-pills > .active > a:focus{
background-color: #93C01F;
background-image: linear-gradient(to bottom, #9BC144, #93C01F);
color: white;
}

Expand Down Expand Up @@ -2471,14 +2477,15 @@ div.tooltip {
border: 1px solid darkgray;
border-bottom-color: transparent;
}
/* Remove border & padding */
#edition div.tab-content {
border: 1px solid lightgrey;
padding: 10px;
/* border: 1px solid lightgrey;
padding: 10px; */
}
#edition div.jforms-table-group{
background-color: lightgrey;
padding: 10px 0px;
border-radius: 10px;
/* background-color: lightgrey; */
padding: 5px 0px;
/* border-radius: 10px; */
}

#edition-point-coord-form,
Expand Down Expand Up @@ -2937,6 +2944,7 @@ lizmap-reverse-geom svg{
.btn-print-launch.spinner::after {
right: 5px;
}

/* lizmap-feature-toolbar */
lizmap-feature-toolbar button.btn:hover,
.attribute-layer-action-bar button.btn:not(.dropdown-toggle):hover{
Expand Down Expand Up @@ -3149,6 +3157,10 @@ lizmap-treeview .icon-remove-sign {
lizmap-treeview .icon-info-sign {
visibility: hidden;
margin-left: auto;
/* Make it centered vertically & horizontally */
background-origin: content-box;
border: 1px solid gray;
border-radius: 5px;
}

lizmap-treeview .node:hover .icon-info-sign {
Expand Down Expand Up @@ -3180,4 +3192,9 @@ lizmap-treeview .symbols img.legend {

lizmap-treeview img.legend[src="data:image/png;base64, "]{
visibility: hidden;
}
}

/* CKEDITOR adaptations */
.ck.ck-balloon-panel.ck-balloon-panel_visible {
z-index: 9999;
}
Binary file modified lizmap/www/themes/default/css/img/logo.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading

0 comments on commit abc431e

Please sign in to comment.