Skip to content

Commit

Permalink
Finalize README.md
Browse files Browse the repository at this point in the history
  • Loading branch information
OutlawAndy committed Mar 28, 2024
1 parent 4d20e83 commit 1b33e2d
Show file tree
Hide file tree
Showing 2 changed files with 40 additions and 6 deletions.
4 changes: 2 additions & 2 deletions LICENSE
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
MIT License

Copyright (c) 2023 RoleModel Software
Copyright (c) 2024 RoleModel Software

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
Expand All @@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
SOFTWARE.
42 changes: 38 additions & 4 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ TC.start()

## Usage

Turbo's confirmation interface is exercised most commonly via `button_to` (example shown in [slim](https://github.com/slim-template/slim) templating syntax)
Turbo's confirmation interface is exercised most commonly via `button_to` (example shown in [slim] templating syntax)

```ruby
= button_to 'Delete ToDo', todo_path(todo),
Expand All @@ -63,7 +63,7 @@ Turbo-Confirm supports other custom content beyond a simple message, by setting
- **body** activated by a `data-confirm-details` attribute on the confirmation trigger. The attribute's value will be assigned to the element matching the `#confirm-body` selector.
- **acceptText** activated by a `data-confirm-button` attribute on the confirmation trigger. The attribute's value will be assigned to the element matching the `#confirm-accept` selector (same as the default value of the `acceptSelector` configuration property)

example usage of default _contentSlots_ via `button_to` in Slim templating syntax:
example usage of default _contentSlots_ via `button_to` in [slim] templating syntax:

```ruby
= button_to 'Delete ToDo', todo_path(todo),
Expand Down Expand Up @@ -210,6 +210,40 @@ Based on the default configuration, the following template is suitable.
</div>
```

[turbo-rails]: https://github.com/hotwired/turbo-rails
### Using the native Dialog Example

If you're not already using a CSS or style component framework. I suggest checking out [Optics]. Alternatively, the native [dialog][mdn-dialog] element is fully supported by modern browsers and removes much of the styling burden that would otherwise be required to emulate such behavior with only `div`.

Turbo-Confirm fully supports the native dialog element, including dismissal via `esc` key.

```HTML
<!-- not visible without an [open] attribute, which Turbo-Confirm will handle for you -->
<dialog id="confirm" class="modal">
<div class="modal__content">
<h3 id="confirm-title">Replaced by `data-turbo-confirm` attribute</h3>
<div id="confirm-body">
<p>Default confirm message.</p>
<p>Optionally replaced by `data-confirm-details` attribute</p>
</div>
<div class="modal-actions">
<button class="confirm-cancel">Cancel</button>
<button id="confirm-accept">Yes, I'm Sure</button>
</div>
</div>
</dialog>
```

## What is RoleModel Software?

[RoleModel Software][rms] is a world-class, collaborative software development team dedicated to delivering the highest quality custom web and mobile software solutions while cultivating a work environment where community, family, learning, and mentoring flourish.

## License

[MIT](LICENSE)

[slim]: https://github.com/slim-template/slim
[turbo-rails]: https://github.com/hotwired/turbo-rails/
[mdn-promise]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise
[mdn-dialog]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog
[mdn-dialog]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog/
[Optics]: https://github.com/RoleModel/optics/
[rms]: https://rolemodelsoftware.com/

0 comments on commit 1b33e2d

Please sign in to comment.