WordPress.org
Get WordPress

Plugin Directory

Changeset 2739182


Ignore:
Timestamp:
06/08/2022 10:50:58 AM (4 years ago)
Author:
odpsolutions
Message:

fix ui issues

Location:
sky-systemz
Files:
2 edited

Legend:

Unmodified
Added
Removed

  • sky-systemz/tags/1.01/SkySystemz-woocommerceCheckout.php

    r2736505 r2739182  
    105105   
    106106
    107                 .payment-m-box{margin: 20px 0 0 0; width: 100%; background: #fff; border: #ecf1f7 10px solid; border-radius: 20px;}
    108                 .card-box-sec{width: 100%; margin: 0;}
     107                .payment-m-box{margin: 20px 0 0 0; padding:5px 2% !important; width: 91%; background: #fff; border: #ecf1f7 10px solid; border-radius: 20px;}
     108                .card-box-sec{width: 100%; margin:8px 0 0 0;}
    109109                .inp-fld small{display: block; font-size: 14px; font-weight: 500; color: #000000;   margin-bottom: 4px;}
    110110                .card-box-sec small{display: block; font-size: 14px; font-weight: 500; color: #000000;  margin-bottom: 4px;}
    … …  
    113113                .card-box-in .form-group {border-radius: 0; outline: 0;}
    114114                .card-box-in .card-no {margin: 0;}
    115                 .card-box-in .card-no input{border: 0; border-bottom: #dfe0e5 1px solid; background: #fff url(https://staging.skysystemz.com/assets/paymentpage/images/card-ico01.jpg); background-repeat: no-repeat; background-position: right 10px center; width: 96%; padding: 8px;}
     115                .card-box-in .card-no input{border: 0; border-bottom: #dfe0e5 1px solid; background: url(https://staging.skysystemz.com/assets/paymentpage/images/card-ico01.jpg); background-repeat: no-repeat; background-position: right 10px center; width: 96%; padding:8px 2%;}
    116116                #skysystemz_card_holder {
    117                     padding: 8px;
     117                    padding: 2%;
    118118                }
    119119                #skysystemz_card_holder:focus {
    120120                    outline: 0!important; box-shadow: none!important;
    121121                }
     122
     123                .woocommerce form .form-row select, .woocommerce-page form .form-row select {padding: 10px 1.1rem;}
    122124               
    123125                .card-logo{padding:10px 0;}
    124126                .card-box-in .card-no input:focus{border-bottom: #dfe0e5 1px solid; outline: 0!important; box-shadow: none!important;}
    125                 .card-box-in .month{border-right: #dfe0e5 1px solid; width: 32.5%!important; display: inline-block; margin: 0;  }
    126                 .card-box-in .month select{border: 0; border-right: #dfe0e5 1px solid; padding: 8px; background: #fff; width: 100%;}
    127                 .card-box-in .year{border-right: #dfe0e5 1px solid; width: 32.5%!important; display: inline-block; margin: 0; }
    128                 .card-box-in .year select{border: 0; border-right: #dfe0e5 1px solid; padding: 8px; background: #fff; width: 100%;}
     127                .card-box-in .month{border-right: #dfe0e5 1px solid; width: 32%!important; display: inline-block; margin: 0;  }
     128                // .card-box-in .month select{border: 0; border-right: #dfe0e5 1px solid; padding: 8px; background: #fff;  width: 100%;}
     129                .card-box-in .month select{border: 0; padding:8px 2%; background: #fff; width: 96%; color:#757575; }
     130
     131                .card-box-in .year{width: 32%!important; display: inline-block; margin: 0; }
     132                .card-box-in .year select{border: 0; border-right: #dfe0e5 1px solid; color:#757575; padding: 8px; background: #fff; width: 100%;}
    129133                .card-box-in .cvv{width: 32%!important; display: inline-block; margin: 0; padding-left: 0;}
    130                 .card-box-in .cvv input{border: 0; border-bottom: #dfe0e5 1px solid; padding: 8px;  background: #fff url(https://staging.skysystemz.com/assets/paymentpage/images/cvv.jpg); background-repeat: no-repeat; background-position: right 10px center; width: 87%;}
     134                .card-box-in .cvv input{border: 0; padding: 8px;  background: url(https://staging.skysystemz.com/assets/paymentpage/images/cvv.jpg); background-repeat: no-repeat; background-position: right 10px center; width: 87%;}
    131135                .card-box-in .cvv input:focus {
    132136                    outline: 0!important; box-shadow: none!important;
    … …  
    151155                    box-shadow: 0px 1px 2.88px 0.12px rgb(0 0 0 / 10%);
    152156                    margin-bottom: 10px;
    153                     width: 100%;
     157                    width: 96%;
    154158                }
    155159                #payment button, .woocommerce-input-wrapper button{
    … …  
    165169                .woocommerce .woocommerce-error, .woocommerce .woocommerce-info, .woocommerce .woocommerce-message{border-top-color: #2979ff !important;}
    166170               
    167                
    168                
     171                .woocommerce-page input[type=radio][name=payment_method]~.payment_box {
     172                    padding-left: 0;
     173                }
     174                .woocommerce-page form label {
     175                    font-weight:600;
     176                }
     177                @media screen and (max-width: 400px){
     178                .card-box-in .month{width:31.5% !important;}
     179                .woocommerce-page form .input-text {
     180                    padding: 8px !important;
     181                }
     182                }
    169183                </style>
    170184                    <div class="card-logo">
    … …  
    195209                        <label>Month:</label>
    196210                        <select id="'.$this->id.'_expdate_month" name="'.$this->id.'_expdate_month" style="width: 100%;">
    197                                 <option value="0">Enter month</option>
     211                                <option value="0">Month</option>
    198212                                <option value="01">(01) January</option>
    199213                                <option value="02">(02) February</option>
    … …  
    213227                        <label>Year:</label>
    214228                        <select id="'.$this->id.'_expdate_year" name="'.$this->id.'_expdate_year" style="width: 100%;">
    215                                 <option value="0">Enter year</option>';
     229                                <option value="0">Year</option>';
    216230                                foreach ($year as $key => $yr) {
    217231                                    $short = substr($yr, 2);

  • sky-systemz/trunk/SkySystemz-woocommerceCheckout.php

    r2736504 r2739182  
    105105   
    106106
    107                 .payment-m-box{margin: 20px 0 0 0; width: 100%; background: #fff; border: #ecf1f7 10px solid; border-radius: 20px;}
    108                 .card-box-sec{width: 100%; margin: 0;}
     107                .payment-m-box{margin: 20px 0 0 0; padding:5px 2% !important; width: 91%; background: #fff; border: #ecf1f7 10px solid; border-radius: 20px;}
     108                .card-box-sec{width: 100%; margin:8px 0 0 0;}
    109109                .inp-fld small{display: block; font-size: 14px; font-weight: 500; color: #000000;   margin-bottom: 4px;}
    110110                .card-box-sec small{display: block; font-size: 14px; font-weight: 500; color: #000000;  margin-bottom: 4px;}
    … …  
    113113                .card-box-in .form-group {border-radius: 0; outline: 0;}
    114114                .card-box-in .card-no {margin: 0;}
    115                 .card-box-in .card-no input{border: 0; border-bottom: #dfe0e5 1px solid; background: #fff url(https://staging.skysystemz.com/assets/paymentpage/images/card-ico01.jpg); background-repeat: no-repeat; background-position: right 10px center; width: 96%; padding: 8px;}
     115                .card-box-in .card-no input{border: 0; border-bottom: #dfe0e5 1px solid; background: url(https://staging.skysystemz.com/assets/paymentpage/images/card-ico01.jpg); background-repeat: no-repeat; background-position: right 10px center; width: 96%; padding:8px 2%;}
    116116                #skysystemz_card_holder {
    117                     padding: 8px;
     117                    padding: 2%;
    118118                }
    119119                #skysystemz_card_holder:focus {
    120120                    outline: 0!important; box-shadow: none!important;
    121121                }
     122
     123                .woocommerce form .form-row select, .woocommerce-page form .form-row select {padding: 10px 1.1rem;}
    122124               
    123125                .card-logo{padding:10px 0;}
    124126                .card-box-in .card-no input:focus{border-bottom: #dfe0e5 1px solid; outline: 0!important; box-shadow: none!important;}
    125                 .card-box-in .month{border-right: #dfe0e5 1px solid; width: 32.5%!important; display: inline-block; margin: 0;  }
    126                 .card-box-in .month select{border: 0; border-right: #dfe0e5 1px solid; padding: 8px; background: #fff; width: 100%;}
    127                 .card-box-in .year{border-right: #dfe0e5 1px solid; width: 32.5%!important; display: inline-block; margin: 0; }
    128                 .card-box-in .year select{border: 0; border-right: #dfe0e5 1px solid; padding: 8px; background: #fff; width: 100%;}
     127                .card-box-in .month{border-right: #dfe0e5 1px solid; width: 32%!important; display: inline-block; margin: 0;  }
     128                // .card-box-in .month select{border: 0; border-right: #dfe0e5 1px solid; padding: 8px; background: #fff;  width: 100%;}
     129                .card-box-in .month select{border: 0; padding:8px 2%; background: #fff; width: 96%; color:#757575; }
     130
     131                .card-box-in .year{width: 32%!important; display: inline-block; margin: 0; }
     132                .card-box-in .year select{border: 0; border-right: #dfe0e5 1px solid; color:#757575; padding: 8px; background: #fff; width: 100%;}
    129133                .card-box-in .cvv{width: 32%!important; display: inline-block; margin: 0; padding-left: 0;}
    130                 .card-box-in .cvv input{border: 0; border-bottom: #dfe0e5 1px solid; padding: 8px;  background: #fff url(https://staging.skysystemz.com/assets/paymentpage/images/cvv.jpg); background-repeat: no-repeat; background-position: right 10px center; width: 87%;}
     134                .card-box-in .cvv input{border: 0; padding: 8px;  background: url(https://staging.skysystemz.com/assets/paymentpage/images/cvv.jpg); background-repeat: no-repeat; background-position: right 10px center; width: 87%;}
    131135                .card-box-in .cvv input:focus {
    132136                    outline: 0!important; box-shadow: none!important;
    … …  
    151155                    box-shadow: 0px 1px 2.88px 0.12px rgb(0 0 0 / 10%);
    152156                    margin-bottom: 10px;
    153                     width: 100%;
     157                    width: 96%;
    154158                }
    155159                #payment button, .woocommerce-input-wrapper button{
    … …  
    165169                .woocommerce .woocommerce-error, .woocommerce .woocommerce-info, .woocommerce .woocommerce-message{border-top-color: #2979ff !important;}
    166170               
    167                
    168                
     171                .woocommerce-page input[type=radio][name=payment_method]~.payment_box {
     172                    padding-left: 0;
     173                }
     174                .woocommerce-page form label {
     175                    font-weight:600;
     176                }
     177                @media screen and (max-width: 400px){
     178                .card-box-in .month{width:31.5% !important;}
     179                .woocommerce-page form .input-text {
     180                    padding: 8px !important;
     181                }
     182                }
    169183                </style>
    170184                    <div class="card-logo">
    … …  
    195209                        <label>Month:</label>
    196210                        <select id="'.$this->id.'_expdate_month" name="'.$this->id.'_expdate_month" style="width: 100%;">
    197                                 <option value="0">Enter month</option>
     211                                <option value="0">Month</option>
    198212                                <option value="01">(01) January</option>
    199213                                <option value="02">(02) February</option>
    … …  
    213227                        <label>Year:</label>
    214228                        <select id="'.$this->id.'_expdate_year" name="'.$this->id.'_expdate_year" style="width: 100%;">
    215                                 <option value="0">Enter year</option>';
     229                                <option value="0">Year</option>';
    216230                                foreach ($year as $key => $yr) {
    217231                                    $short = substr($yr, 2);
Note: See TracChangeset for help on using the changeset viewer.