Textpattern CMS support forum

You are not logged in. Register | Login | Help

#1 2013-03-22 15:10:45

gaekwad
Admin
From: People's Republic of Cornwall
Registered: 2005-11-19
Posts: 2,510

[SOLVED] Styling <txp:comment_preview /> and <txp:comment_submit />

G’day.
Is there a straightforward way to style comment_preview and comment_submit buttons? There are no inbuilt attributes in 4.5.4, according to the wiki pages linked above. The buttons have a class of button defined by default, so I can style that in CSS, but it’d be nice to be able to bind it to a pre-defined style I’m already using in CSS without having to duplicate.

As ever, I’m grateful for any pointers or advice.

Thank you in advance.

Edit: fixed typo.

Last edited by gaekwad (2013-03-23 13:53:58)

Offline

#2 2013-03-23 02:08:26

phiw13
Plugin Author
From: Japan
Registered: 2004-02-27
Posts: 1,677
Website

Re: [SOLVED] Styling <txp:comment_preview /> and <txp:comment_submit />

Both buttons have an ID in addition to the class you mention.
The Preview button has #txpCommentPreview, the Submit button has #txpCommentSubmit.

Offline

#3 2013-03-23 10:36:36

gaekwad
Admin
From: People's Republic of Cornwall
Registered: 2005-11-19
Posts: 2,510

Re: [SOLVED] Styling <txp:comment_preview /> and <txp:comment_submit />

Hi Philippe – that’s the method I’m using now, actually.

Offline

#4 2013-03-23 11:14:20

philwareham
Core designer
From: Farnham, Surrey, UK
Registered: 2009-06-11
Posts: 3,196
Website

Re: [SOLVED] Styling <txp:comment_preview /> and <txp:comment_submit />

Confused. So what’s the issue then?

Offline

#5 2013-03-23 11:54:37

phiw13
Plugin Author
From: Japan
Registered: 2004-02-27
Posts: 1,677
Website

Re: [SOLVED] Styling <txp:comment_preview /> and <txp:comment_submit />

philwareham wrote:

Confused.

Me too…
You could use input[type="submit"] {} and/or input[type="submit"][disabled] {}

Offline

#6 2013-03-23 12:28:39

gaekwad
Admin
From: People's Republic of Cornwall
Registered: 2005-11-19
Posts: 2,510

Re: [SOLVED] Styling <txp:comment_preview /> and <txp:comment_submit />

philwareham wrote:

Confused. So what’s the issue then?

Not a problem, I’d just like to be able to choose the style/id of the button and have it inherit a pre-defined CSS style, rather than bulk up the CSS with extra styles.

The example I have in mind is for Gumby buttons – they do a great job of defining the button styles, and if I’m maintaining extra CSS stubs to duplicate that look, it’s unnecessary overhead. Something like <txp:comment_submit class="medium secondary btn" /> (and I haven’t tested if this works with button as well as div yet) is what I was thinking of.

Offline

#7 2013-03-23 12:56:42

philwareham
Core designer
From: Farnham, Surrey, UK
Registered: 2009-06-11
Posts: 3,196
Website

Re: [SOLVED] Styling <txp:comment_preview /> and <txp:comment_submit />

gaekwad wrote:

Gumby buttons – they do a great job of defining the button styles

I’m not sure the Gumby code:

<div class="medium primary btn"><a href="#">Primary</a></div>

and:

<div class="medium default btn"><input type="submit" value="Submit" /></div>

…are a great way of defining buttons.

A much better way of coding this is:

<a href="#" role="button" class="medium primary">Primary</a>

and:

<input type="submit" class="medium" value="Submit">

Then use the following CSS for example:

[role="button"],
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    ...your button CSS here...
}

One could argue you don’t need the medium classname either – just the small and large would suffice and leave medium as the default size.

Offline

#8 2013-03-23 13:00:30

gaekwad
Admin
From: People's Republic of Cornwall
Registered: 2005-11-19
Posts: 2,510

Re: [SOLVED] Styling <txp:comment_preview /> and <txp:comment_submit />

Phil, thank you very much – that feedback is very useful and I’m grateful for your input.

Offline

#9 2013-03-23 13:44:37

etc
Developer
Registered: 2010-11-11
Posts: 3,201
Website

Re: [SOLVED] Styling <txp:comment_preview /> and <txp:comment_submit />

gaekwad wrote:

Is there a straightforward way to style comment_preview and comment_submit buttons? There are no inbuilt attributes in 4.5.4, according to the wiki pages linked above.

Did I mention that etc_query can set any attribute of any tag?

<txp:etc_query data='<txp:comment_preview />'
	replace="*@@class=any class you wish" />

etc_[ query | search | pagination | date | tree | cache ]

Offline

#10 2013-03-23 13:53:28

gaekwad
Admin
From: People's Republic of Cornwall
Registered: 2005-11-19
Posts: 2,510

Re: [SOLVED] Styling <txp:comment_preview /> and <txp:comment_submit />

etc wrote:

Did I mention that etc_query can set any attribute of any tag?

!http://i0.kym-cdn.com/photos/images/original/000/117/814/are-you-wizard.jpg!

Offline

Board footer

Powered by FluxBB