diff --git a/css/cosmos.css b/css/cosmos.css index 28b98f2..a5eac61 100644 --- a/css/cosmos.css +++ b/css/cosmos.css @@ -3,7 +3,7 @@ * included in this file. */ /* Float four columns side by side */ - + .column { float: left; @@ -21,7 +21,7 @@ } /* Style the counter cards */ -.card { +.cosmos-card .card { /*box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);*/ padding: 16px; /*border-radius: 5px;*/ @@ -29,13 +29,16 @@ .timerCard { width: 540px; + max-width: 100%; margin: 0 auto; font-family: Poppins, sans-serif; z-index: auto; + margin-top: 10px; } .cosmos-card { width: 540px; + max-width: 100%; height: min-content; background-color: white; /*3*/ box-shadow: 0px 0px 4px #999; /*4*/ @@ -66,8 +69,6 @@ border-radius: 5px; background: #FFFFFF 0% 0% no-repeat padding-box; margin: 0 auto; - border-radius 5px; - opacity 1; overflow:hidden; } @@ -161,33 +162,33 @@ float:left; margin: 0 10px 0px; } -.cosmos-card-amount { +.cosmos-card .cosmos-card-amount { display: flex; justify-content: center; color: #3C3C3C; font-size: 1rem; font-weight: lighter; } -.btnText { +.cosmos-card .btnText { width: 20%; vertical-align: middle; /*display: inline-block;*/ } /* page */ -svg { +.cosmos-card svg { display:inline-flex; vertical-align: middle; } -.right { +.cosmos-card .right { text-align: end; position: relative; } -.input-wrapper { +.cosmos-card .input-wrapper { position: relative } -.input-wrapper:after { +.cosmos-card .input-wrapper:after { font-family: 'FontAwesome'; content: '\f24d'; position: absolute; @@ -196,18 +197,17 @@ svg { } -.box { - position: absolute; - width: 450px; +.cosmos-card .box { + margin-bottom: -2.2em; } -.box select { +.cosmos-card .box select { background-color: white; color: black; padding: 12px; width: 410px; + max-width: 100%; border: 2px solid #f3f3f3; - font-size: 20px; /*box-shadow: 0 5px 35px rgba(0, 0, 0, 0.2);*/ -webkit-appearance: button; appearance: button; @@ -215,7 +215,7 @@ svg { border-radius: 5px; } -.box select option { +.cosmos-card .box select option { background-repeat:no-repeat; background-position:bottom left; padding-left:30px; @@ -236,19 +236,20 @@ svg { pointer-events: none; } */ -.box:hover::before { +.cosmos-card .box:hover::before { color: black; background-color: rgba(255, 255, 255, 0.2); } -.box select option { +.cosmos-card .box select option { padding: 30px; } -.buttonSend { - border: none; +.cosmos-card .buttonSend { color: white; - padding: 10px 187px; + padding: 10px; + width: 410px; + max-width: 100%; text-align: center; text-decoration: none; display: inline-block; @@ -260,8 +261,7 @@ svg { border: 2px solid #3CC194; border-radius: 5px; } -.buttonRetry { - border: none; +.cosmos-card .buttonRetry { color: white; padding: 10px 180px; text-align: center; @@ -275,8 +275,7 @@ svg { border: 2px solid #3CC194; border-radius: 5px; } -.buttonCancel { - border: none; +.cosmos-card .buttonCancel { color: white; padding: 19px 100px; text-align: center; @@ -289,16 +288,40 @@ svg { color: black; border: 2px solid red; -} -.cancelTx { +} +.cosmos-card .cancelTx { border: none; padding: 10px; text-align: center; +} - -} +.cosmos-card #finalAmount, .cosmos-card h5 { + margin: 4px 0; +} +.cosmos-card p { + padding: 0; + margin: 0; + margin-bottom: 6px; + font-size: 1em; +} +#cosmos-footer-text { + margin: 10px auto 0 auto; + font-size: 18px; + width: 540px; + max-width: 100%; + text-align: center; +} +.cosmos-card .buttonSend { + margin-top: 15px; +} +.cosmos-card button { + font-weight: bold; +} +.cosmos-card #cancelTx1 h5 { + font-weight: normal; +} -.loader { +.cosmos-card .loader { border: 16px solid #f3f3f3; /* Light grey */ border-top: 16px solid green; /* Blue */ border-radius: 50%; @@ -307,6 +330,12 @@ svg { animation: spin 1s linear infinite; } +@media (max-width: 480px) { + .cosmos-content { + padding: 2em 1em; + } +} + @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } diff --git a/views/templates/front/payment_return.tpl b/views/templates/front/payment_return.tpl index f2a472a..f256d23 100644 --- a/views/templates/front/payment_return.tpl +++ b/views/templates/front/payment_return.tpl @@ -147,8 +147,10 @@