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 any class to a toolbar button #285

Merged
merged 4 commits into from Mar 12, 2020
Merged

Add any class to a toolbar button #285

merged 4 commits into from Mar 12, 2020

Conversation

ericcornelissen
Copy link
Contributor

@ericcornelissen ericcornelissen commented Mar 6, 2020

Closes #271, this would allow users to add any class(es) to buttons. They can then define the class in a local stylesheet an customize buttons as they see fit.

They can do this through the class option which can be either a string or an array of strings. If it is an array every string will be added separately.

Arguably this is unnecessary as you can add multiple strings simply by putting spaces in the string. This is not possible with the current implementation, but an be implemented instead if desired.

Example usage:

  toolBar.addButton({
    icon: 'octoface',
    callback: 'application:about',
    class: 'my-awesome-class'
  });

  toolBar.addButton({
    icon: 'octoface',
    callback: 'application:about',
    class: ['multiple', 'classes', 'also', 'works']
  });

@ericcornelissen ericcornelissen marked this pull request as ready for review March 6, 2020 09:03
@aminya
Copy link
Member

aminya commented Mar 6, 2020

This is awesome. Thanks for the work

toolBar.addButton({
icon: 'octoface',
callback: 'application:about',
class: 'my-awesome-class'
Copy link
Member

@aminya aminya Mar 6, 2020

Choose a reason for hiding this comment

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

It would more useful if you provide a full example that includes the class definition (something which is not possible using the simple options' syntax).

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Good suggestion! I would like some feedback from @suda on how they would like to incorporate that into the documentation.

Some possible options:

  • Add a new file for it docs/button-with-class.md (perhaps a bit overkill, though other options might benefit from a similar approach?)
  • Add it to the repo wiki
  • Create a gist with an example and link there

Copy link
Member

Choose a reason for hiding this comment

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

I think if the class definition is short it can be put at the end of the main readme. But if it takes a lot of space the separate markdown file is a better option. Gist works too, but markdown file stays in this repository.

I don't think repo Wiki is suitable for this case.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I think if the class definition is short it can be put at the end of the main readme. But if it takes a lot of space the separate markdown file is a better option.

I'm mainly just not sure where to put it... I have a comparable thing in the README for one of my own packages, but the use case is slightly different here...

Gist works too, but markdown file stays in this repository.

Wanted to add that disclaimer, but thought it was self-evident. Thanks for pointed it out explicitly though!

I don't think repo Wiki is suitable for this case.

Yea, I'm not sure about it either, but it's definitely a valid option 😄

In the end, again, it's up to @suda

Copy link
Collaborator

Choose a reason for hiding this comment

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

I think adding it to the readme is perfectly fine :) The Example section covers all possible options and we can probably add it there :)

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I put something together, let me know what you think 😄 (and I rebased the PR)

@suda
Copy link
Collaborator

suda commented Mar 8, 2020

Thanks for the contribution Eric! I merged some other PRs so you might need to rebase your work

This option can be a string or an array of strings and will add (all of 
the) value(s) as classes to the button DOM element.
@suda suda merged commit 8cdd651 into atom-community:master Mar 12, 2020
@ericcornelissen ericcornelissen deleted the feat-271 branch March 12, 2020 13:58
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Alternative ways to provide icons
3 participants