woocommerce/assets/css/prettyPhoto.less

470 lines
7.7 KiB
Plaintext

@import 'mixins.less';
// Functions
.button() {
.border_radius(100%);
height:16px;
width:16px;
color: #666 !important;
.vertical_gradient(#f6f6f6,#e8e8e8);
border:1px solid #ccc;
font-size:14px !important;
font-family: verdana !important;
text-shadow:0 1px 0 #fff;
font-weight: bold !important;
-webkit-box-shadow:
inset 0 -1px 0 rgba(0,0,0,0.05),
inset 0 1px 0 rgba(255,255,255,0.5),
0 1px 2px rgba(0,0,0,0.075);
box-shadow:
inset 0 -1px 0 rgba(0,0,0,0.05),
inset 0 1px 0 rgba(255,255,255,0.5),
0 1px 2px rgba(0,0,0,0.075);
&:hover {
.vertical_gradient(#fff,#e8e8e8);
color: #444 !important;
}
}
// WooCommerce theme
div.pp_woocommerce {
.pp_content_container {
background: #fff;
.border_radius(3px);
.box_shadow(0,1px,3px,0,rgba(0,0,0,0.25));
padding:60px 0 40px 0;
.clearfix;
}
.pp_loaderIcon {
background: url(../images/ajax-loader.gif) center no-repeat;
}
div.ppt {
color: black;
}
.pp_gallery {
ul {
li {
a {
border:1px solid rgba(0,0,0,0.5);
background: #fff;
.box_shadow(0,1px,2px,0,rgba(0,0,0,0.2));
.border_radius(2px);
display: block;
&:hover {
border-color:#000;
}
}
&.selected {
a {
border-color:#000;
}
}
}
}
}
// Next / Previous
.pp_arrow_previous, .pp_arrow_next, .pp_previous, .pp_next {
&:before {
line-height: 1.15 !important;
}
}
.pp_previous, .pp_next {
&:before {
.button;
content: "\2039";
text-indent: 0;
display: none;
position: absolute;
top:50%;
margin-top:-10px;
text-align: center;
}
&:hover {
&:before {
display: block;
}
}
}
.pp_previous {
&:before {
left:1em;
}
}
.pp_next {
&:before {
right:1em;
content: "\203a";
}
}
.pp_details {
margin:0;
padding-top:1em;
}
.pp_nav, .pp_description {
font-size:14px;
}
.pp_nav, .pp_nav p, .pp_play, .pp_nav .pp_pause, .pp_arrow_previous, .pp_arrow_next {
margin:0;
}
// Navigation
.pp_nav {
margin-right:1em;
position: relative;
}
.pp_close {
.button;
width:21px;
height:21px;
top:-10px;
right:-10px;
&:before {
content:"\00d7";
display: block;
position: absolute;
top:0;
left:0;
right:0;
bottom:0;
text-align: center;
text-indent: 0;
line-height: 1.45;
}
}
// Buttons
.pp_arrow_previous, .pp_arrow_next {
.button;
position: relative;
margin-top:-1px;
&:before {
content:"\2039";
display: block;
position: absolute;
top:0;
left:0;
right:0;
bottom:0;
text-align: center;
text-indent: 0;
}
}
.pp_arrow_previous {
margin-right:.5em;
}
.pp_arrow_next {
margin-left:.5em;
&:before {
content: "\203a";
}
}
a.pp_expand, a.pp_contract {
.button;
right:auto;
left:-10px;
top:-10px;
height:21px;
width:21px;
&:before {
content:"\2295";
display: block;
position: absolute;
top:0;
left:0;
right:0;
bottom:0;
text-align: center;
text-indent: 0;
line-height:0.9 !important;
font-size:19px !important;
}
}
a.pp_contract {
&:before {
content: "\2297";
}
}
#respond {
margin:0;
width:100%;
background: none;
border:none;
padding:0;
.form-submit {
margin-top:0;
float:none;
}
}
.pp_inline {
padding:0!important;
}
}
/* ------------------------------------------------------------------------
DO NOT CHANGE
------------------------------------------------------------------------- */
div.pp_pic_holder a:focus { outline:none; }
div.pp_overlay {
background: #fff;
display: none;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 9999;
}
div.pp_pic_holder {
display: none;
position: absolute;
width: 100px;
z-index: 10000;
}
.pp_top {
height: 20px;
position: relative;
}
* html .pp_top { padding: 0 20px; }
.pp_top .pp_left {
height: 20px;
left: 0;
position: absolute;
width: 20px;
}
.pp_top .pp_middle {
height: 20px;
left: 20px;
position: absolute;
right: 20px;
}
* html .pp_top .pp_middle {
left: 0;
position: static;
}
.pp_top .pp_right {
height: 20px;
left: auto;
position: absolute;
right: 0;
top: 0;
width: 20px;
}
.pp_content { height: 40px; min-width: 40px; }
* html .pp_content { width: 40px; }
.pp_fade { display: none; }
.pp_content_container {
position: relative;
text-align: left;
width: 100%;
}
.pp_content_container .pp_left { padding-left: 40px; }
.pp_content_container .pp_right { padding-right: 40px; }
.pp_content_container .pp_details {
float: left;
margin: 10px 0 2px 0;
}
.pp_description {
display: none;
margin: 0;
}
.pp_social { float: left; margin: 0; }
.pp_social .facebook { float: left; margin-left: 5px; width: 55px; overflow: hidden; }
.pp_social .twitter { float: left; }
.pp_nav {
clear: right;
float: left;
margin: 3px 10px 0 0;
}
.pp_nav p {
float: left;
margin: 2px 4px;
white-space: nowrap;
}
.pp_nav .pp_play,
.pp_nav .pp_pause {
float: left;
margin-right: 4px;
text-indent: -10000px;
}
a.pp_arrow_previous,
a.pp_arrow_next {
display: block;
float: left;
height: 15px;
margin-top: 3px;
overflow: hidden;
text-indent: -10000px;
width: 14px;
}
.pp_hoverContainer {
position: absolute;
top: 0;
width: 100%;
z-index: 2000;
}
.pp_gallery {
display: none;
left: 50%;
margin-top: -50px;
position: absolute;
z-index: 10000;
}
.pp_gallery div {
float: left;
overflow: hidden;
position: relative;
}
.pp_gallery ul {
float: left;
height: 35px;
margin: 0 0 0 5px;
padding: 0;
position: relative;
white-space: nowrap;
}
.pp_gallery ul a {
border: 1px #000 solid;
border: 1px rgba(0,0,0,0.5) solid;
display: block;
float: left;
height: 33px;
overflow: hidden;
}
.pp_gallery ul a:hover,
.pp_gallery li.selected a { border-color: #fff; }
.pp_gallery ul a img { border: 0; }
.pp_gallery li {
display: block;
float: left;
margin: 0 5px 0 0;
padding: 0;
}
.pp_gallery li.default a {
display: block;
height: 33px;
width: 50px;
}
.pp_gallery li.default a img { display: none; }
.pp_gallery .pp_arrow_previous,
.pp_gallery .pp_arrow_next {
margin-top: 7px !important;
}
a.pp_next {
display: block;
float: right;
height: 100%;
text-indent: -10000px;
width: 49%;
}
a.pp_previous {
display: block;
float: left;
height: 100%;
text-indent: -10000px;
width: 49%;
}
a.pp_expand,
a.pp_contract {
cursor: pointer;
display: none;
height: 20px;
position: absolute;
right: 30px;
text-indent: -10000px;
top: 10px;
width: 20px;
z-index: 20000;
}
a.pp_close {
position: absolute; right: 0; top: 0;
display: block;
line-height:22px;
text-indent: -10000px;
}
.pp_bottom {
height: 20px;
position: relative;
}
* html .pp_bottom { padding: 0 20px; }
.pp_bottom .pp_left {
height: 20px;
left: 0;
position: absolute;
width: 20px;
}
.pp_bottom .pp_middle {
height: 20px;
left: 20px;
position: absolute;
right: 20px;
}
* html .pp_bottom .pp_middle {
left: 0;
position: static;
}
.pp_bottom .pp_right {
height: 20px;
left: auto;
position: absolute;
right: 0;
top: 0;
width: 20px;
}
.pp_loaderIcon {
display: block;
height: 24px;
left: 50%;
margin: -12px 0 0 -12px;
position: absolute;
top: 50%;
width: 24px;
}
#pp_full_res .pp_inline {
text-align: left;
}
div.ppt {
color: #fff;
display: none;
font-size: 17px;
margin: 0 0 5px 15px;
z-index: 9999;
}