Comments (12)
Yep. It seems there is something odd going on from respec. I can probably fix this manually when generating a Working Draft, but otherwise I will have to go debug it in respec, and I guess that means debugging a library it depends on...
So I'm not sure which approach I will take - depends on available time.
@marcoscaceres have you seen this before?
from microdata.
I know it looks weird, but it's actually working as expected. You need to change the markup a little bit. I'd suggest either making the example into a note, which itself contains the <pre class=example>
, or making a new section
:
<section class="informative">
<h3>Example of usage</h3>
<pre class="example">
.. stuff here...
</pre>
</section>
from microdata.
Oh, another option is putting adding an example
class on the pre
. It's kinda ugly tho:
Additionally, you should put figcaption
after the svg image. Otherwise, it looks like you are labelling the code, and not the image.
from microdata.
from microdata.
One last thing, on <pre class="example">
you can add a title
attribute, which will then be rendered to resemble a heading. like:
<pre class="example html" title="Using itemscope">
from microdata.
Wait, sorry for all the noise... I totally misunderstood the problem (serves me right for trying to do things without drinking coffee first). You've done things correctly.
I don't see the problem with the highlight colors?
To add a label correctly, use an aside
instead... like the following:
<aside class="example" title="This will add number">
<p>Here we see how to use a fat arrow in ES.
<pre>
const sum = [...items]
.map(item => item * 2)
.reduce((sum, next) => sum + (next || 0) );
</pre>
</aside>
from microdata.
I don't see the problem with the highlight colors?
I made screenshots:
from microdata.
Ok, yeah, I see it now. I didn't scroll down far enough last time.
from microdata.
We will need to file a bug at https://github.com/isagalaev/highlight.js/
from microdata.
@marcoscaceres thanks for taking the time (and sorry you wasted the time before coffee ;) ).
If we used something like the markup you suggested
<aside class="example" title="Now we can name examples">
<pre class="something">...example goes here...
would we actually get the desired effect despite the bug? Or do I need to dig harder to find out for myself?
from microdata.
@chaals, you'll have to try it. Might get lucky and it just works. If it doesn't, let me know. I have a custom build of the highlighter that I include into ReSpec, so worst case we try to fix it there. I've not checked how hard is to fix.
from microdata.
so I added class="html"
to the code examples that are HTML, and they all came out nice in respec. I'll raise a separate issue to name examples, but it does seem to work if they are <aside class="example" title="put a name here">
Thanks to both of you for picking this up, and @marcoscaceres for suggesting a fix. I'm applying it a bit as black magic, but I think that's reasonable in this case...
from microdata.
Related Issues (20)
- Global Identifier
- Values section title odd
- Textual property value does not use language of the element HOT 4
- No description of how numeric property values are obtained. HOT 12
- Incomplete sentence: "User agents are"
- Capitalization of "microdata"
- give examples and algorithms a URL HOT 1
- Provide an example of itemid
- incomplete sentence "User agents are" HOT 2
- RDFa and JSON-LD are not equivalent HOT 12
- RDFa should generate to RDFa Lite HOT 4
- Use the same example for JSON-LD and RDFa HOT 6
- Reference to [microdata-rdf] should be changed HOT 13
- Reusing components in different contexts HOT 4
- itemref as a url, not just an ID within the same document
- "Valid" definition doesn't resolve
- "Our company" example is confusing
- Hedral the Cat HOT 1
- Hedral Issue 2 HOT 1
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 microdata.