Move all tray close buttons to the up-right corner

there was a mix of left and right. the inst design team has
standardized on the upper-right corener, regardless of which
edge of the window the tray opens from.

closes COREFE-231

test plan:
  - load a page with the rce
  - open Links > Course Links
  - open Images > Course Images
  - open Documents > Course Documents
  > verify the close button is in the upper-right corner
    and the heading is on the same line, to the left

Change-Id: I77bec2cad44e432b88d633d1f07eb2622da5cdb4
Reviewed-on: https://gerrit.instructure.com/206981
Tested-by: Jenkins
Reviewed-by: Clay Diffrient <cdiffrient@instructure.com>
QA-Review: Jeremy Putnam <jeremyp@instructure.com>
Product-Review: Ed Schiebel <eschiebel@instructure.com>
This commit is contained in:
Ed Schiebel 2019-08-27 14:25:37 -04:00
parent 414fca0278
commit d88a3d5183
3 changed files with 18 additions and 17 deletions

View File

@ -145,18 +145,18 @@ export default function ImageOptionsTray(props) {
>
<Flex direction="column" height="100vh">
<Flex.Item as="header" padding="medium">
<Flex direction="row">
<Flex.Item>
<Flex direction="row">
<Flex.Item grow shrink>
<Heading as="h2">
{formatMessage('Image Options')}
</Heading>
</Flex.Item>
<Flex.Item>
<CloseButton placemet="static" variant="icon" onClick={onRequestClose}>
{formatMessage('Close')}
</CloseButton>
</Flex.Item>
<Flex.Item grow shrink>
<Heading as="h2" margin="none none none medium">
{formatMessage('Image Options')}
</Heading>
</Flex.Item>
</Flex>
</Flex.Item>

View File

@ -86,16 +86,17 @@ export default function LinkOptionsTray(props) {
<Flex direction="column" height="100vh">
<Flex.Item as="header" padding="medium">
<Flex direction="row">
<Flex.Item grow shrink>
<Heading as="h2">
{formatMessage('Link Options')}
</Heading>
</Flex.Item>
<Flex.Item>
<CloseButton placement="static" variant="icon" onClick={props.onRequestClose}>
{formatMessage('Close')}
</CloseButton>
</Flex.Item>
<Flex.Item grow shrink>
<Heading as="h2" margin="none none none medium">
{formatMessage('Link Options')}
</Heading>
</Flex.Item>
</Flex>
</Flex.Item>

View File

@ -179,15 +179,15 @@ export default function CanvasContentTray(props) {
<Flex direction="column" display="block" height="100vh" overflowY="hidden">
<Flex.Item padding="medium" shadow="above">
<Flex margin="none none medium none">
<Flex.Item grow shrink>
<Heading level="h2">{formatMessage('Add')}</Heading>
</Flex.Item>
<Flex.Item>
<CloseButton placement="static" variant="icon" onClick={handleDismissTray}>
{formatMessage('Close')}
</CloseButton>
</Flex.Item>
<Flex.Item grow shrink>
<Heading level="h2" margin="none none none medium">{formatMessage('Add')}</Heading>
</Flex.Item>
</Flex>
<Filter