Como uso bastante o OSC Brasil 6.0, tive que buscar como torná-lo responsivo, pois os temas hoje são todos responsivos.
Achei um issue no github do Deivison Arthur que ajudou, post:
https://github.com/deivisonarthur/OSC-Magento-Brasil-6-Pro/issues/220
Temos que alterar o onestep.phtml que está em:
/app/design/frontend/base/default/template/onestepcheckout/ ou na pasta do seu tema, se você copiou ele, que deve ser em:
/app/design/frontend/”seu tema”/”padrão”/template/onestepcheckout/onestep.phtml ou
/app/design/frontend/default/”tema”/template/onestepcheckout/onestep.phtml
Alterando a linha 14 trocando <div class=”col1″> por <div class=”col1 verssoes”>
Alterando a linha 21 trocando <div class=”col2″> por <div class=”col2 verssoes”>
Alterando a linha 14 trocando <div class=”col3″> por <div class=”col3 verssoes”>
o trecho do phtml vai ficar assim (# da linha abaixo não corresponde as linhas alteradas)
<div class="col-1 versoes"> <div class="opc"> <div class="section allow active"> <?php echo $this->getChildHtml('address'); ?> </div> </div> </div> <div class="col-2 versoes"> <div class="opc"> <div class="section allow active"> <div id="onestepcheckout-shipping-method-wrapper"> <?php echo $this->getChildHtml('shippingmethod'); ?> </div> <div id="onestepcheckout-payment-method-wrapper"> <?php echo $this->getChildHtml('paymentmethod'); ?> </div> </div> </div> </div> <div class="col-3 versoes"> <div class="opc"> <div class="section allow active">
Depois temos que colocar um CSS no final do arquivo do seu tema, que pode ser em:
/skin/frontend/”seu tema”/”padrão”/css/local.css ou skin/frontend/default/”tema”/css/local.css
ou no arquivo skin.css. Em outro tema, do magentothem, tive que colocar no bootstrap.css, o seguinte estitlo:
.versoes { width: 32% !important; } @media screen and (max-width: 800px) { .versoes { width: 100% !important; } }
Usei esta solução em vários temas com sucesso.
Espero ter ajudado.
Alfredo Letti