Helvetica Neue theme for FoldingText v1.1dev

pryley's Avatar

pryley

21 Oct, 2012 12:15 PM

This FoldingText theme is based on the default Courier theme.
I made it to match my custom TaskPaper theme.
It supports 3 tags styles:

@high (high priority)
@low (low priority)
@hl (highlight text)

See attached screenshot.

  1. 2 Posted by mutahhir on 22 Oct, 2012 03:28 AM

    mutahhir's Avatar

    This looks great! Love how you've used the tag system to highlight/color nodes. I'd have liked the font to be a tad bit larger, but that's alright.

    I also like how you've made the .todo mode specifier a little smaller than the mode title when the mode node type is a heading.

    Thanks for this! Great work.

  2. Support Staff 3 Posted by Jesse Grosjean on 22 Oct, 2012 03:06 PM

    Jesse Grosjean's Avatar

    Yes, this looks nice. I'm glad you were able to dig into the HTML structure and figure out how to highlight based on tags. Nice work! I've added this theme to the making themes page.

  3. 4 Posted by CuriousnBusy on 26 Oct, 2012 01:56 PM

    CuriousnBusy's Avatar

    This is a great theme! I have tweaked it a bit cosmetically for my own purposes. I love that I can add my own tags to tweak the styling even further.

    My JavaSript/CSS knowledge is limited, therefore two questions:

    1. I would like to change the colour and size of the @tags themselves. I could not identify them in the CSS. Is there a way that this could be done?
    2. Is there a way to increase the width of the display area? It seems to be a dogma of distraction free writing that text is restricted to a rather narrow area. I tried to change the width of the body, but this did not do the trick.

    Thanks for your help!

  4. 5 Posted by pryley on 26 Oct, 2012 02:23 PM

    pryley's Avatar
    1. You can target the color and font-size of the tags in the theme CSS with .tags {}. If you want to target only the @ symbol use .tags.syntax {}, else to target only the tagname use .tags.tagname {}.
    2. To change the text-wrap-width, Click Format -> Text Wrap Width on the menubar.

    What sort of tweaks did you make?

  5. 6 Posted by jafwld on 26 Oct, 2012 04:39 PM

    jafwld's Avatar

    This theme is oh so sweet. Love the highlight, and finally some colored tags!! Thanks for sharing this with us.

  6. 7 Posted by CuriousnBusy on 27 Oct, 2012 07:55 AM

    CuriousnBusy's Avatar

    @pryley:

    As I said, I did mainly cosmetic changes:

    Firstly, I resized some of the elements and gave them a lighter tone of grey, to get them more out of the way in order to concentrate more on content: the #-indicators for the headings, the .mode indicators, and with your help I will do the same for the tags.

    Secondly, I played with your tags: I renamed and restyled them. My priorities are @next (your @hl with bold text), @soon (greenish bold text) and @later (light grey to get it out of the way).

    I would love to post a picture, but the theme is locked in on my local computer @work. It may actually be a good idea to make themes transferable by dropbox & co. once they are officially supported.

    One more remark: your theme also works perfectly for me with longer text. I use your @hl tag as textmarker.

  7. 8 Posted by mitchellm on 03 Nov, 2012 01:39 PM

    mitchellm's Avatar

    Many thanks for creating this theme! Now for the silly question:

    Where do I install custom themes?
    How do I make a custom theme active?

    For example, when I open the Folding Text package and navigate to themes folder I see 4 already existing themes. Is this where I drag your theme to? (I'm assuming yes.) More importantly, how do I then tell Folding Text which theme to use?

  8. Support Staff 9 Posted by Jesse Grosjean on 03 Nov, 2012 01:43 PM

    Jesse Grosjean's Avatar
  9. 10 Posted by mitchellm on 03 Nov, 2012 02:18 PM

    mitchellm's Avatar

    Got it. Many thanks.

    P.S. I've run into the spam protection saying I put in a wrong answer about half the time. I've been very careful and noticing that the spam protection is making the mistake. This last post asked what is 5 times 5. I put in 25. Said it was wrong. Not a huge deal, but somewhat frustrating.

  10. 11 Posted by CuriousnBusy on 03 Dec, 2012 04:37 PM

    CuriousnBusy's Avatar

    Is there a way to specifically style the different heading levels?

    Addressing h1, h2 ... in the CSS does not seem to work.

  11. Support Staff 12 Posted by Jesse Grosjean on 03 Dec, 2012 06:25 PM

    Jesse Grosjean's Avatar

    Yes, you can try something like:

    .heading[level="0"] {
        font-size: 2rem;
    }
    
    .heading[level="1"] {
        font-size: 1.5rem;
    }
    
    .heading[level="2"] {
        font-size: 1.17rem;
    }
    
    .heading[level="4"] {
        font-size: .83rem;
    }
    
    .heading[level="5"] {
        font-size: .67rem;
    }
    
  12. 13 Posted by jafwld on 07 Dec, 2012 11:50 PM

    jafwld's Avatar

    Is there anyway to color different tags? For instance @soon = yellow @now = red?

    pryley's hints about .tags.tagname colors all tags, but I haven't been able to assign different colors to different tags.

    Many thanks!

  13. Support Staff 14 Posted by Jesse Grosjean on 08 Dec, 2012 02:00 PM

    Jesse Grosjean's Avatar

    I don't think you'll be able to assign different colors to different tag names. You can change the styling of a line based on it's tagname, but I don't think styling the individual tags text (based on the tag name) is possible.

  14. 15 Posted by jafwld on 08 Dec, 2012 05:37 PM

    jafwld's Avatar

    Okay, thank's for the answer. I was trying everything and it wouldn't work so I thought I would better spend my time asking those who would know. Cheers!

  15. 16 Posted by Scott on 14 Dec, 2012 06:44 PM

    Scott's Avatar

    What great work on the tags! Even if full theme support is a way off, these priority/highlight tags seem like a must-have edition to the default theme in the next release. I've pasted the code into the default theme (actually a user theme that is the default, plus this tag code) and they look and work great.

  16. 17 Posted by dgbeecher on 15 Apr, 2013 11:26 AM

    dgbeecher's Avatar

    This is a great theme. Thank you, pryley!

    I have only one issue with it. It has to do with left justification in a todo list. I'll describe the issue in pictures:

    Helvetica

    Default

    If somebody can help me fix this, I'd really appreciate it. Thanks!

Reply to this discussion

Internal reply

Formatting help / Preview (switch to plain text) No formatting (switch to Markdown)

Attached Files

You can attach files up to 10MB

If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.