Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Max Sage 4 posts 84 karma points
    Feb 19, 2016 @ 10:18
    Max Sage
    0

    TXT Starter Kit

    Hi All,
    Can anyone give me any advice on getting bullet lists working when using the TXT Starter Kit. Whenever I try and use the list icons at the top of the Rich Text Editor or if I directly add syntax like this:
    <ul>
    <li>item 1</li>
    <li>item 2</li>
    </ul>
    The list is not displayed I just get the plain text. I am assuming that this is due to the fact that the TXT starter kit styles lists for use in the navigation bar. I spoke to AJ who is the author of the CSS style sheet used in the TXT starter kit at http://html5up.net/ and he suggested I add a class called "default" to the ul element:
    <ul class="default">
    However this didn't have any effect. Any help would be much appreciated.

  • Max Sage 4 posts 84 karma points
    Feb 26, 2016 @ 09:33
    Max Sage
    0

    Is there anybody out there?

  • Nik 1608 posts 7234 karma points MVP 7x c-trib
    Feb 26, 2016 @ 09:38
    Nik
    0

    What version of Umbraco are you using?

  • Max Sage 4 posts 84 karma points
    Feb 26, 2016 @ 11:03
    Max Sage
    0

    Umbraco version 7.3.5 assembly: 1.0.5858.25602

  • Anthony Chudley 50 posts 197 karma points
    Feb 26, 2016 @ 10:28
    Anthony Chudley
    100

    Hi Max,

    Had a quick look at the starter kit and the issue is that in the head of the layout template the styles are being added directly to the head by the Javascript. These have a style of 'list-style:none;' for all <ul> and <ol> tags.

    <script src="/js/skel.min.js"></script>
    <script src="/js/skel-panels.min.js"></script>
    <noscript>
        <link rel="stylesheet" href="/css/skel-noscript.css" />
        <link rel="stylesheet" href="/css/style.css" />
        <link rel="stylesheet" href="/css/style-desktop.css" />
    </noscript>
    

    Normally you would just modify the style.css file and add a new more specific rule. But this is only used if Javascript is disabled.

    So I would create a new style sheet such as customstyles.css and add that after the </noscript> tag.

    In that add this rule and you will see a more normal list style.

    section ul {
        list-style: circle;
        margin-left: 30px;
    }
    

    As such it's an odd quirk of the Txt Starter Kit. It's a very broad reset for all list items.

  • Max Sage 4 posts 84 karma points
    Feb 26, 2016 @ 11:04
    Max Sage
    0

    Thanks Anthony - I will give that a try.

Please Sign in or register to post replies

Write your reply to:

Draft