bebeboutik/themes/site/css/less/header.less
Srv Bebeboutik 340bc7c146 push site
2016-01-04 12:48:08 +01:00

561 lines
9.3 KiB
Plaintext
Executable File

#header {
.header;
position: ~`@{header_fixed} == "no"? "absolute": "fixed"`;
width: 100%;
z-index: 5;
> .content {
padding-top: @header_border;
height: @header_height;
> .top {
height: @header_height;
> .content {
width: 980px;
margin: 0px auto;
padding-top: 6px;
height: @header_height;
position: relative;
.logo_block {
float: left;
//height: @header_logo_height;
height: 70px;
//padding-top: (@header_height - @header_logo_height) / 2 + 1px;
}
}
}
}
}
#sales_menu {
display: block;
clear: both;
padding-top: 8px;
ul {
list-style: outside none;
margin: 0px;
padding: 0px;
}
> ul {
.gradient(#656297, #4B487D, #565388);
height: 47px;
> li {
position: relative;
height: 47px;
float: left;
&:hover > a span, &.selected > a span {
color: #E36EA2;
}
> a {
display: block;
line-height: 1em;
padding: 15px 0px 0px;
height: 32px;
text-decoration: none;
span {
line-height: 15px;
vertical-align: middle;
color: #ffffff;
font-family: Georgia;
font-size: 18px;
font-style: italic;
display: block;
border-left: 1px solid #8982C2;
padding: 0px 15px;
}
}
ul {
display: none;
position: absolute;
z-index: 10;
background: #cccccc;
.boxshadow(~"0px 0px 5px rgba(0, 0, 0, 0.3)");
padding: 0px 1px 1px 0px;
width: 612px;
max-height: 355px;
&:before {
content: "";
line-height: 0px;
font-size: 0px;
width: 0px;
height: 0px;
border: 10px solid transparent;
border-bottom: 10px solid #ffffff;
position: absolute;
margin-top: -19px;
left: 27px;
}
&.single {
width: 306px;
}
&.long {
overflow-y: auto;
width: 632px;
}
a {
text-decoration: none;
display: block;
width: 305px - 10px;
height: 60px;
padding: 5px;
}
li {
height: 60px + 10px;
float: left;
width: 305px;
background: #ffffff;
margin: 1px 0px 0px 1px;
&:hover {
background: #f3f3f3;
strong {
color: #796DC7;
}
}
}
strong {
color: #000000;
font-family: Georgia, Times new roman, serif;
font-weight: normal;
font-style: italic;
display: block;
margin-top: 8px;
font-size: 14px;
}
span span {
display: block;
color: #888888;
font-size: 12px;
margin-top: 5px;
}
img {
width: 60px;
height: 60px;
margin-right: 10px;
float: left;
}
.desc_wrapper {
width: 305px - 60px - 10px - 10px;
float: left;
height: 60px;
}
}
&:hover ul {
display: block;
}
}
> li:first-child > a span {
border-left: 0px;
}
}
}
#shopping_cart_container {
float: right !important;
background: #E36EA2;
color: #ffffff !important;
font-style: italic;
font-size: 18px !important;
font-family: Georgia, Times new roman, serif;
height: 35px !important;
padding: 12px 15px 0px 0px;
cursor: pointer;
a {
.gradient(#656297, #4B487D, #565388);
height: 35px;
float: left;
color: #ffffff;
display: inline-block;
padding: 12px 15px 0px;
margin-right: 15px;
text-decoration: none;
font-style: italic;
font-size: 18px;
margin-top: -12px;
font-family: Georgia, Times new roman, serif;
line-height: 1em !important;
}
&:before {
content: "";
background: url("../img/minicart.png") no-repeat top left;
width: 20px;
height: 19px;
line-height: 0px;
font-size: 0px;
position: absolute;
margin-left: -17px;
}
span, div {
color: #ffffff !important;
font-style: italic;
font-size: 18px !important;
line-height: 1em !important;
font-family: Georgia, Times new roman, serif !important;
}
.ajax_cart_product_txt, .ajax_cart_product_txt_s, .ajax_cart_total {
display: none !important;
}
}
#subheader {
border-bottom: @header_sub_border_bottom;
height: @header_sub_height;
border-top: @header_sub_border_top;
position: ~`@{header_fixed} == "no"? "absolute": "fixed"`;
top: @header_height + @header_border;
z-index: 4;
width: 100%;
left: 0px;
.header_sub;
}
.breadcrumb {
top: @header_height + @header_border;
position: ~`@{header_fixed} == "no"? "absolute": "fixed"`;
z-index: 4;
width: 980px;
padding-top: 11px;
height: (@header_sub_height + 1px) / 2 + 7px;
color: ~`@{header_sub_invert} == "no"? "@{color_text}": "@{color_alttext}"`;
a, span {
margin-right: 5px;
}
.navigation-pipe {
color: ~`@{header_sub_invert} == "no"? "@{color_alttext}": "@{color_text}"`;
}
}
body.doubleCol .breadcrumb {
margin-left: -220px;
}
body#category.doubleCol .breadcrumb {
margin-left: -200px;
}
#authentication #subheader,
#index #subheader,
#authentication .breadcrumb,
#index .breadcrumb {
display: ~`@{header_sub_loggedonly} == "no"? "block": "none"`;
}
#authentication #header,
#index #header {
border-bottom: ~`@{header_sub_loggedonly} == "no"? "0px": "@{header_sub_loggedonly_border}"`;
}
#index.logged {
/*#subheader,
.breadcrumb {
display: block;
}*/
#header {
border-bottom: ~`@{header_sub_loggedonly} == "no"? "0px": "@{header_sub_loggedonly_border}"`;
}
}
#header_user {
.header_infos;
float:right;
ul#header_nav {
float:left;
margin: 0px;
list-style: none outside;
> li {
float:left;
list-style: none outside;
}
}
> p {
text-align: right;
margin-top: 9px;
span {
color: #E26EA2;
}
}
}
/*
#header_user {
position: absolute;
left: 280px;
top: -6px;
ul#header_nav {
margin: 0px;
list-style: none outside;
> li {
float: left;
border-left: 1px solid #e4e4e4;
> a {
display: block;
width: 174px;
height: 86px;
}
&.first.large > a {
width: 224px;
}
}
}
}
#header_user ul#header_nav > li > a span,
#cart_block_summary span {
display: block;
font-family: "BebasRegular", "Trebuchet MS", sans-serif;
font-size: 18px;
color: #444d52;
padding-top: 26px;
padding-left: 18px;
text-transform: uppercase;
font-weight: normal;
}
#header #header_user ul#header_nav > li {
> a span.desc {
font-family: sans-serif;
font-size: 12px;
padding-top: 2px;
text-transform: none;
}
&.first {
> a span {
color: #4f82f5;
&.desc {
color: #444d52;
}
}
}
a:hover {
text-decoration: none;
background: #444d52 url("../img/pattern2.png") repeat 0px 6px;
}
}
#header_user ul#header_nav > li a:hover span,
#header_user ul#header_nav > li.first > a:hover span,
#header_user ul#header_nav > li.last > a.active span,
#cart_block_summary.active span,
#cart_block_summary:hover span {
color: #ffffff;
}
#header #cart_block {
display: block;
width: 173px;
height: 86px;
position: absolute;
right: 0px;
top: -6px;
border-left: 1px solid #e4e4e4;
border-right: 1px solid #e4e4e4;
.block_content {
position: relative;
}
}
#cart_block_summary {
display: block;
width: 173px;
height: 86px;
cursor: pointer;
span.ajax_cart_quantity,
span.ajax_cart_product_txt,
span.ajax_cart_product_txt_s,
span.ajax_cart_total,
span.ajax_cart_no_product {
display: inline;
font-size: 12px;
font-family: sans-serif;
text-transform: none;
color: #f96608;
padding-top: 2px;
}
span.ajax_cart_product_txt,
span.ajax_cart_product_txt_s,
span.ajax_cart_total {
padding-left: 0px;
}
}
#header_user ul#header_nav > li.last > a.active,
#cart_block_summary.active,
#cart_block_summary:hover {
background: #444d52 url("../img/pattern2.png") repeat 0px 6px;
}
#cart_block_list {
display: none;
position: absolute;
z-index: 10;
right: 0px;
top: 86px;
background: #444d52 url("../img/pattern2.png") repeat;
padding: 18px;
width: 224px;
#cart-prices {
border-top: 1px dotted #ffffff;
padding-top: 5px;
overflow: auto;
span {
clear: right;
float: left;
padding-bottom: 5px;
}
.price {
float: right;
clear: none;
}
}
* {
color: #ffffff;
font-size: 12px;
line-height: 1.5em;
}
p#cart-buttons {
margin-top: 5px;
overflow: auto;
a.button_small {
float: left;
width: 184px;
.button_prev;
}
a.exclusive {
float: right;
.button_next;
}
}
#cart-prices span#cart_block_shipping_cost,
dl.products,
p#cart_block_no_products {
padding-bottom: 5px;
}
.ajax_cart_block_remove_link {
background: url("../img/delete.png") no-repeat top left;
width: 13px;
height: 13px;
display: block;
cursor: pointer;
}
.remove_link {
width: 13px;
height: 13px;
float: right;
padding-top: 2px;
margin-left: 8px;
}
dl.products .price {
float: right;
}
}
#header_user ul#header_nav > li.last {
position: relative;
> div.sub {
display: none;
position: absolute;
z-index: 10;
left: 0px;
top: 86px;
background: #444d52 url("../img/pattern2.png") repeat;
padding: 10px 10px;
width: 224px;
ul {
list-style: none outside;
margin: 0px;
li {
border-top: 1px dotted #ffffff;
padding: 0px 8px;
a {
display: block;
color: #ffffff;
text-decoration: none;
font-size: 12px;
padding: 8px 0px;
}
&:first-child {
border-top: 0px;
&:hover {
border-top: 0px;
}
}
&:hover {
background: #ffffff;
color: #444d52;
border-top: 1px dotted transparent;
a {
color: #444d52;
background: #ffffff;
}
+ li {
border-top: 1px dotted transparent;
}
}
}
}
}
}
*/