Images - framing roles (role="thumb") ?

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
5 messages Options
Reply | Threaded
Open this post in threaded view
|

Images - framing roles (role="thumb") ?

rotcodiicsa
http://asciidoctor.org/docs/user-manual/#putting-images-in-their-place
"32.2.3. Framing roles"

What it is suppose to do ? Put a border or a bigger margin or what?
It has zero effect locally or at the few online editors.
Thank you.
Reply | Threaded
Open this post in threaded view
|

Re: Images - framing roles (role="thumb") ?

mojavelinux
Administrator
Most of the time, a role is merely a hint to tell the presentation layer how to style an element. It's up to the presentation layer to act on that hint. In the HTML output, that acting is performed by the stylesheet (i.e., CSS).

The default stylesheet that is bundled with Asciidoctor applies the following rules to the thumb role (i.e., CSS class).


Whatever viewer you are referring to must not have such rules, and is therefore not honoring this hint.

-Dan

--
Dan Allen | @mojavelinux | https://twitter.com/mojavelinux
Reply | Threaded
Open this post in threaded view
|

Re: Images - framing roles (role="thumb") ?

rotcodiicsa
Thank you! But...
My target is gitbook which _should_  be standart/default.
But to be sure I tried different browsers and these 3 online editors
https://www.tutorialspoint.com/try_asciidoc_online.php
http://asciidoc-igels.rhcloud.com/
https://asciidoclive.com/edit/scratch/1

And still looking at the output html/css there is zero difference.
I will really appreciate if you post a screenshot of the same image with and without "role=thumb", to see the effect
because looking at the css snippet it might be exactly what I want.
Best Regards.

Ted
Reply | Threaded
Open this post in threaded view
|

Re: Images - framing roles (role="thumb") ?

Ted
rotcodiicsa wrote
I will really appreciate if you post a screenshot of the same image with and without "role=thumb", to see the effect
because looking at the css snippet it might be exactly what I want.
I tried using https://www.tutorialspoint.com/try_asciidoc_online.php and it doesn't appear to be using the Asciidoctor.css style sheet, which is why you don't see the effect.

Here's what an image looks like with the Asciidoctor stylesheet. You can see there is a subtle border around the second tiger image that has the 'thumb' role.

http://tedbergeron.github.io/images/TigerRoleThumb.png


This is the code.

= Test Role Thumb

This is the tiger image:

image::tiger.png[]

This is the tiger with roll thumb.

image::tiger.png[role="thumb"]



- Ted @TedAtCIS
Reply | Threaded
Open this post in threaded view
|

Re: Images - framing roles (role="thumb") ?

rotcodiicsa
Thank you , you all been so helpful.
While waiting for reply I applied the css manually :)
I will bring the issue to gitbook, but I don't think it will resolved anytime soon.
I also tried orher roles from the guide , only one  kind of worked
- positioning right but only with _block_ images (::).

So that's it for now.