Gossamer Forum
Home : Products : Gossamer Links : Discussions :

CSS .error vs .message

Quote Reply
CSS .error vs .message
In the luna_core.css file there are style classes for .error and .message.
I see the style for .error when submitting a form with missing required data.
i.e. "Column Title cannot be left blank." This correctly displays in a red box.
Where does the style for .message appear?

I ask because I would like .error(s) to be in a Red box, and .message(s) to be
in a Green box. I do not know what to do to involk a .message for testing the css.

Also, I am ultimately wanting the message that states:
"You have been successfully logged out." (and some others) to be in a green box.
Successful logout is currently displaying in a Red box.
This should be a message, not an error.

So really I want to know, is... How do I turn what GT is determining as errors
to instead be determined as messages, so that the css will display the
appropriately colored box?


Code:
#contentheader .error, #contentheader .message {
margin: 0px 200px 0px 0px;
padding: 2px;
border: 1px solid #ffffff;
color: #ffffff;
font-size: 12px;
text-align: center;
}
#contentheader .error {
background: #8c3030;
}
#contentheader .message {
background: #3a5841;
}
#contentheader .error *, #contentheader .message * {
margin: 0px;
padding: 0px;
}



Thanks for any assistance.

Chris
RGB World, Inc. - Software & Web Development.
rgbworld.com

Last edited by:

rgbworld: Apr 9, 2006, 1:29 AM
Quote Reply
Re: [rgbworld] CSS .error vs .message In reply to
Well, I managed to find a .message...
After signing up for the newsletter, the templates receive the following .message:
"You have successfully subscribed to the Newsletter."

This is correctly displaying in a Green box, so to re-ask my question...
Why do ".message"(s) such as "You have been successfully logged out."
appear as .errors and not .message(s)?

And is there any way to correct the anomoly? ( I am sure I didn't spell that correctly) <g>

Thanks again,
Chris
RGB World, Inc. - Software &amp; Web Development.
rgbworld.com
Quote Reply
Re: [rgbworld] CSS .error vs .message In reply to
That's a backwards compatibility issue, that we couldn't change or users who used the old templates wouldn't get a message after they logged out.

However, I took another look at it, and one way we can fix it is to change login.html and add the following to the top of the file:
Code:
<%~if logout and error%>
<%~set message = $error%>
<%~set error = ''%>
<%~endif%>

Since when we logout, the only possible error is the successful logout 'error', we can just change the error to be a message instead.

Adrian
Quote Reply
Re: [brewt] CSS .error vs .message In reply to
Perfect solution Brewt! Thank you.

I have also fixed a few instances of static text on login forms into an actual
message or an error so that they display in the nice css error/message boxes.

In login.html I added the following code, which turns "You have been successfully logged out."
into a message so it displays in a green box, and "You must first login before you can access that."
into an error so it displays in a red box. I then deleted "You must first login before you can access that."
from the content of the form.
Code:
<%~if logout and error%>
<%~set message = $error%>
<%~set error = ''%>
<%~endif%>

<%if url%>
<%~set error = 'You must first login before you can access that.'%>
<%endif%>


I added this to the top of login_success.html and removed the identical text from the form.
It puts the successful login message into the green css message box.
Code:
<%~set message = "You have been successfully logged into $site_title"%>

This could and probably should be done in other places like signup.html and signup_success.html.
It would be nice to have a consistant interface wrt to messages and errors. Feedback?

Too cool! I am planning on using 'warning' and 'note' icons in the boxes
now that this seems to be all straightened out.

One kinda long question.... REAL errors seem to go through error.html
Displaying the error "Oops, we had the following problem".

Is it possible do you think to use 1 of 3 icons to represent messages/form_errors/system_errors
into messages/warnings/errors? With respective icons of note/caution/stop?

Is it safe to distinguish form_errors as caution, and errors in error.html as error (stop)?

Thanks again Brewt!
You can see these 'live' at the dev site I pm'd you.
Chris
RGB World, Inc. - Software &amp; Web Development.
rgbworld.com

Last edited by:

rgbworld: Apr 10, 2006, 5:59 PM
Quote Reply
Re: [rgbworld] CSS .error vs .message In reply to
In Reply To:
In login.html I added the following code, which turns "You have been successfully logged out." into a message so it displays in a green box, and "You must first login before you can access that." into an error so it displays in a red box. I then deleted "You must first login before you can access that." from the content of the form.
Thanks, I changed that one. However, it should be <%if url and not error%>, or they won't see the proper error from getting their username/password wrong.

In Reply To:
I added this to the top of login_success.html and removed the identical text from the form.
It puts the successful login message into the green css message box.
I'm not going to change that one because without any content on that page, the page looks very strange.

In Reply To:
Is it possible do you think to use 1 of 3 icons to represent messages/form_errors/system_errors into messages/warnings/errors? With respective icons of note/caution/stop?

Is it safe to distinguish form_errors as caution, and errors in error.html as error (stop)?
I did a quick grep and it looks like any time they get sent to error.html, it's a fatal (ie. can't go any further) kind of error. If they can do something to fix the problem, they'll get sent back to whatever page they were at.

