| OLD | NEW |
| 1 | 1 |
| 2 <!--- | 2 <!--- |
| 3 | 3 |
| 4 This README is automatically generated from the comments in these files: | 4 This README is automatically generated from the comments in these files: |
| 5 paper-dialog-behavior.html | 5 paper-dialog-behavior.html |
| 6 | 6 |
| 7 Edit those files, and our readme bot will duplicate them over here! | 7 Edit those files, and our readme bot will duplicate them over here! |
| 8 Edit this file, and the bot will squash your changes :) | 8 Edit this file, and the bot will squash your changes :) |
| 9 | 9 |
| 10 The bot does some handling of markdown. Please file a bug if it does the wrong | 10 The bot does some handling of markdown. Please file a bug if it does the wrong |
| (...skipping 25 matching lines...) Expand all Loading... |
| 36 ``` | 36 ``` |
| 37 | 37 |
| 38 `paper-dialog-shared-styles.html` provide styles for a header, content area, and
an action area for buttons. | 38 `paper-dialog-shared-styles.html` provide styles for a header, content area, and
an action area for buttons. |
| 39 Use the `<h2>` tag for the header and the `buttons` class for the action area. Y
ou can use the | 39 Use the `<h2>` tag for the header and the `buttons` class for the action area. Y
ou can use the |
| 40 `paper-dialog-scrollable` element (in its own repository) if you need a scrollin
g content area. | 40 `paper-dialog-scrollable` element (in its own repository) if you need a scrollin
g content area. |
| 41 | 41 |
| 42 Use the `dialog-dismiss` and `dialog-confirm` attributes on interactive controls
to close the | 42 Use the `dialog-dismiss` and `dialog-confirm` attributes on interactive controls
to close the |
| 43 dialog. If the user dismisses the dialog with `dialog-confirm`, the `closingReas
on` will update | 43 dialog. If the user dismisses the dialog with `dialog-confirm`, the `closingReas
on` will update |
| 44 to include `confirmed: true`. | 44 to include `confirmed: true`. |
| 45 | 45 |
| 46 ### Styling | |
| 47 | |
| 48 The following custom properties and mixins are available for styling. | |
| 49 | |
| 50 | Custom property | Description | Default | | |
| 51 | --- | --- | --- | | |
| 52 | `--paper-dialog-background-color` | Dialog background color | `--primary-backg
round-color` | | |
| 53 | `--paper-dialog-color` | Dialog foreground color | `--primary-text-color` | | |
| 54 | `--paper-dialog` | Mixin applied to the dialog | `{}` | | |
| 55 | `--paper-dialog-title` | Mixin applied to the title (`<h2>`) element | `{}` | | |
| 56 | `--paper-dialog-button-color` | Button area foreground color | `--default-prim
ary-color` | | |
| 57 | |
| 58 ### Accessibility | 46 ### Accessibility |
| 59 | 47 |
| 60 This element has `role="dialog"` by default. Depending on the context, it may be
more appropriate | 48 This element has `role="dialog"` by default. Depending on the context, it may be
more appropriate |
| 61 to override this attribute with `role="alertdialog"`. | 49 to override this attribute with `role="alertdialog"`. |
| 62 | 50 |
| 63 If `modal` is set, the element will set `aria-modal` and prevent the focus from
exiting the element. | 51 If `modal` is set, the element will set `aria-modal` and prevent the focus from
exiting the element. |
| 64 It will also ensure that focus remains in the dialog. | 52 It will also ensure that focus remains in the dialog. |
| 65 | 53 |
| 66 | 54 |
| OLD | NEW |