Alby96
ee67bedc31
Implementato il calcolo del valore reale dei prodotti in asta, includendo il prezzo "Compra Subito", spese di spedizione e risparmio stimato. Aggiunta una nuova sezione "Info Prodotto" nella UI per visualizzare i dettagli estratti e i calcoli. - **AuctionMonitorControl.xaml**: Aggiunta sezione fissa per mostrare informazioni prodotto e calcolo valore. - **AuctionMonitorControl.xaml.cs**: Gestiti eventi per il caricamento e aggiornamento delle informazioni prodotto. - **MainWindow**: Integrati handler per il calcolo e refresh delle informazioni prodotto. - **AuctionInfo.cs**: Aggiunte proprietà per gestire prezzo "Compra Subito", spese di spedizione e limiti di vincita. - **ProductValueCalculator.cs**: Nuova utility per calcolare il valore del prodotto e parsare informazioni dall'HTML. - **AuctionViewModel.cs**: Binding per visualizzare risparmio, costo totale e convenienza nella UI. - **Documentazione**: Aggiornata con dettagli sull'algoritmo di calcolo e layout UI. Fix: - Risolto problema di encoding UTF-8 per emoji nella UI. - Migliorato parsing HTML per prezzi e limiti di vincita. TODO: - Testare parsing su più aste e gestire edge cases. - Implementare caricamento automatico delle informazioni.
579 lines
13 KiB
CSS
579 lines
13 KiB
CSS
.ingenico-body{
|
|
padding: 0;
|
|
}
|
|
.ingenico-body:not(.no-padding){
|
|
padding-top: 20px;
|
|
background-color: #fcfcfd;
|
|
}
|
|
.ingenico-body .header{
|
|
font-size: 16px;
|
|
margin-top: -9px;
|
|
padding-bottom: 15px;
|
|
margin-bottom: 15px;
|
|
/*border-bottom: 0.3px solid #E4EAEE;*/
|
|
font-weight: lighter;
|
|
}
|
|
.ingenico-body .close{
|
|
opacity: 1;
|
|
font-size: 16px;
|
|
margin-top: 3px;
|
|
font-weight: lighter;
|
|
cursor: pointer;
|
|
}
|
|
.ingenico-body .close .left-arrow{
|
|
margin: -3px 5px 0 0;
|
|
}
|
|
.ingenico-body .header .price{
|
|
padding-left: 10px;
|
|
}
|
|
.ingenico-body .credit-cards{
|
|
margin-top: 5px;
|
|
}
|
|
.ingenico-body .or-pay-with-bids{
|
|
font-size: 13px !important;
|
|
padding: 9px 0 0 0;
|
|
}
|
|
.ingenico-body .dashed-or{
|
|
padding: 0;
|
|
border-style: dashed;
|
|
border-color: #9b9b9b;
|
|
}
|
|
.ingenico-body .title{
|
|
margin: 20px 0 25px 0;
|
|
color: #1c2125;
|
|
font-size: 23px;
|
|
}
|
|
.ingenico-body .grey{
|
|
color: #848484;
|
|
}
|
|
.ingenico-body .safe-payment{
|
|
font-size: 16px;
|
|
}
|
|
.ingenico-body .safe-payment .safe-payment-icon{
|
|
margin-right: 10px;
|
|
width: 18px;
|
|
height: 26px;
|
|
background-image: url(../images/lock_safe_payment.svg);
|
|
}
|
|
.ingenico-body .or.active{
|
|
margin-top: 10px;
|
|
}
|
|
.ingenico-body .pay-with-a-card{
|
|
border: 1px solid #D8D8D8;
|
|
background-color: transparent;
|
|
}
|
|
.ingenico-body .btn-with-shadow{
|
|
box-shadow: 0px 0px 20px -4px rgba(208, 209, 213, 0.6), 0 2px 2px 1px rgba(220, 221, 224, 0.4);
|
|
-webkit-box-shadow: 0px 0px 20px -4px rgba(208, 209, 213, 0.6), 0 2px 2px 1px rgba(220, 221, 224, 0.4);
|
|
-moz-box-shadow: 0px 0px 20px -4px rgba(208, 209, 213, 0.6), 0 2px 2px 1px rgba(220, 221, 224, 0.4);
|
|
}
|
|
.ingenico-body .btn{
|
|
width: 100%;
|
|
padding: 10px;
|
|
outline: 0;
|
|
max-height: 130px;
|
|
}
|
|
.ingenico-body .btn .pay-with-card{
|
|
font-weight: 900;
|
|
padding-left: 10px;
|
|
font-size: 15px;
|
|
}
|
|
.ingenico-body .btn .pay-with-card p{
|
|
margin-bottom: 0;
|
|
}
|
|
.ingenico-body .btn .pay-with-card .subtitle{
|
|
font-size: 12px;
|
|
font-weight: 900;
|
|
}
|
|
.ingenico-body .btn-blue-proceed{
|
|
padding: 10px 0;
|
|
background: #e3e3e3;
|
|
background: -moz-linear-gradient(bottom, #ececec 0%, #e3e3e3 100%);
|
|
background: -webkit-linear-gradient(top, #ececec 0%,#e3e3e3 100%);
|
|
background: linear-gradient(to bottom, #ececec 0%,#e3e3e3 100%);
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ececec', endColorstr='#e3e3e3',GradientType=0 );
|
|
color: #313131;
|
|
border: 1px solid #D8D8D8;
|
|
margin-top: 10px;
|
|
}
|
|
.ingenico-body .pay-with-a-card .pull-right{
|
|
padding-right: 6px;
|
|
}
|
|
.ingenico-body .pay-with-a-card span{
|
|
display: inline-block;
|
|
}
|
|
.ingenico-body .pay-with-a-card .no-paypal-btn{
|
|
margin-right: 10px;
|
|
}
|
|
.ingenico-body .fa-angle-right{
|
|
font-size: 35px;
|
|
}
|
|
.ingenico-body .pay-btn,
|
|
.ingenico-body .pay-btn:hover,
|
|
.ingenico-body .pay-btn:focus{
|
|
background: #0077E2;
|
|
background: -moz-linear-gradient(bottom, #02A1DE 0%, #0077E2 100%);
|
|
background: -webkit-linear-gradient(top, #02A1DE 0%,#0077E2 100%);
|
|
background: linear-gradient(to bottom, #02A1DE 0%,#0077E2 100%);
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#02A1DE', endColorstr='#0077E2',GradientType=0 );
|
|
color: white;
|
|
margin: 0;
|
|
border: 1px solid #2170CB;
|
|
height: 58px;
|
|
}
|
|
.ingenico-body .pay-now,
|
|
.ingenico-body .pay-now:hover,
|
|
.ingenico-body .pay-now:focus{
|
|
margin: 0;
|
|
font-size: 10px;
|
|
padding: 8px 5px 8px 9px;
|
|
}
|
|
@media(max-width:576px){
|
|
.ingenico-body .pay-now,
|
|
.ingenico-body .pay-now:hover,
|
|
.ingenico-body .pay-now:focus{
|
|
|
|
font-size: 10px;
|
|
padding: 8px 5px 8px 9px;
|
|
}
|
|
#order_your_product .order-product .pay-now .ingenico-pay-button .white-arrow {
|
|
margin-top: 0px !important;
|
|
}
|
|
}
|
|
.ingenico-body .pay-now .card-number{
|
|
font-size: 11px;
|
|
font-weight: 900;
|
|
}
|
|
body[data-lang=es] .ingenico-body .pay-now .card-number{
|
|
font-size: 10px;
|
|
}
|
|
|
|
.ingenico-body .card-brand-visa-background{
|
|
background-color: white;
|
|
border-radius: 1.5px;
|
|
width: 59px;
|
|
height: 31px;
|
|
display: inline-block;
|
|
margin: 4px 10px 0 0;
|
|
padding: 5px 0 0 6px;
|
|
}
|
|
body[data-lang=es] .ingenico-body .card-brand-visa-background{
|
|
margin-right: 5px;
|
|
width: 50px;
|
|
height: 33px;
|
|
padding: 4px 0 0 2px;
|
|
}
|
|
.ingenico-body .pay-now .card-brand-placeholder{
|
|
margin: 3px 10px 0 0;
|
|
width: 50px;
|
|
height: 32px;
|
|
}
|
|
body[data-lang=es] .ingenico-body .pay-now .card-brand-placeholder{
|
|
margin-right: 7px;
|
|
}
|
|
@media(max-width:320px){
|
|
.ingenico-body .pay-now .card-brand-placeholder{
|
|
width: 24px;
|
|
height: 19px;
|
|
margin-top: 10px;
|
|
margin-right: 5px;
|
|
}
|
|
.ingenico-body .pay-now .card-number{
|
|
font-size: 10px;
|
|
|
|
}
|
|
}
|
|
.ingenico-body .mastercard{
|
|
background-image: url(../images/mastercard.png);
|
|
}
|
|
.ingenico-body .visa{
|
|
background-image: url(../images/visa.png);
|
|
}
|
|
|
|
.ingenico-body .amex {
|
|
background-image: url(../images/amex_b.png);
|
|
}
|
|
.ingenico-body .pay-now .amex{
|
|
background-image: url(../images/amex_b.png);
|
|
}
|
|
|
|
.ingenico-body .pay-now .visa{
|
|
background-image: url(../images/visa-isolated.png);
|
|
width: 44px;
|
|
height: 13px;
|
|
}
|
|
.ingenico-body .postepay{
|
|
background-image: url(../images/postepay.png);
|
|
}
|
|
body[data-lang=es] .ingenico-body .postepay{
|
|
display: none;
|
|
}
|
|
|
|
.ingenico-body .card-holder{
|
|
margin-bottom: 0;
|
|
}
|
|
.ingenico-body .card-info-normal{
|
|
font-weight: 600;
|
|
font-size: 9px;
|
|
}
|
|
.ingenico-body .btn-text-size {
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
padding-right: 0px;
|
|
}
|
|
.ingenico-body .pay-now .ingenico-pay-button,
|
|
.ingenico-body .pay-now .ingenico-pay-button:hover{
|
|
padding: 7px 7px;
|
|
margin-top: 3px;
|
|
}
|
|
body[data-lang=es] .ingenico-body .pay-now .ingenico-pay-button,
|
|
body[data-lang=es] .ingenico-body .pay-now .ingenico-pay-button:hover{
|
|
padding: 7px 0px;
|
|
}
|
|
@media(max-width:576px){
|
|
.ingenico-body .pay-now .ingenico-pay-button,
|
|
.ingenico-body .pay-now .ingenico-pay-button:hover{
|
|
padding: 7px 1px;
|
|
margin-top: 3px;
|
|
}
|
|
.ingenico-body .btn-text-size{
|
|
font-size: 14px;/* 16px */
|
|
}
|
|
body[data-lang=es] .ingenico-body .btn-text-size{
|
|
font-size: 12px;/* 16px */
|
|
}
|
|
}
|
|
@media(max-width:400px){
|
|
body[data-lang=es] .ingenico-body .btn-text-size{
|
|
font-size: 11px;/* 16px */
|
|
}
|
|
}
|
|
@media(max-width:320px){
|
|
.ingenico-body .pay-now .ingenico-pay-button,
|
|
.ingenico-body .pay-now .ingenico-pay-button:hover{
|
|
padding: 7px 2px;
|
|
/*margin-top: -30px;*/
|
|
}
|
|
body[data-lang=es] .ingenico-body .btn-text-size{
|
|
font-size: 11px;/* 16px */
|
|
}
|
|
body[data-lang=es] .ingenico-body .card-info{
|
|
position: absolute;
|
|
}
|
|
|
|
}
|
|
.ingenico-body .select-new-card .btn-text{
|
|
margin-top: 3px;
|
|
}
|
|
.ingenico-body .select-new-card{
|
|
color: #333;
|
|
font-weight: normal;
|
|
}
|
|
.ingenico-body .ingenico-pay-button .arrow{
|
|
margin: -3px 0 0 5px;/* -3px 0 0 10px */
|
|
}
|
|
.ingenico-body .pay-with-a-card-first .arrow{
|
|
margin-top: 6px;
|
|
}
|
|
.ingenico-body .safe-payment{
|
|
position: absolute;
|
|
bottom: 20px;
|
|
}
|
|
.ingenico-body .ingenico-lock{
|
|
background: url(../images/lock.svg);
|
|
width: 22px;
|
|
height: 29px;
|
|
margin: -21px 10px 0;
|
|
}
|
|
.ingenico-body .btn-blue-proceed b{
|
|
padding-right: 10px;
|
|
}
|
|
.ingenico-body .accepted-cards-container:not(.pull-left){
|
|
margin-top: 10px;
|
|
}
|
|
.ingenico-body .pay-now .accepted-cards-container .text{
|
|
font-size: 12px;
|
|
padding-right: 9px;
|
|
}
|
|
.ingenico-body .accepted-cards-container .bi{
|
|
width: 43px;
|
|
height: 27px;
|
|
}
|
|
@media(max-width: 576px){
|
|
.ingenico-body .accepted-cards-container .bi{
|
|
width: 33px;
|
|
height: 23px;
|
|
}
|
|
.ingenico-body .pay-now .accepted-cards-container .text{
|
|
font-size: 10px;
|
|
}
|
|
}
|
|
@media(max-width: 320px){
|
|
.ingenico-body .accepted-cards-container .bi{
|
|
width: 20px;
|
|
height: 15px;
|
|
}
|
|
}
|
|
.ingenico-body .gray-text{
|
|
color: #aaaaaa;
|
|
font-size: 16px;
|
|
}
|
|
.ingenico-body .accepted-cards-container-first .gray-text{
|
|
font-size: 13px;
|
|
}
|
|
.ingenico-body .arrow,
|
|
.buy-error-message .arrow{
|
|
width: 12px;
|
|
height: 22px;
|
|
margin: 6px 5px 0 0;
|
|
}
|
|
.ingenico-body .white-arrow,
|
|
.buy-error-message .white-arrow{
|
|
background: url(../images/white-chevron.svg);
|
|
}
|
|
.ingenico-body .black-arrow{
|
|
background: url(../images/grey-chevron.svg);
|
|
}
|
|
.ingenico-body button{
|
|
height: 58px;
|
|
}
|
|
.ingenico-body .accepted-cards-container-first{
|
|
margin-top: 10px;
|
|
}
|
|
.ingenico-body .pay-with-a-card-first .arrow{
|
|
margin-top: 5px;
|
|
}
|
|
.ingenico-loader{
|
|
position: absolute;
|
|
z-index: 1;
|
|
background-color: rgba(255,255,255,0.8);
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
}
|
|
.ingenico-loader .ingenico-blue-lock{
|
|
background: url(../images/lock-blue.svg?v=1);
|
|
margin-top: 63px;
|
|
width: 28px;
|
|
height: 37px;
|
|
}
|
|
.ingenico-loader .loader-text{
|
|
color: #1687E5;
|
|
font-size: 22px;
|
|
margin: -27px 0 0 0;
|
|
}
|
|
div.spinner {
|
|
position: relative;
|
|
width: 184px;
|
|
height: 184px;
|
|
margin: 146px 0 0 -92px;
|
|
left: 50%;
|
|
background: transparent;
|
|
padding: 10px;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
div.spinner div {
|
|
width: 4%;
|
|
height: 16%;
|
|
background: #1687E5;
|
|
position: absolute;
|
|
left: 49%;
|
|
top: 43%;
|
|
opacity: 0;
|
|
-webkit-border-radius: 50px;
|
|
-webkit-box-shadow: 0 0 3px rgba(0,0,0,0.2);
|
|
-webkit-animation: fade 1s linear infinite;
|
|
}
|
|
|
|
@-webkit-keyframes fade {
|
|
from {opacity: 1;}
|
|
to {opacity: 0.25;}
|
|
}
|
|
|
|
div.spinner div.bar1 {
|
|
-webkit-transform:rotate(0deg) translate(0, -130%);
|
|
-webkit-animation-delay: 0s;
|
|
}
|
|
|
|
div.spinner div.bar2 {
|
|
-webkit-transform:rotate(30deg) translate(0, -130%);
|
|
-webkit-animation-delay: -0.9167s;
|
|
}
|
|
|
|
div.spinner div.bar3 {
|
|
-webkit-transform:rotate(60deg) translate(0, -130%);
|
|
-webkit-animation-delay: -0.833s;
|
|
}
|
|
div.spinner div.bar4 {
|
|
-webkit-transform:rotate(90deg) translate(0, -130%);
|
|
-webkit-animation-delay: -0.7497s;
|
|
}
|
|
div.spinner div.bar5 {
|
|
-webkit-transform:rotate(120deg) translate(0, -130%);
|
|
-webkit-animation-delay: -0.667s;
|
|
}
|
|
div.spinner div.bar6 {
|
|
-webkit-transform:rotate(150deg) translate(0, -130%);
|
|
-webkit-animation-delay: -0.5837s;
|
|
}
|
|
div.spinner div.bar7 {
|
|
-webkit-transform:rotate(180deg) translate(0, -130%);
|
|
-webkit-animation-delay: -0.5s;
|
|
}
|
|
div.spinner div.bar8 {
|
|
-webkit-transform:rotate(210deg) translate(0, -130%);
|
|
-webkit-animation-delay: -0.4167s;
|
|
}
|
|
div.spinner div.bar9 {
|
|
-webkit-transform:rotate(240deg) translate(0, -130%);
|
|
-webkit-animation-delay: -0.333s;
|
|
}
|
|
div.spinner div.bar10 {
|
|
-webkit-transform:rotate(270deg) translate(0, -130%);
|
|
-webkit-animation-delay: -0.2497s;
|
|
}
|
|
div.spinner div.bar11 {
|
|
-webkit-transform:rotate(300deg) translate(0, -130%);
|
|
-webkit-animation-delay: -0.167s;
|
|
}
|
|
div.spinner div.bar12 {
|
|
-webkit-transform:rotate(330deg) translate(0, -130%);
|
|
-webkit-animation-delay: -0.0833s;
|
|
}
|
|
.ingenico-body .error{
|
|
background-color: #D0021B;
|
|
border-radius: 2px;
|
|
color: white;
|
|
padding: 10px;
|
|
margin-bottom: 10px;
|
|
}
|
|
.ingenico-body .error .close-error{
|
|
background: url(../images/close-icon.svg);
|
|
position: absolute;
|
|
right: 10px;
|
|
margin-top: -2px;
|
|
width: 10px;
|
|
height: 10px;
|
|
cursor: pointer;
|
|
}
|
|
.ingenico-body .error .arrow-down{
|
|
background: url(../images/down-chevron.svg);
|
|
display: block;
|
|
width: 22px;
|
|
height: 12px;
|
|
margin: 7px auto 0 auto;
|
|
}
|
|
@media screen and (min-width: 768px){
|
|
.ingenico-body .pay-with-a-card-first,
|
|
.ingenico-body .pay-with-a-card-first:hover{
|
|
margin-top: 35px !important;
|
|
padding-right: 5px;
|
|
}
|
|
}
|
|
@media screen and (min-width: 500px) and (max-width: 990px){
|
|
.ingenico-body .or .col-xs-3{
|
|
width: 30%;
|
|
}
|
|
}
|
|
@media screen and (width: 370px) and (height: 420px){
|
|
.ingenico-body .no-paypal-btn{
|
|
height: 26px;
|
|
}
|
|
.ingenico-body .no-paypal{
|
|
width: 130px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 360px){
|
|
.ingenico-body .title{
|
|
font-size: 22px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 576px){
|
|
.ingenico-body .pay-with-a-card .pull-right{
|
|
margin-top: 6px;
|
|
}
|
|
}
|
|
@media screen and (max-width: 320px){
|
|
.ingenico-body .pay-with-a-card .pull-right{
|
|
margin-top: 6px;
|
|
}
|
|
.ingenico-body .container:eq(0){
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
.ingenico-body .title{
|
|
font-size: 19px;
|
|
}
|
|
.ingenico-body .btn-text-size{
|
|
font-size: 10px;
|
|
}
|
|
.ingenico-body .pay-with-a-card .pull-right{
|
|
padding-right: 2px;
|
|
}
|
|
.ingenico-body .pay-now .ingenico-pay-button .arrow{
|
|
margin-right: -5px;
|
|
}
|
|
.ingenico-body .error .close-error{
|
|
right: 5px;
|
|
margin-top: -5px;
|
|
}
|
|
}
|
|
|
|
.box-credit-card{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 5px 0;
|
|
}
|
|
.box-credit-card img.img-center{
|
|
margin: 0px 2px;
|
|
width: 36px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 3px;
|
|
}
|
|
@media(max-width: 576px){
|
|
.box-credit-card img.img-center{
|
|
width: 33px;
|
|
}
|
|
}
|
|
|
|
@media(max-width: 576px){
|
|
.box-credit-card img.img-center{
|
|
width: 30px;
|
|
margin: 0px 1px;
|
|
}
|
|
|
|
}
|
|
.btn-text {
|
|
margin-top: 5px;
|
|
margin-left: 5px;
|
|
}
|
|
.accepted-cards-container-first .box-credit-card{
|
|
margin-top: 0px;
|
|
padding-top: 0px;
|
|
}
|
|
.accepted-cards-container-first .box-credit-card img.img-center{
|
|
margin: 0px 2px;
|
|
border: 1px solid #ebebeb;
|
|
border-radius: 3px;
|
|
width: 38px;
|
|
}
|
|
@media(max-width: 320px){
|
|
.accepted-cards-container-first .box-credit-card img.img-center{
|
|
margin: 0px 1px;
|
|
width: 27px;
|
|
}
|
|
}
|
|
@media(max-width: 360px){
|
|
.ingenico-body .btn-text-size{
|
|
font-size: 10px;
|
|
}
|
|
body[data-lang=es] .card-info {
|
|
position: absolute;
|
|
}
|
|
.accepted-cards-container-first .box-credit-card img.img-center{
|
|
margin: 0px 1px;
|
|
width: 33px;
|
|
}
|
|
} |