- Posts: 55
- Thank you received: 6
Hikashop reponsive button cart
4 years 8 months ago #338513
by GARANDET
Hikashop reponsive button cart was created by GARANDET
-- HikaShop version -- : 4.4.5
-- Joomla version -- : 4.0.5
-- PHP version -- : 7.4.25
-- Browser(s) name and version -- : Firefox et Safari Ipad
Bonjour,
- Nous aurions besoin d'aide car de nombreux éléments de notre boutique en ligne ne s'adaptent pas aux formats tablettes (par exemple) ou mobile ; voir captures écrans plus bas.
Éléments qui débordent (panier par ex) le conteneur, buttons collent la table au dessus, espace quantité écrasé et quasi non visible, formulaire champs pas assez hauts etc...)
De plus une bordure s'applique sur presque tous les éléments ce qui n’était pas le cas avant.
- Nous venons de changer de template et utilisons maintenant Rockettheme Versla Gantry 5.
- Nous utilisions avant cela un templates Yootheme warp 7 et avions été confronté à ce même problème . Vous nous aviez fourni ce code CSS qui avait largement résolu nos soucis d'affichages. Nous avons réutilisé ce code CSS dans le nouveau templates mais visiblement sans beaucoup de succès ...
Le reste du custom.scss sous Rockettheme fonctionne normalement, il ne s'agit donc pas d'un soucis à ce niveau là.
Merci d'avance
* Le code CSS custom actuellement actif en ligne
Capture écran
Merci
-- Joomla version -- : 4.0.5
-- PHP version -- : 7.4.25
-- Browser(s) name and version -- : Firefox et Safari Ipad
Bonjour,
- Nous aurions besoin d'aide car de nombreux éléments de notre boutique en ligne ne s'adaptent pas aux formats tablettes (par exemple) ou mobile ; voir captures écrans plus bas.
Éléments qui débordent (panier par ex) le conteneur, buttons collent la table au dessus, espace quantité écrasé et quasi non visible, formulaire champs pas assez hauts etc...)
De plus une bordure s'applique sur presque tous les éléments ce qui n’était pas le cas avant.
- Nous venons de changer de template et utilisons maintenant Rockettheme Versla Gantry 5.
- Nous utilisions avant cela un templates Yootheme warp 7 et avions été confronté à ce même problème . Vous nous aviez fourni ce code CSS qui avait largement résolu nos soucis d'affichages. Nous avons réutilisé ce code CSS dans le nouveau templates mais visiblement sans beaucoup de succès ...
Le reste du custom.scss sous Rockettheme fonctionne normalement, il ne s'agit donc pas d'un soucis à ce niveau là.
Merci d'avance
* Le code CSS custom actuellement actif en ligne
Code:
/* HS import old Yoo*/
/* HIKASHOP Bouton ajouter produit */
.hikashop_cart_button { width: 59% !important;}
/* HS Bouton ajouter produit */
/* quantité de produit et + -*/
.hikashop_product_quantity_field_2 {
border-radius: 16px;
border-style: solid;
border-color: #000;
}
select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
border-radius: 4px;
color: #555;
display: inline-block;
font-size: 14px;
height: 20px;
line-height: 20px;
margin-bottom: 10px;
padding: 4px 6px;
vertical-align: middle;
background-color: #bcbdbd;
text-transform: lowercase;
}
.hikashop_product_quantity_field_change {
color:#000;
border-style: solid;
border-width: 1px;
border-color: #9c9c9c;
border-radius: 25px;
background-color: #f4f5f5 ;
margin: 2px;
padding-left: 1px;
padding-right: 1px;
}
/* quantité de produit et + - */
/* tag sur fiche produit*/
.label-info[href], .badge-info[href] {
background-color: #cbcbcb;
border-radius: 16px;
}
/* tag sur fiche produit*/
/* bouton ajouter au panier */
a.hikashop_cart_button, a.hikashop_compare_button, .hikashop_cart_input_button {
background: #61b6fd;
color: #024d8c !important;
border: 2px solid #047ee5;
}
a.hikashop_cart_button:hover, a.hikashop_compare_button:hover, .hikashop_cart_input_button:hover {
background: #7dc1fa;
color: #414242;
border: 2px solid #0262b3;
}
/* bouton ajouter au panier */
/* bouton payer via nicolas HS*/
.hikabtn_checkout_next{
background-color: #46a546;
border: 1px solid #0a5500;
font-size : 20px;
color: #f5f6f5;
padding:10px;
}
.hikabtn_checkout_next:hover{
background-color: #50c050;
border: 1px solid #0a5500;
font-size : 20px;
color: #f5f6f5;
padding:10px;
}
/* bouton payer via nicolas HS*/
/* Fin HS import old Yoo*/
Capture écran
Merci
Please Log in or Create an account to join the conversation.
4 years 8 months ago - 4 years 8 months ago #338527
by GARANDET
Replied by GARANDET on topic Hikashop reponsive button cart
Merci pour cette réponse.
je vais appliquer cela des demain matin!
Pour la partie Panier HS (qui est dans une colonne à droite comme la capture le montre ) qui dépasse de sa boite vous auriez un bout de code CSS me permettant d'éviter cela?
En réalité cela déborde même sur un écran classique 192/1080...
J'ai essayé de réduire ça de 100 % à 90%
Idem au niveau du HTML
même si je ne sais pas dans le back end si il est possible de modifier ce width à 90 %
De toute façon cela ne donne rien...
Merci
je vais appliquer cela des demain matin!
Pour la partie Panier HS (qui est dans une colonne à droite comme la capture le montre ) qui dépasse de sa boite vous auriez un bout de code CSS me permettant d'éviter cela?
En réalité cela déborde même sur un écran classique 192/1080...
J'ai essayé de réduire ça de 100 % à 90%
Code:
.hikashop_cart table {
width: 90%;
}
Code:
<table class="hikashop_cart" width="90%">
De toute façon cela ne donne rien...
Merci
Last edit: 4 years 8 months ago by GARANDET.
Please Log in or Create an account to join the conversation.
4 years 8 months ago - 4 years 8 months ago #338550
by GARANDET
Replied by GARANDET on topic Hikashop reponsive button cart
Bonjour Nicolas,
Merci pour cette réponse.
J'ai effectivement élargi la colonne droite à 30% au lieu de 25 % et supprimé l’option quantité et supprimer.
Cela règle le pb !
La possibilité de changer le type de panier est aussi OK.
Je mets une capture d'écran pour que cela soit plus clair à d'autres, si cela peut servir.
Le fait que ceci soit en mode table du coté HS ne limite t il pas les capacités "responsive ?
Merci pour tout
Merci pour cette réponse.
J'ai effectivement élargi la colonne droite à 30% au lieu de 25 % et supprimé l’option quantité et supprimer.
Cela règle le pb !
La possibilité de changer le type de panier est aussi OK.
Je mets une capture d'écran pour que cela soit plus clair à d'autres, si cela peut servir.
Le fait que ceci soit en mode table du coté HS ne limite t il pas les capacités "responsive ?
Merci pour tout
Last edit: 4 years 8 months ago by GARANDET.
Please Log in or Create an account to join the conversation.
Time to create page: 0.215 seconds