Please upgrade here. These earlier versions are no longer being updated and have security issues.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

Bootstrap theme popup close "X" is invisible

2»

Comments

  • peregrineperegrine MVP
    edited December 2014

    .

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • vrijvlindervrijvlinder Papillon-Sauvage MVP

    In Bootstrap there is no css targeting the span. From making so many themes I know these things. I saw that span was targeted before in the main style.css which still gets called even if the theme is something else. Otherwise you would need to clone the entire thing right ?

    Maybe there are other ways of doing it. This has worked for me time and time again.

  • peregrineperegrine MVP
    edited December 2014

    .

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • vrijvlindervrijvlinder Papillon-Sauvage MVP
    edited December 2014

    This is possibly why , but not the answer since the color is black line 12 in the style.css

    .close, .DismissMessage .Dismiss, a.Close, a.Delete, .token-input-delete-token {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .2;
    filter: alpha(opacity=20);
    }
    

    I don't have that code in the bootstrap theme I am testing this on. That comes from the main style sheet.

  • peregrineperegrine MVP
    edited December 2014

    I don't care what it is before or other rules or what color the signin popup x is.

    I am saying the rule

       a.close span{
        color:#000;  
        }
    

    will not change anything on the signing popup - because it is class Close (you can change color to something else to prove it to yourself, even if add important.

    because this is the "sign in" popup. The class is Close NOT close

         <a class="Close" href="#">
        <span>×</span>
        </a>
    

    my point is modifying this rule has absolutely no impact on the signin popup because the class is incorrect to apply to the sigin popup.

    lower case c.........................................................................

         a.close span{
        color:#000;  
        }
    

    However with a capital c in Close the rule will work and change the colors in the "signin" popup

    upper case C for Close will change signin popup.

    upper case C ....................................................

         a.Close span{
           color: black !important;
           background: red !important;
        }
    

    but lower case c for close will not affect signin popup.

    lower case c ............................................................

        a.close span{
           color: blue !important;
           background: green !important;
        }
    

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • vrijvlindervrijvlinder Papillon-Sauvage MVP

    In his custom_cosmo.css he has that .close it might be affecting from there

  • peregrineperegrine MVP
    edited December 2014

    giving up trying to explain, not important anyway.

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • intalikintalik New
    edited December 2014

    I fixed this recently.

    Just add the following to you bootstrap custom.css file:

    a.Close span{
    color: red !important;
    }
    

    Hope that helps!

    p.s. note that "a.Close" uses capital C. The above code results in a red X in your log in popup window.

  • peregrineperegrine MVP
    edited December 2014

    @intalik said:
    I fixed this recently.

    Just add the following to you bootstrap custom.css file:

    a.Close span{
    color: red !important;
    }
    

    Hope that helps!

    p.s. note that "a.Close" uses capital C. The above code results in a red X in your log in popup window.

    Amen.

    someone who understands what I said.

    exactly my point.

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • vrijvlindervrijvlinder Papillon-Sauvage MVP

    I am sure he used a.Close too. Or simply acted on the span. Would like to know for sure as well.

    I understood what you meant and have been searching the bootstrap files to understand what is happening.

    By change found why the pop up for sign in was not showing for someone else while using my plugin.

  • Anyway, this is solve then, thanks a lot for helping me.

Sign In or Register to comment.