Visual issues updating to 8.7.0

[queensgambit9]

Hi, updated to 8.7.0 and I see some visual difference compared to earlier version 8.2.0.

The header background seems pushed down

Code: [Select]

.ui-widget-header {
    border: 1px solid #3f7506;
    background: #3a8104 url("images/ui-bg_highlight-soft_33_3a8104_1x100.png") 50% 50% repeat-x;
    color: #ffffff;
    font-weight: bold;
}
modifying background to:

Code: [Select]

background: #3a8104 url("images/ui-bg_highlight-soft_33_3a8104_1x100.png") 50% 0% repeat-x;
seems to fix the problem but the footer also seems wrong regarding the background...

Using:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.13.2/themes/le-frog/jquery-ui.css">

attached is screenshot

[paramvir]

It works fine:

Code: [Select]


<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.13.2/themes/le-frog/jquery-ui.css">   


<link href="https://paramquery.com/pro2/Content/css8.7.0/pqgrid.min.css" type="text/css" rel="stylesheet"><link href="https://paramquery.com/pro2/Content/css8.7.0/pqgrid.ui.min.css" type="text/css" rel="stylesheet">
<!--link href="https://paramquery.com/pro2/Content/css8.7.0/themes/office/pqgrid.css" type="text/css" rel="stylesheet"-->   

<script src="https://paramquery.com/pro2/Content/js8.7.0/pqgrid.min.js"></script>
<script src="https://paramquery.com/pro2/Content/js/localize/pq-localize-en.js"></script>

https://jsfiddle.net/mpbL32w4/

[queensgambit9]

Seems my toolbar (2 rows) push it down. I use

Code: [Select]

{type: '<br><br>'},
to get elements on second row and therefor I set height on toolbar.
What would be a better way to have 2 row toolbar?

[paramvir]

It works fine too

https://jsfiddle.net/yc54ubom/

[queensgambit9]

There is a darker green area at the top starting to show. It will be greater as you add more object in toolbar that need more height.
I attached a screenshot.

[paramvir]

That's part of jqueryui css rules for ui-widget-header and works the same in v8.2.0 of pqgrid.

https://jsfiddle.net/9z0r75ua/

you can either make changes in the css rules of .ui-widget-header to your liking or choose a different theme.