Afform - Use bootstrap classes on form elements
authorColeman Watts <coleman@civicrm.org>
Tue, 30 Mar 2021 14:18:49 +0000 (10:18 -0400)
committerColeman Watts <coleman@civicrm.org>
Tue, 30 Mar 2021 14:18:49 +0000 (10:18 -0400)
ext/afform/admin/ang/afGuiEditor.css
ext/afform/core/ang/af/fields/ChainSelect.html
ext/afform/core/ang/af/fields/Date.html
ext/afform/core/ang/af/fields/Number.html
ext/afform/core/ang/af/fields/Select.html
ext/afform/core/ang/af/fields/Text.html
ext/afform/core/ang/afCore.css

index 93c1d00f38dee45f713fa28200db8997bea70bc7..3667005a12235d9d7d862e2cf862c4cbb6a2753a 100644 (file)
 #afGuiEditor .af-gui-layout.af-layout-inline > div {
   display: inline-block;
   width: 300px;
+  vertical-align: top;
 }
 
 #afGuiEditor .af-gui-button {
index d34450e6507a33d16060c8b78cd02902b2cc6eb8..d1763602ff3f5b056513ba6f8a9383e98057b669 100644 (file)
@@ -1 +1 @@
-<input crm-ui-select="{data: select2Options, multiple: $ctrl.defn.input_attrs.multiple, placeholder: $ctrl.defn.input_attrs.placeholder}" id="{{:: fieldId }}" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]" />
+<input class="form-control" crm-ui-select="{data: select2Options, multiple: $ctrl.defn.input_attrs.multiple, placeholder: $ctrl.defn.input_attrs.placeholder}" id="{{:: fieldId }}" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]" />
index 7e8a34f0fa450d9a617ef2505824311670bd2e3d..ecd7fcdc6f118d20e04dffd5f77ddb94e0b36848 100644 (file)
@@ -1 +1 @@
-<input crm-ui-datepicker="$ctrl.defn.input_attrs" id="{{ fieldId }}" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]" />
+<input class="form-control" crm-ui-datepicker="$ctrl.defn.input_attrs" id="{{ fieldId }}" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]" />
index 3b2b7bbc23dc8076d09c3402f43c051d8a478f05..f38d4d0dd9a76805e8a1a6cc9f85394a0a0cda0f 100644 (file)
@@ -1 +1 @@
-<input class="crm-form-text" type="number" id="{{ fieldId }}" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]" placeholder="{{ $ctrl.defn.input_attrs.placeholder }}" />
+<input class="form-control" type="number" id="{{ fieldId }}" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]" placeholder="{{ $ctrl.defn.input_attrs.placeholder }}" />
index d34450e6507a33d16060c8b78cd02902b2cc6eb8..d1763602ff3f5b056513ba6f8a9383e98057b669 100644 (file)
@@ -1 +1 @@
-<input crm-ui-select="{data: select2Options, multiple: $ctrl.defn.input_attrs.multiple, placeholder: $ctrl.defn.input_attrs.placeholder}" id="{{:: fieldId }}" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]" />
+<input class="form-control" crm-ui-select="{data: select2Options, multiple: $ctrl.defn.input_attrs.multiple, placeholder: $ctrl.defn.input_attrs.placeholder}" id="{{:: fieldId }}" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]" />
index 89cc8cefb262c42ebfd9b8df876b936077521366..71be54197e4126fb15762033340db496818dc912 100644 (file)
@@ -1 +1 @@
-<input class="crm-form-text" type="text" id="{{:: fieldId }}" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]" placeholder="{{ $ctrl.defn.input_attrs.placeholder }}" />
+<input class="form-control" type="text" id="{{:: fieldId }}" ng-model="dataProvider.getFieldData()[$ctrl.fieldName]" placeholder="{{ $ctrl.defn.input_attrs.placeholder }}" />
index 59070b0df50e1858e179b29bbdc8a49f28262e2b..124ead36ff2749fa66da7d31f6897f0f8781b240 100644 (file)
@@ -15,7 +15,7 @@ a.af-api4-action-idle {
 .af-container.af-layout-inline > * {
     display: inline-block;
     margin-right: .5em;
-    vertical-align: bottom;
+    vertical-align: top;
 }
 
 [af-repeat-item] {