Category slider list font size

  • Posts: 2
  • Thank you received: 0
12 years 11 months ago #32457

Hi Nicolas,

Congratulations for taking Hikashop where its now.

And a Big Thankyou for making available such a fantastic product on such fantastic terms, with such fantastic support.

I've successfully configured my online art gallery with Hikashop (still on localhost, going live shortly). Just facing tiny issues with:

1) font size of the 'category list slider' on the right side of my site (left side on Hikashop Demo site). Can you tll me where can the font size of the category header be reduced?

2) alignment of the image with the image name and 'add to cart' button, where can this be sorted?

Screenshot of the page attached for your reference.

Thanks is advance,

Dhiraj

Attachments:

Please Log in or Create an account to join the conversation.

  • Posts: 82906
  • Thank you received: 13378
  • MODERATOR
12 years 11 months ago #32477

Hi,

1. You need to edit the front end CSS file of HikaShop that can be edited via the tab Display of the configuration.

2. In your products listing module/menu's options (that you can access via the menu Display->Content menus/modules), you can choose to center the text.

Please Log in or Create an account to join the conversation.

  • Posts: 2
  • Thank you received: 0
12 years 11 months ago #32542

Thank you for the prompt reply, your support is fantastic as always.

Have managed to 'centre' align the image names. For the category font size, still cant manage it (sorry I'm pretty raw with php)
Attaching front end css for your reference. can you tell me what else needs to be done to achieve a smaleer font size for category names in the slider pane..

Thanks a ton,
Dhiraj

/* sliders CSS for module categories display */
#pane h3 {margin:0;font-size:60%;letter-spacing:0px;}
.pane-sliders .title {margin:0;padding:5px;color:#666;cursor:pointer;}
.pane-sliders .panel {border:1px solid #ccc;margin-bottom:3px;}
.pane-sliders .panel h3 {background:#f6f6f6;color:#666;}
.pane-sliders .content {background:#ffffff;}
.pane-sliders div.content {padding:0px 10px 10px 10px;}
.jpane-toggler span {background:transparent url(../images/j_arrow.png) 5px 50% no-repeat;padding-left:10px;font-weight:100;}
.jpane-toggler-down span {background:transparent url(../images/j_arrow_down.png) 5px 50% no-repeat;padding-left:10px;font-weight:100;}
.jpane-toggler-down { border-bottom:1px solid #ccc;}



* docs.jquery.com/UI/Slider#theming
*/
.ui-slider { position: relative; text-align: left; }
.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1em; height: 1em; cursor: default; }
.ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; }

.ui-slider-horizontal { height: .8em; width:250px; }
.ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; }
.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; }
.ui-slider-horizontal .ui-slider-range-min { left: 0; }
.ui-slider-horizontal .ui-slider-range-max { right: 0; }

.ui-slider-vertical { width: .8em; height: 100px; }
.ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; }
.ui-slider-vertical .ui-slider-range { left: 0; width: 100%; }
.ui-slider-vertical .ui-slider-range-min { bottom: 0; }
.ui-slider-vertical .ui-slider-range-max { top: 0; }

Please Log in or Create an account to join the conversation.

  • Posts: 82906
  • Thank you received: 13378
  • MODERATOR
12 years 11 months ago #32578

You should change that line:
.pane-sliders .title {margin:0;padding:5px;color:#666;cursor:pointer;}

for example:
.pane-sliders .title {margin:0;padding:5px;color:#666;cursor:pointer; font-size: 12px !important;}

Please Log in or Create an account to join the conversation.

Time to create page: 0.060 seconds
Powered by Kunena Forum