Merge branch 'master' into visualize-by-value-editor

Author: Maja Grubic

.github/PULL_REQUEST_TEMPLATE.md

@@ -7,12 +7,12 @@ Summarize your PR. If it involves visual changes include a screenshot or gif.
 Delete any items that are not applicable to this PR.
 
 - [ ] Any text added follows [EUI's writing guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses sentence case text and includes [i18n support](https://github.com/elastic/kibana/blob/master/packages/kbn-i18n/README.md)
-- [ ] [Documentation](https://github.com/elastic/kibana/blob/master/CONTRIBUTING.md#writing-documentation) was added for features that require explanation or tutorials
-- [ ] [Unit or functional tests](https://github.com/elastic/kibana/blob/master/CONTRIBUTING.md#cross-browser-compatibility) were updated or added to match the most common scenarios
+- [ ] [Documentation](https://www.elastic.co/guide/en/kibana/master/development-documentation.html) was added for features that require explanation or tutorials
+- [ ] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios
 - [ ] This was checked for [keyboard-only and screenreader accessibility](https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Accessibility#Accessibility_testing_checklist)
 - [ ] This renders correctly on smaller devices using a responsive layout. (You can test this [in your browser](https://www.browserstack.com/guide/responsive-testing-on-local-server)
 - [ ] This was checked for [cross-browser compatibility](https://www.elastic.co/support/matrix#matrix_browsers)
 
 ### For maintainers
 
-- [ ] This was checked for breaking API changes and was [labeled appropriately](https://github.com/elastic/kibana/blob/master/CONTRIBUTING.md#release-notes-process)
+- [ ] This was checked for breaking API changes and was [labeled appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)

.sass-lint.yml

@@ -1,6 +1,7 @@
 files:
   include:
     - 'src/legacy/core_plugins/metrics/**/*.s+(a|c)ss'
+    - 'src/plugins/index_pattern_management/**/*.s+(a|c)ss'
     - 'src/plugins/timelion/**/*.s+(a|c)ss'
     - 'src/plugins/vis_type_vislib/**/*.s+(a|c)ss'
     - 'src/plugins/vis_type_vega/**/*.s+(a|c)ss'

TYPESCRIPT.md

@@ -62,7 +62,7 @@ declare module '@elastic/eui' {
 1. Open up the file and see how easy it would be to convert to TypeScript.
 2. If it's very straightforward, go for it.
 3. If it's not and you wish to stay focused on your own PR, get around the error by adding a type definition file in the same folder as the dependency, with the same name.
-4. Minimally you will need to type what you are using in your PR.  No need to go crazy to fully type the thing or you might be there for awhile depending on what's available.
+4. Minimally you will need to type what you are using in your PR.  No need to go crazy to fully type the thing or you might be there for a while depending on what's available.
 
 For example:
 

docs/canvas/canvas-edit-workpads.asciidoc

@@ -0,0 +1,136 @@
+[role="xpack"]
+[[edit-workpads]]
+== Edit workpads
+
+To create the look and feel that you want, apply format settings to the entire workpad, or individual elements.
+
+[float]
+[[create-variables]]
+=== Create variables
+
+When you frequently use copy and paste, create variables to easily reuse strings and patterns. For example, when you clone a large workpad and need to connect your elements to a new index, use variables to update 
+each element instead of updating them manually.
+
+. Create the variables.
+.. Click *Add a variable*. 
+.. Specify the variable options, then click *Save changes*.
+
+. Apply the variable.
+.. Copy the variable.
+.. Select the element you want to change, then open the expression editor. 
+.. Paste the variable.
+
+For example, to change the index pattern for a set of charts:
+
+Specify the variable options.
+
+[role="screenshot"]
+image::images/specify_variable_syntax.png[Specify the variable syntax]
+
+Copy the variable, then apply it to each element you want to update in the *Expression editor*.
+
+[role="screenshot"]
+image::images/copy_variable_syntax.png[Copy the variable syntax]
+
+[float]
+[[apply-changes-to-the-entire-workpad]]
+=== Apply changes to the entire workpad
+
+With stylesheets, you can change the look of the entire workpad, including fonts, colors, layout, and more.
+
+To get started, enter the changes you want to make in the *Global CSS overrides* text editor, then click *Apply stylesheet*.
+
+For example, to change the background for the entire workpad, enter:
+
+[source,text]
+--------------------------------------------------
+.canvasPage {
+background-color: #3990e6;
+}
+--------------------------------------------------
+
+[float]
+[[change-the-element-settings]]
+=== Change the element settings
+
+Element settings enable you to change the display options at the element level. For example, use the element settings to change the dimensions, style, or location of an element.
+
+[float]
+[[change-the-display-options]]
+==== Change the display options
+
+Choose the display options for your elements. The options available depend on the element you select. 
+
+To change the element display options, click *Display*, then make your changes in the editor.
+
+To use CSS overrides:
+
+. Click *+* next to *Element style*, then select *CSS*. 
+. In the *CSS* text editor, enter the changes you want to make, then click *Apply stylesheet*.
+
+For example, to center an element, enter:
+
+[source,text]
+--------------------------------------------------
+.canvasRenderEl h1 {
+text.align: center;
+}
+--------------------------------------------------
+
+[float]
+[[clone-elements]]
+==== Clone elements
+To use an element with the same functionality and appearance in multiple places, clone the element.
+
+Select the element, then click *Edit > Clone*. 
+
+[role="screenshot"]
+image::images/clone_element.gif[Clone elements]
+
+[float]
+[[move-and-resize-elements]]
+==== Move and resize elements
+
+Canvas provides you with many options to move and resize the elements on your workpad.
+
+* To move elements, click and hold the element, then drag to the new location.
+
+* To move elements by 1 pixel, select the element, press and hold Shift, then use your arrow keys.
+
+* To move elements by 10 pixels, select the element, then use your arrow keys.
+
+* To resize elements, click and drag the resize handles to the new dimensions.
+
+[float]
+[[edit-elements]]
+==== Edit elements
+
+The element editing options allow you to arrange and organize the elements on your workpad page.
+
+To align two or more elements:
+
+. Press and hold Shift, then select the elements you want to align.
+
+. Click *Edit > Alignment*, then select the alignment option.
+
+To distribute three or more elements:
+
+. Press and hold Shift, then select the elements you want to distribute.
+
+. Click *Edit > Distribution*, then select the distribution option.
+
+To reorder elements:
+
+. Select the element you want to reorder.
+
+. Click *Edit > Order*, then select the order option.
+
+[float]
+[[delete-elements]]
+==== Delete elements
+
+When you no longer need an element, delete it from your workpad.
+
+. Select the element you want to delete.
+
+. Click *Edit > Delete*.

docs/canvas/canvas-elements.asciidoc

@@ -1,6 +1,6 @@
 [role="xpack"]
 [[canvas-present-workpad]]
-=== Present your workpad
+== Present your workpad
 
 When you are ready to present your workpad, use and enable the presentation options.
 
@@ -21,3 +21,31 @@ image::images/canvas-autoplay-interval.png[Element autoplay interval]
 image::images/canvas-fullscreen.png[Fullscreen mode]
 
 . When you are ready to exit fullscreen mode, press the Esc (Escape) key.
+
+[float]
+[[zoom-in-out]]
+=== Use the zoom options
+
+To get a closer look at a portion of your workpad, use the zoom options.
+
+. Click *View > Zoom*.
+
+. Select the zoom option.
++
+[role="screenshot"]
+image::images/canvas-zoom-controls.png[Zoom controls]
+
+[float]
+[[configure-auto-refresh-interval]]
+=== Change the auto-refresh interval
+
+Change how often the data refreshes on your workpad.
+
+. Click *View > Auto refresh settings*.
+
+. Select the interval you want to use, or *Set a custom interval*.
++
+[role="screenshot"]
+image::images/canvas-refresh-interval.png[Element data refresh interval]
++
+To manually refresh the data, click image:canvas/images/canvas-refresh-data.png[].