1 /* Style rules for Api4 Explorer */
3 #bootstrap-theme.api4-explorer-page
.panel-heading
{
6 #bootstrap-theme.api4-explorer-page
.panel-body
{
7 min-height: calc
( 100% - 50px);
9 #bootstrap-theme.api4-explorer-page
.explorer-params-panel
.panel-heading
{
12 #bootstrap-theme.api4-explorer-page
.explorer-params-panel
.panel-heading button
{
16 #bootstrap-theme .explorer-params-panel
.panel-heading
.form-inline
> .select2-container
{
17 max-width: 25% !important
;
19 #bootstrap-theme.api4-explorer-page
.api4-explorer-row
{
22 #bootstrap-theme.api4-explorer-page
> div
> .panel
{
27 #bootstrap-theme.api4-explorer-page
> div
> form
.panel
{
30 /* Fix weird shorditch style */
31 #bootstrap-theme.api4-explorer-page
.api4-explorer-row
.panel
.panel-heading
{
32 border-bottom-right-radius: 0;
33 border-bottom-left-radius: 0;
36 #bootstrap-theme.api4-explorer-page
.panel-heading
.nav-tabs
{
37 padding: 8px 0 0 20px;
39 #bootstrap-theme .panel-heading
>li
>a
{
40 background-color: #f1f1f18c
42 #bootstrap-theme.api4-explorer-page
.explorer-code-panel table
td:first-child
{
44 word-break: break-word
;
46 #bootstrap-theme.api4-explorer-page
.explorer-code-panel table td pre
{
49 #bootstrap-theme.api4-explorer-page
.explorer-code-panel
.panel-heading
.nav li a
{
50 text-transform: uppercase
;
53 #bootstrap-theme.api4-explorer-page
.explorer-params-panel
> .panel-body
> div
.api4-input
{
57 #bootstrap-theme.api4-explorer-page
.explorer-help-panel
.panel-body
{
58 word-break: break-word
;
61 /* because each help p is in a div, this undoes bootstrap removing margin from last-child */
62 #bootstrap-theme.api4-explorer-page
.explorer-help-panel
.panel-body p
{
66 #bootstrap-theme.api4-explorer-page form label
{
67 text-transform: capitalize
;
70 #bootstrap-theme.api4-explorer-page fieldset
{
72 border: 1px solid lightgrey
;
77 #bootstrap-theme.api4-explorer-page fieldset legend
{
83 text-transform: capitalize
;
85 #bootstrap-theme.api4-explorer-page crm-api4-clause
> .btn-group
{
90 #bootstrap-theme.api4-explorer-page crm-api4-clause
> .btn-group
.btn
{
94 #bootstrap-theme.api4-explorer-page fieldset div
.api4-input
{
98 #bootstrap-theme.api4-explorer-page fieldset div
.api4-input
.ui-sortable-helper
{
99 background-color: rgba
(255, 255, 255, .9);
102 #bootstrap-theme.api4-explorer-page fieldset div
.api4-input
.ui-sortable-helper
{
103 background-color: rgba
(255, 255, 255, .9);
106 #bootstrap-theme.api4-explorer-page div
.api4-input
.form-inline label
.form-control
{
109 #bootstrap-theme.api4-explorer-page div
.api4-input
.form-inline label
.form-control input
[type
=checkbox
] {
113 #bootstrap-theme.api4-explorer-page div
.api4-input
.form-inline label
.form-control:not
(.api4-option-selected
) {
116 -webkit-box-shadow: none
;
117 -moz-box-shadow: none
;
121 #bootstrap-theme.api4-explorer-page div
.api4-input
.form-inline
.form-control label
{
127 #bootstrap-theme.api4-explorer-page
.api4-clause-fieldset fieldset
{
129 width: calc
(100% - 58px);
133 #bootstrap-theme.api4-explorer-page
.api4-clause-fieldset
.api4-sorting fieldset
.api4-clause-group-sortable
{
137 #bootstrap-theme.api4-explorer-page
.api4-input-group
{
138 display: inline-block
;
141 #bootstrap-theme.api4-explorer-page i
.fa-arrows
{
145 #bootstrap-theme.api4-explorer-page
.api4-clause-badge
{
147 display: inline-block
;
150 #bootstrap-theme.api4-explorer-page
.api4-clause-badge
.badge
{
154 #bootstrap-theme.api4-explorer-page
.api4-clause-badge
.caret
{
157 #bootstrap-theme.api4-explorer-page
.api4-clause-badge
.crm-i
{
161 #bootstrap-theme.api4-explorer-page
.ui-sortable-helper
.api4-clause-badge
.badge span
{
164 #bootstrap-theme.api4-explorer-page
.ui-sortable-helper
.api4-clause-badge
.crm-i
{
165 display: inline-block
;
168 #bootstrap-theme.api4-explorer-page
.api4-operator
,
169 #bootstrap-theme.api4-explorer-page
.api4-chain-index
,
170 #bootstrap-theme.api4-explorer-page
.api4-chain-action
{
173 #bootstrap-theme.api4-explorer-page
.api4-chain-params
{
174 width: calc
(100% - 390px);
177 #bootstrap-theme.api4-explorer-page
.api4-add-where-group-menu
{
179 background-color: rgba
(186, 225, 251, 0.94);
181 #bootstrap-theme.api4-explorer-page
.api4-add-where-group-menu a
{
185 /* Collapsible optgroups for select2 */
186 div
.select2-drop
.collapsible-optgroups-enabled
.select2-result-with-children:not
(.optgroup-expanded
) > .select2-result-sub
> li
.select2-result
{
189 div
.select2-drop
.collapsible-optgroups-enabled
.select2-result-with-children
> .select2-result-label:before
{
190 font-family: FontAwesome
;
192 display: inline-block
;
194 vertical-align: middle
;
197 div
.select2-drop
.collapsible-optgroups-enabled
.select2-result-with-children
.optgroup-expanded
> .select2-result-label:before
{
201 #bootstrap-theme.api4-explorer-page
.form-control
.huge
{
205 #bootstrap-theme.api4-explorer-page
.form-control
.twenty
{
209 /* Another weird shoreditch fix */
210 #bootstrap-theme .form-inline div
.checkbox
{
213 #bootstrap-theme .form-inline div
.checkbox label input
[type
=checkbox
] {
218 * Shims so the UI isn't completely broken when a Bootstrap theme is not installed
220 #bootstrap-theme.api4-explorer-page
* {
221 box-sizing: border-box
;
223 .api4-explorer-page.panel {
224 border: 1px solid grey
;
225 background-color: white
;
227 .api4-explorer-page.panel-heading {
230 background-color: #f3f6f7;