Fix CSS to display tax toggle correctly - 26/04/2018 07:28 EDT
$10-30 USD
Concluído
Publicado há quase 6 anos
$10-30 USD
Pago na entrega
We have a WordPress/WooCommerce site and we use this plugin: [login to view URL]
The plugin allows our customers to toggle between prices that have included VAT and excluded VAT.
I have come as far as I can with my limited CSS knowledge but now I need a professional to fix the rest.
As you can see in the attached image, the tax toggle is located on the left in the topbar. It should be located to the right in the topbar, where LOGOUT currently sits. LOGOUT should be moved to the left of the TAX toggle and have sufficient space between them.
Also, the toggle itself doesn't look very nice. It should use up the entire height of the topbar and the two buttons ("exkl. moms" and "inkl. moms") should both have the same height. When switching between the two options, the background color of both of them should change respectively.
All this must be achieved using CSS. We use a WordPress plugin called Simple Custom CSS and JS where we can add CSS directly in the Admin panel. This is the CSS code we currently use to achieve what you see in the attached image:
/* STYLE TAX TOGGLE */
/*.topnav-item {
margin-right: 300px!important;
}*/
/*#mycartbtn {
margin-right: 0px!important;
}*/
#wcvat-toggle::before {
display: none;
}
#wcvat-toggle {
margin-right: 0px;
padding-left: 5px;
color: #FFFFFF;
background-color: #66cc33;
font-family: "Open Sans";
font-size: 13px;
margin-right: 5px;
}
#[login to view URL] {
padding-left: 5px;
color: #FFFFFF;
background-color: #999999;
font-family: "Open Sans";
font-size: 13px;
margin-right: 5px;
}
#wcvat-toggle:after {
margin-top: 0px;
padding-left: 5px;
padding-right: 5px;
background-color: #999999;
color: #FFFFFF;
font-family: "Open Sans";
font-size: 13px;
content: "inkl. moms";
}
#[login to view URL]:after {
min-height: 100%;
padding-left: 5px;
padding-right: 5px;
background-color: #66cc33;
color: #FFFFFF;
font-family: "Open Sans";
font-size: 13px;
content: "inkl. moms";
}
/* END TAX TOGGLE STYLING */
.product-tax {
font-size: 12px!important;
font-weight: 200;
}
.woocommerce-Price-amount {
font-size: 18px!important;
font-weight: 600;
}
NOTE!!!! This job needs to be completed fast. Unless you can start working on it and complete it within 30- 60 minutes, please don't bid on this project.
Thanks in advance.
ID do Projeto: 16786433
Sobre o projeto
18 propostas
Projeto remoto
Ativo há 6 anos
Quer ganhar algum dinheiro?
Benefícios de ofertar no Freelancer
Defina seu orçamento e seu prazo
Seja pago pelo seu trabalho
Descreva sua proposta
É grátis para se inscrever e fazer ofertas em trabalhos
5,2
5,2
18 freelancers estão ofertando em média $26 USD for esse trabalho
8,0
8,0
7,0
7,0
6,6
6,6
6,4
6,4
5,0
5,0
3,8
3,8
2,9
2,9
2,3
2,3
Sobre o cliente
Hägersten, Sweden
11
Método de pagamento verificado
Membro desde jan. 28, 2009
Verificação do Cliente
Outros trabalhos deste cliente
$30-250 USD
$30-250 USD
$10-30 USD
€8-30 EUR
$10-30 USD
Trabalhos semelhantes
₹1500-12500 INR
$30-250 USD
₹75000-150000 INR
$10-30 CAD
€30-250 EUR
₹1500-12500 INR
₹600-1500 INR
€12-18 EUR / hour
$2-8 USD / hour
₹1500-12500 INR
$30-250 USD
₹1500-12500 INR
$15-25 USD / hour
₹1500-12500 INR
$10-30 USD
$10-30 USD
₹600-1500 INR
₹600-1500 INR
$15-25 USD / hour
₹1500-12500 INR
Obrigado! Te enviamos um link por e-mail para que você possa reivindicar seu crédito gratuito.
Algo deu errado ao enviar seu e-mail. Por favor, tente novamente.
Não foi possível copiar para a área de transferência, por favor, tente novamente após ajustar suas permissões.
Copiado para a área de transferência.
Carregando pré-visualização
Permissão concedida para Geolocalização.
Sua sessão expirou e você foi desconectado. Por favor, faça login novamente.