Press This: fix styling on the Tools screen.
Props Michael-Arestad, see #31462. git-svn-id: https://develop.svn.wordpress.org/trunk@31806 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Andrew Ozz
parent
f1ce621be7
commit
df2c74e878
|
|
@ -674,17 +674,46 @@ table.form-table td .updated p {
|
|||
line-height: 24px;
|
||||
}
|
||||
|
||||
.pressthis {
|
||||
margin: 20px 0;
|
||||
/* Card styles */
|
||||
|
||||
.card {
|
||||
position: relative;
|
||||
margin-top: 20px;
|
||||
padding: 0.7em 2em 1em;
|
||||
min-width: 255px;
|
||||
max-width: 520px;
|
||||
border: 1px solid #e5e5e5;
|
||||
-webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
|
||||
box-shadow: 0 1px 1px rgba(0,0,0,0.04);
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
/* Press this styles */
|
||||
|
||||
.pressthis h4 {
|
||||
margin: 2em 0 1em;
|
||||
}
|
||||
|
||||
.pressthis textarea {
|
||||
width: 100%;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
#pressthis-code-wrap {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.pressthis-bookmarklet-wrapper {
|
||||
margin: 20px 0 8px;
|
||||
vertical-align: top;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.pressthis a,
|
||||
.pressthis a:hover,
|
||||
.pressthis a:focus,
|
||||
.pressthis a:active {
|
||||
.pressthis-bookmarklet,
|
||||
.pressthis-bookmarklet:hover,
|
||||
.pressthis-bookmarklet:focus,
|
||||
.pressthis-bookmarklet:active {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
cursor: move;
|
||||
|
|
@ -699,35 +728,11 @@ table.form-table td .updated p {
|
|||
text-decoration: none;
|
||||
}
|
||||
|
||||
.pressthis a:active {
|
||||
.pressthis-bookmarklet:active {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.pressthis a:hover:after {
|
||||
-webkit-transform: skew(20deg) rotate(9deg);
|
||||
-ms-transform: skew(20deg) rotate(9deg);
|
||||
transform: skew(20deg) rotate(9deg);
|
||||
-webkit-box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
|
||||
box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
|
||||
.pressthis a span {
|
||||
display: inline-block;
|
||||
margin: 0px 0 0;
|
||||
padding: 0px 12px 8px 9px;
|
||||
}
|
||||
|
||||
.pressthis a span:before {
|
||||
color: #777;
|
||||
font: normal 20px/1 'dashicons';
|
||||
content:'\f157';
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
top: 4px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.pressthis a:after {
|
||||
.pressthis-bookmarklet:after {
|
||||
content: '';
|
||||
width: 70%;
|
||||
height: 55%;
|
||||
|
|
@ -743,62 +748,55 @@ table.form-table td .updated p {
|
|||
box-shadow: 0 10px 8px rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
|
||||
.pressthis .button {
|
||||
.pressthis-bookmarklet:hover:after {
|
||||
-webkit-transform: skew(20deg) rotate(9deg);
|
||||
-ms-transform: skew(20deg) rotate(9deg);
|
||||
transform: skew(20deg) rotate(9deg);
|
||||
-webkit-box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
|
||||
box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
|
||||
.pressthis-bookmarklet span {
|
||||
display: inline-block;
|
||||
margin: 0px 0 0;
|
||||
padding: 0px 12px 8px 9px;
|
||||
}
|
||||
|
||||
.pressthis-bookmarklet span:before {
|
||||
color: #777;
|
||||
font: normal 20px/1 'dashicons';
|
||||
content:'\f157';
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
top: 4px;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.pressthis-js-toggle {
|
||||
margin-left: 10px;
|
||||
padding: 0;
|
||||
height: auto;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.pressthis button .dashicons {
|
||||
.pressthis-js-toggle .dashicons {
|
||||
margin: 5px 8px 6px 7px;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.press-this-install {
|
||||
margin: 20px 0 0 0;
|
||||
padding: 0.7em 2em 1em;
|
||||
max-width: 520px;
|
||||
}
|
||||
|
||||
.press-this-install textarea {
|
||||
width: 100%;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.press-this-install h4 {
|
||||
margin: 2em 0 1em;
|
||||
}
|
||||
|
||||
/* to override the button class being applied */
|
||||
.pressthis .button.button {
|
||||
.pressthis-js-toggle.button.button {
|
||||
margin-left: 10px;
|
||||
padding: 0;
|
||||
height: auto;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.pressthis button .dashicons {
|
||||
.pressthis-js-toggle .dashicons {
|
||||
margin: 5px 8px 6px 7px;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.press-this-install {
|
||||
margin: 20px 0 0 0;
|
||||
padding: 0.7em 2em 1em;
|
||||
max-width: 520px;
|
||||
}
|
||||
|
||||
.press-this-install textarea {
|
||||
width: 100%;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.press-this-install h4 {
|
||||
margin: 2em 0 1em;
|
||||
}
|
||||
|
||||
|
||||
/*------------------------------------------------------------------------------
|
||||
20.0 - Settings
|
||||
------------------------------------------------------------------------------*/
|
||||
|
|
|
|||
|
|
@ -36,28 +36,26 @@ require_once( ABSPATH . 'wp-admin/admin-header.php' );
|
|||
<h2><?php echo esc_html( $title ); ?></h2>
|
||||
|
||||
<?php if ( current_user_can('edit_posts') ) : ?>
|
||||
<div class="tool-box">
|
||||
<h3 class="title"><?php _e('Press This') ?></h3>
|
||||
<div class="postbox press-this-install">
|
||||
<p><?php _e( 'Press This is a little app that lets you grab bits of the web and create new posts with ease.' );?></p>
|
||||
<p><?php _e( 'Use Press This to clip text, images and videos from any web page. Then edit and add more straight from Press This before you save or publish it in a post on your site.' ); ?></p>
|
||||
</div>
|
||||
<div class="card pressthis">
|
||||
<h3><?php _e('Press This') ?></h3>
|
||||
<p><?php _e( 'Press This is a little app that lets you grab bits of the web and create new posts with ease.' );?></p>
|
||||
<p><?php _e( 'Use Press This to clip text, images and videos from any web page. Then edit and add more straight from Press This before you save or publish it in a post on your site.' ); ?></p>
|
||||
|
||||
|
||||
<form>
|
||||
<div class="postbox press-this-install">
|
||||
<h3><?php _e( 'Install Press This' ); ?></h3>
|
||||
<h4><?php _e( 'Bookmarklet' ); ?></h4>
|
||||
<p><?php _e( 'Drag the bookmarklet below to your bookmarks bar. Then, when you’re on a page you want to share, simply “press” it.' ); ?></p>
|
||||
|
||||
<p class="pressthis">
|
||||
<a class="" onclick="return false;" href="<?php echo htmlspecialchars( get_shortcut_link() ); ?>"><span><?php _e( 'Press This' ) ?></span></a>
|
||||
<button type="button" class="button button-secondary js-show-pressthis-code-wrap" aria-expanded="false" aria-controls="pressthis-code-wrap">
|
||||
<p class="pressthis-bookmarklet-wrapper">
|
||||
<a class="pressthis-bookmarklet" onclick="return false;" href="<?php echo htmlspecialchars( get_shortcut_link() ); ?>"><span><?php _e( 'Press This' ); ?></span></a>
|
||||
<button type="button" class="button button-secondary pressthis-js-toggle js-show-pressthis-code-wrap" aria-expanded="false" aria-controls="pressthis-code-wrap">
|
||||
<span class="dashicons dashicons-clipboard"></span>
|
||||
<span class="screen-reader-text"><?php _e( 'Copy “Press This” bookmarklet code' ) ?></span>
|
||||
</button>
|
||||
</p>
|
||||
|
||||
<div class="hidden js-pressthis-code-wrap" id="pressthis-code-wrap">
|
||||
<div class="hidden js-pressthis-code-wrap clear" id="pressthis-code-wrap">
|
||||
<p id="pressthis-code-desc">
|
||||
<?php _e( 'If you can’t drag the bookmarklet to your bookmarks, copy the following code and create a new bookmark. Paste the code into the new bookmark’s URL field.' ) ?>
|
||||
</p>
|
||||
|
|
@ -92,7 +90,6 @@ require_once( ABSPATH . 'wp-admin/admin-header.php' );
|
|||
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<?php
|
||||
|
|
@ -102,7 +99,7 @@ if ( current_user_can( 'import' ) ) :
|
|||
$cats = get_taxonomy('category');
|
||||
$tags = get_taxonomy('post_tag');
|
||||
if ( current_user_can($cats->cap->manage_terms) || current_user_can($tags->cap->manage_terms) ) : ?>
|
||||
<div class="tool-box">
|
||||
<div class="card">
|
||||
<h3 class="title"><?php _e( 'Categories and Tags Converter' ) ?></h3>
|
||||
<p><?php printf( __('If you want to convert your categories to tags (or vice versa), use the <a href="%s">Categories and Tags Converter</a> available from the Import screen.'), 'import.php' ); ?></p>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue