Hiding the Query Builder

Questions & Help
1

Hi there,

Is there any way for me to get rid of the query builder selections from my table view? (see image)

querybuilder
querybuilder865×184 12.5 KB

It’s taking up a ridiculous amount of vertical space and detracts from the table?

Thanks in advance!

2

Could put into file custom.css something like this:

.cp__query-builder {
  display: none;
}
3

I have this setup:

.cp__query-builder-filter {
  opacity: 0;
  margin-top: -30px; /* Apply negative margin to bring it up */
  transition: opacity 0.3s, margin-top 0.3s; /* Add transitions for smooth effect */
}

.custom-query:hover .cp__query-builder-filter {
  opacity: 1;
  margin-top: 0; /* Reset margin to its original value */
}

and it’s working fine. It hides the builder and shows it on hover. I would so much like to be able to set titles for simple queries and, instead of the “Live query” text, to have the query title but I am not sure that is possible with css… perhaps as a Feature Request…

2 Likes
4

That’s a nice one!

I also added this to minimze the whitespace around the query header and to compact tables:

/* Compact tables */
.whitespace-nowrap {
  padding-top: 1px;
  padding-right: 1px;
  padding-bottom: 1px;
  padding-left: 1px;
}
/* Compcts live query header */
.custom-query > div:first-child {
    border-radius: 5px;
    padding: 2px 2px;
}
1 Like
5

Thanks so much for this! It works great.

6

Used this and it’s smartened up my tables - thanks so much!

7

I have also added:

.table-auto {
  margin-top: 0;
  margin-bottom: 0;
}

… thought of posting it here :slight_smile: