diff --git a/docs/8.0/ayanova/docs/ay-start-form-overview.md b/docs/8.0/ayanova/docs/ay-start-form-overview.md index 9041e59e..b17a4767 100644 --- a/docs/8.0/ayanova/docs/ay-start-form-overview.md +++ b/docs/8.0/ayanova/docs/ay-start-form-overview.md @@ -6,17 +6,21 @@ AyaNova is a single page web application; to the browser it is a single web page ### Consistent -We work hard to ensure AyaNova displays and acts the same on every supported web browser, platform and operating system. +It is our goal that, AyaNova displays and acts the same on every supported web browser, platform and operating system. -It is our goal that a user should have the same experience on Chrome in Linux, Safari in iOS or FireFox in Windows (for example) and we test and support the most recent two releases of all major browsers. +A user should have the same experience on Chrome in Linux, Safari in iOS or FireFox in Windows (for example) and we test and support the most recent two releases of all major browsers. ### Responsive display The AyaNova interface is designed to be "responsive" which means it will adapt what is displayed to accomodate to the size of the device being used. -On narrow screen devices such as smart phones and smaller tablets the form will be displayed vertically as a single column of fields. +On narrow screen devices such as smart phones and smaller tablets the form will be displayed vertically as a single column of fields: -On wider screen devices form fields will flow outwards horizontally to make the best use of screen space. +![narrow form](img/form-narrow-example.png) + +On wider screen devices form fields will flow outwards horizontally to make the best use of screen space: + +![wide form](img/form-wide-example.png) In addition to the layout changing, some elements are customized to be easiser to use with specific sizes of devices. For example a data table list of records will show as a traditional horizontal table with columns on a wider display to take advantage of the horizontal space and on a smaller device the same list will appear as a series of vertical boxes containing each record. diff --git a/docs/8.0/ayanova/docs/img/form-narrow-example.png b/docs/8.0/ayanova/docs/img/form-narrow-example.png new file mode 100644 index 00000000..5c5709d1 Binary files /dev/null and b/docs/8.0/ayanova/docs/img/form-narrow-example.png differ diff --git a/docs/8.0/ayanova/docs/img/form-wide-example.png b/docs/8.0/ayanova/docs/img/form-wide-example.png new file mode 100644 index 00000000..04e77441 Binary files /dev/null and b/docs/8.0/ayanova/docs/img/form-wide-example.png differ