Textpattern Forum

You are not logged in. Register | Login | Help

#11 2009-09-28 15:36:15

Els
Admin
From: The Netherlands
Registered: 2004-06-06
Posts: 7,390
Website

Re: [wiki] Tutorials page: layout & scope

Much better indeed, thanks for finding this Uli!


<txp:Els /> ;)
Tag Reference | Unexpected behaviour? Check the tag trace | Still no clue? Check the names of your custom fields

Offline

#12 2009-10-02 20:53:19

nabrown78
Moderator
From: Boston, MA, USA
Registered: 2006-10-04
Posts: 289
Website

Re: [wiki] Tutorials page: layout & scope

Visually, the page layout in three columns is a mess: even at a small-ish font size, one sees this:

Agreed. Looking at the source, it seems the three columns arise from a three-cell table row, so I don’t know what can be done about this unless the underlying markup is changed. Hmm, yeah there’s not much that can be done just with CSS if the content is output into a table, right?

I think it would be better to create a new page with a hand-maintained list

So is this the only way around the automatic generation of an alphabetically organized, three-column list?

Offline

#13 2009-10-02 21:32:16

jsoo
Developer
From: NC, USA
Registered: 2004-11-15
Posts: 1,730
Website

Re: [wiki] Tutorials page: layout & scope

nabrown78 wrote:

Hmm, yeah there’s not much that can be done just with CSS if the content is output into a table, right?

I haven’t tried this, but you can certainly set the display property of a table cell to something other than “table-cell”. How well browsers support this I don’t know.


Txp tags not doing what you expect? Learn to use a tag trace. And the Tag Reference.

Offline

#14 2009-10-02 22:12:51

nabrown78
Moderator
From: Boston, MA, USA
Registered: 2006-10-04
Posts: 289
Website

Re: [wiki] Tutorials page: layout & scope

Excellent point. IE doesn’t behave (the display is unchanged, so it doesn’t make it any worse), but Safari and Firefox get it right:

http://www.norabrowndesign.com/testLayouts/table-display-exp.html

The CSS:

table{width:100%}
td{display:block;}

Offline

#15 2009-10-02 22:23:05

jsoo
Developer
From: NC, USA
Registered: 2004-11-15
Posts: 1,730
Website

Re: [wiki] Tutorials page: layout & scope

Very good. If not feasible to get different HTML output for this page, if you can target this page only with CSS you could clean it up considerably. Things that occur to me:

div#mw-subcategories h3 { display: none; }
div#mw-subcategories li { list-style-type: none; }
div#mw-pages td { display: block; }

plus whatever manipulation of the ul/il would get the subcategories to appear as though they were a single unit.


Txp tags not doing what you expect? Learn to use a tag trace. And the Tag Reference.

Offline

#16 2009-10-02 22:34:08

nabrown78
Moderator
From: Boston, MA, USA
Registered: 2006-10-04
Posts: 289
Website

Re: [wiki] Tutorials page: layout & scope

Yes.

The letters (h3’s) are disruptive and irrelevant.
If it were up to me I would eliminate the list bullets on all category listings.

So – on the body tag of the Orientation Category page, for example we have:

class="mediawiki ns-14 ltr page-Category_Orientation"

I looked up the ns-14 class and it seems to refer to the namespace of the page, which in this case is Category. Unless we want to apply the above styles to all Category pages (and I suppose we don’t since the Tag Reference is such a page) then we’re stuck (I think) applying the styles specifically to page-Category_Orientation, page-Category_Installation, etc. Not too big of a deal, since there won’t be too many top-level categories, yeah?

So now my only question is, who has the power to mess with the css?

Offline

#17 2009-10-02 22:51:27

Els
Admin
From: The Netherlands
Registered: 2004-06-06
Posts: 7,390
Website

Re: [wiki] Tutorials page: layout & scope

jsoo wrote:

If not feasible to get different HTML output for this page

At first sight it looks quite fixed, other wikis show exactly the same markup. Anyway, I don’t think we should apply any major changes at the moment, when the .com site redesign is in effect Textbook will have to follow and we don’t know to what extent the CSS will need to be rewritten then.

But if a few additions to the CSS will make such a difference for the category pages, I’d say go for it!

nabrown78 wrote:

Unless we want to apply the above styles to all Category pages (and I suppose we don’t since the Tag Reference is such a page) then we’re stuck (I think) applying the styles specifically to page-Category_Orientation, page-Category_Installation, etc. Not too big of a deal, since there won’t be too many top-level categories, yeah?

Or apply it to all category pages and exclude the Tag Reference, would that be possible?

So now my only question is, who has the power to mess with the css?

I think you have :)


<txp:Els /> ;)
Tag Reference | Unexpected behaviour? Check the tag trace | Still no clue? Check the names of your custom fields

Offline

#18 2009-10-02 22:52:42

nabrown78
Moderator
From: Boston, MA, USA
Registered: 2006-10-04
Posts: 289
Website

Re: [wiki] Tutorials page: layout & scope

Hey how come pages like this are structured so differently? Is there some way we could change the Tutorials page to this type of page? It doesn’t appear to use tables at all…

Offline

#19 2009-10-02 22:54:37

Els
Admin
From: The Netherlands
Registered: 2004-06-06
Posts: 7,390
Website

Re: [wiki] Tutorials page: layout & scope

That’s a page template, not a category. It’s done manually, looking much better but not so desirable in my opinion because it won’t be updated automatically.

Last edited by Els (2009-10-02 22:56:49)


<txp:Els /> ;)
Tag Reference | Unexpected behaviour? Check the tag trace | Still no clue? Check the names of your custom fields

Offline

#20 2009-10-02 23:07:12

nabrown78
Moderator
From: Boston, MA, USA
Registered: 2006-10-04
Posts: 289
Website

Re: [wiki] Tutorials page: layout & scope

So I found this in the wiki help docs:

Because of the customized nature of the TextBook skin, it’s not possible to effectively edit the CSS from any wiki page. The skin is (or will be soon if not already) defined by several CSS files that cascade together. Thus only TextBook admins can edit the presentation layer of TextBook, via the back-end.

There are various help docs brewing under the Presentation section of the help:Contents that aim to provide wiki users with a set of CSS rules to easily make their content consistent and beautiful. If you have suggestions for additional styling, let the admins know in the TextBook forum.

Yet for the life of me I can’t figure out where one can access the CSS to edit it.

That’s a page template, not a category. It’s done manually, looking much better but not so desirable in my opinion because it won’t be updated automatically.

That’s what I thought, but when you click “Edit” you see {{Installation index}} instead of a manually-entered list of links as I expected. I don’t really get how that’s working, especially with the external links that are in the list.

Offline

Board footer

Powered by FluxBB