Login Form/Register Form widht - by Gry4you

This topic has 10 replies, 3 voices, and was last updated 6 years, 8 months ago ago by Rose Tyler

  • Avatar: Gry4you
    Gry4you
    Participant
    February 7, 2018 at 15:20

    Hi,

    1. I would like to change width of.form-row and .input-text on form.login input and form.register input (Login and register page/my account).

    In wp-content/plugins/woocommerce/templates/myaccount/form-login.php plugin I found the possibility to add a border to register form, when I change <div class=”u-column2 col-2″> to <div class=”u-column2 col-1″>.

    I coudn’t find the possibility of changing width of.form-row unfortunately. I would like to change width of register row, like name, email, passwd etc. and social login form.
    https://gry4you.com/wp-content/uploads/2018/02/login_form1.jpg

    2. How to change border color and line width to 3px or 4px?

    3. It is possible to change login and register form for a bit nicely?

    Regards
    Damian

    9 Answers
    Avatar: Gry4you
    Gry4you
    Participant
    February 7, 2018 at 15:29

    Hi,

    I used this code:
    .woocommerce-account .woocommerce .u-columns form.register input {
    max-width: 85%;
    }

    and it’s working:)
    Row width – problem solved!

    Avatar: Gry4you
    Gry4you
    Participant
    February 8, 2018 at 12:22

    Hi,
    Ok, problem solved!

    I used this code:
    @media only screen and (min-width: 768px) {
    .col2-set#customer_login .col-1,
    .col2-set#customer_login .col-2 {
    float: left !important;
    width: 47% !important;
    margin-right: 0 !important;
    margin-left: 35px !important; /* optional */
    border-color: #0b1fba !important;
    }
    .col2-set#customer_login .col-1 {
    margin-right: 2% !important;
    }
    .col2-set#customer_login {
    width: 100% !important;;
    float: none !important;;
    }
    }

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    February 8, 2018 at 17:37

    Hello,

    Do you need any other assistance from our side?

    Regards

    Avatar: Gry4you
    Gry4you
    Participant
    February 8, 2018 at 18:09

    Hi,

    Yes, I would like to change color of apply-coupon-button and update-cart-button on woocommerce cart.

    I used the code, but it didn’t work:
    .apply_coupon .button, .update_cart .button input[type=”submit”] {
    background-color: #0b1fba !important;
    color: #ffffff;
    border-color: #0b1fba !important;
    }

    .apply-coupon .button:hover, .update-cart .button:hover {
    background-color: #000000 !important;
    color: #ffffff;
    border-color: #000000 !important;
    }

    When I used the code, that worked only on the apply-coupon-button

    input[type=”submit”] {
    background-color: #0b1fba !important;
    color: #ffffff;
    border-color: #0b1fba !important;
    }

    input[type=”submit”]:hover {
    background-color: #000000 !important;
    color: #ffffff;
    border-color: #000000 !important;
    }
    I don’t understand what is wrong. Update-cart-button doesn’t work.

    PS. I have polish translation files for XStore 4.18 (100% tranlated)!

    If want to receive it, let me know by e-mail: d.safonow@gry4you.com
    https://www.8theme.com/topic/xstore-translation-files/page/6/#post-184495

    Regards
    Damian

    Avatar: Olga Barlow
    Olga Barlow
    Support staff
    February 8, 2018 at 18:29

    Hello,

    Try this code to change the Update Cart button

    .woocommerce-cart-form button.btn.gray {
        background-color: red;
        color: white;
    }
    .woocommerce-cart-form button.btn.gray:hover {
        background-color: white;
        color: red;
    }

    Try this code to change coupon button

    .checkout_coupon .coupon .btn {
        background-color: red;
        color: white;
    }
    .checkout_coupon .coupon .btn:hover {
        background-color: white;
        color: red;
    }
    

    We have sent you email for the translation. Thank you!

    Regards

    Avatar: Gry4you
    Gry4you
    Participant
    February 9, 2018 at 11:32

    Hi Olga,

    Thank you very much. It;s working:)

    I have one more question!

    How to reduce the distance from the header and footer on page 404?
    https://gry4you.com/wp-content/uploads/2018/02/page_404_ver1.jpg

    Between the image and header or footer is 150px on page 404.

    Regards
    Damian

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    February 9, 2018 at 12:01

    Hello,

    .page-404 {
        margin-top: 5%;
        margin-bottom: 5%;
    }
    

    Regards

    Avatar: Gry4you
    Gry4you
    Participant
    February 9, 2018 at 13:26

    Hi,

    Perfect Rose. Thank you:)

    Regards
    Damian

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    February 9, 2018 at 13:28

    Hello,

    You’re welcome!

    Regards

  • Viewing 10 results - 1 through 10 (of 10 total)

The issue related to '‘Login Form/Register Form widht’' has been successfully resolved, and the topic is now closed for further responses

8theme customization service
We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.