1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Adding a glow to text fields

Discussion in 'XenForo Questions and Support' started by toodlez, Nov 8, 2011.

  1. toodlez

    toodlez Active Member

    Hey, I was curious, is there a way to add a light glow to the text input fields on the registration / login section?

    Just like it is on twitter?

    Thanks!
     
  2. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    I don't tweeter. :(

    Got a picture?
     
  3. toodlez

    toodlez Active Member

    :)
    here ya go, buddy

    Screen shot 2011-11-08 at 7.10.06 PM.png
     
  4. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    Admin CP -> Appearance -> Templates -> EXTRA.css

    Add this:

    Code:
    .textCtrl
    {
    	box-shadow: 0px 0px 5px #FFFFFF;
    }
    
     
  5. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    Oh. If you want it to only affect the login / register area then use this:

    Code:
    #login .textCtrl
    {
    	box-shadow: 0px 0px 5px #FFFFFF;
    }
    
     
  6. toodlez

    toodlez Active Member

    What if I want it only to display on overlays?
    I have my login and registration on an overlay now :)
     
  7. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    Code:
    .xenOverlay .textCtrl
    {
    	box-shadow: 0px 0px 5px #FFFFFF;
    }
    
     
  8. toodlez

    toodlez Active Member

    ahh i put the hashtag in front of xenoverlay instead of the period
    explains it!
     
  9. toodlez

    toodlez Active Member

    Jake do you know what the image is for the background of the "Search" bar when you are in the active state? It has the gradient going downward rather than upwards like most standard gradients
     
  10. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    Admin CP -> Appearance -> Style Properties -> Forms -> Text Control, Focused State
     
  11. toodlez

    toodlez Active Member

    I put that background into my background on Form-Type Overlays > Text Control, Focused State and it didn't change anything, strange
     
  12. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    Forms, not Form-Type Overlays.
     
  13. toodlez

    toodlez Active Member

    Yeah I meant I copied the image from the Forms one (which should be the background image on the search bar) and put it into my Form-Type Overlay > Focused State and the background isn't showing

    I'm trying to get that gradient into my login / sign up active states on my overlay
     
  14. toodlez

    toodlez Active Member

    If I input this one:
    @imagePath/xenforo/gradients/form-button-white-25px.png

    It works, but the actual one I want is
    @imagePath/xenforo/gradients/form-element-focus-25.png
     
  15. toodlez

    toodlez Active Member

    I guess if all else fails I can just save that image in a vertical flipped version :X
     
  16. Jake Bunce

    Jake Bunce XenForo Moderator Staff Member

    I am guessing the form in question is not using the formOverlay class which would explain why those changes are not affecting the text fields.

    Look at this template for an example of an overlay that uses the formOverlay class:

    Admin CP -> Appearance -> Templates -> contact
     

Share This Page