Close

Profile: sumit7034

Avatar

User posts

9 years ago

Thanks now I understand Now I have added below in css
.attributeFilterPanel7Spikes ul
{
max-height: 300px;
overflow: auto;
}
.manufacturerFilterPanel7Spikes ul
{
max-height: 400px;
overflow: auto;
}
.specificationFilterPanel7Spikes ul
{
max-height: 300px;
overflow: auto;
}


Also let me know is there a way of searching in filters like in link below on filter they are having textbox to search
http://www.centralbooksonline.com/school-books/cbse/nursery.html?p=2

9 years ago

Now I got it I am getting scrolling on Product attribute filters only

But not getting on manufacturers, vendors and Specification Attribute filter.

Please suggest the change for getting filter on them also.

9 years ago

Did you found any solution?

Is below solution working fine at your end and giving scrolling in filters
.attributeFilterPanel7Spikes ul
{
max-height: 300px;
overflow: auto;
}

9 years ago

My path is 
Desktop\nopCommerce_3.60_Source\Presentation\Nop.Web\Plugins\SevenSpikes.Nop.Plugins.AjaxFilters\Themes\DefaultClean\Content\AjaxFilters.css


and default clean is my active theme

9 years ago

Please provide the solution or provide update css for this problem

9 years ago

I have changed below is my CSS but it has no effect.
/*
* Copyright 2015 Seven Spikes Ltd. All rights reserved. (http://www.nop-templates.com)
* http://www.nop-templates.com/t/licensinginfo
*/
.attributeFilterPanel7Spikes ul
{
max-height: 20px;
overflow: auto;
}




.nopAjaxFilters7Spikes .filtersTitlePanel {
  display: none;
}
.nopAjaxFilters7Spikes a {
    cursor: pointer;
}
.product-filters {
  display: none; /*hide empty default filters*/
}




.nopAjaxFilters7Spikes .block {
    min-height: 46px;
    margin: 0 auto 10px;
}
.nopAjaxFilters7Spikes .block .title {
    position: relative;
    overflow: hidden;
    padding: 0;
    background: #f6f6f6;
    margin: 0;
}
.nopAjaxFilters7Spikes .block .filtersGroupPanel {
    position: relative;
    padding: 15px 10px;
    overflow: hidden;
}
.nopAjaxFilters7Spikes .block .title a.toggleControl {
    position: relative;
    display: block;
    cursor: pointer;
    padding: 12px 40px 12px 10px;
    color: #444;
    font-size: 18px;
}
.nopAjaxFilters7Spikes .block .title a.toggleControl:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 12px;
  height: 19px;
  margin-top: -9px;
  background: url(images/filters-toggle.png) center no-repeat;
}
.nopAjaxFilters7Spikes .block .title a.clearFilterOptions {
    position: absolute;
    top: 50%;
    right: 40px;
    font-size: 14px;
    line-height: 1;
    text-transform: lowercase;
    color: #888;
    cursor: pointer;
    margin-top: -7px;
}
.nopAjaxFilters7Spikes .block .title a.clearFilterOptions:hover {
  text-decoration: underline;
}












/* search criteria */




.selected-options-list > li {
  margin: 10px 0 0;
  font-size: 16px;
    overflow: hidden;
}
.selected-options-list > li:first-child {
  margin: 0;
}
.selected-options-list > li label{
    display: block;
    color: #444;
    margin: 0 0 2px;
}
.selected-options-list > li span {
    float: left;
    padding: 6px 14px 6px 0;
    margin: 0 20px 0 0;
    color: #4ab2f1;
    cursor: pointer;
    background: url(images/filters-remove.png) right center no-repeat;
    line-height: 1;
}
.selected-options-list > li span:hover {
  text-decoration: underline;
}












/* price range slider */




.priceRangeFilterPanel7Spikes .ui-slider {
    margin: 0 0 20px;
    border-radius: 0;
    height: 11px;
    background: #f3f3f3;
    border: 1px solid #ddd;
}
.priceRangeFilterPanel7Spikes .ui-slider-range.ui-widget-header {
    top: -1px;
    height: 11px;
    background: #ccc;
    border: 1px solid #bbb;
}
.priceRangeFilterPanel7Spikes .priceRangeMinMaxPanel {
    overflow: hidden;
    margin-bottom: 20px;
}
.priceRangeMinPanel,
.priceRangeCurrentPricesPanel .currentMinPrice {
    float: left;
}
.priceRangeMaxPanel,
.priceRangeCurrentPricesPanel .currentMaxPrice {
    float: right;
}
.priceRangeMinPanel,
.priceRangeMaxPanel {
    font-size: 14px;
    color: #888;
}
.priceRangeCurrentPricesPanel .currentMinPrice,
.priceRangeCurrentPricesPanel .currentMaxPrice {
    font-size: 16px;
    color: #444;
}
.nopAjaxFilters7Spikes .block .title a.clearPriceRangeFilter {
    position: absolute;
    top: 50%;
    right: 40px;
    font-size: 14px;
    line-height: 1;
    text-transform: lowercase;
    color: #888;
    cursor: pointer;
    margin-top: -7px;
}
.nopAjaxFilters7Spikes .block .title a.clearPriceRangeFilter:hover {
  text-decoration: underline;
}
.priceRangeFilterPanel7Spikes .ui-slider-handle {
    top: -7px !important;
    width: 10px !important;
    height: 23px !important;
    padding: 0 !important;
    cursor: pointer !important;
    background: #aaa !important;
    border: 1px solid #999 !important;
    border-radius: 0 !important;
    margin: 0 0 0 -1px !important;
}
.priceRangeFilterPanel7Spikes .ui-slider-handle:last-child {
  margin-left: -9px !important;
}



9 years ago

Currently I am using trial version of nope 3.60 I have same issue.

Please tell me where I have to change.
I mean in which file so that i can make all filters scrollable.