Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add documentation for action icons and action divider #185

Closed
wants to merge 3 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
41 changes: 41 additions & 0 deletions docs/3.0/actions.md
Original file line number Diff line number Diff line change
Expand Up @@ -362,6 +362,47 @@ end
```
:::

:::option `action icons`
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Other labels have only the option name. Theis would be icon

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@adrianthedev the other options on actions are response types I changed the icon an divider location in this PR #187

I couldn't commit to this one

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I get that, but I think we should do the same with these arguments.

Maybe in a docs reorganization?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes agree, just created this issue to track it #195


Action icons allow you to enhance the visual representation of actions. Action icons provide a quick visual cue for users, helping them identify different actions at a glance.

Here's an example of how you can define actions with icons:

```ruby
def actions
action Avo::Actions::ToggleInactive, icon: "heroicons/outline/globe"
action Avo::Actions::ToggleAdmin
action Avo::Actions::Sub::DummyAction
action Avo::Actions::DownloadFile, icon: "heroicons/outline/arrow-left"
action Avo::Actions::Test::NoConfirmationRedirect
action Avo::Actions::Test::CloseModal
end
```


<img :src="('/assets/img/action_icon.png')" class="border mb-4" />
:::

:::option `action divider`
Action dividers allow you to organize and separate actions into logical groups, improving the overall layout and usability.

Here's an example of how you can define actions dividers:

```ruby
def actions
action Avo::Actions::ToggleInactive
action Avo::Actions::ToggleAdmin
divider
action Avo::Actions::Sub::DummyAction
action Avo::Actions::DownloadFile
divider
action Avo::Actions::Test::NoConfirmationRedirect
action Avo::Actions::Test::CloseModal
end
```
<img :src="('/assets/img/action_divider.png')" class="border mb-4" />
:::

## Customization

```ruby{2-6}
Expand Down
2 changes: 2 additions & 0 deletions docs/3.0/customizable-controls.md
Original file line number Diff line number Diff line change
Expand Up @@ -163,6 +163,8 @@ actions_list exclude: DisableAccount
# Or
actions_list exclude: [ExportSelection, PublishPost]
```
::::info
The actions icon and dividers are defined in `def actions` method. Here is an example of [action icon and divider](actions.md#action_icons_and_action_divider)

:::

Expand Down
Binary file added docs/public/assets/img/action_divider.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/public/assets/img/action_icon.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.