Thanks again, all working 🙂
Apply styles to only certain pages
-
Hey @psychobunny,
Is there a way to only apply less or css styles to certain routes without including the route to the css in the template?
Thanks.
-
Without hacking things in (ex. adding/removing styles via JS) the answer is no. As you mentioned, we do include the route in the container div to help you style - ex. this page should have a
<div class="topic">container.Is there a reason why you need this as opposed to using your own custom class as a container?
-
Yeah, I want to apply style to the
body,htmland#contenttags, but I guess I'll just have to do that within the template
-
But only for one specific route?
You could listen for
action:ajaxify.contentLoaded(this is after content is parsed but before it fades in) and if it matches your route then add a class tobody. If it does not match, remove that class.Then style:
body.myclass { style #content { style } } -
I'll just include those specific styles in the template, and the rest in
lessOn Mon, Mar 2, 2015 at 8:57 PM, [email protected] wrote:
Hello pitaj,
psychobunny has posted a reply to: Apply styles to only certain pages:
But only for one specific route?
You could listen for action:ajaxify.contentLoaded (this is after content
is parsed but before it fades in) and if it matches your route then add a
class to body. If it does not match, remove that class.Then style:
body.myclass {
style
#content {
style
}
}Thanks!
NodeBBThis post notification was sent to you due to your subscription settings. Click
here to alter those settings
http://mandrillapp.com/track/click/30149961/community.nodebb.org?p=eyJzIjoiUGpGaDBKdHlCZkZjdVVRSGFxNUZvaTNVT3Y0IiwidiI6MSwicCI6IntcInVcIjozMDE0OTk2MSxcInZcIjoxLFwidXJsXCI6XCJodHRwczpcXFwvXFxcL2NvbW11bml0eS5ub2RlYmIub3JnXFxcL3VzZXJcXFwvcGl0YWpcXFwvc2V0dGluZ3NcIixcImlkXCI6XCJiNjA2ZGNmMDVhZWI0ZGI2OGUyYmUzNjEyYTM3ZTVkZlwiLFwidXJsX2lkc1wiOltcIjNhN2E2MGUxYmRmNDZkNTIyZjA3YjM5ODlkOWI5NDE3YmY2YTA0ZWJcIl19In0. -
Would be nice to include the template name in the body with a unique template class name in the body.
<body class="nbb-templatename">or something like that. That would do wonders.
-
Whenever we navigate from page to page,
<body>doesn't change, just everything inside#content, so I'm think that would only work on cold loads... is that what you're going for?If so, you should look into adding it wherever you want as it is sent in via the API:
"template": { "name": "categories", "categories": true }So you can do both
<!-- IF template.categories -->and echoing it out somewhere if you want. -
Yeah I like this idea, we should update body or #content (likely the latter) with the template route
-
@julian @psychobunny putting the template route on the
htmlelement would cover everything. -
No, actually I wouldn't recommend adding it to the content as it requires a higher level for better customization such as body or even html so that you can totally customize it the way you want. For example, adding it to the
#contentwould be a bit more work to customize because it contains padding and marginal properties to go around.@julian Oh yeah, just noticed that. Good stuff.
@pitaj said putting the template route on the
htmlelement would cover everything.+1 for html or body (since they usually contain 0 padding and margins).
