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 language name as data-attribute #65

Closed
wants to merge 1 commit into from
Closed

Add language name as data-attribute #65

wants to merge 1 commit into from

Conversation

fhemberger
Copy link

Allows displaying highlight language name as a hint, e.g.:

pre[class*="language-"]::before {
  content:attr(data-language-name);
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  padding: 4px 10px 2px;
  background-color: #e6e6e6;
  border-bottom: 1px solid #dddddd;
  border-left: 1px solid #dddddd;
  border-bottom-left-radius: 6px;
  font-size: 0.75em;
}

results in:

Allows displaying highlight language name as a hint, e.g.:

```css
pre[class*="language-"]::before {
  content:attr(data-language-name);
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  padding: 4px 10px 2px;
  background-color: #e6e6e6;
  border-bottom: 1px solid #dddddd;
  border-left: 1px solid #dddddd;
  border-bottom-left-radius: 6px;
  font-size: 0.75em;
}
```
@fhemberger
Copy link
Author

Not sure this is possible to inject as an "advanced option" instead, as preAttributes only allows static attributes.

@zachleat
Copy link
Member

Rather than a hardcoded option here, we are shipping #50 that will allow you to specify your own callbacks for any attribute name!

@zachleat zachleat closed this Jun 28, 2022
@zachleat zachleat added this to the 4.1.0 milestone Jun 28, 2022
@zachleat
Copy link
Member

You’ll want something like this to replicate what you have in this PR:

preAttributes: {
  "data-language-name": ({language}) => language
}

@zachleat zachleat added the enhancement New feature or request label Jun 28, 2022
@fhemberger
Copy link
Author

fhemberger commented Jun 28, 2022

Great, thank you! Much cleaner solution.

@fhemberger fhemberger deleted the feature/language-display-name branch June 29, 2022 15:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants