Vanilla 1 is no longer supported or maintained. If you need a copy, you can get it here.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

Looking for "(optional)" in CSS [solved]

TexTex
edited November 2006 in Vanilla 1.0 Help
Hi, I cannot find the css entry which defines the "(optional)" in "Whisper your comments to (optional)". Could anyone please tell me where the colour and font-size of this element is defined? Thanks, Tex

Comments

  • Tex, source code says something like:
    <label for="WhisperUsername">Whisper your comments to <small>(optional)</small></label>
    which means the way it looks is governed by the FORM definition
    (it does not have its own class or ID)

    To change it you can either change the #Form * definition
    (starts at line 949 in my vanilla.css, but may depend on your style)

    Alternatively (not very clean, but allows more leeway if you want only
    THAT specific label in the form to change) you can add it in your
    /conf/language/php definitions, for instance this will make
    it red, 24px.

    $Context->Dictionary['WhisperYourCommentsTo'] = '<span style="color:red;font-size:24px;">Whisper only to</span> <small>(optional)</small>';
  • Thank you very much. I was looking for this way too long. The problem was, if I would change the #Form *, the text inside the text-filds would change his colour, too. So I used your second method, slightly adapted, as I wanted to change the "optional": $Context->Dictionary['WhisperYourCommentsTo'] = 'Whisper your comments to <small><span style="color:red;">(optional)</span></small>'; By the way. How to quote code like you did? Thanks, thanks, thanks, Tex
  • Hold on...correction, actually it *is* in the CSS file (line 1044) but you would not be able to change only the optional.

    #Form.StartDiscussion label, #Form.AddComments label { display: block; width: 100%; color: rgb(131, 67, 0); font-weight: bold; }
    To quote code use <code> and </code> around the code
  • TexTex
    edited November 2006
    I already changed that, but it does not have any effect on the optional. Why is this excluded like this anyway? It even has another font. Is this done on purpose?
  • They've just defined <SMALL> as small type (below certain point size it will not show boldface)
  • TexTex
    edited November 2006
    @ Mark: Then "optional" should please be handled like "Whisper your comments to" in future versions. At least one could consider doing so. Thanks.
  • You can change 90% everything yourself in /conf/language.php
    and/or /themes/vanilla/{yourstylehere}/vanilla.css

    Vanilla is very good at separating content from display I find...
  • TexTex
    edited November 2006
    Absolutely. I could do all the adjustments I wanted to do. Even the last one, with the help of a part of this great supporting community. :)
  • Max_BMax_B New
    edited November 2006
    Adding style statements in php/html file breaks the xhml conformance and is a deprecated method.
    You should either do someting like:
    #Form.StartDiscussion label small { /*you styling here*/ }
    Or to be more specific, add a class or id to the span in the theme file, then add the relevant styling:
    the theme:
    <small class="optional">(optional)</small> or
    <small id="optional">(optional)</small>
    the style:
    [small].optional { /*you styling here*/ }or
    #optional { /*you styling here*/ }
  • @Max, agree if the change required can be done in CSS, it should be.
    Your solution is the best one for changing the styling of (optional).
    Was not sure what Tex was looking for (text change, font change, etc).
  • @ Max_B: I can't find the row where optional is defined in the theme. Should be in comment_form.php, right?
  • Tex, do NOT go and change the PHP file unless you absolutely must... (that's the last thing to do)

    Can you tell me how you'd like that to show/change exactly?
  • TexTex
    edited November 2006
    I would just like it to look like the "Whisper...". In my case like it looks like the "Whisper.." does here, but in colour #889977 and in the same font and font-size than the "Whisper...".
  • The small tag is defined in the language file and not in the theme file.
    I all you want is "(optional)" looks like the rest of the label, just remove this tag from the language file, saving the original line as a comment for information.
  • @ Max_B: Unbelievable. Sometimes it's just too easy. I did never think about looking it up there. Thank you so much. Looks much better now.
This discussion has been closed.