Welcome to the Question2Answer Q&A. There's also a demo if you just want to try it out.

"Log in" button and place it next to it. Between "Log in" and "Facebook" button

0 votes
723 views
asked Jan 16, 2013 in Q2A Core by JulieG
edited Jan 16, 2013 by JulieG

 

Hi,
 
My wanting is to make a "Register" button on the top bar.
 
There's actually one, but I wanted to have in with the same design as "Log in" button and place it next to it. Between "Log in" and "Facebook" button.
 
Can you tell me how to make it ?
 
Thanks a lot
Q2A version: 1.5
commented Jan 16, 2013 by jatin.soni
meme means? sorry its not clear.
commented Jan 16, 2013 by JulieG
Sorry for my bad english. (google....) I just edit my first message ;)

1 Answer

+1 vote
answered Jan 16, 2013 by jatin.soni
selected Jan 17, 2013 by JulieG
 
Best answer

No problem.

To make regsiter button same as login button do following

--------[ To Style Register Button Same As Login  ]--------------------------------------------------

1. In qa-styles.css line no #196 (in default stylesheet) or find #qa-register,#qa-login

2. Add register class .qa-nav-user-register .qa-nav-user-link to the #qa-register,#qa-login so finally it should be like this #qa-register,#qa-login,.qa-nav-user-register .qa-nav-user-link

3. In that rule add !important to color:#fff so it will be color:#fff !important;

4. Now add hover and focus rule for register link on line #213 (in default stylesheet). Usually it should below to the point 2 rule or fine #qa-register:hover,#qa-register:focus, #qa-login:hover,#qa-login:focus

5. Add .qa-nav-user-register .qa-nav-user-link:hover,.qa-nav-user-register .qa-nav-user-link:focus to above rule so finally it should be #qa-register:hover,#qa-register:focus, #qa-login:hover,#qa-login:focus,.qa-nav-user-register .qa-nav-user-link:hover,.qa-nav-user-register .qa-nav-user-link:focus

6. In above rule add text-decoration:none; to remove underline from register link when hover

--------[ To Move Facebook Button ]----------------------------------------------------------------

To move facebook button after register, the most easiest way to to float right the facebook button. Use below

1. Find .qa-nav-user-item in qa-styles.css around line #353

2. Below that rule add new rule as below

.qa-nav-user-item.qa-nav-user-facebook-login{

float:right;
}

All done!

...