Adrian
Quote Reply
Re: [brewt] CSS .error vs .message In reply to
In Reply To:
I'm not going to change that one because without any content on that page, the page looks very strange.[/quote]


In login_success.html I have added the following snippets:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%~set message = "Welcome back $Name"%> <%-- Core LUNA Mod --%>

...

<h2>Logged In</h2>

<p>
You have successfully logged into <%site_title%> as '<%Username%>'.
</p>



I think it is ok to say Welcome 'back' because signup success goes to a different template.

I have a couple more core edits along the same line, but I am going to put it in another reply.

Chris
RGB World, Inc. - Software &amp; Web Development.
rgbworld.com

Last edited by:

rgbworld: Apr 11, 2006, 6:32 PM
Quote Reply
Re: [rgbworld] CSS .error vs .message In reply to
The other edits I made to the core luna template set are as follows.
Edits were made to 4 files: login.html, login_success.html, signup_success.html, error.html.
We have already covered login and login_sucess. So...

In signup_success.html (on less lines)... <g>
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%~if Validation%>
<%~set message = "Registration recieved successfully."%>
<%~else%>
<%~set message = "You have successfully registered."%>
<%~endif%>

...

<p>
<%~if Validation%>
Thanks for signing up, an e-mail has been sent to you with a
validation code. Once you receive it, you'll need to enter a <a
href="<%config.db_cgi_url%>/user.cgi?validate=1">validation
code</a>
<%~else%>
You are now logged into <%site_title%> as '<%Username%>'.
<%~endif%>
</p>
signup_success message is now consistant with login_success message in previous post.

in error.html. Deleted the entire <p>"Oops"</p> from the content and added...
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%set error_message = $error~%>
<%set error = 'Oops, we had the following problem:'~%>

...

<p class="errormessage">
Error: <%error_message%>
</p>

Now that the errors/messages are cleaned-up a bit, it would be really cool to have a better
place to display them.

For a great example of where the errors/messages (and banner ads) look best IMHO, Please
visit my other post or log into that dev site. It is finished as far as placement of errors/banner ads:
http://www.gossamer-threads.com/...i?post=290641#290641

Thank you,
Chris
RGB World, Inc. - Software &amp; Web Development.
rgbworld.com
Quote Reply
Re: [brewt] CSS .error vs .message In reply to
How do I change the background-color of the "error-message" and the "info-message" ?
The CSS within luna.css does not work:

Also, how do I change the TEXT itself ? The text is not listed within "User-Language".


.errormessage {
background: #EE1C25;
color: #FFFFFF;
font-weight: bold;
}
.infomessage {
background: #99CC33;
color: #FFFFFF;
font-weight: bold;
}



Many thanks,

Erich

Last edited by:

erichcyber: Apr 20, 2009, 1:15 PM
Quote Reply
Re: [erichcyber] CSS .error vs .message In reply to
I think what you're looking for is the CSS rules:

#contentheader .error

and

#contentheader .message

Adrian