Skip to content

Commit be921a8

Browse files
authored
Edits.
1 parent 127d36c commit be921a8

File tree

1 file changed

+8
-8
lines changed

1 file changed

+8
-8
lines changed

docs/design/web-part-levels.md

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,13 @@ description: Learn about SharePoint web part levels, secondary state toolbars, a
44
ms.date: 08/13/2018
55
---
66

7-
# SharePoint Web part levels
7+
# SharePoint web part levels
88

9-
When designing a SharePoint web part, you sometimes need to have a secondary interaction level; for example, an item in a list or a individual photo in a gallery. This article explains how to use secondary state toolbars, default commands, scale, and interactions states to select an individual item.
9+
When designing a SharePoint web part, you sometimes need to have a secondary interaction level; for example, an item in a list or an individual photo in a gallery. This article explains how to use secondary state toolbars, default commands, scale, and interaction states to select an individual item.
1010

11-
Secondary web part configuration and toolbars follow the same patterns as single state web parts, such as image or file viewer. Second level items can have their own toolbars and respective property pane to make it easy for authors to configure the web part with meaningful content and data. Keep in mind that there should be a clear separation between configuration options in web parts that have two levels. We recommend that you keep the Source, Filtering, and Layout configuration, as well as any additional options that affect the web part as a whole, at the first level.
11+
Secondary web part configurations and toolbars follow the same patterns as single state web parts, such as an image or file viewer. Second-level items can have their own toolbars and respective property pane, to make it easy for authors to configure the web part with meaningful content and data. Keep in mind that there should be a clear separation between configuration options in web parts that have two levels. We recommend that you keep the Source, Filtering, and Layout configuration, as well as any additional options that affect the web part as a whole, at the first level.
1212

13-
Some example web parts to use as reference are:
13+
The following are some web part examples to use as reference:
1414

1515
- Image gallery
1616
- Quick links
@@ -20,17 +20,17 @@ Some example web parts to use as reference are:
2020

2121
## Secondary toolbars
2222

23-
Secondary toolbar are used on individual items in a web part layout that need to support item level configuration in the property pane and other commands like move, to re-arrange items in a layout, or to remove/delete an item. Custom commands can also be added in this toolbar that fit the needs of your web part..
23+
Secondary toolbars are used on individual items in a web part layout that need to support item-level configuration in the property pane - and other commands like move - to rearrange items in a layout, or to remove/delete an item. You can also add custom commands in this toolbar that fit the needs of your web part.
2424

2525
![Edit state of Image Gallery web part with property pane open](../images/02_WebpartLevels_SecondLevel.png)
2626

2727
## Selection states
2828

29-
There are 3 core commands on 2nd level toolbars within a web part. They are Edit, Move and Remove. It's important to consider the implementation of the selection states when building a web part with a secondary level.
29+
Second-level toolbars within a web part have three core commands: Edit, Move, and Remove. It's important to consider the implementation of the selection states when building a web part with a secondary level.
3030

31-
The 2nd level toolbar should only display when the author selects (clicks/taps) an individual item. Do not show all the 2nd level toolbars for every items at once as this can overwhelm the user. Additionally, do not have the toolbar appear on hover, as this may cause usability issues with devices that support touch.
31+
The second-level toolbar should only display when the author selects (clicks/taps) an individual item. Do not show all the second-level toolbars for every items at once, as this can overwhelm the user. Additionally, do not have the toolbar appear on hover, as this might cause usability issues with devices that support touch.
3232

33-
The bounding box and/or outline of each 2nd level item should change from its default state to the primary color on hover and remain the primary color on selection. It is important that the bounding box and icons keep their active states so the user understands what item is selected when using the property pane or while re-arranging items.
33+
The bounding box and/or outline of each second-level item should change from its default state to the primary color on hover and remain the primary color on selection. It is important that the bounding box and icons keep their active states so the user understands what item is selected when using the property pane or while re-arranging items.
3434

3535
Below is an example from an individual 2nd level item in the Image gallery web part:
3636

0 commit comments

Comments
 (0)