mediawiki-extensions-Visual.../modules/ve/ce/styles/ve.ce.Surface.css
Christian Williams 61de058d08 Alien support for IE
We got lucky - the fact that our alien styling choice required phantom overlays had the nice side-effect of preventing the ability to focus the aliens. Therefore, as soon as we started ignoring IE to deliver nice alien handling for standards-compliant browsers, we inadvertently solved(?) the IE alien problem. I've touched up the styling to look nice in IE 9 (solid green phantoms) and IE 10 (stripes). Shield GIF switched to PNG because IE 10 renders the transparent GIF as solid red. Yeah, red.

Change-Id: I3bc69acba9ed883a823cdf722117b90966bc332b
2012-12-07 15:51:15 -08:00

71 lines
1.4 KiB
CSS

/**
* VisualEditor content editable Surface styles.
*
* @copyright 2011-2012 VisualEditor Team and others; see AUTHORS.txt
* @license The MIT License (MIT); see LICENSE.txt
*/
.ve-ce-surface {
overflow: hidden;
font-size: 1em; /* to look more like MediaWiki use: 0.8em */;
}
.ve-ce-surface-textarea {
position: absolute;
z-index: -1;
filter: alpha(opacity=0);
opacity: 0;
color: white;
background-color: #fff;
border: none;
padding: 0;
margin: 0;
width: 1px;
}
.ve-ce-surface-textarea:focus {
outline: none;
}
.ve-ce-surface-cursor {
position: absolute;
background-color: #000;
width: 1px;
display: none;
}
.ve-ce-phantoms {
cursor: not-allowed;
left: 0;
opacity: .85;
position: absolute;
top: 0;
}
.ve-ce-phantom {
background-color: #C3E59A;
background-image: -ms-repeating-linear-gradient(-45deg, white 0px, white 5px, #C3E59A 5px, #C3E59A 10px );
background-image: -webkit-repeating-linear-gradient(-45deg, white 0px, white 5px, #C3E59A 5px, #C3E59A 10px );
background-image: -moz-repeating-linear-gradient(-45deg, white 0px, white 5px, #C3E59A 5px, #C3E59A 10px);
background-image: repeating-linear-gradient(-45deg, white 0px, white 5px, #C3E59A 5px, #C3E59A 10px );
background-size: 14px 14px;
position: absolute;
}
#paste {
display: none;
height: 1px;
left: 0;
filter: alpha(opacity=0);
opacity: 0;
overflow: hidden;
position: fixed;
top: 0;
width: 1px;
}
#paste * {
height: 1px !important;
width: 1px !important;
}