Product/1464 ui frame

coscine/issues#1464

src/components/ApplicationProfiles/APSelection.vue

 <template>
-  <div>
-    <SearchAP @applicationProfiles="handleApplicationProfiles" />
-    <ListAPs
-      :applicationProfiles="applicationProfiles"
-      @selectApplicationProfile="selectApplicationProfile"
-    />
+  <div id="ApplicationProfiles">
+    <b-col-sm-3>
+      <b-card>
+        <h6><b>{{ $t("APHeader") }}</b></h6>
+        <SearchAP @applicationProfiles="handleApplicationProfiles" />
+        <div class="vMenu">
+          <ListAPs
+            :applicationProfiles="applicationProfiles"
+            @selectApplicationProfile="selectApplicationProfile"
+          />
+        </div>
+      </b-card>
+    </b-col-sm-3>
   </div>
 </template>
 
@@ -39,4 +46,8 @@ export default Vue.extend({
 </script>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped></style>
+<style scoped>
+#ApplicationProfiles{
+  margin-left: 1.5rem;
+}
+</style>