Browse Source

Use simple modal for search.

pull/443/head
Sebastian Stehle 6 years ago
parent
commit
409e9c78e7
  1. 2
      frontend/app/features/settings/pages/clients/client.component.html
  2. 25
      frontend/app/shared/components/search-form.component.html
  3. 15
      frontend/app/shared/components/search-form.component.scss

2
frontend/app/features/settings/pages/clients/client.component.html

@ -69,7 +69,7 @@
</div>
<ng-container *sqxModal="connectDialog">
<sqx-modal-dialog large="true" (close)="connectDialog.hide()">
<sqx-modal-dialog (close)="connectDialog.hide()" large="true">
<ng-container title>
Connect
</ng-container>

25
frontend/app/shared/components/search-form.component.html

@ -41,17 +41,13 @@
</sqx-onboarding-tooltip>
<ng-container *sqxModal="searchDialog;closeAuto:false">
<div class="dropdown-menu" [sqxAnchoredTo]="inputFind" @fade>
<div class="form-horizontal">
<div class="submit">
<button type="button" class="btn btn-primary mr-2" (click)="search(true)">
Submit
</button>
<sqx-modal-dialog (close)="searchDialog.hide()" large="true">
<ng-container title>
Custom Query
</ng-container>
<button type="button" class="btn btn-text-secondary" (click)="searchDialog.hide()">
<i class="icon-close"></i>
</button>
</div>
<ng-container content>
<div class="form-horizontal">
<sqx-query
[model]="queryModel"
[query]="query"
@ -63,7 +59,14 @@
Read more about filtering in the <a href="https://docs.squidex.io/04-guides/02-api.html" sqxExternalLink>Documentation</a>.
</div>
</div>
</div>
</ng-container>
<ng-container footer>
<button type="button" class="float-right btn btn-primary mr-2" (click)="search(true)">
Submit
</button>
</ng-container>
</sqx-modal-dialog>
</ng-container>
<ng-container *sqxModal="saveQueryDialog">

15
frontend/app/shared/components/search-form.component.scss

@ -13,21 +13,8 @@
padding-right: 3rem;
}
.dropdown-menu {
max-height: 80%;
overflow-x: hidden;
overflow-y: auto;
}
.form-horizontal {
padding: 1rem 1.5rem;
position: relative;
min-width: 60rem;
max-width: 60rem;
}
.submit {
@include absolute(.5rem, 1rem, auto, auto);
min-width: 35rem;
}
.buttons {

Loading…
Cancel
Save