Invision Community 4: SEO, prepare for v5 and dormant account notifications Matt November 11, 2024Nov 11
Posted April 7, 201411 yr I can not believe there are only a dozen of CSS classes, to control the zillions of blocks and elements. Even worse, each group or type of page does not has its own css class. If you have ever used 'wordpress' you would know what I meant. wordpress has CSS built-in even for the tinest element in a document. And It's hell easy even for a beginner level web designer to customize the way they can., Only because extremely specific CSS classes. For instance, If I am viewing single post, (topic view in IPB, or article view in IP content, where I needed it most) wordpress would add .single css class to body element among others. Likewise to other type of different public view templates. There is no way you can style a different template or page without messing with the core files. I have little to no knowledge of XML, since I have pretty good understanding of HTML, I was able to pull this trick off where I could. But as a general rule, 'never ever be general with css'., be as much specific as you can. It would result in adding more classes and one time hard work. But it would save zillions of hours for many of us. Thanks for consideration.
April 7, 201411 yr Sorry but not sure I follow. IP.Content has its own css and can be changed as required If there is a same class in IP Content that is used in forum, blog, gallery etc then they can all be changed to be different by using the css file for that app (or adding your own css file for that app) Perhaps I am mis-reading your post ?
April 7, 201411 yr Sorry but not sure I follow. IP.Content has its own css and can be changed as required If there is a same class in IP Content that is used in forum, blog, gallery etc then they can all be changed to be different by using the css file for that app (or adding your own css file for that app) Perhaps I am mis-reading your post ? He's referring to class names in the HTML. Eg - having 'article' class added to the body tag within IP.Content articles or 'topic' in an IP.Board topic. Having the class names readily available within the HTML makes it easier for skinners to target specific areas of the template without having to go in and start tweaking stuff. The interactive elements within IP.Board 3 are generally awful for skinners and is something that I hope is addressed in IPS4. Just off the top of my head - - The open/close sidebar blocks on the homepage are controlled by inline CSS and have no targetable class names. - The collapsible sidebar is controlled with inline styles and again, adds no helpful class names. - Pretty much all elements that trigger a modal dialog don't have an 'active' class to indicate that the element is open. From what I've gathered by reading the IPS4 blogs, they have adopted a fairly strict approach towards the HTML/CSS framework. No inline styles etc.
April 7, 201411 yr Community Expert Management This is all resolved in IPS4 which is still in development. Inline styles are not allowed and the classname structure is much better. Here's an example of the body tag generated for the front end. <body class='ipsApp ipsApp_front ipsJS_none ipsClearfix' data-controller='core.front.core.app' data-message="" data-pageApp='forums' data-pageLocation='front' data-pageModule='forums' data-pageController='topic'>
April 7, 201411 yr This is all resolved in IPS4 which is still in development. Inline styles are not allowed and the classname structure is much better. Here's an example of the body tag generated for the front end. <body class='ipsApp ipsApp_front ipsJS_none ipsClearfix' data-controller='core.front.core.app' data-message="" data-pageApp='forums' data-pageLocation='front' data-pageModule='forums' data-pageController='topic'> Are you using Modernizr for feature detection (ipsJS_none) or is that something built in house ?
April 7, 201411 yr Something in-house as I recall, though I'll let Rikki confirm. Building on Matt's code example, you can target using the data attributes body[data-pageController="topic"] { ... }
April 7, 201411 yr Something in-house as I recall, though I'll let Rikki confirm. Building on Matt's code example, you can target using the data attributes body[data-pageController="topic"] { ... } Yep. The jquery equivalent works great as well and has better browser support: $('body').data('pageController');
April 7, 201411 yr Well, I'm looking forward to the improvements. I had a lot of issues with light/dark backgrounds because the smallText or whatever that class was had different backgrounds depending on the page. Niiiiiightmare.
April 8, 201411 yr Community Expert Management We would love for your detailed feedback once we hit the alpha/beta testing stages. Please speak up if you feel things can be improved.
April 8, 201411 yr My only concern is this in-house stuff you speak of. Care to point me in a direction where I can read up on this in-house things you guys are building.
April 8, 201411 yr My only concern is this in-house stuff you speak of. Care to point me in a direction where I can read up on this in-house things you guys are building. I don't understand why that is a concern for you. In house was used as a reference to their internal communication.
April 8, 201411 yr I don't understand why that is a concern for you. In house was used as a reference to their internal communication. I missunderstood what he's saying then - I thought inhouse meant their own code framework.
April 8, 201411 yr Are you asking about PHP or about the front end (javascript, CSS, etc.)? The PHP backend is almost entirely "in-house". We use a few libraries here and there, but the vast majority of code we wrote ourselves. The front end leverages some common third party libraries including, but not limited to: jQuery ClampJS Underscore While we may not be using Modernizr specifically (and that may or may not change before release depending on need), it's also not like we reinvented jQuery. :)
April 8, 201411 yr Are you asking about PHP or about the front end (javascript, CSS, etc.)? The PHP backend is almost entirely "in-house". We use a few libraries here and there, but the vast majority of code we wrote ourselves. The front end leverages some common third party libraries including, but not limited to: jQuery ClampJS Underscore While we may not be using Modernizr specifically (and that may or may not change before release depending on need), it's also not like we reinvented jQuery. :smile: Thanks that's what I wanted to know for the front end :-)
April 9, 201411 yr Author This is all resolved in IPS4 which is still in development. Inline styles are not allowed and the classname structure is much better. Here's an example of the body tag generated for the front end. <body class='ipsApp ipsApp_front ipsJS_none ipsClearfix' data-controller='core.front.core.app' data-message="" data-pageApp='forums' data-pageLocation='front' data-pageModule='forums' data-pageController='topic'> Exactly. :)
Archived
This topic is now archived and is closed to further replies.