From 7ef4987c07d5cdb219a95b1fdd3cc96688985e78 Mon Sep 17 00:00:00 2001 From: Manuel Raynaud Date: Fri, 13 Sep 2013 18:18:48 +0200 Subject: [PATCH] update new css --- .../default/assets/less/thelia/global.less | 10 +++ .../default/assets/less/thelia/product.less | 52 +++++++++---- .../default/assets/less/thelia/variables.less | 40 +++------- .../assets/themes/default/less/theme.less | 73 +++++++++++++------ .../assets/themes/default/less/variables.less | 4 +- 5 files changed, 112 insertions(+), 67 deletions(-) diff --git a/templates/default/assets/less/thelia/global.less b/templates/default/assets/less/thelia/global.less index b4645c948..52847c756 100755 --- a/templates/default/assets/less/thelia/global.less +++ b/templates/default/assets/less/thelia/global.less @@ -6,6 +6,16 @@ // Collapse .no-js .collapse { display: block!important; } +// thumbnail +.thumbnail { + &.active, + &:active { + border-style: solid; + border-width: 2px; + } + &.active { border-color: @gray-light; } +} + // Layout .main { margin-bottom: @line-height-computed; } .layout-col-1, diff --git a/templates/default/assets/less/thelia/product.less b/templates/default/assets/less/thelia/product.less index 946a3c2bc..e3b26c683 100755 --- a/templates/default/assets/less/thelia/product.less +++ b/templates/default/assets/less/thelia/product.less @@ -9,11 +9,16 @@ // Availibility .availability { + display: block; + // In Stock - &.in-stock {} + .in-stock { + font-style: italic; + text-transform: uppercase; + } // Out of Stock - &.out-of-stock {} + .out-of-stock {} } @@ -61,11 +66,33 @@ margin-bottom: @line-height-computed; } - .product-thumbnails { - > ul { + #product-thumbnails { + .carousel-inner { + margin: 0 auto; + width: 90%; + } + .carousel-control { + background-image: none; + display: none; // Need js + width: 4%; margin-top: -4px; + .icon-prev { + &:before { + .icon(@chevron-left); + } + } + .icon-next { + &:before { + .icon(@chevron-right); + } + } + } + + ul { .list-inline; - li { - width: 20%; + margin: 0; + > li { + margin: 0; padding: 0; + width: 19%; } } } @@ -80,13 +107,12 @@ } .product-price { margin-bottom: @line-height-computed; - .availability { - .availibity-label { .sr-only; } - font-style: italic; - text-transform: uppercase; - position: absolute; - right: 15px; - } + } + .product-cart { + background: @option-bg; + border: 1px solid @option-border; + border-radius: @option-border-radius; + margin-bottom: @line-height-computed; padding: @option-padding; } } diff --git a/templates/default/assets/less/thelia/variables.less b/templates/default/assets/less/thelia/variables.less index b4bf549d2..7ed29e8b8 100755 --- a/templates/default/assets/less/thelia/variables.less +++ b/templates/default/assets/less/thelia/variables.less @@ -5,7 +5,7 @@ @FontAwesomePath: "../font/fontawesome"; //bootstrap font -@icon-font-path: "../font/bootstrap/"; +@icon-font-path: "../font/bootstrap/"; // Grid system @grid-float-breakpoint: @screen-desktop; @@ -14,9 +14,9 @@ @legend-border-color: transparent; // Buttons -@btn-default-color: #333; -@btn-default-bg: #f5f5f5; -@btn-default-border: #ccc; +@btn-default-color: #333; +@btn-default-bg: #f5f5f5; +@btn-default-border: #ccc; @btn-primary-color: #fff; @btn-primary-bg: @brand-primary; @@ -74,14 +74,14 @@ @block-subheading-font-size: ceil(@font-size-base * 1.1); // 15.4px // Thelia : Block Links -@block-nav-bg: transparent; -@block-nav-hover-bg: #f7f7f7; -@block-nav-border: #eee; -@block-nav-color: #747474; +@block-nav-bg: transparent; +@block-nav-hover-bg: #f7f7f7; +@block-nav-border: #eee; +@block-nav-color: #747474; // Thelia : Block Links @block-links-bg: transparent; -@block-links-hover-bg: #f7f7f7; +@block-links-hover-bg: darken(@body-bg, 8%); @block-links-border: #fff; @block-links-color: #747474; @@ -112,25 +112,3 @@ @option-heading-border: darken(@body-bg, 12.5%); //#dfdfdf @option-heading-color: @text-color; @option-heading-font-size: @font-size-base; - - -// Callout -@callout-bg: @body-bg; -@callout-border: #ddd; -@callout-text: @text-color; - -@callout-success-text: @state-success-text; -@callout-success-border: @state-success-border; -@callout-success-bg: @state-success-bg; - -@callout-warning-text: @state-warning-text; -@callout-warning-border: @state-warning-border; -@callout-warning-bg: @state-warning-bg; - -@callout-danger-text: @state-danger-text; -@callout-danger-border: @state-danger-border; -@callout-danger-bg: @state-danger-bg; - -@callout-info-text: @state-info-text; -@callout-info-border: @state-info-border; -@callout-info-bg: @state-info-bg; diff --git a/templates/default/assets/themes/default/less/theme.less b/templates/default/assets/themes/default/less/theme.less index 64da7a255..62ee4afa0 100755 --- a/templates/default/assets/themes/default/less/theme.less +++ b/templates/default/assets/themes/default/less/theme.less @@ -41,16 +41,6 @@ label { font-weight: 600; } .box-shadow(none); } -// thumbnail -.thumbnail { - &.active, - &:active { - border-style: solid; - border-width: 5px; - } - &.active { border-color: @gray-light; } -} - // Navbar .navbar { @@ -169,9 +159,9 @@ header { font-weight: 600; text-align: left; text-shadow: none; - + @media (min-width: @screen-desktop) { padding: 2px 15px 2px 5px; } - + &:hover, &:focus { background-color: @brand-primary; @@ -208,7 +198,7 @@ header { font-weight: 600; text-align: left; text-shadow: none; - + @media (min-width: @screen-desktop) { padding: 2px 15px 2px 5px; } &:hover, @@ -252,7 +242,7 @@ header { // Products List #category-products .btn-cart { .btn-secondary; - + &:before { content: @shopping-cart; font-size: 1.3em; @@ -335,6 +325,9 @@ td.product, } } +// Availibility +.availibity-label { .sr-only; } + .products-grid, .products-list { @@ -600,6 +593,38 @@ td.product, margin-bottom: 10px; } } + .product-cart { + background-color: #f5f5f5!important; + margin-bottom: @line-height-computed; padding: 10px!important; + } +} + +#product-thumbnails { + .carousel-control { + width: 17px!important; + &.left { + border-right: 7px solid #ccc; + color: #ccc; + text-align: left; + > .icon-prev { + left: 0; margin-left: 0; margin-top: -15px; + &:before { + color: inherit; + content: @caret-left!important; + } + } + } + &.right { + border-left: 7px solid #ccc; + text-align: right; + > .icon-next { + left: auto; right: 0; margin-left: 0; margin-top: -15px; + &:before { + content: @caret-right!important; + } + } + } + } } @media (min-width: @screen-tablet) { @@ -613,7 +638,13 @@ td.product, // Product Details #product-details { - + .group-qty { + .form-control { + display: inline-block; + margin-right: 1em; margin-left: .4em; + width: 100px; + } + } } } } @@ -896,7 +927,7 @@ td.product, } // Add address button -#account-address, +#account-address, #delivery-address { .btn-add-address { .btn-link; @@ -1021,7 +1052,7 @@ td.product, margin-right: .3em; vertical-align: middle; } - + &:hover, &:focus { color: @link-hover-color; } } @@ -1075,7 +1106,7 @@ td.product, } .table-cart { - + thead, tbody, tfoot { @@ -1139,14 +1170,14 @@ td.product, padding: 12px; text-align: left; width: 100%; - + &:hover, &:focus, &:active, &.active { background-color: @brand-primary; } - + &.disabled, &[disabled] { &, @@ -1158,7 +1189,7 @@ td.product, } } } - + @media (min-width: @screen-tablet) { .btn-step { border-top: 0; diff --git a/templates/default/assets/themes/default/less/variables.less b/templates/default/assets/themes/default/less/variables.less index cb9c3fcac..3d2a48061 100755 --- a/templates/default/assets/themes/default/less/variables.less +++ b/templates/default/assets/themes/default/less/variables.less @@ -50,8 +50,8 @@ // Pager -@pager-border-radius: 0; -@pager-disabled-color: @gray-light; +@pager-border-radius: 0; +@pager-disabled-color: @gray-light; // Navbar