Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

(Harlowe) What's the css tag for (mouseover:) links?

Hey, I'm trying to use mouseover links in harlowe and I noticed that they're just sort of... underlined with a dotted line, and I'd like to make them more noticeable by changing their appearance in the CSS style sheet.

The problem is no matter how hard I look I can't for the life of me find the css tag for links created with (mouseover:) I know about tw-link and .enchantment:link, but I haven't seen anyone clarify the equivalent tag for (mouseover:) links.

Comments

  • Please state the name and full version number of the Story Format you are using, as answers can be different for each one. I will assume you are using v1.2.3 as it is the default.

    The following is the CSS selector you need to overwrite, it uses a border property to display the dashed under line.
    .enchantment-mouseover {
    	border-bottom: 1px dashed #666;
    }
    


    You can use the Developer Tools of your web-browser to examine the HTML generated for the page and the related CSS being used to style it. For example the following passage content:
    This text contains a mouseover [link]<link| within it.
    
    (mouseover: ?link)[]
    
    ... generates the related HTML (note: excluding unrelated elements) within the Elements tab:
    "This text contains a mouseover "
    <tw-enchantment class="enchantment-mouseover">
    	<tw-hook name="link">link</tw-hook>
    </tw-enchantment>
    " within it."
    
    ... selecting the tw-enchantment element in the Elements tab shows the related CSS in the Styles tab.

    note: the names of the Elements tab and the Styles tab may be different for your brand of web-browser.
Sign In or Register to comment.