Merge pull request #19066 from colemanw/tabCleanup

[civicrm-core.git] / ext / afform / html / ang / afHtmlEditor.aff.html

diff --git a/ext/afform/html/ang/afHtmlEditor.aff.html b/ext/afform/html/ang/afHtmlEditor.aff.html
index 0cbca87fd24174c052d8d3d7decc6cabc3f7cbf5..782ea3a256c11b57f0f40b43ba5cd506cf4f111e 100644 (file)
--- a/ext/afform/html/ang/afHtmlEditor.aff.html
+++ b/ext/afform/html/ang/afHtmlEditor.aff.html
@@ -4,32 +4,88 @@
     {{ts('Failed to find requested form.')}}
   </div>
 
-  <div ng-repeat="resultForm in apiData.result" ng-if="apiData.result.length > 0">
-    <div crm-ui-debug="resultForm"></div>
-
-    <div>
-      <a ng-href="#!/">{{ts('Back')}}</a>
-      |
-      <a af-api4-action="['Afform', 'update', {layoutFormat: 'html', where: [['name', '=', resultForm.name]], values:resultForm}]">{{ts('Save')}}</a>
-      <span ng-if="resultForm.server_route">
-        | <a target="_blank" ng-href="{{crmUrl(resultForm.server_route)}}">Open</a>
-      </span>
-    </div>
+  <div ng-repeat="resultForm in apiData.result" ng-if="apiData.result.length > 0" class="container-fluid">
+
+    <div class="row">
+
+      <div class="col-sm-12 col-md-4">
+        <div class="panel panel-default">
+          <div class="panel-heading">{{ts('Properties')}}</div>
+          <div class="panel-body">
+
+            <div crm-ui-debug="resultForm"></div>
+
+            <div class="form-group">
+              <label class="control-label">{{ts('Name')}}</label>
+              <p class="form-control-static">{{resultForm.name}}</p>
+            </div>
+            <div class="form-group">
+              <label class="control-label">{{ts('Title')}}</label>
+              <input ng-model="resultForm.title" type="text" class="form-control" />
+            </div>
+            <div class="form-group">
+              <label class="control-label">{{ts('Description')}}</label>
+              <textarea class="form-control" ng-model="resultForm.description"></textarea>
+              <p class="help-block">{{ts('Semi-private description about the form\'s purpose.')}}</p>
+              <!-- "Semi-private": not generally public, but not audited for secrecy -->
+            </div>
+            <div class="form-group">
+              <label class="control-label">{{ts('Path')}}</label>
+              <input ng-model="resultForm.server_route" type="text" class="form-control" />
+              <p class="help-block">{{ts('Expose the form as a standalone page on the web site. (Example: "civicrm/my-form")')}}</p>
+            </div>
+            <div class="form-group" ng-if="!!resultForm.server_route">
+              <label for="af_config_form_is_public">
+                <input type="checkbox" id="af_config_form_is_public" ng-model="resultForm.is_public">
+                {{ ts('Enable frontend styling') }}
+              </label>
+              <p class="help-block">{{ts('The general look/feel should match the frontend')}}</p>
+            </div>
+            <div class="form-group">
+              <label for="af_config_form_is_dashlet">
+                <input type="checkbox" id="af_config_form_is_dashlet" ng-model="resultForm.is_dashlet">
+                {{ ts('Enable dashlet') }}
+              </label>
+              <p class="help-block">{{ts('Allow backend users to embed the form on the dashboard.')}}</p>
+            </div>
+            <div class="form-group">
+              <label class="control-label">{{ts('Permission')}}</label>
+              <input ng-model="resultForm.permission" type="text" class="form-control" />
+              <p class="help-block">{{ts('What permission is required to use this form?')}}</p>
+            </div>
+          </div>
+        </div>
 
-    <fieldset>
-      <legend>{{ts('Properties')}}</legend>
-      <div><label>{{ts('Name')}}:</label> {{resultForm.name}}</div>
-      <div><label>{{ts('Title')}}:</label> <input ng-model="resultForm.title" type="text" /></div>
-      <div><label>{{ts('Server Route')}}:</label> <input ng-model="resultForm.server_route" type="text" /></div>
-      <div><label>{{ts('Permission')}}:</label> <input ng-model="resultForm.permission" type="text" /></div>
-      <div><label>{{ts('Description')}}:</label> <textarea ng-model="resultForm.description"></textarea></div>
-    </fieldset>
+        <div class="clearfix"></div>
+      </div>
 
-    <fieldset>
-      <legend>{{ts('Layout')}}</legend>
-      <div af-monaco ng-model="resultForm.layout"></div>
-    </fieldset>
+      <div class="col-sm-12 col-md-8">
+        <div class="panel panel-default">
+          <div class="panel-heading">
+            <div class="btn-group btn-group-xs pull-right" role="group" aria-label="{{ts('Actions')}}">
 
+              <a class="btn btn-default" target="_blank" ng-href="{{crmUrl(resultForm.server_route)}}"  ng-if="resultForm.server_route">
+                <i class="crm-i fa-location-arrow"></i>
+                {{ts('Open')}}
+              </a>
+
+              <a class="btn btn-default"
+                 af-api4-action="['Afform', 'update', {layoutFormat: 'html', where: [['name', '=', resultForm.name]], values:resultForm}]">
+                <i class="crm-i fa-floppy-o"></i>
+                {{ts('Save')}}
+              </a>
+
+            </div>
+
+            {{ts('Markup')}}
+          </div>
+          <div class="panel-body">
+            <div crm-monaco ng-model="resultForm.layout"></div>
+          </div>
+        </div>
+      </div>
+
+    </div>
   </div>
 
 </div>