sergiotarxz
/
Wordpress
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

TinyMCE: fix styles, add 2x background icons and load buttons.css in the Edit Image modal, remove wp-view styles from content.css, add 2x icons for the popup buttons (for editing image and gallery), fixes #22447, see #21019 

git-svn-id: https://develop.svn.wordpress.org/trunk@22586 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrew Ozz 2012-11-14 23:21:59 +00:00
parent 5c08470293
commit 434af4ce3e
9 changed files with 41 additions and 192 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
wp-includes/js/tinymce/plugins/wpeditimage/css/editimage.css
View File

@ -5,25 +5,10 @@ html, body {
padding: 0;
}
.submit input,
.button,
.button-primary,
.button-secondary,
.button-highlighted {
font-family: "Lucida Grande", "Lucida Sans Unicode", Tahoma, Verdana, sans-serif;
text-decoration: none;
font-size: 11px !important;
line-height: 16px;
padding: 2px 8px;
cursor: pointer;
border-width: 1px;
border-style: solid;
-webkit-border-radius: 11px;
border-radius: 11px;
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box;
-khtml-box-sizing: content-box;
box-sizing: content-box;
body {
font-family: sans-serif;
font-size: 12px;
line-height: 1.4em;
}
a.button {
@ -33,7 +18,7 @@ a.button {
textarea,
input,
select {
font: 13px Verdana, Arial, Helvetica, sans-serif;
font: inherit;
margin: 1px;
padding: 3px;
}
@ -44,10 +29,6 @@ p.help {
font-style: italic;
}
body, td {
font: 13px "Lucida Grande", "Lucida Sans Unicode", Tahoma, Verdana, sans-serif;
}
abbr.required {
color: #FF0000;
text-align: left;
@ -311,6 +292,7 @@ form {
padding: 0 0 0 28px;
margin: 0 1em 0 0;
}
.image-align-none-label {
background: url(../../../../../../wp-admin/images/align-none.png) no-repeat center left;
}
@ -429,3 +411,25 @@ body#media-upload.rtl ul#sidemenu {
.rtl #img_size_title {
text-align: left;
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) {
.image-align-none-label {
background: url(../../../../../../wp-admin/images/align-none-2x.png) no-repeat center left;
background-size: auto 15px;
}
.image-align-left-label {
background: url(../../../../../../wp-admin/images/align-left-2x.png) no-repeat center left;
background-size: auto 15px;
}
.image-align-center-label {
background: url(../../../../../../wp-admin/images/align-center-2x.png) no-repeat center left;
background-size: auto 15px;
}
.image-align-right-label {
background: url(../../../../../../wp-admin/images/align-right-2x.png) no-repeat center left;
background-size: auto 15px;
}
}

1
wp-includes/js/tinymce/plugins/wpeditimage/editimage.html
View File

@ -5,6 +5,7 @@
<title></title>
<link rel="stylesheet" href="css/editimage.css?ver=357-20121111" type="text/css" media="all" />
<link rel="stylesheet" href="../../../../css/buttons.css?ver=357-20121111" type="text/css" media="all" />
<script type="text/javascript" src="js/editimage.min.js?ver=357-20121111"></script>
<script type="text/javascript" src="../../utils/form_utils.js?ver=357-20121111"></script>
<base target="_self" />

9
wp-includes/js/tinymce/plugins/wpeditimage/editor_plugin_src.js
View File

@ -199,7 +199,10 @@
},
_createButtons : function() {
var t = this, ed = tinyMCE.activeEditor, DOM = tinymce.DOM, editButton, dellButton;
var t = this, ed = tinyMCE.activeEditor, DOM = tinymce.DOM, editButton, dellButton, isRetina;
isRetina = ( window.devicePixelRatio && window.devicePixelRatio > 1 ) || // WebKit, Opera
( window.matchMedia && window.matchMedia('(min-resolution:130dpi)').matches ); // Firefox, IE10, Opera
DOM.remove('wp_editbtns');
@ -209,7 +212,7 @@
});
editButton = DOM.add('wp_editbtns', 'img', {
src : t.url+'/img/image.png',
src : isRetina ? t.url+'/img/image-2x.png' : t.url+'/img/image.png',
id : 'wp_editimgbtn',
width : '24',
height : '24',
@ -221,7 +224,7 @@
});
dellButton = DOM.add('wp_editbtns', 'img', {
src : t.url+'/img/delete.png',
src : isRetina ? t.url+'/img/delete-2x.png' : t.url+'/img/delete.png',
id : 'wp_delimgbtn',
width : '24',
height : '24',

BIN
wp-includes/js/tinymce/plugins/wpeditimage/img/delete-2x.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.9 KiB

BIN
wp-includes/js/tinymce/plugins/wpeditimage/img/image-2x.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.6 KiB

9
wp-includes/js/tinymce/plugins/wpgallery/editor_plugin_src.js
View File

@ -69,7 +69,10 @@
},
_createButtons : function() {
var t = this, ed = tinyMCE.activeEditor, DOM = tinymce.DOM, editButton, dellButton;
var t = this, ed = tinyMCE.activeEditor, DOM = tinymce.DOM, editButton, dellButton, isRetina;
isRetina = ( window.devicePixelRatio && window.devicePixelRatio > 1 ) || // WebKit, Opera
( window.matchMedia && window.matchMedia('(min-resolution:130dpi)').matches ); // Firefox, IE10, Opera
DOM.remove('wp_gallerybtns');
@ -79,7 +82,7 @@
});
editButton = DOM.add('wp_gallerybtns', 'img', {
src : t.url+'/img/edit.png',
src : isRetina ? t.url+'/img/edit-2x.png' : t.url+'/img/edit.png',
id : 'wp_editgallery',
width : '24',
height : '24',
@ -93,7 +96,7 @@
});
dellButton = DOM.add('wp_gallerybtns', 'img', {
src : t.url+'/img/delete.png',
src : isRetina ? t.url+'/img/delete-2x.png' : t.url+'/img/delete.png',
id : 'wp_delgallery',
width : '24',
height : '24',

BIN
wp-includes/js/tinymce/plugins/wpgallery/img/delete-2x.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.9 KiB

BIN
wp-includes/js/tinymce/plugins/wpgallery/img/edit-2x.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.8 KiB

162
wp-includes/js/tinymce/themes/advanced/skins/wp_theme/content.css
View File

@ -140,165 +140,3 @@ img.wp-oembed {
width: 300px;
height: 250px;
}
/* WordPress TinyMCE Previews */
.wp-view-wrap {
position: relative;
display: inline-block;
}
.wp-view-wrap * {
font-family: sans-serif;
font-weight: normal;
}
.wp-view-wrap img {
display: block;
border: 0;
padding: 0;
margin: 0;
border-radius: 0;
box-shadow: none;
}
.wp-view-wrap.alignnone {
display: block;
}
.wp-view-wrap.aligncenter {
display: block;
text-align: center;
}
.wp-view-wrap.alignleft {
float: left;
}
.wp-view-wrap.alignright {
float: right;
}
.wp-view-wrap .overlay {
opacity: 0;
display: block;
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
box-shadow: inset 0 0 45px rgba( 0, 0, 0, 0.3 );
/*box-shadow:
inset 0 60px 30px -30px rgba( 0, 0, 0, 0.2 ),
inset 0 -60px 30px -30px rgba( 0, 0, 0, 0.2 );*/
overflow: hidden;
-webkit-transition: opacity 100ms ease-in-out, background 150ms;
-moz-transition: opacity 100ms ease-in-out, background 150ms;
-ms-transition: opacity 100ms ease-in-out, background 150ms;
-o-transition: opacity 100ms ease-in-out, background 150ms;
transition: opacity 100ms ease-in-out, background 150ms;
}
.wp-view-wrap:hover .overlay,
.wp-view-wrap.selected .overlay {
opacity: 1;
}
.wp-view-wrap.selected .overlay {
background: rgba( 0, 86, 132, 0.3 );
}
.wp-view-wrap .spinner {
background: #fff url("../../../../../../../wp-admin/images/wpspin_light.gif") no-repeat center center;
}
.wp-view-wrap .button {
position: absolute;
height: 22px;
line-height: 22px;
font-size: 14px;
text-align: center;
cursor: pointer;
color: #464646;
background: #f3f3f3;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#f4f4f4));
background-image: -webkit-linear-gradient(top, #fefefe, #f4f4f4);
background-image: -moz-linear-gradient(top, #fefefe, #f4f4f4);
background-image: -ms-linear-gradient(top, #fefefe, #f4f4f4);
background-image: -o-linear-gradient(top, #fefefe, #f4f4f4);
background-image: linear-gradient(to bottom, #fefefe, #f4f4f4);
box-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.2 );
border-radius: 2px;
}
.wp-view-wrap .button:hover {
box-shadow:
0 0 0 1px rgba( 0, 0, 0, 0.6 ),
0 0 10px rgba( 255, 255, 255, 0.4 );
background: #fff;
background-image: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f3f3f3));
background-image: -webkit-linear-gradient(top, #fff, #f3f3f3);
background-image: -moz-linear-gradient(top, #fff, #f3f3f3);
background-image: -ms-linear-gradient(top, #fff, #f3f3f3);
background-image: -o-linear-gradient(top, #fff, #f3f3f3);
background-image: linear-gradient(to bottom, #fff, #f3f3f3);
color: #333;
}
.wp-view-wrap .close {
top: 5px;
right: 5px;
width: 22px;
font-size: 22px;
line-height: 20px;
}
.wp-view-wrap .edit {
bottom: 5px;
right: 5px;
padding: 0 10px;
}
.editor-attachment {
display: inline-block;
position: relative;
margin-top: 10px;
margin-right: 10px;
overflow: hidden;
}
.editor-attachment,
.editor-attachment img {
min-height: 100px;
min-width: 100px;
}
.editor-attachment img,
.editor-attachment .overlay {
border-radius: inherit;
}
.editor-attachment-preview {
position: relative;
}
.wp-view-type-gallery {
display: block;
}
.editor-gallery {
display: inline-block;
position: relative;
min-height: 150px;
min-width: 150px;
margin: 5px 15px 15px 5px;
box-shadow:
0 0 0 4px #fff,
0 0 0 5px #ccc,
5px 5px 0 4px #fff,
5px 5px 0 5px #ccc,
10px 10px 0 4px #fff,
10px 10px 0 5px #ccc;
}