Comments (8)
The styles are not getting loaded, for the view all pages it is working partially but also not as intended, and for the detail view with the code panel it is not working.
Thanks for highlighting that issue.
from patternlab-node.
To my impression code highlighting just wasn't expected to work / targeted at anything else than the code panels so far. So we most likely only need to decide on whether we want to target for code[class*="language-"]
in other contexts as well (mainly the surrounding pattern lab documentation content as well as the description section within the expanded details.
from patternlab-node.
Even there it is not working.
I tested it myself in the code panels on the view all pages and in the code panels on the detail page.
Both seem not to take the CSS into account. Maybe there was a change down the road where we missed it.
from patternlab-node.
@JosefBredereck maybe I do have a misunderstanding here, but if I do open e.g. https://patternlab-handlebars-preview.netlify.app/?p=all the HTML code gets its highlighting:
from patternlab-node.
Ah, that's what you mean. I mean the left-hand site of that panel, where the .md content gets rendered.
from patternlab-node.
Yes, but not the content of the description.
Take this for example: https://lab.n8d.studio/htwoo/htwoo-core/?p=atoms-grid
It has somewhat rendered syntax highlighting, just the 'code' styles but does not tokenise it with primsjs.
<pre><code class="language-css">.demo-item{
@include gridSpan(4);
}
</code></pre>
from patternlab-node.
Yes, but not the content of the description.
Take this for example: https://lab.n8d.studio/htwoo/htwoo-core/?p=atoms-grid
It has somewhat rendered syntax highlighting, just the 'code' styles but does not tokenise it with primsjs.
<pre><code class="language-css">.demo-item{ @include gridSpan(4); } </code></pre>
I still think that's related to the selector & scope that we're using for the code formatter at the moment – this would either need to get added to that selector or – if we are in another component for this section on the left – a JavaScript call of that code formatter would need to get added for <code>
parts in that component as well, which most likely currently doesn't exist.
@StfBauer would you be able to contribute a PR for this problem, please?
from patternlab-node.
Sure, but I need some guidance on the project.
from patternlab-node.
Related Issues (20)
- engine-twig-php: include-function syntax not matched by findPartials HOT 2
- startup error on TwigRenderer
- Nothing compiling to patterns folder HOT 1
- [Documentation] Engine configuration fileExtension vs extension HOT 6
- Rework how pattern lab loads UI-kits HOT 3
- Rework UI-kit Workshop
- Broken starter kit Twig Demo HOT 2
- Twig does not reload template on changes (PHP and node) HOT 3
- Rewrite Pattern Lab Core HOT 3
- Subitems would get cropped or disappear on vertical navigation
- PHP TwigRenderer Error when adding custom Twig extension via alter-twig.php HOT 1
- Patternlab and D10 / Twig 3 HOT 3
- [Vulnerability] Old version of lodash causing `npm audit` issues flagged HOT 2
- [Handlebars] Inconsistent data access when leveraging sibling JSON + partial blocks
- Migrate to Node 18
- Migrate from `pretty-quick` to `lint-staged`
- Stuck on start with patternlab twig-php engine HOT 1
- Is Pattern twig-php is broken and doesn't render any patterns? HOT 2
- NPM vulnerabilities for GOT
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from patternlab-node.