hugo-theme-learn
hugo-theme-learn copied to clipboard
matcornic
Add a language label to code blocks
Add a language label to each individual code block, move the copy to clipboard button down to accommodate the new header
Before
After
I really like the idea! Nevertheless I am not quite sure if it would be better to have this feature configurable. At least so existing installations could switch back to the old style.
Technically I don't like the fact, that every pre element is affected by the new styling. There may be users that use html preelements inside their markdown for other reasons which would now also be styled. In this case there even might not be a code element nested inside of the pre leading to a visible but empty language lable.
Now that your patch for #427 is applied, the grey color needs alignment.
...and as a matter of taste, the border radius is a bit too large in comparison to other radiuses like the one of the search box.
Sadly, this change may not look that good together with the proposed "tab" feature #386.
@McShelby I think the two proposed changes address two completely different use cases.
My change is best used when different code snippets are present on the same page individually in multiple languages and formats -- eg. bash scripts, code snippets, HTML -- etc. I'm using this theme for course material and the labels are extremely helpful for beginner developers who may not know when to switch between their terminal and their editor.
The tab view proposed in #386 is far more useful for API documentation -- when the same snippet of code is presented in different languages or output formats.
Personally, I'd implement it like this:
- Put language labels behind a config param
- If language labels are on, disable them in a tabbed view, since a label is already present.
Optionally they can be styled to look cohesive if both were used on one page but I'd need help with this as I'm not great with CSS.
If this is something you're interested in I can fix the merge conflict and wrap language labels in a config param that is off by default.
I'ld love to work with you on this PR. Sadly I am not a maintainer (yet). So before diving into this, it would be great to hear the opinion of @matalo33 and/or @matcornic about this.