Index: branches/1.0.x/inc/styles.css
===================================================================
--- branches/1.0.x/inc/styles.css (revision 14979)
+++ branches/1.0.x/inc/styles.css (revision 14980)
@@ -1,1181 +1,1186 @@
@charset "UTF-8";
/* Basic Blocks
*******************************************************************************/
html {
min-width: 1000px;
}
body {
background: #fff url(@templates_base@/img/bg-header.jpg) repeat-y 0 0;
color: #3c3c3c;
font: 0.813em/1.231em Arial,Verdana,Tahoma,Sans-Serif;
}
img { border: 0; }
table { border-collapse: collapse; border-spacing: 0; }
td { padding: 0; vertical-align: top; }
a, a:hover, a:focus { color: #333; outline: none; text-decoration: underline; }
a:hover, a:focus { text-decoration: none; }
.clear { clear: both !important; }
.fix { border: 1px solid #f00; }
/* Header
*******************************************************************************/
#header {
margin: 0 auto;
width: 960px;
}
#header .logo {
float: left;
padding: 18px 0;
}
#header .infoblock {
float: right;
position: relative;
width: 580px;
}
#header .infoblock .welcome {
color: #343338;
float: right;
padding: 9px 0;
position: relative;
}
#header .infoblock .welcome div { float: left; }
#header .infoblock .welcome .txt { padding: 0 0 0 20px; }
#header .infoblock .welcome .logged { padding-top: 5px; }
#header .infoblock .welcome .txt a { font-weight: bold; }
#header .infoblock .welcome .lang .with-icon {
background: url(@templates_base@/img/lang/eng.gif) no-repeat 10px 7px;
padding: 5px 10px 10px 35px;
}
#header .infoblock .welcome .lang .without-icon {
padding: 5px 10px 10px 10px;
}
#header .infoblock .welcome .txt,
#header .infoblock .welcome .lang,
#header .infoblock .welcome .currency,
#header .infoblock .welcome .profile-menu {
position: relative;
}
#header .infoblock .welcome .profile-menu { margin-left: 10px; margin-right: 10px; }
#header .infoblock .welcome .txt .login,
#header .infoblock .welcome .currency .cur,
#header .infoblock .welcome .profile-menu .link {
padding: 5px 10px 10px;
}
#header .infoblock .welcome .currency { margin-left: 5px; }
#header .infoblock .welcome .currency .cur.plashka-sel { margin-left: -1px; }
a#lang,
a#currency,
a#profile {
background: url(@templates_base@/img/icon-select.gif) no-repeat 100% 6px;
display: block;
padding: 0 12px 0 0;
text-decoration: none;
}
#header .infoblock .cart {
background: url(@templates_base@/img/bg-cart.jpg) no-repeat 100% 0;
float: left;
font-size: 1.154em;
font-weight: bold;
padding: 15px 0;
}
#header .infoblock .cart span,
#header .infoblock .cart a { float: left; }
#header .infoblock .cart a {
background: url(@templates_base@/img/icon-checkout.gif) no-repeat 100% 12px;
color: #75b833;
line-height: 33px;
padding: 0 12px 0 0;
text-decoration: none;
}
#header .infoblock .cart i {
font-size: 0.733em;
}
#header .infoblock .cart .items {
background: url(@templates_base@/img/icon-cart.png) no-repeat 0 0;
line-height: 33px;
padding: 0 0 0 50px;
}
#header .infoblock .cart .delim {
color: #b5b5b5;
font-weight: normal;
line-height: 33px;
padding: 0 15px;
}
#header .infoblock .cart .phone {
color: #535353;
font: bold 1.385em Tahoma,Arial,Verdana,Sans-Serif;
line-height: 33px;
padding-right: 50px;
}
#header .infoblock .welcome .lang #lang-sel a {
text-decoration: underline;
}
#header .infoblock .welcome .lang #lang-sel .eng {
background: url(@templates_base@/img/lang/eng.gif) no-repeat 0 0;
padding: 0 0 0 25px;
}
#header .infoblock .welcome .lang #lang-sel .deutch {
background: url(@templates_base@/img/lang/deutch.gif) no-repeat 0 0;
padding: 0 0 0 25px;
}
#header .infoblock .welcome .lang #lang-sel .rus {
background: url(@templates_base@/img/lang/rus.gif) no-repeat 0 0;
padding: 0 0 0 25px;
}
.plashka {
background-color: #fff;
border: 1px solid #d0d0d0;
display: none;
padding: 10px 20px 5px;
position: absolute;
top: 31px;
right: -1px;
z-index: 95;
-webkit-border-radius: 5px;
-webkit-border-top-right-radius: 0;
-moz-border-radius: 5px;
-moz-border-radius-topright: 0;
border-radius: 5px;
border-top-right-radius: 0;
-moz-box-shadow: 0 0 8px #ccc;
-webkit-box-shadow: 0 0 8px #ccc;
box-shadow: 0 0 8px #ccc;
}
.plashka-sel {
background-color: #fff !important;
border: 1px solid #d0d0d0;
border-bottom: 1px solid #fff;
margin: -1px -1px 0 0;
position: relative;
z-index: 96;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
-moz-box-shadow: #ccc 0 -3px 8px -1px;
-webkit-box-shadow: #ccc 0 -3px 8px -1px;
box-shadow: #ccc 0 -3px 8px -1px;
}
#header .infoblock .welcome .plashka li {
padding: 0 0 5px;
white-space: nowrap;
}
#header .infoblock .welcome .plashka .active { color: #2d85d6; }
#header .infoblock .welcome .txt .plashka,
#header .infoblock .welcome .profile-menu .plashka { right: 0; }
.plashka-sel a#lang,
.plashka-sel a#currency,
.plashka-sel a#profile {
background: url(@templates_base@/img/icon-close.gif) no-repeat 100% 6px;
}
#header .infoblock .welcome .login,
.login-alt .login {
display: inline-block;
float: none;
}
.login-alt .login { font-size: 0.867em; padding-left: 5px; }
#header .infoblock .welcome .login a,
.login-alt .login a {
background: url(@templates_base@/img/bg-button-login.jpg) no-repeat 0 0;
display: block;
height: 18px;
text-align: center;
text-decoration: none;
width: 61px;
}
#header .infoblock .welcome .txt .login.plashka-sel,
.login-alt .login.plashka-sel {
margin-left: 4px;
margin-bottom: 1px;
padding: 5px 18px 10px;
}
.login-alt .login.plashka-sel { padding: 5px 10px 10px; }
#header .infoblock .welcome .login.plashka-sel a,
.login-alt .login.plashka-sel a {
background: none;
height: auto;
width: auto;
}
.icon-close { right: 10px; position: absolute; }
/*** Menu ***/
.menu {
background: #3e3e3e url(@templates_base@/img/bg-menu.jpg) repeat-x 0 0;
height: 46px;
position: relative;
width: 100%;
}
.menu .padding {
margin: 0 auto;
width: 960px;
}
.menu ul {
float: left;
width: 740px;
}
.menu ul li {
color: #fff;
float: left;
font-size: 1.154em;
font-weight: bold;
}
.menu ul li a {
color: #fff;
display: block;
line-height: 46px;
padding: 0 18px;
text-decoration: none;
}
.menu ul li a:hover,
.menu ul li a:focus {
background: #4b4b4b url(@templates_base@/img/bg-menu.jpg) repeat-x 0 -46px;
}
.menu ul li a.active {
background: #2d85d6 url(@templates_base@/img/bg-menu.jpg) repeat-x 0 -92px;
}
.menu .searchbox {
background: url(@templates_base@/img/bg-searchbox-l.jpg) no-repeat 0 0;
float: right;
margin-top: 10px;
text-align: right;
width: 210px;
}
.menu .searchbox input[type="text"] {
border: none;
background: #fff url(@templates_base@/img/bg-searchbox-r.jpg) no-repeat 100% 0;
height: 23px;
line-height: 23px;
padding-top: 2px;
width: 180px;
}
.level2 {
background-color: #fff;
left: 273px;
position: absolute;
z-index: 4000;
}
.level2-bg {
border: 1px solid #3e3e3e;
float: left;
width: auto;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
box-shadow: 0 0 3px #444;
-moz-box-shadow: 0 0 3px #444;
-webkit-box-shadow: 0 0 3px #444;
}
#level2-menu {
background-color: #3e3e3e;
float: left;
padding: 8px 0;
width: 200px;
}
#level2-menu h3 {
background-color: #3e3e3e;
padding: 7px 12px;
white-space: nowrap;
}
#level2-menu h3 a {
color: #fff;
font-weight: bold;
text-decoration: none;
}
#level2-menu h3 a:hover {
text-decoration: underline;
}
#level2-menu ul {
width: 100%;
}
#level2-menu ul li {
background-color: #eaeaea;
font-size: 0.923em;
font-weight: normal;
width: 100%;
}
#level2-menu ul li a {
color: #3e3e3e;
line-height: 20px;
padding: 3px 13px 5px;
text-decoration: none;
}
#level2-menu ul li a:hover,
#level2-menu ul li a:focus {
background: none;
text-decoration: underline;
}
#level2-menu ul li a.active {
background: none;
}
#level2-menu ul li i {
background: url(@templates_base@/img/bullet-l3menu.png) no-repeat 22px 9px;
display: block;
padding: 0 0 0 20px;
white-space: nowrap;
}
#level2-menu ul li.level3-menu h4 {
padding-left: 20px;
white-space: nowrap;
}
#level2-menu ul li.level3-menu ul {
background-color: #fff;
}
#level2-menu ul li.level3-menu ul li {
background-color: #fff;
font-size: 0.917em;
}
#level2-menu ul li.level3-menu ul li a {
background: url(@templates_base@/img/bullet-l3menu.png) no-repeat 35px 4px;
line-height: 18px;
padding: 0 0 0 45px;
}
#level2-menu ul li.level3-menu ul li a.active { color: #2f7916; }
#level2-menu.ui-accordion .ui-accordion-content { overflow: hidden; }
#level2-menu.ui-accordion .ui-accordion-content-active { background-color: #eaeaea; }
#level2-menu .ui-icon-circle-arrow-l2e {
background: url(@templates_base@/img/bullet-l2menu.png) no-repeat 0 0;
height: 7px;
width: 4px;
}
#level2-menu .ui-icon-circle-arrow-l2s {
background: url(@templates_base@/img/bullet-l2menu.png) no-repeat 0 -7px;
height: 4px;
width: 7px;
}
#level2-menu .ui-icon-circle-arrow-l3e {
background: url(@templates_base@/img/bullet-l2menu.png) no-repeat 0 -11px;
height: 7px;
width: 4px;
}
#level2-menu .ui-icon-circle-arrow-l3s {
background: url(@templates_base@/img/bullet-l2menu.png) no-repeat 0 -18px;
height: 4px;
width: 7px;
}
#level-content {
background-color: #fff;
float: left;
padding: 15px;
width: 400px;
}
#level-content ul {
width: auto;
}
#level-content ul li {
background: url(@templates_base@/img/bullet-level5.png) no-repeat 0 7px;
float: left;
font-size: 1em;
font-weight: normal;
padding: 0 10px 7px 10px;
width: 180px;
}
#level-content ul li a {
color: #3c3c3c;
line-height: 20px;
padding: 0;
text-decoration: underline;
}
#level-content ul li a:hover,
#level-content ul li a:focus {
background: none;
color: #2a80d3;
}
#level-good {
background-color: #fff;
float: left;
padding: 15px;
text-align: center;
width: 120px;
}
#level-good .price { padding: 10px 0; }
/* Content
*******************************************************************************/
#content {
background-color: #f7f7f7;
padding: 32px 0;
width: 100%;
}
#content .padding {
margin: 0 auto;
position: relative;
width: 960px;
}
#content .block-fixed {
background-color: #fff;
border: 1px solid #d0d0d0;
padding: 13px 11px 0 11px;
position: absolute;
margin: 40px 0 0 -100px;
}
#content .block-fixed div { padding-bottom: 13px; }
.button-addtocart {
background: url(@templates_base@/img/button-addtocart-left.jpg) no-repeat 0 0;
color: #faffed;
display: inline-block;
font-size: 0.846em;
text-shadow: #000 0px 1px 1px;
text-decoration: none;
}
.button-addtocart span {
background: url(@templates_base@/img/button-addtocart-right.jpg) no-repeat 100% 0;
display: inline-block;
height: 40px;
padding: 5px 6px 0;
text-align: center;
}
.button-addtocart span i { display: block; margin-top: -4px; }
.button-addtocart:hover { color: #faffed; text-shadow: #000 0px 1px 1px; }
#content .leftcol {
float: left;
padding: 0 20px 0 0;
width: 230px;
}
#content .rightcol {
float: left;
padding: 0 0 0 20px;
width: 230px;
}
#content .contentcol {
float: left;
width: 710px;
}
.subscribe-block {
background: url(@templates_base@/img/subs.png) no-repeat 0 100%;
padding: 0 16px 11px 0;
width: 214px;
}
.subscribe-block h4 {
background: url(@templates_base@/img/subs-top.png) no-repeat 0 0;
font-size: 1.077em;
font-weight: bold;
padding: 14px 0 0 16px;
width: 214px;
}
.subscribe-block fieldset {
padding: 10px 0 0 16px;
text-align: left;
width: 214px;
}
input.field,
textarea.field,
select.field,
select.field-alt {
background: url(@templates_base@/img/bg-field.jpg) repeat-x 0 0;
border: 1px solid #828282;
height: 24px;
line-height: 24px;
margin-bottom: 5px;
padding: 0 5px;
}
select.field { padding: 0 0 0 5px; }
select.field-alt { margin: 0; padding: 0 0 0 5px; }
input.field:focus,
textarea.field:focus,
select.field-alt:focus,
select.field:focus { border: 1px solid #000; }
.form select.field { width: 360px; }
.form input.subsfield { width: 190px; }
/*** Block ***/
.block {
background: url(@templates_base@/img/bg-block-bottom.jpg) no-repeat 0 100%;
margin: 0 0 10px;
padding: 0 0 8px;
}
.block .block-top {
background: url(@templates_base@/img/bg-block-top.jpg) no-repeat 0 100%;
height: 8px;
width: 100%;
}
.block.no-border-bottom {
background: none;
padding: 0;
}
.block.block-margin { margin: 0 0 20px; }
.block h2 {
background: url(@templates_base@/img/h1-left.png) no-repeat 0 0;
height: 36px;
line-height: 36px;
padding-left: 14px;
position: relative;
z-index: 10;
}
.block h2 em,
.block h2 a {
color: #fefefe;
font-size: 1.154em;
font-weight: bold;
font-style: normal;
position: relative;
z-index: 150;
}
+
+.block h2 em.filter-header {
+ padding-left: 14px;
+}
+
.block h2 a { text-decoration: underline; }
.block h2 i {
background: url(@templates_base@/img/bc-step.png) no-repeat 50% 50%;
padding: 0 15px;
}
.block h2 span {
background: url(@templates_base@/img/h1-right.png) no-repeat 100% 0;
height: 53px;
position: absolute;
top: -3px; right: -6px;
width: 136px;
z-index: 50;
}
.block h2 span.new { background: url(@templates_base@/img/h1-right-new.png) no-repeat 100% 0; }
.block h2 span.pick { background: url(@templates_base@/img/h1-right-pick.png) no-repeat 100% 0; }
.block h2 span.sale { background: url(@templates_base@/img/h1-right-sale.png) no-repeat 100% 0; }
.block h2 span.bullet { background: url(@templates_base@/img/h1-right-bullet.png) no-repeat 100% 0; }
.block.alt-block {
background: none;
}
.block.alt-block h2 {
background: url(@templates_base@/img/bg-block.png) no-repeat 0 0;
padding-left: 0;
}
.block.alt-block h2.active {
background-position: 0 100%;
}
.block.alt-block h2 a {
display: block;
- height: 36px;
- line-height: 36px;
- padding-left: 14px;
- text-decoration: none;
+ float: right;
+ line-height: 8px;
+ padding-top: 8px;
+ padding-right: 8px;
}
.block .block-content {
background-color: #fff;
border: 1px solid #d0d0d0;
border-top: none;
padding: 15px;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
.block .block-content.noactive { display: none; }
.manufacturer dt {
float: left;
width: 155px;
}
.manufacturer dd {
float: left;
text-align: right;
width: 40px;
}
.manufacturer .active {
color: #0171e4;
}
.manufacturer label { text-decoration: underline; }
.slider-vertical {
background: url(@templates_base@/img/bg-vertslider-full.png) no-repeat 0 0;
float: left;
padding: 5px 0 0;
}
.slider-vertical .ui-slider-range {
background: url(@templates_base@/img/bg-vertslider-a.png) repeat-y 0 0;
margin: 0 0 0 7px;
}
.slider-vertical .ui-slider-handle {
background: url(@templates_base@/img/point-vertslider.png) no-repeat 0 0;
height: 9px;
margin: 0;
width: 16px;
}
.range-block {
margin: 0 auto;
padding: 10px 0 0;
width: 120px;
}
.range-block ul.range {
color: #333;
float: left;
margin-right: 10px;
position: relative;
top: -7px;
width: 50px;
}
.range-block ul.range li {
padding: 0 0 10px;
text-align: right;
}
.range-block ul.range li:last-child { padding: 0; }
.range-block ul.range2 {
color: #a0a0a0;
float: left;
margin-left: 10px;
position: relative;
top: 4px;
width: 20px;
}
.range-block ul.range2 li {
font-size: 0.846em;
padding: 0 0 10px;
text-align: left;
}
.range-block ul.range2 li:last-child { padding: 0; }
/*** Accordion menu ***/
#accordion-menu {
border-left: 1px solid #d0d0d0;
border-right: 1px solid #d0d0d0;
}
#accordion-menu h3 {
background: #fff url(@templates_base@/img/bg-point-menu.jpg) repeat-x 0 100%;
border-bottom: 1px solid #d0d0d0;
color: #666;
cursor: pointer;
font-size: 1.077em;
font-weight: bold;
padding: 10px 14px;
position: relative;
}
#accordion-menu h3.active {
background: #1b6bc7 url(@templates_base@/img/bg-point-menu-active.jpg) repeat-x 0 0;
color: #fff;
}
#accordion-menu a { padding-left: 20px; text-decoration: none; }
#accordion-menu a:hover, #accordion-menu a:focus { text-decoration: underline; }
#accordion-menu h3.active a { color: #fff; }
#accordion-menu .ui-icon-circle-arrow-e {
background: url(@templates_base@/img/bullet-menu.png) no-repeat 0 0;
height: 6px;
width: 10px;
}
#accordion-menu.alt-menu .ui-icon-circle-arrow-e {
margin-top: -4px;
position: absolute;
top: 50%;
}
#accordion-menu .ui-icon-circle-arrow-s {
background: url(@templates_base@/img/bullet-menu.png) no-repeat 0 -6px;
height: 6px;
width: 10px;
}
#accordion-menu .ui-icon-circle-arrow-a {
background: url(@templates_base@/img/bullet-menu.png) no-repeat 0 -12px;
height: 10px;
margin-top: -5px;
position: absolute;
top: 50%;
width: 8px;
}
#accordion-menu div {
background-color: #fff;
border-bottom: 1px solid #d0d0d0;
}
#accordion-menu div ul { padding: 10px 0 10px 7px; }
#accordion-menu div ul li { padding: 3px 0 5px 7px; }
#accordion-menu div ul li.active {
background: url(@templates_base@/img/bg-subcategory.png) repeat-x 0 0;
}
#accordion-menu div ul a { color: #333; padding-left: 0; }
#accordion-menu div ul li.active a { color: #fff; }
#accordion-menu div ul li ul { padding: 10px 0 0 25px; }
#accordion-menu div ul li ul li {
background: url(@templates_base@/img/point-subcategory.png) no-repeat 0 7px;
font-size: 0.923em;
padding: 2px 0 2px 10px;
}
#accordion-menu div ul li.active ul a { color: #333; }
/*** Good item ***/
.good-item {
background-color: #fff;
width: auto;
}
.good-item.good-item-narrow {
margin: 5px 5px 0 0;
width: 171px;
}
.good-item.good-item-narrow-last {
margin-right: 0;
}
.good-item.good-item-float {
float: left;
height: 290px;
}
.good-item.border-radius-bottom {
border: 1px solid #d0d0d0;
border-top: none;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-bottomright: 5px;
-moz-border-radius-bottomleft: 5px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
.good-item.border-radius {
border: 1px solid #d0d0d0;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.good-item dl {
padding: 14px 16px 0;
text-align: center;
}
.good-item dl dd { padding-bottom: 15px; }
.good-item.comparing-items dl {
border-bottom: 1px dotted #b5b5b5;
padding: 14px 0;
margin: 0 16px;
}
.good-item.comparing-items dl.last {
border-bottom: none;
}
.good-item.comparing-items .buttons {
padding: 15px 0;
text-align: center;
width: 210px;
}
.good-item dl dt { padding-bottom: 15px; }
.good-item dl dt a {
font-size: 1.077em;
font-weight: bold;
}
.good-item .img { height: 140px; }
.good-item .price {
font-size: 1.846em;
font-weight: bold;
font-style: normal;
padding: 10px 0;
}
.good-item .price span {
font-size: 0.708em;
}
.good-item .addtocart {
background: url(@templates_base@/img/addtocart-left.jpg) no-repeat 0 0;
color: #faffed;
display: inline-block;
font-size: 1.077em;
font-weight: bold;
text-shadow: #000 0px 1px 1px;
text-decoration: none;
}
.good-item .addtocart span {
background: url(@templates_base@/img/addtocart-right.jpg) no-repeat 100% 0;
display: inline-block;
height: 33px;
line-height: 33px;
padding: 0 20px;
}
.good-item .addedtocart {
color: #3d901f;
font-size: 1.154em;
}
/*** Scrollable ***/
#scrollable {
position:relative;
overflow: hidden;
width: 710px;
height: 309px;
background-color: #fff;
margin: 5px 0
}
#scrollable .items {
border-top: 1px solid #d0d0d0;
border-bottom: 1px solid #d0d0d0;
height: 307px;
margin: 0 30px;
position: relative;
width: 650px;
}
#scrollable .good-item {
background: url(@templates_base@/img/delimiter-special.gif) repeat-y 100% 0;
position:relative;
width:222px;
height: 280px;
margin: 16px 0;
}
#scrollable .good-item dl { padding: 0 16px; }
#scrollable .good-item dl dt { height: 35px; }
#scrollable .good-item dl dd .price { color: #c2120a; }
#scrollable .good-item dl dd .price-deal {
padding: 10px 0;
}
#scrollable .good-item dl dd .price-deal s.under {
font-size: 1.308em;
font-weight: bold;
padding-right: 10px;
}
#scrollable .good-item dl dd .price-deal s.under span {
font-size: 0.706em;
}
#scrollable .ca-nav span {
width:30px;
height:309px;
background:transparent url(@templates_base@/img/special-navi.png) no-repeat 0 0;
position:absolute;
top:0;
left:0;
text-indent:-9000px;
cursor:pointer;
z-index:8;
}
#scrollable .ca-nav span.ca-nav-prev:hover {
background-position:-30px 0;
}
#scrollable .ca-nav span.ca-nav-next {
background-position:-60px 0;
left:auto;
right:0;
}
#scrollable .ca-nav span.ca-nav-next:hover {
background-position:-90px 0;
}
#content .content,
#content .compare {
margin: 5px 0 0;
padding: 20px 30px;
}
#content .content.border-radius,
#content .goods.border-radius,
#content .items.border-radius,
#content .compare.border-radius {
background-color: #fff;
border: 1px solid #d0d0d0;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
width: auto;
}
#content .content p {
font-size: 1.077em;
line-height: 1.5em;
}
#feedback {
background: url(@templates_base@/img/con-contact.jpg) no-repeat 100% 0;
font-size: 0.929em;
padding: 20px 330px 0 0;
}
#feedback p.req {
border-bottom: 1px solid #d0d0d0;
color: #3e85d2;
font-size: 1em;
font-weight: bold;
margin-bottom: 15px;
padding: 0 0 5px;
}
span.star {
color: #3e85d2;
font-weight: bold;
}
#feedback p {
clear: both !important;
padding: 5px 0;
}
#feedback label {
float: left;
font-weight: bold;
padding: 5px 0;
white-space: nowrap;
width: 110px;
}
.form .field {
border: 1px solid #b4b4b4;
width: 350px;
}
#feedback input.field,
#feedback span.radios,
#feedback textarea {
float: left;
}
#feedback textarea {
background: url(@templates_base@/img/bg-textarera.jpg) repeat-x 0 0;
border: 1px solid #b4b4b4;
height: 120px;
width: 450px;
}
#feedback .radio label { width: 240px; }
#feedback span.radios { padding: 5px 0; }
#feedback .buttons {
padding: 10px 0 0 110px;
}
.form .green-button {
background: url(@templates_base@/img/bg-buttons.jpg) no-repeat 0 0;
border: none;
color: #fff;
font-weight: bold;
height: 26px;
padding-bottom: 1px;
width: 90px;
}
.form .grey-button, .form .green-button[disabled] {
background: url(@templates_base@/img/bg-buttons.jpg) no-repeat 0 100%;
border: none;
color: #000;
font-weight: bold;
height: 26px;
padding-bottom: 1px;
width: 90px;
}
.green-but {
background: url(@templates_base@/img/bg-button-left.png) no-repeat 0 0;
color: #fff;
display: inline-block;
font-weight: bold;
height: 26px;
line-height: 26px;
margin: 0 20px 0 0;
padding: 0 0 0 20px;
text-decoration: none;
}
.green-but:hover { color: #fff; text-decoration: none; }
.green-but span {
background: url(@templates_base@/img/bg-button-right.png) no-repeat 100% 0;
display: inline-block;
height: 26px;
margin: 0 -19px 0 0;
padding: 0 20px 0 0;
}
.grey-but {
background: url(@templates_base@/img/bg-button-left.png) no-repeat 0 100%;
color: #3c3c3c;
display: inline-block;
font-weight: bold;
height: 26px;
line-height: 26px;
padding: 0 0 0 20px;
text-decoration: none;
}
.grey-but:hover { color: #3c3c3c; text-decoration: none; }
.grey-but span {
background: url(@templates_base@/img/bg-button-right.png) no-repeat 100% 100%;
display: inline-block;
height: 26px;
margin: 0 -19px 0 0;
padding: 0 20px 0 0;
}
/*** Login form ***/
.login-form {
padding: 0;
}
.login-form p {
padding: 5px 0;
}
.login-form label {
display: block;
font-weight: bold;
padding-bottom: 5px;
}
.login-form .field {
width: 230px;
}
/* Footer
*******************************************************************************/
#footer {
margin: 0 auto;
width: 960px;
}
#footer .copy {
float: left;
font-family: Tahoma,Arial,Verdana,Sans-Serif;
padding-top: 18px;
width: 580px;
}
#footer .copy .doplinks {
color: #a8a8a8;
padding-top: 15px;
}
#footer .copy .doplinks a { padding: 0 15px; }
#footer .copy .doplinks a:first-child { padding-left: 0; }
#footer .links {
background: url(@templates_base@/img/bg-blinks.jpg) no-repeat 0 0;
float: left;
padding: 18px 0 36px 16px;
width: 124px;
}
#footer .links ul li {
background: url(@templates_base@/img/li-blinks.gif) no-repeat 0 6px;
padding: 0 0 0 11px;
}
#footer .payment {
float: left;
font-weight: bold;
padding: 18px 0 36px;
text-align: right;
width: 230px;
}
#footer .payment .logos {
padding: 0 0 20px;
}
#footer .payment a {
padding: 0 3px;
}
.basketStatus {
position: absolute;
top: 153px;
left: 247px;
display: block;
z-index: 5000;
}
.basketStatus .basketContent {
background-color: #fff;
width: 230px;
font-weight: bold;
position:relative;
z-index:5001;
color: #333;
padding: 12px 25px;
box-shadow: 0 0 3px #444;
-moz-box-shadow: 0 0 3px #444;
-webkit-box-shadow: 0 0 3px #444;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
.basketStatus .basketArrow {
background: url(@templates_base@/img/con-basket-arrow.png) no-repeat 0 0;
height: 15px;
margin: -55px 0 0 22px;
position: relative;
width: 26px;
z-index: 5006;
}
.basketStatus .basketContent .subtitle { color: #62aa2c; padding-bottom: 15px; }
.basketStatus .basketContent .img {
float: left;
padding-right: 15px;
}
.basketStatus .basketContent .info { color: #333; }
/* --- Item Rating Styles --- */
.ratingblock, .ratingblock div {
display: -moz-inline-block;
}
.voted {
color: #999;
}
.thanks {
color: #36AA3D;
}
.static {
color: #5D3126;
}
.inline-rating {
display:-moz-inline-block;
display:-moz-inline-box;
display:inline-block;
vertical-align: middle;
}
.star-rating,
.star-rating a:hover,
.star-rating a:active,
.star-rating a:focus,
.star-rating .current-rating{
background: url('@templates_base@/img/star_sprite.gif') left -1000px repeat-x;
}
.star-rating {
position:relative;
width:125px;
height:25px;
overflow:hidden;
list-style:none;
margin:0;
padding:0;
background-position: left top;
}
.star-rating li {
display: inline;
}
.star-rating a,
.star-rating .current-rating {
position:absolute;
top:0;
left:0;
text-indent:-1000em;
height:25px;
line-height:25px;
outline:none;
overflow:hidden;
border: none;
}
.star-rating a:hover,
.star-rating a:active,
.star-rating a:focus {
background-position: left bottom;
}
.star-rating a.r1-unit { width:20%;z-index:6; }
.star-rating a.r2-unit { width:40%;z-index:5; }
.star-rating a.r3-unit { width:60%;z-index:4; }
.star-rating a.r4-unit { width:80%; z-index:3; }
.star-rating a.r5-unit { width:100%; z-index:2; }
.star-rating .current-rating { z-index:1; background-position: left center; }
.small-star {
width:50px;
height:10px;
}
.small-star, .small-star a:hover, .small-star a:active,
.small-star a:focus, .small-star .current-rating {
background-image: url('@templates_base@/img/star_sprite_small.gif');
line-height: 10px;
height: 10px;
}
\ No newline at end of file
Index: branches/1.0.x/inc/js/list_manager.js
===================================================================
--- branches/1.0.x/inc/js/list_manager.js (revision 14979)
+++ branches/1.0.x/inc/js/list_manager.js (revision 14980)
@@ -1,257 +1,338 @@
function ListManager() {}
ListManager.containerSelector = ''; // selector id of container
ListManager.url = ''; // url to template with list contents
ListManager.urlParams = {layout: 'list'};
ListManager.filters = {};
ListManager.xhrRequests = [];
ListManager.reloadTimer = null;
ListManager.reloadTimeout = 1000;
ListManager.firstLoad = true;
ListManager.getUrl = function () {
var $url = this.url;
}
ListManager.cancelXHRRequests = function () {
while ( this.xhrRequests.length > 0 ) {
this.xhrRequests.shift().abort();
}
}
ListManager.reload = function ($now) {
this.cancelXHRRequests();
if ( $now === undefined || $now === false ) {
this.updateAnchor();
return;
}
var $container = $(this.containerSelector);
$container.fadeTo('fast', 0.7);
var $request = $.post(
this.url,
this.urlParams,
function ($data) {
$container.html($data).fadeTo('fast', 1.0);
}
);
this.xhrRequests.push($request);
}
ListManager.scheduleReload = function () {
var $me = this;
clearTimeout(this.reloadTimer);
this.reloadTimer = setTimeout(function() { $me.reload(); }, this.reloadTimeout);
}
ListManager.setParam = function ($name, $value, $reload) {
if ( $value === undefined || $value === '' ) {
// don't pass empty parameters
delete this.urlParams[$name];
}
else {
this.urlParams[$name] = $value;
}
if ( $reload === true ) {
this.reload();
}
}
ListManager.getParam = function ($name) {
return this.urlParams[$name] !== undefined ? this.urlParams[$name] : false;
}
ListManager.updateAnchor = function () {
var $query_string = [],
$url_params = sort_object(this.urlParams);
for (var $param_name in $url_params) {
$query_string.push( $param_name + '=' + encodeURIComponent(this.urlParams[$param_name]) );
}
window.location.hash = '#' + $query_string.join('&');
}
ListManager.parseAnchor = function ($anchor) {
var $query_string = {};
$anchor.replace(
new RegExp('([^?=&]+)(=([^&]*))?', 'g'),
function($0, $1, $2, $3) {
$query_string[$1] = decodeURIComponent($3);
}
);
this.urlParams = $query_string;
// sync values from url params into empty filters on first page with anchor load
this.initFilters();
this.reload(true);
}
+ListManager.replaceFilter = function ($form_id, $form_html) {
+ $('#' + $form_id).replaceWith($form_html);
+}
+
+ListManager.replaceCounters = function ($field, $counters) {
+ // reset all counters in case if we got less, then are displayed right now
+ $('.filter-counter', '#filter-form-' + $field).text('0');
+
+ for (var $option_value in $counters) {
+ $('#' + jq('filter-counter[' + $field + '][' + $option_value + ']')).text($counters[$option_value]);
+ }
+}
+
ListManager.registerFilter = function ($field) {
var $manager = this,
$form = $('#filter-form-' + $field);
$manager.filters[$field] = {'type': $form.attr('filter_type')};
- $('h2:first a', $form).click(
+ /*$('h2:first a', $form).click(
function ($e) {
var $header = $(this).parent(),
$active = $header.hasClass('active');
$header.toggleClass('active', !$active);
$header.next().toggleClass('noactive', $active);
return false;
}
+ );*/
+
+ $('h2:first .reset-filter', $form).click(
+ function ($e) {
+ $manager.resetFilter($field);
+
+ return false;
+ }
);
switch( $manager.filters[$field].type ) {
case 'radio':
$("input[type='radio']", $form).click(
function ($e) {
- $manager.updateFilterParams();
+ $manager.updateFilterParams($field);
}
);
break;
case 'checkbox':
$("input[type='checkbox']", $form).click(
function ($e) {
var $checkbox = $(this),
$hidden_id = $checkbox.attr('id').replace(/_([\d\w-=]|)+$/, ''),
$regexp = new RegExp(jq($hidden_id) + '_([\\d\\w-=]+)');
if ( $checkbox.val() == '' ) {
// "All" checkbox
$("input[type='checkbox']", $form).not($checkbox).attr('checked', false);
}
else if ( $checkbox.is(':checked') ) {
$("input[type='checkbox'][value='']", $form).attr('checked', false);
}
update_checkbox_options($regexp, $hidden_id, $form);
- $manager.updateFilterParams();
+ $manager.updateFilterParams($field);
}
);
break;
}
}
+ListManager.resetFilters = function ($reload) {
+ for (var $filter_field in this.filters) {
+ this.resetFilter($filter_field, $reload);
+ }
+}
+
+ListManager.resetFilter = function ($field, $reload) {
+ var $manager = this,
+ $form = $('#filter-form-' + $field);
+
+ switch( $manager.filters[$field].type ) {
+ case 'radio':
+ $("input[type='radio'][value='']", $form).attr('checked', true);
+ break;
+
+ case 'checkbox':
+ var $checkbox = $("input[type='checkbox'][value='']", $form),
+ $hidden_id = $checkbox.attr('id').replace(/_([\d\w-=]|)+$/, ''),
+ $regexp = new RegExp(jq($hidden_id) + '_([\\d\\w-=]+)');
+
+ $checkbox.attr('checked', true);
+ $("input[type='checkbox']", $form).not($checkbox).attr('checked', false);
+
+ update_checkbox_options($regexp, $hidden_id, $form);
+ break;
+
+ case 'range':
+ var $param_name = 'filters[' + $field + ']',
+ $slider = $('#' + jq($param_name + '_slider') );
+
+ $slider.slider('option', 'values', [$slider.slider('option', 'min'), $slider.slider('option', 'max')]);
+
+ $('#' + jq($param_name) ).val('');
+ break;
+ }
+
+ $manager.updateFilterParams($field, $reload);
+}
+
ListManager.initFilters = function () {
if ( !this.firstLoad ) {
return;
}
for (var $filter_field in this.filters) {
this.initFilter($filter_field);
}
this.firstLoad = false;
}
+ListManager.toggleFilter = function ($field, $toggle) {
+ var $form = $('#filter-form-' + $field),
+ $param_value = this.getParam('filters[' + $field + ']');
+
+ if ( $toggle === undefined ) {
+ $toggle = $param_value !== false && $param_value !== '';
+ }
+
+ $('h2:first', $form).toggleClass('active', $toggle);
+ $('h2:first .reset-filter', $form).toggle($toggle);
+}
+
ListManager.initFilter = function ($field) {
var $values = '',
$form = $('#filter-form-' + $field),
$param_name = 'filters[' + $field + ']',
$param_value = this.getParam($param_name);
if ( $param_value === false || $param_value === '' ) {
return;
}
+ this.toggleFilter($field);
+
switch( this.filters[$field].type ) {
case 'radio':
$('#' + jq($param_name + '_' + $param_value) ).attr('checked', true);
break;
case 'checkbox':
$values = $param_value.substring(1, $param_value.length - 1).split('|');
for (var $i = 0; $i < $values.length; $i++) {
$('#' + jq($param_name + '_' + $values[$i]) ).attr('checked', true);
}
$('#' + jq($param_name + '_') ).attr('checked', false);
$('#' + jq($param_name) ).val($param_value);
break;
case 'range':
var $slider = $('#' + jq($param_name + '_slider') ),
$slider_options = {
- min: $slider.slider('option', 'min'),
- max: $slider.slider('option', 'max'),
- step: $slider.slider('option', 'step')
- };
+ min: $slider.slider('option', 'min'),
+ max: $slider.slider('option', 'max'),
+ step: $slider.slider('option', 'step')
+ };
$values = $param_value.split('-');
$values = this.invertRange($slider_options, $values[0], $values[1]);
$slider.slider('option', 'values', $values);
$('#' + jq($param_name) ).val($param_value);
break;
}
this.syncChecked( $("input[type=checkbox], input[type=radio]", '#filter-form-' + $field) );
}
ListManager.invertRange = function ($options, $min, $max) {
var $min_value = $options.min + (($options.max - $max) / $options.step) * $options.step,
$max_value = $options.max - (($min - $options.min) / $options.step) * $options.step;
return [$min_value, $max_value];
}
ListManager.syncChecked = function ($checkboxes) {
$checkboxes.each(
function () {
var $me = $(this),
$checked = $me.is(':checked'),
$dt = $me.parent(),
$dd = $dt.next();
$dt.toggleClass('active', $checked);
$dd.toggleClass('active', $checked);
}
);
}
-ListManager.updateFilterParams = function () {
+ListManager.updateFilterParams = function ($current_field, $reload) {
var $form_fields;
for (var $field in this.filters) {
$form_fields = $('#filter-form-' + $field).serializeArray();
for (var $i = 0; $i < $form_fields.length; $i++) {
this.setParam($form_fields[$i].name, $form_fields[$i].value);
}
this.syncChecked( $("input[type=checkbox], input[type=radio]", '#filter-form-' + $field) );
}
- this.scheduleReload();
+ if ( $current_field !== undefined ) {
+ this.toggleFilter($current_field);
+ this.setParam('exclude_filters', $current_field);
+ }
+
+ if ( $reload === undefined || $reload === true ) {
+ this.scheduleReload();
+ }
}
ListManager.init = function () {
var $manager = this;
this.firstLoad = window.location.hash.length > 1;
$('body').bind(
'anchorchanged',
function ($e, $anchor) {
$manager.parseAnchor($anchor);
}
);
}
\ No newline at end of file
Index: branches/1.0.x/elements/filters.elm.tpl
===================================================================
--- branches/1.0.x/elements/filters.elm.tpl (revision 14979)
+++ branches/1.0.x/elements/filters.elm.tpl (revision 14980)
@@ -1,125 +1,151 @@
<inp2:m_DefineElement name="filter_text_block" PrefixSpecial="item-filter" filter_type="text" is_list="0">
<input type="text" name="<inp2:FilterInputName/>" id="<inp2:FilterInputName/>" value="<inp2:FilterField/>"/>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="filter_select_block" PrefixSpecial="item-filter" filter_type="select" is_list="0">
<select name="<inp2:FilterInputName/>" id="<inp2:FilterInputName/>">
</select>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="filter_radio_element">
<dt<inp2:m_if check="m_Param" name="selected"> class="active"</inp2:m_if>>
<input type="radio"<inp2:m_if check="m_Param" name="selected"> checked</inp2:m_if> name="<inp2:FilterInputName/>" id="<inp2:FilterInputName/>_<inp2:m_param name='key'/>" value="<inp2:m_param name='key'/>"/> <label for="<inp2:FilterInputName/>_<inp2:m_param name='key'/>"><inp2:m_Param name="title"/></label>
</dt>
- <dd<inp2:m_if check="m_Param" name="selected"> class="active"</inp2:m_if>>(<inp2:m_Param name="count"/>)</dd>
+ <dd<inp2:m_if check="m_Param" name="selected"> class="active"</inp2:m_if>>(<span id="filter-counter[<inp2:m_Param name='filter_field'/>][<inp2:m_param name='key'/>]" class="filter-counter"><inp2:m_Param name="count"/></span>)</dd>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="filter_radio_block" PrefixSpecial="item-filter" filter_type="radio" is_list="0">
<dl class="manufacturer">
<inp2:ListFilterOptions render_as="filter_radio_element" pass_params="1"/>
</dl>
<div class="clear"></div>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="filter_checkbox_element" form_id="">
<dt<inp2:m_if check="m_Param" name="selected"> class="active"</inp2:m_if>>
<input type="checkbox"<inp2:m_if check="m_Param" name="selected"> checked</inp2:m_if> id="<inp2:FilterInputName/>_<inp2:m_param name='key'/>" value="<inp2:m_param name='key'/>"/> <label for="<inp2:FilterInputName/>_<inp2:m_param name='key'/>"><inp2:m_Param name="title"/></label>
</dt>
- <dd<inp2:m_if check="m_Param" name="selected"> class="active"</inp2:m_if>>(<inp2:m_Param name="count"/>)</dd>
+ <dd<inp2:m_if check="m_Param" name="selected"> class="active"</inp2:m_if>>(<span id="filter-counter[<inp2:m_Param name='filter_field'/>][<inp2:m_param name='key'/>]" class="filter-counter"><inp2:m_Param name="count"/></span>)</dd>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="filter_checkbox_block" PrefixSpecial="item-filter" filter_type="checkbox" is_list="0">
<dl class="manufacturer">
<inp2:ListFilterOptions render_as="filter_checkbox_element" form_id="filter-form-{$filter_field}" pass_params="1"/>
</dl>
<div class="clear"></div>
<input type="hidden" name="<inp2:FilterInputName/>" id="<inp2:FilterInputName/>" value="<inp2:FilterField/>"/>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="filter_range_value_element">
<li>
<!--##<inp2:m_param name='key'/>; ##--><inp2:m_Param name="title"/>
</li>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="filter_range_count_element">
- <li>(<inp2:m_Param name="count"/>)</li>
+ <li>(<span id="filter-counter[<inp2:m_Param name='filter_field'/>][<inp2:m_param name='key'/>]" class="filter-counter"><inp2:m_Param name="count"/></span>)</li>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="filter_range_block" PrefixSpecial="item-filter" filter_type="range" is_list="0">
<div class="range-block">
<ul class="range">
<inp2:ListFilterOptions render_as="filter_range_value_element" pass_params="1"/>
</ul>
<div class="slider-vertical" id="<inp2:FilterInputName/>_slider" style="height:260px;"></div>
<ul class="range2">
<inp2:ListFilterOptions render_as="filter_range_count_element" pass_params="1"/>
</ul>
<div class="clear"></div>
</div>
<script type="text/javascript">
$(document).ready(
function() {
var $slider_options = {
min: <inp2:m_Get name="min_range_value"/>,
max: <inp2:m_Get name="max_range_value"/>,
step: <inp2:m_Get name="range_step"/>
},
$options = {
orientation: 'vertical',
range: true,
values: [<inp2:m_Get name="selected_from_range"/>, <inp2:m_Get name="selected_to_range"/>],
change: function(event, ui) {
// jQuery UI slider has inverted range - fix that here
var $selected_range = ListManager.invertRange($slider_options, ui.values[0], ui.values[1]);
- $('#' + jq('<inp2:FilterInputName/>')).val($selected_range[0] + '-' + $selected_range[1]);
- ListManager.updateFilterParams();
+ if ( $selected_range[0] == $slider_options.min && $selected_range[1] == $slider_options.max ) {
+ $('#' + jq('<inp2:FilterInputName/>')).val('');
+ }
+ else {
+ $('#' + jq('<inp2:FilterInputName/>')).val($selected_range[0] + '-' + $selected_range[1]);
+ }
+
+ ListManager.updateFilterParams('<inp2:m_Param name="filter_field"/>');
}
},
$values = ListManager.invertRange($slider_options, $options.values[0], $options.values[1]);
$options.values[0] = $values[0];
$options.values[1] = $values[1];
$.extend($options, $slider_options);
$( '#' + jq('<inp2:FilterInputName/>_slider') ).slider($options);
}
);
</script>
<input type="hidden" name="<inp2:FilterInputName/>" id="<inp2:FilterInputName/>" value="<inp2:FilterField/>"/>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="filter_element" PrefixSpecial="item-filter" prefix="" filter_field="" filter_type="" is_list="0">
<inp2:m_IFDataExists>
<inp2:m_ifnot check="m_Param" name="is_list">
<inp2:ReloadItem prefix="$prefix" field="$filter_field"/>
</inp2:m_ifnot>
<form action="<inp2:m_FormAction/>" id="filter-form-<inp2:m_Param name='filter_field'/>" method="post" class="filter-form" filter_field="<inp2:m_Param name='filter_field'/>" filter_type="<inp2:m_Param name='filter_type'/>">
<div class="block alt-block">
- <h2 class="active"><a href="#">Filter by <inp2:m_Phrase name="lu_fld_{$filter_field}"/></a></h2>
+ <h2>
+ <em class="filter-header">
+ Filter by <inp2:m_Phrase name="lu_fld_{$filter_field}"/>
+ </em>
+
+ <a href="#" class="reset-filter" style="display: none;">
+ <img src="<inp2:m_TemplatesBase/>img/btn_reset_filter.png" width="18" height="18" alt="Reset Filter"/>
+ </a>
+ </h2>
<div class="block-content">
<inp2:m_RenderElement name="filter_{$filter_type}_block" pass_params="1"/>
</div>
</div>
<script type="text/javascript">
$(document).ready(
function () {
ListManager.registerFilter('<inp2:m_Param name="filter_field"/>');
}
);
</script>
</form>
</inp2:m_IFDataExists>
</inp2:m_DefineElement>
+
+<inp2:m_DefineElement name="filter_counter_element">
+ '<inp2:m_Param name="key"/>': <inp2:m_Param name="count"/><inp2:m_ifnot check="m_Param" name="is_last">,</inp2:m_ifnot>
+</inp2:m_DefineElement>
+
+<inp2:m_DefineElement name="filter_counters_element">
+ ListManager.replaceCounters('<inp2:m_Param name="filter_field"/>', {<inp2:ListFilterOptions render_as="filter_counter_element" pass_params="1" strip_nl="2"/>});
+</inp2:m_DefineElement>
+
+<inp2:m_DefineElement name="used_filter_element">
+ ListManager.replaceFilter('filter-form-<inp2:m_Param name="filter_field"/>', '<inp2:m_RenderElement name="filter_element" pass_params="1" js_escape="1"/>');
+</inp2:m_DefineElement>
\ No newline at end of file
Index: branches/1.0.x/elements/sorting.elm.tpl
===================================================================
--- branches/1.0.x/elements/sorting.elm.tpl (revision 14979)
+++ branches/1.0.x/elements/sorting.elm.tpl (revision 14980)
@@ -1,135 +1,136 @@
<inp2:m_DefaultParam prefix="" list_name="" layout="list" ajax="0"/>
<div class="filter-block">
<div class="paginate">
<a href="#prev" class="prev"><img src="<inp2:m_TemplatesBase/>img/arrow-left.png" width="7" height="13" alt="" /></a>
Products
<select id="paginate">
<inp2:m_DefineElement name="option_page_current">
<option value="<inp2:m_param name='page'/>" selected><inp2:m_param name="from_record"/> - <inp2:m_param name="to_record"/></a>
</inp2:m_DefineElement>
<inp2:m_DefineElement name="option_page_link">
<option value="<inp2:m_param name='page'/>"><inp2:m_param name="from_record"/> - <inp2:m_param name="to_record"/></a>
</inp2:m_DefineElement>
<inp2:$prefix_PaginationBar list_name="$list_name" current_render_as="option_page_current" link_render_as="option_page_link"/>
</select>
out of <inp2:p_TotalRecords/>
<a href="#next" class="next"><img src="<inp2:m_TemplatesBase/>img/arrow-right.png" width="7" height="13" alt="" /></a>
</div>
<div class="sortby">
<form method="post" action="<inp2:m_FormAction/>">
Sort by:
<select name="<inp2:p_CombinedSortingDropDownName/>" id="sorting">
<option value="Name|asc" <inp2:p_SortingSelected sorting="l1_Name|asc" selected='selected="selected"'/>>Name</option>
<option value="Price|asc" <inp2:p_SortingSelected sorting="Price|asc" selected='selected="selected"'/>>Price Low</option>
<option value="Price|desc" <inp2:p_SortingSelected sorting="Price|desc" selected='selected="selected"'/>>Price High</option>
<option value="CachedRating|asc" <inp2:p_SortingSelected sorting="CachedRating|asc" selected='selected="selected"'/>>Rating</option>
</select>
Per Page:
<select name="<inp2:{$prefix}_VarName type='PerPage'/>" id="per-page">
<option value="10" <inp2:$prefix_PerPageSelected per_page="10" selected='selected="selected"'/>>10</option>
<option value="20" <inp2:$prefix_PerPageSelected per_page="20" selected='selected="selected"'/>>20</option>
<option value="50" <inp2:$prefix_PerPageSelected per_page="50" selected='selected="selected"'/>>50</option>
<option value="-1" <inp2:$prefix_PerPageSelected per_page="-1" selected='selected="selected"'/>>All</option>
</select>
</form>
- <a href="#" id="per-page-all">Show All</a>
+ <a href="#" id="show-all">Show All</a>
</div>
<div class="display_switch">
<a href="#" class="switch_thumb" layout="<inp2:m_Param name='layout'/>"></a>
</div>
<script type="text/javascript">
$(document).ready(
function() {
$('a.switch_thumb').click(
function ($e) {
var $me = $(this);
if ( $me.attr('layout') == 'list' ) {
$me.addClass('swap');
$('ul.display').fadeOut(
'fast',
function() {
$me.attr('layout', 'grid');
ListManager.setParam('layout', 'grid');
$('div.items').removeClass('border-radius').addClass('items-alt');
$(this).fadeIn('fast').addClass('thumb_view');
}
);
}
else {
$me.removeClass('swap');
$('ul.display').fadeOut(
'fast',
function() {
$me.attr('layout', 'list');
ListManager.setParam('layout', 'list');
$('div.items').addClass('border-radius').removeClass('items-alt');
$(this).fadeIn('fast').removeClass('thumb_view');
}
);
}
return false;
}
);
$('#paginate').change(
function () {
ListManager.setParam('page', $(this).val(), true);
}
);
$('.prev, .next', '.paginate').click(
function ($e) {
var $option = $('option:selected', '#paginate')[ $(this).attr('class') ]();
if ( $option.length ) {
$('#paginate').val( $option.attr('value') ).change();
}
return false;
}
);
$('#sorting').change(
function ($e) {
ListManager.setParam('sort_by', $(this).val().replace('|', ','), true);
}
);
$('#per-page').change(
function ($e) {
var $per_page = $(this).val();
if ( $per_page == -1 ) {
ListManager.setParam('page', '');
}
ListManager.setParam('per_page', $per_page, true);
}
);
- $('#per-page-all').click(
+ $('#show-all').click(
function () {
+ ListManager.resetFilters(false);
$('#per-page').val(-1).change();
return false;
}
);
}
);
</script>
</div>
<div class="clear"></div>
\ No newline at end of file
Index: branches/1.0.x/elements/content_boxes/products.elm.tpl
===================================================================
--- branches/1.0.x/elements/content_boxes/products.elm.tpl (revision 14979)
+++ branches/1.0.x/elements/content_boxes/products.elm.tpl (revision 14980)
@@ -1,44 +1,50 @@
<inp2:m_DefaultParam prefix="" list_name="" layout="list"/>
<inp2:m_if check="m_Get" name="ajax" equals_to="yes">
<inp2:m_NoDebug/>
<inp2:m_Get name="list_prefix" result_to_var="prefix"/>
<inp2:m_Get name="list_name" result_to_var="list_name"/>
<inp2:m_Get name="layout" result_to_var="layout"/>
</inp2:m_if>
<inp2:$prefix_InitList list_name="$list_name" main_list="1"/>
<inp2:m_Include template="elements/content_boxes.elm" strip_nl="2"/>
<inp2:m_Include template="elements/product_elements.elm" strip_nl="2"/>
<inp2:m_if check="{$prefix}_TotalRecords" list_name="$list_name">
<inp2:m_Include template="elements/sorting.elm" list_name="$list_name" prefix="$prefix" layout="$layout" ajax="1"/>
<div class="items <inp2:m_if check='m_Param' name='layout' equals_to='list'>border-radius<inp2:m_else/>items-alt</inp2:m_if>">
<ul class="display<inp2:m_if check='m_Param' name='layout' equals_to='grid'> thumb_view</inp2:m_if>">
<inp2:$prefix_ListProducts list_name="$list_name" render_as="product_list_element"/>
</ul>
<div class="clear"></div>
<inp2:m_Include template="elements/pagination.elm" list_name="$list_name" prefix="$prefix" ajax="1"/>
</div>
<script type="text/javascript">
$(document).ready(
function () {
$('.compare-checkbox').click(
function ($e) {
var $me = $(this);
compare_product($me.val(), $me.is(':checked'));
}
);
$('.addtocart', '#products').click(add_to_cart_handler);
}
);
</script>
<inp2:m_else/>
No Products
</inp2:m_if>
+
+<inp2:m_include template="elements/filters.elm"/>
+
+<script type="text/javascript">
+ <inp2:item-filter_PrintList render_as="filter_counters_element" list_name="$list_name" prefix="$prefix" is_list="1"/>
+</script>
\ No newline at end of file
Index: branches/1.0.x/img/btn_reset_filter.png
===================================================================
Cannot display: file marked as a binary type.
svn:mime-type = application/octet-stream
Property changes on: branches/1.0.x/img/btn_reset_filter.png
___________________________________________________________________
Added: svn:mime-type
## -0,0 +1 ##
+application/octet-stream
\ No newline at end of property
Index: branches/1.0.x/img/bg-block.png
===================================================================
Cannot display: file marked as a binary type.
svn:mime-type = application/octet-stream