searchToolbar input size

[bouks]

Try to change resizeFilterToolbarInput by css rules.

https://github.com/openpsa/grid.js/pull/77#issuecomment-71310216

[flack]

I just tried adding the rules I posted on top of your merged PR, but they don't apply anymore now because you removed ui-search-box:

https://github.com/openpsa/grid.js/commit/a917effe73d954df1b0bfca412be7759ec8aece3#diff-b00cd3167597a03d096b6f2a33e604b7L430

Is there any particular reason for removing it? The DOM would be a lot easier to style if it were still there.

[bouks]

I think what is useless must be removed. :)

try this one :

.ui-search-toolbar
{
    .ui-search-oper
    {
        width: 20px;
        padding-right: 0.5em;
        .ui-search-oper, a.clearsearchclass
        {
            width: 10%;
        }
    }
    .ui-search-input
    {
        & > input, & > select
        {
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            width: 80%;
        }
    }
}

[flack]

It's a bit dirty as a solution IMHO, because these percentages work well only with certain column widths. If the column gets too wide, then the icons have too much space. If it gets too small, they don't have enough. See this for example:

[bouks]

For the big (big) one, no problem if it's not occupying all the width. It is centered and big. Cool.

For the little one, i suggest if you think it's the smallest possible (more small can't fill and see the input) to adjust percentage.

It's, then, not fixed, but according to the usage scale of the grid, it's enough IMHO. Don't you think ?

[bouks]

And for the big one, you have less mouse move to do. :)

[flack]

Well yeah, the percentage solution is better than nothing, but doing it properly is not that hard. Basically, the only thing that is missing is ui-search-box. And the display: table-cell solution would also be easier better for people who use different icons

[flack]

I've implemented this in

https://github.com/openpsa/grid.js/commit/2b1f43d03b7796c25391bd8fa67aa074d39fe897

It works now with display: table-cell and without resizeFilterToolbarInput and also without ui-search-box. Pls test on your machine and tell me if it looks ok

[bouks]

Working like this : https://github.com/openpsa/grid.js/pull/84