Sign Up! Login: Password: New User? Forgot? Support
Code 
 
 
Forums 
Forums : Calendar & Events > Event Signup/Withdraw Button
Mottie (SuperAdmin) 10/25/2011 4:57 PM EST : Event Signup/Withdraw Button
ACK!
Mottie
Posts: 3884

0
Like

0
Dislike

Event Signup/Withdraw Button


This is a Mod
Control Panel > Site Mods > Get Site Mods >
Look for "Event Signup/Withdraw Button"


Make your Event Sign Up/Withdraw button more prominent.

All this mod does is adds a css class to the button, you can modify everything else!

Before
 
 After  

Customizable Code
<style>
a.signupButton {
  font-size: 20px;
  background: #131e2d;
  color: #ddd;
  border: #777 1px solid;
  line-height: 40px; /* font size + padding x 2 */
  padding: 10px;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
}
a.signupButton:hover {
  background: #294263;
  color: #fff;
}
</style>
  • The first css style block is to style the button in the non-hovered state.

    Adjust the font family & size as desired to make the button stand out more. Note that to keep the filter input which is directly below the button from overlapping, you'll need to adjust the "line-height" to include the font size and padding (10px from the top and bottom) which is why the line height is set to 40px.

    I was going to use some fancy css3 gradients ( get your own css3 gradient code here, just add the code from that page inside of the curly brackets {} ), but decided to make it short and sweet and try not to confuse anyone.

  • The second style block is for the same button but in the hovered state. Adjust, add or remove whatever settings you want 
Characters: Mottie Motty Mortie Ooshiny Mot Fudgems
TopBottom

 
 
Key 
New posts No new posts
New posts ( popular ) No new posts ( popular )
New posts ( sticky ) No new posts ( sticky )
New posts ( locked ) No new posts ( locked )
 
 
Who's Online 
There are   members online.
 
 
So-and-so has logged on!
%title%
%message%