132 lines
4.3 KiB
SCSS
132 lines
4.3 KiB
SCSS
|
@import "compass/css3";
|
||
|
|
@import "compass/css3/border-radius";
|
||
|
|
@import "compass/css3/images";
|
||
|
|
@import "compass/css3/text-shadow";
|
||
|
|
// @import "helpers";
|
||
|
|
|
||
|
|
/* Locomotive's version of Clearlooks 2 */
|
||
|
|
|
||
|
|
/* Reset */
|
||
|
|
// .locomotive, .locomotive div, .locomotive span, .locomotive a { vertical-align:baseline; text-align:left; position:absolute; border:0; padding:0; margin:0; background:transparent; text-decoration:none; font-weight:normal; width:auto; height:auto; display:block; }
|
||
|
|
|
||
|
|
/* General */
|
||
|
|
.locomotive {
|
||
|
|
position: absolute;
|
||
|
|
direction: ltr;
|
||
|
|
text-align: left;
|
||
|
|
|
||
|
|
width: auto !important;
|
||
|
|
height: auto !important;
|
||
|
|
|
||
|
|
font-family: Helvetica, Arial;
|
||
|
|
|
||
|
|
background: transparent;
|
||
|
|
|
||
|
|
// @include box-shadow(rgba(0, 0, 0, 0.2) 0px 0px 10px 3px);
|
||
|
|
|
||
|
|
.mceWrapper {
|
||
|
|
position: static;
|
||
|
|
// padding: 30px;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
|
||
|
|
.mceTop {
|
||
|
|
// position: static;
|
||
|
|
width: 645px;
|
||
|
|
height: 47px;
|
||
|
|
|
||
|
|
background: red;
|
||
|
|
@include border-top-radius(6px);
|
||
|
|
@include box-shadow(rgba(0, 0, 0, 0.2) 0px -3px 10px 3px);
|
||
|
|
|
||
|
|
text-align: left;
|
||
|
|
|
||
|
|
span {
|
||
|
|
display: block;
|
||
|
|
position: relative;
|
||
|
|
|
||
|
|
border-bottom: 1px dotted #BBBBBD;
|
||
|
|
color: #1E1F26;
|
||
|
|
font-size: 18px;
|
||
|
|
font-weight: bold;
|
||
|
|
padding: 0;
|
||
|
|
margin: 0 10px;
|
||
|
|
line-height: 45px;
|
||
|
|
}
|
||
|
|
} // .mceTop
|
||
|
|
|
||
|
|
.mceMiddle {
|
||
|
|
position: static;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
|
||
|
|
& > span {
|
||
|
|
top: 0px;
|
||
|
|
position: relative;
|
||
|
|
background: transparent;
|
||
|
|
}
|
||
|
|
|
||
|
|
iframe {
|
||
|
|
height: auto !important;
|
||
|
|
@include box-shadow(rgba(0, 0, 0, 0.2) 0px 3px 10px 3px);
|
||
|
|
}
|
||
|
|
|
||
|
|
} // .mceMiddle
|
||
|
|
|
||
|
|
.mceBottom {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
} // .locomotive
|
||
|
|
|
||
|
|
|
||
|
|
.mceEventBlocker {
|
||
|
|
position:fixed;
|
||
|
|
left:0;
|
||
|
|
top:0;
|
||
|
|
width:100%;
|
||
|
|
height:100%;
|
||
|
|
}
|
||
|
|
.locomotive .mcePlaceHolder { top: 0; left: 0; background: #666; opacity:0.3; -ms-filter:'alpha(opacity=30)'; filter:alpha(opacity=30); }
|
||
|
|
.locomotive_modalBlocker { position:fixed; left:0; top:0; width:100%; height:100%; background:#666; opacity:0.3; -ms-filter:'alpha(opacity=30)'; filter:alpha(opacity=30); display:none; }
|
||
|
|
|
||
|
|
|
||
|
|
/* Middle */
|
||
|
|
// .locomotive .mceMiddle { top: 0px; width: 100%; height: 100%; }
|
||
|
|
// .locomotive .mceMiddle span { top: 47px; position: relative; background: transparent; }
|
||
|
|
|
||
|
|
/* Bottom */
|
||
|
|
// .locomotive .mceBottom { bottom: 0px; width: 100%; height: 1px; background: #8b8d9a; }
|
||
|
|
|
||
|
|
/* Move & Close */
|
||
|
|
.locomotive a.mceClose { display: none; }
|
||
|
|
.locomotive a.mceMove { top: 1px; display: block; width: 100%; height: 35px; cursor: move; }
|
||
|
|
|
||
|
|
/* Resize */
|
||
|
|
.locomotive .mceResize { top:auto; left:auto; display:none; width:5px; height:5px; }
|
||
|
|
.locomotive .mceResizable .mceResize {display:block}
|
||
|
|
.locomotive .mceResizable .mceMin, .locomotive .mceMax {display:none}
|
||
|
|
.locomotive .mceMinimizable .mceMin {display:block}
|
||
|
|
.locomotive .mceMaximizable .mceMax {display:block}
|
||
|
|
.locomotive .mceMaximized .mceMed {display:block}
|
||
|
|
.locomotive .mceMaximized .mceMax {display:none}
|
||
|
|
.locomotive a.mceResizeN {top:0; left:0; width:100%; cursor:n-resize}
|
||
|
|
.locomotive a.mceResizeNW {top:0; left:0; cursor:nw-resize}
|
||
|
|
.locomotive a.mceResizeNE {top:0; right:0; cursor:ne-resize}
|
||
|
|
.locomotive a.mceResizeW {top:0; left:0; height:100%; cursor:w-resize;}
|
||
|
|
.locomotive a.mceResizeE {top:0; right:0; height:100%; cursor:e-resize}
|
||
|
|
.locomotive a.mceResizeS {bottom:0; left:0; width:100%; cursor:s-resize}
|
||
|
|
.locomotive a.mceResizeSW {bottom:0; left:0; cursor:sw-resize}
|
||
|
|
.locomotive a.mceResizeSE {bottom:0; right:0; cursor:se-resize}
|
||
|
|
|
||
|
|
/* Alert/Confirm */
|
||
|
|
.locomotive .mceButton {font-weight:bold; bottom:10px; width:80px; height:30px; background:url(img/button.gif); line-height:30px; vertical-align:middle; text-align:center; outline:0}
|
||
|
|
.locomotive .mceMiddle .mceIcon {left:15px; top:35px; width:32px; height:32px}
|
||
|
|
.locomotive .mceAlert .mceMiddle span, .locomotive .mceConfirm .mceMiddle span {background:transparent;left:60px; top:35px; width:320px; height:50px; font-weight:bold; overflow:auto; white-space:normal}
|
||
|
|
.locomotive a:hover {font-weight:bold;}
|
||
|
|
.locomotive .mceAlert .mceMiddle, .locomotive .mceConfirm .mceMiddle {background:#D6D7D5}
|
||
|
|
.locomotive .mceAlert .mceOk {left:50%; top:auto; margin-left: -40px}
|
||
|
|
.locomotive .mceAlert .mceIcon {background:url(img/alert.gif)}
|
||
|
|
.locomotive .mceConfirm .mceOk {left:50%; top:auto; margin-left: -90px}
|
||
|
|
.locomotive .mceConfirm .mceCancel {left:50%; top:auto}
|
||
|
|
.locomotive .mceConfirm .mceIcon {background:url(img/confirm.gif)}
|