1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Node icons in extra.css when using a parent style

Discussion in 'Styling and Customization Questions' started by SchmitzIT, Oct 18, 2011.

  1. SchmitzIT

    SchmitzIT Well-Known Member

    I have a quick quick question. We use a "parent style" to ensure that template edits only have to be done once there, and will automatically be trickling down to the styles defined as children under it.

    Now we have a bunch of customizations I'd like to see go through every child-style, but preferably without having to do them in every seperate style (to be specific, we add different icons to diffferent nodes, and have those defined in extra.css).

    Is it somehow possible to do this while still allowing for the extra.css of the children to contain specific customizations for these styles?

    So essentially, I'd like to add stuff like the following:

    And preferably only have to do it in a single file, rather than4-5 seperate EXTRA.css files.

    By the way. If anyone knows of an easy way to have multiple nodes have the same icon, I'm all ears.

    Thanks :)

  2. bambua

    bambua Well-Known Member

    It's almost like a PARENTEXTRA.css file or something would be worthwhile that is only in the parent but also doesn't get wiped out by upgrades.
  3. SchmitzIT

    SchmitzIT Well-Known Member

    Exactly. Leaving the EXTRA.css for the stuff specific to the style.
  4. Brogan

    Brogan XenForo Moderator Staff Member

    Create an EXTRA2.css (or whatever you want to call it, one for each style) and include that in EXTRA.css.

    Make sure you include it at the end, so the additional css in EXTRA2.css comes after the original css in EXTRA.css.

    Then add just the changed css to EXTRA2.css.
  5. SchmitzIT

    SchmitzIT Well-Known Member

    Would I do this in the parent styles or the child styles?

    And would I just use a:

    <xen:require css="Extra2.css" />
    to accomplish this?
  6. Brogan

    Brogan XenForo Moderator Staff Member

    In the parent style create all the additional templates, one for each child style.

    In the parent style, do the include in EXTRA.css for all of the additional templates.

    Revert EXTRA.css in each child style, to ensure they inherit it from the parent.

    In each child style add the css to its relevant template, EXTRA2.css for child style 1, EXTRA3.css for child style 2, etc.

    Yes, that is how to include a css template.
  7. SchmitzIT

    SchmitzIT Well-Known Member

    I didn't manage to get this working. I tried creating the new css template both in the master style, and included it in the default EXTRA.css style. That didn't work, so I removed the template from the master style, and created it in default, and then had it required in EXTRA.css, but again, to no avail.

    It did work when I directly pasted the node icons css into EXTRA.css though.

    Oh well, was worth a shot :) Thanks anyway.
  8. Brogan

    Brogan XenForo Moderator Staff Member

    That's the same system I use for my two styles, one parent and one child, so I'm surprised it's not working.
  9. SchmitzIT

    SchmitzIT Well-Known Member

    Would I have to do anything in the style properties, maybe? It seemed as if the include just was not picked up properly, as the styles kept showing the default behaviour (the sprite icons).
  10. Brogan

    Brogan XenForo Moderator Staff Member

    Well I use EXTRA.css for my node icons, so I know it works for those.
  11. SchmitzIT

    SchmitzIT Well-Known Member

    Yeah, that's why I'm consufed about the whole thing. Even if the rest of my EXTRA.css is empty, and only the include is in there, it still doesn't recognize the icons. And I do have the !important addition in the new file.

Share This Page