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

XF 1.5 Add Buttons for Control Bar Links

Discussion in 'Styling and Customization Questions' started by Amaury, Nov 15, 2015.

  1. Amaury

    Amaury Well-Known Member

    How easy would it be to turn the control bar links into buttons, using the @button styling?

    Buttons 1.PNG

    Buttons 2.PNG
     
  2. Russ

    Russ Well-Known Member

    You could just add your own styling to it easy enough.

    Code:
    .messageMeta .item {
    background-color: #f0f7fc;
    border: 1px solid #d7edfc;
    border-radius: 3px;
    padding: 4px 6px;
    }
    
    Probably require a few adjustment but it would get you started.

    Screenshot_5.png
    (I know this isn't the button css but you can apply your own :D )
     
    Amaury likes this.
  3. Amaury

    Amaury Well-Known Member

    @Russ

    Code:
    .messageMeta .item {
        color: @secondaryDarker;
        background-color: @secondaryMedium;
        border: 1px solid @secondaryLight;
        border-radius: 5px;
        padding: 5px;
    }
    
    .messageMeta .item:hover {
        color: @secondaryDarker;
        background-color: @inlineMod;
    }
    
    .messageMeta .item:active {
        background-color: @secondaryMedium;
    }
    Buttons.PNG

    Only had problems getting an exact padding match with SPs > Buttons > Button (0px for the top, 6px for the right, 0px for the bottom, and 6px for the left), so I just used 5px padding. :)
     

Share This Page