├── .gitignore ├── .phpcs.xml.dist ├── .svnignore ├── Gruntfile.js ├── assets ├── bookmarklet.js ├── bookmarklet.min.js ├── press-this-editor-rtl.css ├── press-this-editor.css ├── press-this-rtl.css ├── press-this.css ├── press-this.js ├── spinner-2x.gif └── spinner.gif ├── class-wp-press-this-plugin.php ├── composer.json ├── composer.lock ├── package-lock.json ├── package.json ├── press-this-plugin.php └── readme.txt /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | 3 | /vendor/ 4 | -------------------------------------------------------------------------------- /.phpcs.xml.dist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | error 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | . 39 | 40 | 41 | 42 | 43 | 44 | 45 | /node_modules/* 46 | /vendor/* 47 | 48 | 49 | -------------------------------------------------------------------------------- /.svnignore: -------------------------------------------------------------------------------- 1 | *.DS_Store 2 | .editorconfig 3 | .distignore 4 | .git 5 | .gitignore 6 | .travis.yml 7 | Gruntfile.js 8 | LINGUAS 9 | Makefile 10 | README.md 11 | _site 12 | bin 13 | composer.json 14 | composer.lock 15 | gulpfile.js 16 | node_modules 17 | npm-debug.log 18 | package.json 19 | package-lock.json 20 | phpcs.xml 21 | phpcs.ruleset.xml 22 | phpunit.xml 23 | phpunit.xml.dist 24 | tests 25 | vendor 26 | -------------------------------------------------------------------------------- /Gruntfile.js: -------------------------------------------------------------------------------- 1 | module.exports = function( grunt ) { 2 | grunt.initConfig({ 3 | checktextdomain: { 4 | options:{ 5 | text_domain: 'press-this', 6 | keywords: [ 7 | '__:1,2d', 8 | '_e:1,2d', 9 | '_x:1,2c,3d', 10 | 'esc_html__:1,2d', 11 | 'esc_html_e:1,2d', 12 | 'esc_html_x:1,2c,3d', 13 | 'esc_attr__:1,2d', 14 | 'esc_attr_e:1,2d', 15 | 'esc_attr_x:1,2c,3d', 16 | '_ex:1,2c,3d', 17 | '_n:1,2,4d', 18 | '_nx:1,2,4c,5d', 19 | '_n_noop:1,2,3d', 20 | '_nx_noop:1,2,3c,4d' 21 | ] 22 | }, 23 | files: { 24 | src: [ 25 | '**/*.php', // Include all files 26 | '!apigen/**', // Exclude apigen/ 27 | '!node_modules/**', // Exclude node_modules/ 28 | '!tests/**', // Exclude tests/ 29 | '!vendor/**', // Exclude vendor/ 30 | '!tmp/**' // Exclude tmp/ 31 | ], 32 | expand: true 33 | } 34 | }, 35 | 36 | addtextdomain: { 37 | pressthis: { 38 | options: { 39 | textdomain: 'press-this' 40 | }, 41 | files: { 42 | src: [ 43 | '*.php', 44 | '**/*.php', 45 | '!node_modules/**' 46 | ] 47 | } 48 | } 49 | }, 50 | }); 51 | 52 | grunt.loadNpmTasks( 'grunt-wp-i18n' ); 53 | grunt.loadNpmTasks( 'grunt-checktextdomain' ); 54 | }; -------------------------------------------------------------------------------- /assets/bookmarklet.js: -------------------------------------------------------------------------------- 1 | ( function( window, document, href, pt_url ) { 2 | var encURI = window.encodeURIComponent, 3 | form = document.createElement( 'form' ), 4 | head = document.getElementsByTagName( 'head' )[0], 5 | target = '_press_this_app', 6 | canPost = true, 7 | windowWidth, windowHeight, selection, 8 | metas, links, content, images, iframes, img; 9 | 10 | if ( ! pt_url ) { 11 | return; 12 | } 13 | 14 | if ( href.match( /^https?:/ ) ) { 15 | pt_url += '&u=' + encURI( href ); 16 | if ( href.match( /^https:/ ) && pt_url.match( /^http:/ ) ) { 17 | canPost = false; 18 | } 19 | } else { 20 | top.location.href = pt_url; 21 | return; 22 | } 23 | 24 | if ( window.getSelection ) { 25 | selection = window.getSelection() + ''; 26 | } else if ( document.getSelection ) { 27 | selection = document.getSelection() + ''; 28 | } else if ( document.selection ) { 29 | selection = document.selection.createRange().text || ''; 30 | } 31 | 32 | pt_url += '&buster=' + ( new Date().getTime() ); 33 | 34 | if ( ! canPost ) { 35 | if ( document.title ) { 36 | pt_url += '&t=' + encURI( document.title.substr( 0, 256 ) ); 37 | } 38 | 39 | if ( selection ) { 40 | pt_url += '&s=' + encURI( selection.substr( 0, 512 ) ); 41 | } 42 | } 43 | 44 | windowWidth = window.outerWidth || document.documentElement.clientWidth || 600; 45 | windowHeight = window.outerHeight || document.documentElement.clientHeight || 700; 46 | 47 | windowWidth = ( windowWidth < 800 || windowWidth > 5000 ) ? 600 : ( windowWidth * 0.7 ); 48 | windowHeight = ( windowHeight < 800 || windowHeight > 3000 ) ? 700 : ( windowHeight * 0.9 ); 49 | 50 | if ( ! canPost ) { 51 | window.open( pt_url, target, 'location,resizable,scrollbars,width=' + windowWidth + ',height=' + windowHeight ); 52 | return; 53 | } 54 | 55 | function add( name, value ) { 56 | if ( typeof value === 'undefined' ) { 57 | return; 58 | } 59 | 60 | var input = document.createElement( 'input' ); 61 | 62 | input.name = name; 63 | input.value = value; 64 | input.type = 'hidden'; 65 | 66 | form.appendChild( input ); 67 | } 68 | 69 | metas = head.getElementsByTagName( 'meta' ) || []; 70 | 71 | for ( var m = 0; m < metas.length; m++ ) { 72 | if ( m > 200 ) { 73 | break; 74 | } 75 | 76 | var q = metas[ m ], 77 | q_name = q.getAttribute( 'name' ), 78 | q_prop = q.getAttribute( 'property' ), 79 | q_cont = q.getAttribute( 'content' ); 80 | 81 | if ( q_cont ) { 82 | if ( q_name ) { 83 | add( '_meta[' + q_name + ']', q_cont ); 84 | } else if ( q_prop ) { 85 | add( '_meta[' + q_prop + ']', q_cont ); 86 | } 87 | } 88 | } 89 | 90 | links = head.getElementsByTagName( 'link' ) || []; 91 | 92 | for ( var y = 0; y < links.length; y++ ) { 93 | if ( y >= 50 ) { 94 | break; 95 | } 96 | 97 | var g = links[ y ], 98 | g_rel = g.getAttribute( 'rel' ); 99 | 100 | if ( g_rel === 'canonical' || g_rel === 'icon' || g_rel === 'shortlink' ) { 101 | add( '_links[' + g_rel + ']', g.getAttribute( 'href' ) ); 102 | } 103 | } 104 | 105 | if ( document.body.getElementsByClassName ) { 106 | content = document.body.getElementsByClassName( 'hfeed' )[0]; 107 | } 108 | 109 | content = document.getElementById( 'content' ) || content || document.body; 110 | images = content.getElementsByTagName( 'img' ) || []; 111 | 112 | for ( var n = 0; n < images.length; n++ ) { 113 | if ( n >= 100 ) { 114 | break; 115 | } 116 | 117 | img = images[ n ]; 118 | 119 | // If we know the image width and/or height, check them now and drop the "uninteresting" images. 120 | if ( img.src.indexOf( 'avatar' ) > -1 || img.className.indexOf( 'avatar' ) > -1 || 121 | ( img.width && img.width < 256 ) || ( img.height && img.height < 128 ) ) { 122 | 123 | continue; 124 | } 125 | 126 | add( '_images[]', img.src ); 127 | } 128 | 129 | iframes = document.body.getElementsByTagName( 'iframe' ) || []; 130 | 131 | for ( var p = 0; p < iframes.length; p++ ) { 132 | if ( p >= 50 ) { 133 | break; 134 | } 135 | 136 | add( '_embeds[]', iframes[ p ].src ); 137 | } 138 | 139 | if ( document.title ) { 140 | add( 't', document.title ); 141 | } 142 | 143 | if ( selection ) { 144 | add( 's', selection ); 145 | } 146 | 147 | form.setAttribute( 'method', 'POST' ); 148 | form.setAttribute( 'action', pt_url ); 149 | form.setAttribute( 'target', target ); 150 | form.setAttribute( 'style', 'display: none;' ); 151 | 152 | window.open( 'about:blank', target, 'location,resizable,scrollbars,width=' + windowWidth + ',height=' + windowHeight ); 153 | 154 | document.body.appendChild( form ); 155 | form.submit(); 156 | } )( window, document, top.location.href, window.pt_url ); 157 | -------------------------------------------------------------------------------- /assets/bookmarklet.min.js: -------------------------------------------------------------------------------- 1 | (function(a,b,c,d){function e(a,c){if("undefined"!=typeof c){var d=b.createElement("input");d.name=a,d.value=c,d.type="hidden",p.appendChild(d)}}var f,g,h,i,j,k,l,m,n,o=a.encodeURIComponent,p=b.createElement("form"),q=b.getElementsByTagName("head")[0],r="_press_this_app",s=!0;if(d){if(!c.match(/^https?:/))return void(top.location.href=d);if(d+="&u="+o(c),c.match(/^https:/)&&d.match(/^http:/)&&(s=!1),a.getSelection?h=a.getSelection()+"":b.getSelection?h=b.getSelection()+"":b.selection&&(h=b.selection.createRange().text||""),d+="&buster="+(new Date).getTime(),s||(b.title&&(d+="&t="+o(b.title.substr(0,256))),h&&(d+="&s="+o(h.substr(0,512)))),f=a.outerWidth||b.documentElement.clientWidth||600,g=a.outerHeight||b.documentElement.clientHeight||700,f=f<800||f>5e3?600:.7*f,g=g<800||g>3e3?700:.9*g,!s)return void a.open(d,r,"location,resizable,scrollbars,width="+f+",height="+g);i=q.getElementsByTagName("meta")||[];for(var t=0;t200);t++){var u=i[t],v=u.getAttribute("name"),w=u.getAttribute("property"),x=u.getAttribute("content");x&&(v?e("_meta["+v+"]",x):w&&e("_meta["+w+"]",x))}j=q.getElementsByTagName("link")||[];for(var y=0;y=50);y++){var z=j[y],A=z.getAttribute("rel");"canonical"!==A&&"icon"!==A&&"shortlink"!==A||e("_links["+A+"]",z.getAttribute("href"))}b.body.getElementsByClassName&&(k=b.body.getElementsByClassName("hfeed")[0]),k=b.getElementById("content")||k||b.body,l=k.getElementsByTagName("img")||[];for(var B=0;B=100);B++)n=l[B],n.src.indexOf("avatar")>-1||n.className.indexOf("avatar")>-1||n.width&&n.width<256||n.height&&n.height<128||e("_images[]",n.src);m=b.body.getElementsByTagName("iframe")||[];for(var C=0;C=50);C++)e("_embeds[]",m[C].src);b.title&&e("t",b.title),h&&e("s",h),p.setAttribute("method","POST"),p.setAttribute("action",d),p.setAttribute("target",r),p.setAttribute("style","display: none;"),a.open("about:blank",r,"location,resizable,scrollbars,width="+f+",height="+g),b.body.appendChild(p),p.submit()}})(window,document,top.location.href,window.pt_url); -------------------------------------------------------------------------------- /assets/press-this-editor-rtl.css: -------------------------------------------------------------------------------- 1 | /* 2 | Press This TinyMCE editor styles :) 3 | */ 4 | 5 | 6 | /** 7 | * Links 8 | */ 9 | a { 10 | color: #0073aa; 11 | } 12 | 13 | a:visited { 14 | color: #0073aa; 15 | } 16 | 17 | a:hover, 18 | a:focus, 19 | a:active { 20 | color: #00a0d2; 21 | } 22 | 23 | 24 | /** 25 | * Lists 26 | */ 27 | ul, 28 | ol { 29 | margin: 0 3em 1.5em 0; 30 | } 31 | 32 | ul { 33 | list-style: disc; 34 | } 35 | 36 | ol { 37 | list-style: decimal; 38 | } 39 | 40 | li > ul, 41 | li > ol { 42 | margin-bottom: 0; 43 | margin-right: 1.5em; 44 | } 45 | 46 | dt { 47 | font-weight: 700; 48 | } 49 | 50 | dd { 51 | margin: 0 1.5em 1.5em; 52 | } 53 | 54 | 55 | /** 56 | * Media 57 | * 58 | * Basic image and object styles 59 | */ 60 | img { 61 | max-width: 100%; 62 | height: auto; 63 | } 64 | 65 | /* Makes sure embeds and iframes fit inside their containers */ 66 | embed, 67 | iframe, 68 | object { 69 | max-width: 100%; 70 | } 71 | 72 | 73 | /** 74 | * TinyMCE styles 75 | * 76 | * Pretty dang good. 77 | */ 78 | body { 79 | color: #404040; 80 | font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; 81 | font-size: 20px; 82 | font-weight: 400; 83 | line-height: 1.6; 84 | } 85 | @media (max-width: 900px) { 86 | body#tinymce { 87 | padding-top: 30px !important; 88 | } 89 | } 90 | @media (max-width: 640px) { 91 | body { 92 | font-size: 16px; 93 | } 94 | } 95 | @media (max-width: 320px) { 96 | body { 97 | margin: 0 15px; 98 | } 99 | } 100 | 101 | #tinymce b, 102 | #tinymce strong { 103 | /* overrides TinyMCE's !important. Woohoo. */ 104 | font-weight: 700 !important; 105 | } 106 | 107 | blockquote { 108 | margin: 1em 1.5em; 109 | color: #9ea7af; 110 | font-size: em(25px); 111 | font-style: italic; 112 | } 113 | @media (max-width: 900px) { 114 | blockquote { 115 | margin: 1.5em 1em; 116 | } 117 | } 118 | 119 | ul, 120 | ol { 121 | margin: 0 .75em 1.5em 0; 122 | } 123 | -------------------------------------------------------------------------------- /assets/press-this-editor.css: -------------------------------------------------------------------------------- 1 | /* 2 | Press This TinyMCE editor styles :) 3 | */ 4 | 5 | 6 | /** 7 | * Links 8 | */ 9 | a { 10 | color: #0073aa; 11 | } 12 | 13 | a:visited { 14 | color: #0073aa; 15 | } 16 | 17 | a:hover, 18 | a:focus, 19 | a:active { 20 | color: #00a0d2; 21 | } 22 | 23 | 24 | /** 25 | * Lists 26 | */ 27 | ul, 28 | ol { 29 | margin: 0 0 1.5em 3em; 30 | } 31 | 32 | ul { 33 | list-style: disc; 34 | } 35 | 36 | ol { 37 | list-style: decimal; 38 | } 39 | 40 | li > ul, 41 | li > ol { 42 | margin-bottom: 0; 43 | margin-left: 1.5em; 44 | } 45 | 46 | dt { 47 | font-weight: 700; 48 | } 49 | 50 | dd { 51 | margin: 0 1.5em 1.5em; 52 | } 53 | 54 | 55 | /** 56 | * Media 57 | * 58 | * Basic image and object styles 59 | */ 60 | img { 61 | max-width: 100%; 62 | height: auto; 63 | } 64 | 65 | /* Makes sure embeds and iframes fit inside their containers */ 66 | embed, 67 | iframe, 68 | object { 69 | max-width: 100%; 70 | } 71 | 72 | 73 | /** 74 | * TinyMCE styles 75 | * 76 | * Pretty dang good. 77 | */ 78 | body { 79 | color: #404040; 80 | font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; 81 | font-size: 20px; 82 | font-weight: 400; 83 | line-height: 1.6; 84 | } 85 | @media (max-width: 900px) { 86 | body#tinymce { 87 | padding-top: 30px !important; 88 | } 89 | } 90 | @media (max-width: 640px) { 91 | body { 92 | font-size: 16px; 93 | } 94 | } 95 | @media (max-width: 320px) { 96 | body { 97 | margin: 0 15px; 98 | } 99 | } 100 | 101 | #tinymce b, 102 | #tinymce strong { 103 | /* overrides TinyMCE's !important. Woohoo. */ 104 | font-weight: 700 !important; 105 | } 106 | 107 | blockquote { 108 | margin: 1em 1.5em; 109 | color: #9ea7af; 110 | font-size: em(25px); 111 | font-style: italic; 112 | } 113 | @media (max-width: 900px) { 114 | blockquote { 115 | margin: 1.5em 1em; 116 | } 117 | } 118 | 119 | ul, 120 | ol { 121 | margin: 0 0 1.5em .75em; 122 | } 123 | -------------------------------------------------------------------------------- /assets/press-this-rtl.css: -------------------------------------------------------------------------------- 1 | /* 2 | Press This styles :) 3 | */ 4 | 5 | 6 | /** 7 | * Normalize 8 | * 9 | * normalize.css v3.0.0 | MIT License | git.io/normalize 10 | */ 11 | html { 12 | font-family: sans-serif; 13 | -ms-text-size-adjust: 100%; 14 | -webkit-text-size-adjust: 100%; 15 | } 16 | 17 | body { 18 | margin: 0; 19 | } 20 | 21 | *, 22 | *:before, 23 | *:after { 24 | -webkit-box-sizing: border-box; 25 | -moz-box-sizing: border-box; 26 | box-sizing: border-box; 27 | } 28 | @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) { 29 | *, 30 | *:before, 31 | *:after { 32 | -webkit-font-smoothing: antialiased; 33 | } 34 | } 35 | 36 | article, 37 | aside, 38 | details, 39 | figcaption, 40 | figure, 41 | footer, 42 | header, 43 | hgroup, 44 | main, 45 | nav, 46 | section, 47 | summary { 48 | display: block; 49 | } 50 | 51 | audio, 52 | canvas, 53 | progress, 54 | video { 55 | display: inline-block; 56 | vertical-align: baseline; 57 | } 58 | 59 | audio:not([controls]) { 60 | display: none; 61 | height: 0; 62 | } 63 | 64 | [hidden], 65 | template { 66 | display: none; 67 | } 68 | 69 | a { 70 | background: transparent; 71 | } 72 | 73 | a:active, 74 | a:hover { 75 | outline: 0; 76 | } 77 | 78 | abbr[title] { 79 | border-bottom: 1px dotted; 80 | } 81 | 82 | b, 83 | strong { 84 | font-weight: 700; 85 | } 86 | 87 | dfn { 88 | font-style: italic; 89 | } 90 | 91 | h1 { 92 | font-size: 2em; 93 | margin: 0.67em 0; 94 | } 95 | 96 | mark { 97 | background: #ff0; 98 | color: #000; 99 | } 100 | 101 | small { 102 | font-size: 80%; 103 | } 104 | 105 | sub, 106 | sup { 107 | font-size: 75%; 108 | line-height: 0; 109 | position: relative; 110 | vertical-align: baseline; 111 | } 112 | 113 | sup { 114 | top: -0.5em; 115 | } 116 | 117 | sub { 118 | bottom: -0.25em; 119 | } 120 | 121 | img { 122 | border: 0; 123 | } 124 | 125 | svg:not(:root) { 126 | overflow: hidden; 127 | } 128 | 129 | figure { 130 | margin: 1em 40px; 131 | } 132 | 133 | hr { 134 | -webkit-box-sizing: content-box; 135 | -moz-box-sizing: content-box; 136 | box-sizing: content-box; 137 | height: 0; 138 | } 139 | 140 | pre { 141 | overflow: auto; 142 | } 143 | 144 | code, 145 | kbd, 146 | pre, 147 | samp { 148 | font-family: monospace, monospace; 149 | font-size: 1em; 150 | } 151 | 152 | button, 153 | input, 154 | optgroup, 155 | select, 156 | textarea { 157 | color: inherit; 158 | font: inherit; 159 | margin: 0; 160 | } 161 | 162 | button { 163 | overflow: visible; 164 | } 165 | 166 | button, 167 | select { 168 | text-transform: none; 169 | } 170 | 171 | button, 172 | html input[type="button"], 173 | input[type="reset"], 174 | input[type="submit"] { 175 | -webkit-appearance: button; 176 | cursor: pointer; 177 | } 178 | 179 | button[disabled], 180 | html input[disabled] { 181 | cursor: default; 182 | } 183 | 184 | button::-moz-focus-inner, 185 | input::-moz-focus-inner { 186 | border: 0; 187 | padding: 0; 188 | } 189 | 190 | input { 191 | line-height: normal; 192 | } 193 | 194 | input[type="checkbox"], 195 | input[type="radio"] { 196 | -webkit-box-sizing: border-box; 197 | -moz-box-sizing: border-box; 198 | box-sizing: border-box; 199 | padding: 0; 200 | } 201 | 202 | input[type="number"]::-webkit-inner-spin-button, 203 | input[type="number"]::-webkit-outer-spin-button { 204 | height: auto; 205 | } 206 | 207 | input[type="search"] { 208 | -webkit-appearance: textfield; 209 | -webkit-box-sizing: content-box; 210 | -moz-box-sizing: content-box; 211 | box-sizing: content-box; 212 | } 213 | 214 | input[type="search"]::-webkit-search-cancel-button, 215 | input[type="search"]::-webkit-search-decoration { 216 | -webkit-appearance: none; 217 | } 218 | 219 | fieldset { 220 | border: 0; 221 | margin: 0; 222 | padding: 0; 223 | } 224 | 225 | legend { 226 | border: 0; 227 | padding: 0; 228 | } 229 | 230 | textarea { 231 | overflow: auto; 232 | } 233 | 234 | optgroup { 235 | font-weight: 700; 236 | } 237 | 238 | table { 239 | border-collapse: collapse; 240 | border-spacing: 0; 241 | } 242 | 243 | td, 244 | th { 245 | padding: 0; 246 | } 247 | 248 | ::-webkit-input-placeholder { 249 | color: #72777c; 250 | } 251 | 252 | ::-moz-placeholder { 253 | color: #72777c; 254 | opacity: 1; 255 | } 256 | 257 | :-ms-input-placeholder { 258 | color: #72777c; 259 | } 260 | 261 | .clearfix:before, 262 | .clearfix:after { 263 | content: ""; 264 | display: table; 265 | } 266 | .clearfix:after { 267 | clear: both; 268 | } 269 | 270 | .hide-if-js { 271 | display: none; 272 | } 273 | 274 | .screen-reader-text { 275 | position: absolute; 276 | margin: -1px; 277 | padding: 0; 278 | height: 1px; 279 | width: 1px; 280 | overflow: hidden; 281 | clip: rect(0 0 0 0); 282 | border: 0; 283 | } 284 | 285 | 286 | /** 287 | * Typography 288 | * 289 | * Base element typographic styles. 290 | */ 291 | body, 292 | button, 293 | input, 294 | select, 295 | textarea { 296 | color: #404040; 297 | font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; 298 | font-size: 20px; 299 | font-weight: 400; 300 | line-height: 1.6; 301 | } 302 | 303 | h1, 304 | h2, 305 | h3, 306 | h4, 307 | h5, 308 | h6 { 309 | clear: both; 310 | } 311 | 312 | p { 313 | margin-bottom: 1.5em; 314 | } 315 | 316 | b, 317 | strong { 318 | font-weight: 700; 319 | } 320 | 321 | 322 | /** 323 | * Buttons 324 | * 325 | * Pushing buttons is what I do. 326 | */ 327 | 328 | .scan-submit { 329 | display: inline-block; 330 | margin: 0; 331 | padding: 0 10px 1px; 332 | border-width: 1px; 333 | border-style: solid; 334 | -webkit-border-radius: 3px; 335 | border-radius: 3px; 336 | font-size: 13px; 337 | line-height: 2; 338 | text-decoration: none; 339 | white-space: nowrap; 340 | cursor: pointer; 341 | -webkit-appearance: none; 342 | } 343 | 344 | .split-button { 345 | position: relative; 346 | display: inline-block; 347 | vertical-align: middle; 348 | } 349 | 350 | .split-button-body { 351 | display: none; 352 | position: absolute; 353 | bottom: 39px; 354 | left: 0; 355 | border: 1px solid #ddd; 356 | background-color: #fff; 357 | min-width: 180px; 358 | max-width: 100%; 359 | margin: 0; 360 | padding: 8px; 361 | list-style: none; 362 | -webkit-box-shadow: -1px 0 4px rgba( 0, 0, 0, 0.15 ); 363 | box-shadow: -1px 0 4px rgba( 0, 0, 0, 0.15 ); 364 | } 365 | 366 | .split-button-body:before, 367 | .split-button-body:after { 368 | position: absolute; 369 | left: 12px; 370 | display: block; 371 | width: 0; 372 | height: 0; 373 | border-style: solid; 374 | border-color: transparent; 375 | content: ""; 376 | } 377 | 378 | .split-button-body:before { 379 | bottom: -18px; 380 | border-top-color: #ccc; 381 | border-width: 9px; 382 | left: 11px; 383 | } 384 | 385 | .split-button-body:after { 386 | bottom: -16px; 387 | border-top-color: #fff; 388 | border-width: 8px; 389 | } 390 | 391 | .split-button-body .split-button-option { 392 | display: block; 393 | padding: 5px 15px; 394 | margin: 0; 395 | width: 100%; 396 | border: 0; 397 | text-align: right; 398 | line-height: 2; 399 | background: none; 400 | color: inherit; 401 | text-decoration: none; 402 | outline: none; 403 | -webkit-transition: none; 404 | transition: none; 405 | } 406 | 407 | .split-button-body .split-button-option:hover, 408 | .split-button-body .split-button-option:active { 409 | color: inherit; 410 | } 411 | 412 | .is-open .split-button-body { 413 | display: block; 414 | } 415 | 416 | .split-button-primary, 417 | .split-button-toggle { 418 | -webkit-border-radius: 0; 419 | border-radius: 0; 420 | display: block; 421 | margin: 0; 422 | font-size: 13px; 423 | text-decoration: none; 424 | white-space: nowrap; 425 | cursor: pointer; 426 | -webkit-appearance: none; 427 | line-height: 2; 428 | padding: 0 10px 1px; 429 | background: #0085ba; 430 | border-color: #0073aa #006799 #006799; 431 | border-width: 1px; 432 | border-style: solid; 433 | -webkit-box-shadow: 0 1px 0 #006799; 434 | box-shadow: 0 1px 0 #006799; 435 | color: #fff; 436 | text-shadow: 0 -1px 1px #006799, 437 | -1px 0 1px #006799, 438 | 0 1px 1px #006799, 439 | 1px 0 1px #006799; 440 | } 441 | 442 | .split-button-primary { 443 | -webkit-border-top-right-radius: 3px; 444 | border-top-right-radius: 3px; 445 | -webkit-border-bottom-right-radius: 3px; 446 | border-bottom-right-radius: 3px; 447 | border-left: 0 none; 448 | float: right; 449 | } 450 | 451 | .split-button-toggle { 452 | padding: 0; 453 | -webkit-border-top-left-radius: 3px; 454 | border-top-left-radius: 3px; 455 | -webkit-border-bottom-left-radius: 3px; 456 | border-bottom-left-radius: 3px; 457 | border-right: 1px solid #006799; 458 | float: left; 459 | } 460 | 461 | .split-button-toggle i { 462 | margin: 4px 0 3px 20px; 463 | padding: 0 10px; 464 | } 465 | 466 | .split-button-primary:hover, 467 | .split-button-toggle:hover { 468 | outline: none; 469 | background: #008ec2; 470 | border-color: #006799; 471 | } 472 | 473 | .split-button-primary:focus, 474 | .split-button-toggle:focus { 475 | outline: none; 476 | -webkit-box-shadow: 0 1px 0 #0073aa, 477 | 0 0 2px 1px #33b3db; 478 | box-shadow: 0 1px 0 #0073aa, 479 | 0 0 2px 1px #33b3db; 480 | } 481 | 482 | .split-button-primary:active, 483 | .split-button-toggle:active { 484 | background: #0073aa; 485 | border-color: #006799; 486 | -webkit-box-shadow: inset 0 2px 10px #006799, 0 1px 0 #0073aa; 487 | box-shadow: inset 0 2px 10px #006799, 0 1px 0 #0073aa; 488 | } 489 | 490 | /** 491 | * Forms 492 | * 493 | * So many input types. 494 | */ 495 | button, 496 | input, 497 | select, 498 | textarea { 499 | font-size: 100%; 500 | margin: 0; 501 | vertical-align: baseline; 502 | *vertical-align: middle; 503 | } 504 | 505 | [type="checkbox"], 506 | [type="radio"] { 507 | padding: 0; 508 | } 509 | 510 | [type="search"] { 511 | -webkit-appearance: textfield; 512 | -webkit-box-sizing: content-box; 513 | -moz-box-sizing: content-box; 514 | box-sizing: content-box; 515 | } 516 | 517 | [type="search"]::-webkit-search-decoration { 518 | -webkit-appearance: none; 519 | } 520 | 521 | button::-moz-focus-inner, 522 | input::-moz-focus-inner { 523 | border: 0; 524 | padding: 0; 525 | } 526 | 527 | [type="text"], 528 | [type="email"], 529 | [type="url"], 530 | [type="password"], 531 | [type="search"], 532 | textarea { 533 | padding: 0.4em 0.75em; 534 | color: #32373c; 535 | border: 1px solid #ccc; 536 | } 537 | 538 | [type="text"]:focus, 539 | [type="email"]:focus, 540 | [type="url"]:focus, 541 | [type="password"]:focus, 542 | [type="search"]:focus, 543 | textarea:focus { 544 | color: #32373c; 545 | outline: 0; 546 | } 547 | 548 | textarea { 549 | overflow: auto; 550 | padding-right: 3px; 551 | vertical-align: top; 552 | } 553 | 554 | 555 | /** 556 | * Links 557 | */ 558 | a { 559 | color: #0073aa; 560 | } 561 | 562 | a:visited { 563 | color: #0073aa; 564 | } 565 | 566 | a:hover, 567 | a:focus, 568 | a:active { 569 | color: #00a0d2; 570 | } 571 | 572 | 573 | /** 574 | * Lists 575 | */ 576 | ul, 577 | ol { 578 | margin: 0 3em 1.5em 0; 579 | } 580 | 581 | ul { 582 | list-style: disc; 583 | } 584 | 585 | ol { 586 | list-style: decimal; 587 | } 588 | 589 | li > ul, 590 | li > ol { 591 | margin-bottom: 0; 592 | margin-right: 1.5em; 593 | } 594 | 595 | dt { 596 | font-weight: 700; 597 | } 598 | 599 | dd { 600 | margin: 0 1.5em 1.5em; 601 | } 602 | 603 | 604 | /** 605 | * Post formats 606 | * 607 | * Complete styles for post formats UI 608 | */ 609 | /* TODO if we remove the
during merge, this can go. */ 610 | #post-formats-select br { 611 | display: none; 612 | } 613 | 614 | .post-format { 615 | width: 1px; 616 | height: 1px; 617 | position: absolute; 618 | top: -9999px; 619 | } 620 | 621 | .lt-ie9 .post-format { 622 | margin: 17px 13px 0 12px; 623 | width: auto; 624 | height: auto; 625 | position: static; 626 | top: auto; 627 | float: right; 628 | width: 16px; 629 | height: 16px; 630 | } 631 | 632 | .post-format-icon { 633 | position: relative; 634 | display: block; 635 | padding: 13px 13px 14px 2px; 636 | cursor: pointer; 637 | } 638 | 639 | .post-format-icon:before, 640 | .post-format-icon:after { 641 | content: ""; 642 | display: inline-block; 643 | width: 20px; 644 | height: 20px; 645 | margin-left: 10px; 646 | font-size: 20px; 647 | line-height: 1; 648 | font-family: dashicons; 649 | text-decoration: inherit; 650 | color: #9ea7af; 651 | font-weight: 400; 652 | font-style: normal; 653 | vertical-align: top; 654 | text-align: center; 655 | -webkit-transition: color .1s ease-in 0; 656 | transition: color .1s ease-in 0; 657 | -webkit-font-smoothing: antialiased; 658 | -moz-osx-font-smoothing: grayscale; 659 | } 660 | 661 | .post-format-icon:before { 662 | content: "\f109"; 663 | } 664 | 665 | .post-format-icon:after { 666 | display: none; 667 | content: "\f147"; 668 | float: left; 669 | } 670 | 671 | .post-format:checked + .post-format-icon { 672 | -webkit-box-shadow: inset -6px 0 0 #00a0d2; 673 | box-shadow: inset -6px 0 0 #00a0d2; 674 | background: rgba(46, 162, 204, 0.1); 675 | } 676 | 677 | .post-format:checked + .post-format-icon:before, 678 | .post-format:checked + .post-format-icon:after { 679 | color: #32373c; 680 | } 681 | 682 | .post-format:focus + .post-format-icon { 683 | background: #00a0d2; 684 | color: #fff; 685 | } 686 | 687 | .post-format:focus + .post-format-icon:before, 688 | .post-format:focus + .post-format-icon:after { 689 | color: #fff; 690 | } 691 | 692 | .post-format:checked + .post-format-icon:after { 693 | display: block; 694 | } 695 | 696 | .lt-ie9 .post-format-icon { 697 | margin-right: 16px; 698 | } 699 | 700 | .post-format-aside:before { 701 | content: "\f123"; 702 | } 703 | 704 | .post-format-chat:before { 705 | content: "\f125"; 706 | } 707 | 708 | .post-format-gallery:before { 709 | content: "\f161"; 710 | } 711 | 712 | .post-format-link:before { 713 | content: "\f103"; 714 | } 715 | 716 | .post-format-image:before { 717 | content: "\f128"; 718 | } 719 | 720 | .post-format-quote:before { 721 | content: "\f122"; 722 | } 723 | 724 | .post-format-status:before { 725 | content: "\f130"; 726 | } 727 | 728 | .post-format-video:before { 729 | content: "\f126"; 730 | } 731 | 732 | .post-format-audio:before { 733 | content: "\f127"; 734 | } 735 | 736 | 737 | /** 738 | * Tags 739 | * 740 | * Complete styles for tags UI 741 | */ 742 | .tagsdiv p { 743 | margin: 0; 744 | } 745 | 746 | .tagsdiv .ajaxtag { 747 | position: relative; 748 | } 749 | 750 | .tagsdiv .newtag { 751 | display: block; 752 | position: relative; 753 | padding: 11px 16px 11px 58px; 754 | width: 100%; 755 | border: 0; 756 | border-bottom: 1px solid #e5e5e5; 757 | font-size: 16px; 758 | } 759 | 760 | .tagsdiv .tagadd { 761 | position: absolute; 762 | top: 0; 763 | left: 0; 764 | bottom: 1px; 765 | border: 0; 766 | -webkit-border-radius: 0; 767 | border-radius: 0; 768 | margin: 0; 769 | padding: 0 16px; 770 | background: #f7f7f7; 771 | border-right: 1px solid #f1f1f1; 772 | -webkit-box-shadow: none; 773 | box-shadow: none; 774 | } 775 | 776 | .tagsdiv .tagadd:hover, 777 | .tagsdiv .tagadd:active, 778 | .tagsdiv .tagadd:focus { 779 | outline: 0; 780 | background: #2991b7; 781 | border-color: #20708e; 782 | color: #fff; 783 | -webkit-box-shadow: none; 784 | box-shadow: none; 785 | } 786 | 787 | .tagsdiv .howto { 788 | color: #727272; 789 | font-style: italic; 790 | margin: 10px 16px 6px 0; 791 | } 792 | 793 | /* Tags */ 794 | .tagchecklist { 795 | padding: 16px 28px 5px; 796 | } 797 | 798 | .tagchecklist:before, 799 | .tagchecklist:after { 800 | content: ""; 801 | display: table; 802 | } 803 | 804 | .tagchecklist:after { 805 | clear: both; 806 | } 807 | 808 | .tagchecklist > span { 809 | float: right; 810 | margin-left: 25px; 811 | font-size: 13px; 812 | line-height: 1.8; 813 | white-space: nowrap; 814 | cursor: default; 815 | } 816 | 817 | @media (max-width: 600px) { 818 | .tagchecklist > span { 819 | margin-bottom: 15px; 820 | font-size: 16px; 821 | line-height: 1.3; 822 | } 823 | } 824 | 825 | .tagchecklist .ntdelbutton { 826 | position: absolute; 827 | width: 24px; 828 | height: 24px; 829 | border: none; 830 | margin: 0 -19px 0 0; 831 | padding: 0; 832 | background: none; 833 | cursor: pointer; 834 | text-indent: 0;; 835 | position: absolute; 836 | } 837 | 838 | .tagchecklist .ntdelbutton .remove-tag-icon:before { 839 | content: "\f153"; 840 | display: block; 841 | margin-right: 2px; 842 | height: 20px; 843 | width: 20px; 844 | -webkit-border-radius: 50%; 845 | border-radius: 50%; 846 | background: transparent; 847 | color: #0073aa; 848 | /* line-height tweak to vertically center the icon cross browsers */ 849 | font: 400 16px/1.28 dashicons; 850 | text-align: center; 851 | -webkit-font-smoothing: antialiased; 852 | } 853 | 854 | .tagchecklist .ntdelbutton:focus { 855 | outline: 0; 856 | } 857 | 858 | .tagchecklist .ntdelbutton:hover .remove-tag-icon:before, 859 | .tagchecklist .ntdelbutton:focus .remove-tag-icon:before { 860 | color: #c00; 861 | } 862 | 863 | .tagchecklist .ntdelbutton:focus .remove-tag-icon:before { 864 | -webkit-box-shadow: 865 | 0 0 0 1px #5b9dd9, 866 | 0 0 2px 1px rgba(30, 140, 190, .8); 867 | box-shadow: 868 | 0 0 0 1px #5b9dd9, 869 | 0 0 2px 1px rgba(30, 140, 190, .8); 870 | } 871 | 872 | /* THE TAG CLOUD. */ 873 | .tagsdiv + p { 874 | margin: 0; 875 | } 876 | 877 | .press-this .tagcloud-link { 878 | display: block; 879 | margin: 0 16px 5px; 880 | padding: 0; 881 | text-decoration: none; 882 | outline: 0; 883 | color: inherit; 884 | } 885 | 886 | .press-this .tagcloud-link:hover, 887 | .press-this .tagcloud-link:active { 888 | color: inherit; 889 | } 890 | 891 | .tagcloud-link:focus { 892 | text-decoration: underline; 893 | } 894 | 895 | .popular-tags { 896 | border: none; 897 | line-height: 2em; 898 | padding: 8px 12px 12px; 899 | text-align: justify; 900 | } 901 | 902 | .popular-tags a { 903 | padding: 0 3px; 904 | } 905 | 906 | .the-tagcloud { 907 | margin: 0; 908 | padding: 16px; 909 | } 910 | 911 | .the-tagcloud a { 912 | text-decoration: none; 913 | outline: 0; 914 | } 915 | 916 | .the-tagcloud a:focus { 917 | text-decoration: underline; 918 | } 919 | 920 | .tagcloud h3 { 921 | margin: 2px 0 12px; 922 | } 923 | 924 | 925 | /** 926 | * Categories 927 | * 928 | * Complete styles for post categories UI 929 | */ 930 | input[type="search"].categories-search, 931 | .add-category-name { 932 | display: block; 933 | width: 100%; 934 | padding: 0.85714em 1.07143em; 935 | border: 0; 936 | -webkit-border-radius: 0; 937 | border-radius: 0; 938 | border-bottom: 1px solid #e5e5e5; 939 | font-size: 14px; 940 | -webkit-appearance: none; 941 | -moz-appearance: none; 942 | appearance: none; 943 | } 944 | 945 | @media (max-width: 600px) { 946 | input[type="search"].categories-search, 947 | .add-category-name { 948 | /* Needs to be 16px to prevent zooming on iOS. Guh. */ 949 | font-size: 16px; 950 | } 951 | } 952 | 953 | .press-this .add-cat-toggle { 954 | float: left; 955 | margin-top: -45px; 956 | line-height: 20px; 957 | padding: 12px 10px 8px; 958 | color: #0073aa; 959 | text-decoration: none; 960 | -webkit-transition: none; 961 | transition: none; 962 | } 963 | 964 | .press-this .add-cat-toggle:focus { 965 | color: #00a0d2; 966 | } 967 | 968 | .press-this .add-cat-toggle.is-toggled { 969 | padding: 10px; 970 | } 971 | 972 | .press-this .add-cat-toggle.is-toggled .dashicons:before { 973 | content: "\f179"; 974 | } 975 | 976 | .add-category { 977 | position: relative; 978 | border-bottom: 1px solid #e5e5e5; 979 | } 980 | 981 | .add-category.is-hidden { 982 | display: none; 983 | } 984 | 985 | .add-category .add-cat-submit { 986 | position: absolute; 987 | top: 0; 988 | left: 0; 989 | border: 0; 990 | -webkit-border-radius: 0; 991 | border-radius: 0; 992 | padding: 12px 16px; 993 | background: #f7f7f7; 994 | border-right: 1px solid #f1f1f1; 995 | } 996 | 997 | .add-category .add-cat-submit:hover, 998 | .add-category .add-cat-submit:active, 999 | .add-category .add-cat-submit:focus { 1000 | outline: 0; 1001 | background: #2991b7; 1002 | border-color: #20708e; 1003 | color: #fff; 1004 | } 1005 | 1006 | /* Parent category select */ 1007 | .postform-wrapper { 1008 | padding: 12px; 1009 | } 1010 | 1011 | .postform { 1012 | display: block; 1013 | margin: 0; 1014 | width: 100%; 1015 | height: 34px; 1016 | border: 0; 1017 | -webkit-border-radius: 0; 1018 | border-radius: 0; 1019 | border: 1px solid #e5e5e5; 1020 | background: #fff; 1021 | -webkit-background-size: 20px 20px; 1022 | background-size: 20px 20px; 1023 | overflow: hidden; 1024 | line-height: 21px; 1025 | text-overflow: ellipsis; 1026 | text-decoration: none; 1027 | vertical-align: top; 1028 | white-space: nowrap; 1029 | cursor: pointer; 1030 | outline: 0; 1031 | } 1032 | 1033 | .postform:focus { 1034 | border-color: #0073aa; 1035 | -webkit-box-shadow: 0 0 0 3px #00a0d2; 1036 | box-shadow: 0 0 0 3px #00a0d2; 1037 | outline: 0; 1038 | -moz-outline: none; 1039 | -moz-user-focus: ignore; 1040 | } 1041 | 1042 | .postform::-ms-expand { 1043 | display: none; 1044 | } 1045 | 1046 | .postform::-ms-value { 1047 | background: none; 1048 | color: #727272; 1049 | } 1050 | 1051 | .postform:-moz-focusring { 1052 | color: transparent; 1053 | text-shadow: 0 0 0 #727272; 1054 | } 1055 | 1056 | /* Category list */ 1057 | .categories-select { 1058 | margin: 0; 1059 | padding: 0; 1060 | list-style: none; 1061 | } 1062 | 1063 | .categories-select ul { 1064 | margin: 0; 1065 | padding: 0; 1066 | list-style: none; 1067 | } 1068 | 1069 | .category { 1070 | position: relative; 1071 | display: block; 1072 | padding: 13px 16px 14px 16px; 1073 | cursor: pointer; 1074 | background: #fff; 1075 | } 1076 | 1077 | .category:focus, 1078 | .category.selected:focus { 1079 | outline: 0; 1080 | background: #00a0d2; 1081 | color: #fff; 1082 | } 1083 | 1084 | .category.selected { 1085 | -webkit-box-shadow: inset -6px 0 0 #00a0d2; 1086 | box-shadow: inset -6px 0 0 #00a0d2; 1087 | background: #E9F5F9; 1088 | } 1089 | 1090 | .category.selected:after { 1091 | display: inline-block; 1092 | content: "\f147"; 1093 | position: absolute; 1094 | top: 13px; 1095 | left: 0; 1096 | width: 20px; 1097 | height: 20px; 1098 | margin-left: 10px; 1099 | font-size: 20px; 1100 | line-height: 1; 1101 | font-family: dashicons; 1102 | text-decoration: inherit; 1103 | color: #23282d; 1104 | font-weight: 400; 1105 | font-style: normal; 1106 | vertical-align: top; 1107 | text-align: center; 1108 | -webkit-transition: color .1s ease-in 0; 1109 | transition: color .1s ease-in 0; 1110 | -webkit-font-smoothing: antialiased; 1111 | -moz-osx-font-smoothing: grayscale; 1112 | } 1113 | 1114 | .category.selected:focus:after { 1115 | color: #fff; 1116 | } 1117 | 1118 | .categories-select ul .category { 1119 | padding-right: 24px; 1120 | } 1121 | 1122 | .categories-select ul ul .category { 1123 | padding-right: 32px; 1124 | } 1125 | 1126 | .categories-select ul ul ul .category { 1127 | padding-right: 40px; 1128 | } 1129 | 1130 | .categories-select ul ul ul ul .category { 1131 | padding-right: 48px; 1132 | } 1133 | 1134 | .categories-select ul ul ul ul ul .category { 1135 | padding-right: 56px; 1136 | } 1137 | 1138 | .categories-select ul ul ul ul ul ul .category { 1139 | padding-right: 64px; 1140 | } 1141 | 1142 | .categories-select .is-hidden { 1143 | display: none; 1144 | } 1145 | 1146 | .categories-select .is-hidden.searched-parent { 1147 | display: block; 1148 | } 1149 | 1150 | /* Category search */ 1151 | .categories-search-wrapper { 1152 | position: relative; 1153 | } 1154 | 1155 | .categories-search-wrapper.is-hidden { 1156 | display: none; 1157 | } 1158 | 1159 | .categories-search-wrapper label { 1160 | position: absolute; 1161 | top: 50%; 1162 | left: 10px; 1163 | margin-top: -10px; 1164 | color: #9ea7af; 1165 | } 1166 | 1167 | 1168 | /** 1169 | * Main 1170 | */ 1171 | html { 1172 | overflow: auto; 1173 | } 1174 | 1175 | body { 1176 | overflow-x: hidden; 1177 | height: 100%; 1178 | } 1179 | 1180 | html { 1181 | background: #fff; 1182 | -webkit-box-shadow: 10px 0 0 rgba(0, 0, 0, 0.3); 1183 | box-shadow: 10px 0 0 rgba(0, 0, 0, 0.3); 1184 | } 1185 | 1186 | @media (max-width: 900px) { 1187 | body { 1188 | font-size: 16px; 1189 | } 1190 | } 1191 | 1192 | @media (max-width: 320px) { 1193 | body { 1194 | font-size: 14px; 1195 | } 1196 | } 1197 | 1198 | .lt-ie9 { 1199 | overflow: visible; 1200 | } 1201 | 1202 | .adminbar { 1203 | position: relative; 1204 | width: 100%; 1205 | padding: 0 0.8em; 1206 | min-height: 3.2em; 1207 | background: #23282d; 1208 | color: #fff; 1209 | z-index: 9999; 1210 | } 1211 | 1212 | .adminbar:before, 1213 | .adminbar:after { 1214 | content: ""; 1215 | display: table; 1216 | } 1217 | 1218 | .adminbar:after { 1219 | clear: both; 1220 | } 1221 | 1222 | .adminbar .dashicons { 1223 | color: #a0a5aa; /* same as WP admin bar icons */ 1224 | } 1225 | 1226 | .press-this .adminbar button { 1227 | position: absolute; 1228 | top: 50%; 1229 | left: 6px; 1230 | margin-top: -13px; 1231 | padding: 0 10px 1px; 1232 | font-size: 13px; 1233 | text-decoration: none; 1234 | -webkit-transition: none; 1235 | transition: none; 1236 | } 1237 | 1238 | @media (max-width: 320px) { 1239 | .adminbar { 1240 | min-height: 45px; 1241 | } 1242 | } 1243 | 1244 | .current-site { 1245 | margin-top: 0.5625em; 1246 | font-size: 16px; 1247 | line-height: 44px; 1248 | font-weight: 400; 1249 | overflow: hidden; 1250 | white-space: nowrap; 1251 | text-overflow: ellipsis; 1252 | } 1253 | 1254 | @media (max-width: 600px) { 1255 | .current-site { 1256 | margin: 3px 0 0; 1257 | } 1258 | } 1259 | 1260 | @media (max-width: 320px) { 1261 | .current-site { 1262 | margin: 0; 1263 | font-size: 14px; 1264 | } 1265 | } 1266 | 1267 | .current-site-link { 1268 | text-decoration: none; 1269 | } 1270 | 1271 | .current-site-link:focus { 1272 | outline: 0; 1273 | } 1274 | 1275 | .current-site-link:focus .current-site-name{ 1276 | text-decoration: underline; 1277 | } 1278 | 1279 | .current-site-name { 1280 | color: #ededed; 1281 | } 1282 | 1283 | @media (max-width: 320px) { 1284 | .current-site-name { 1285 | font-weight: 600; 1286 | } 1287 | } 1288 | 1289 | .current-site .dashicons-wordpress { 1290 | position: relative; 1291 | top: -1px; 1292 | margin-left: 10px; 1293 | vertical-align: middle; 1294 | } 1295 | 1296 | .options, 1297 | .options.open .on-closed, 1298 | .options.closed .on-open { 1299 | display: none; 1300 | } 1301 | 1302 | @media (max-width: 900px) { 1303 | .options { 1304 | display: block; 1305 | } 1306 | } 1307 | 1308 | .options-panel-back.is-hidden { 1309 | display: none; 1310 | } 1311 | 1312 | .options:focus .dashicons { 1313 | color: #fff; 1314 | text-decoration: none; 1315 | } 1316 | 1317 | .options .dashicons { 1318 | margin-top: 3px; 1319 | } 1320 | 1321 | .options { 1322 | color: #00a0d2; 1323 | } 1324 | 1325 | .alert { 1326 | position: relative; 1327 | margin: 0; 1328 | padding: 16px 50px; 1329 | border-bottom: 1px solid #e5e5e5; 1330 | font-size: 14px; 1331 | } 1332 | 1333 | .alert:before { 1334 | content: ""; 1335 | position: absolute; 1336 | top: 50%; 1337 | right: 30px; 1338 | width: 8px; 1339 | height: 8px; 1340 | margin-top: -4px; 1341 | -webkit-border-radius: 50%; 1342 | border-radius: 50%; 1343 | background: #00a0d2; 1344 | } 1345 | 1346 | @media (max-width: 600px) { 1347 | .alert { 1348 | padding: 16px 35px; 1349 | } 1350 | .alert:before { 1351 | right: 15px; 1352 | } 1353 | } 1354 | 1355 | .alert.is-error:before { 1356 | background: red; 1357 | } 1358 | 1359 | .scan { 1360 | position: relative; 1361 | border-bottom: 1px solid #e5e5e5; 1362 | } 1363 | 1364 | @media (max-width: 900px) { 1365 | .scan form { 1366 | -webkit-transition: opacity .3s ease-in-out; 1367 | transition: opacity .3s ease-in-out; 1368 | } 1369 | .scan.is-hidden form { 1370 | opacity: .2; 1371 | pointer-events: none; 1372 | } 1373 | } 1374 | 1375 | .scan-url { 1376 | display: block; 1377 | border: 0; 1378 | padding: 0.85714em 1.07143em; 1379 | font-size: 14px; 1380 | width: 100%; 1381 | } 1382 | 1383 | @media (max-width: 600px) { 1384 | .scan-url { 1385 | font-size: 16px; 1386 | } 1387 | } 1388 | 1389 | .scan-submit { 1390 | position: absolute; 1391 | top: 0; 1392 | left: 0; 1393 | bottom: 0; 1394 | padding: 0 1.07143em; 1395 | background: #f7f7f7; 1396 | border-color: #ddd; 1397 | border: 0; 1398 | border-right: 1px solid #f1f1f1; 1399 | -webkit-border-radius: 0; 1400 | border-radius: 0; 1401 | color: #555; 1402 | font-size: 14px; 1403 | line-height: 1.6; 1404 | } 1405 | 1406 | .scan-submit:hover, 1407 | .scan-submit:focus { 1408 | background: #008ec2; 1409 | border-color: #006799; 1410 | color: #fff; 1411 | outline: 0; 1412 | } 1413 | 1414 | .scan-submit:active { 1415 | background: #0073aa; 1416 | border-color: #006799; 1417 | color: #fff; 1418 | } 1419 | 1420 | .scan-submit:visited { 1421 | color: #555; 1422 | } 1423 | 1424 | .wrapper { 1425 | position: relative; 1426 | margin-bottom: 60px; 1427 | margin-left: 320px; 1428 | } 1429 | 1430 | .wrapper:before, 1431 | .wrapper:after { 1432 | content: ""; 1433 | display: table; 1434 | } 1435 | 1436 | .wrapper:after { 1437 | clear: both; 1438 | } 1439 | 1440 | @media (max-width: 900px) { 1441 | .wrapper { 1442 | margin: 0; 1443 | width: 100%; 1444 | } 1445 | } 1446 | 1447 | .editor-wrapper { 1448 | overflow: auto; 1449 | float: right; 1450 | width: 100%; 1451 | } 1452 | 1453 | .editor-wrapper:before, 1454 | .editor-wrapper:after { 1455 | content: ""; 1456 | display: table; 1457 | } 1458 | 1459 | .editor-wrapper:after { 1460 | clear: both; 1461 | } 1462 | 1463 | .editor { 1464 | padding: 0 1.5em 4.75em; 1465 | max-width: 700px; 1466 | margin: 0 auto; 1467 | } 1468 | 1469 | .spinner { 1470 | height: 20px; 1471 | width: 20px; 1472 | display: inline-block; 1473 | visibility: hidden; 1474 | background: url(../images/spinner.gif) no-repeat center; 1475 | -webkit-background-size: 20px 20px; 1476 | background-size: 20px 20px; 1477 | opacity: 0.7; 1478 | filter: alpha(opacity=70); 1479 | line-height: 1; 1480 | vertical-align: middle; 1481 | } 1482 | 1483 | @media print, 1484 | (-webkit-min-device-pixel-ratio: 1.25), 1485 | (min-resolution: 120dpi) { 1486 | 1487 | .spinner { 1488 | background-image: url(../images/spinner-2x.gif); 1489 | } 1490 | } 1491 | 1492 | .spinner.is-active { 1493 | visibility: visible; 1494 | } 1495 | 1496 | /* Make the text inside the editor textarea white. Prevents a "flash" on loading the page */ 1497 | #pressthis { 1498 | color: #fff; 1499 | } 1500 | 1501 | @media (min-width: 901px) { 1502 | .editor { 1503 | max-width: 760px; 1504 | } 1505 | } 1506 | 1507 | @media (max-width: 320px) { 1508 | .editor { 1509 | padding: 0; 1510 | } 1511 | } 1512 | 1513 | .post-title, 1514 | .post-title-placeholder { 1515 | margin: 0; 1516 | padding: .83em 0; 1517 | width: 100%; 1518 | border-bottom: 1px solid #e5e5e5; 1519 | font-size: 32px; 1520 | line-height: 1.4; 1521 | font-weight: 700; 1522 | } 1523 | 1524 | .post-title:active, 1525 | .post-title:focus, 1526 | .post-title-placeholder:active, 1527 | .post-title-placeholder:focus { 1528 | outline: 0; 1529 | -webkit-box-shadow: inset 0px -3px 0 #00a0d2; 1530 | box-shadow: inset 0px -3px 0 #00a0d2; 1531 | border-color: #00a0d2; 1532 | } 1533 | 1534 | @media (max-width: 900px) { 1535 | .post-title, 1536 | .post-title-placeholder { 1537 | font-size: 24px; 1538 | } 1539 | } 1540 | 1541 | @media (max-height: 400px) { 1542 | .post-title, 1543 | .post-title-placeholder { 1544 | padding: 15px 0; 1545 | font-size: 16px; 1546 | } 1547 | } 1548 | 1549 | @media (max-width: 320px) { 1550 | .post-title, 1551 | .post-title-placeholder { 1552 | font-size: 16px; 1553 | font-weight: 600; 1554 | padding: 1.14286em 1.42857em; 1555 | } 1556 | } 1557 | 1558 | .post-title { 1559 | /* IE8 fallback */ 1560 | background: url(data:image/gif;base64,R0lGODlhAQABAJEAAAAAAP///////wAAACH5BAEHAAIALAAAAAABAAEAAAICVAEAOw==); 1561 | background: none, none; 1562 | } 1563 | 1564 | .post-title:before { 1565 | /* Keeps empty container from collapsing */ 1566 | content: "\a0"; 1567 | display: inline-block; 1568 | width: 0; 1569 | speak: none; 1570 | } 1571 | 1572 | .post-title-placeholder { 1573 | position: absolute; 1574 | border: 0; 1575 | color: #82878c; 1576 | z-index: -1; 1577 | } 1578 | 1579 | .post-title-placeholder.is-hidden { 1580 | display: none; 1581 | } 1582 | 1583 | /* Suggested images */ 1584 | .media-list-container { 1585 | position: relative; 1586 | padding: 2px 0; 1587 | border-bottom: 1px solid #e5e5e5; 1588 | display: none; 1589 | } 1590 | 1591 | .media-list-inner-container { 1592 | overflow: auto; 1593 | max-height: 150px; 1594 | max-height: 40vw; 1595 | } 1596 | 1597 | .media-list-container.has-media { 1598 | display: block; 1599 | } 1600 | 1601 | .media-list-inner-container:before, 1602 | .media-list-inner-container:after { 1603 | content: ""; 1604 | display: table; 1605 | } 1606 | 1607 | .media-list-inner-container:after { 1608 | clear: both; 1609 | } 1610 | 1611 | .media-list { 1612 | margin: 0; 1613 | padding: 0; 1614 | } 1615 | 1616 | @media (min-width: 321px) { 1617 | .media-list-inner-container { 1618 | max-height: 250px; 1619 | max-height: 40vw; 1620 | } 1621 | } 1622 | 1623 | @media (min-width: 601px) { 1624 | .media-list-inner-container { 1625 | max-height: 200px; 1626 | max-height: 18.75vw; 1627 | } 1628 | } 1629 | 1630 | .wppt-all-media-list { 1631 | list-style: none; 1632 | margin: 0; 1633 | padding: 0; 1634 | } 1635 | 1636 | .suggested-media-thumbnail:focus, 1637 | .is-embed:focus { 1638 | outline: 0; 1639 | -webkit-box-shadow: inset 0 0 0 3px #00a0d2; 1640 | box-shadow: inset 0 0 0 3px #00a0d2; 1641 | } 1642 | 1643 | .suggested-media-thumbnail { 1644 | position: relative; 1645 | display: block; 1646 | float: right; 1647 | width: 16.66%; 1648 | padding: 16.66% 16.66% 0 0; 1649 | background-position: center; 1650 | background-repeat: no-repeat; 1651 | -webkit-background-size: cover; 1652 | background-size: cover; 1653 | background-color: #d8d8d8; 1654 | color: #fff; 1655 | color: rgba(255, 255, 255, 0.6); 1656 | cursor: pointer; 1657 | } 1658 | 1659 | .suggested-media-thumbnail:hover, 1660 | .suggested-media-thumbnail:active, 1661 | .suggested-media-thumbnail:focus { 1662 | color: #fff; 1663 | } 1664 | 1665 | .suggested-media-thumbnail:before, 1666 | .suggested-media-thumbnail:after { 1667 | display: inline-block; 1668 | position: absolute; 1669 | font-size: 20px; 1670 | line-height: 1; 1671 | font-family: dashicons; 1672 | text-decoration: inherit; 1673 | font-weight: 400; 1674 | font-style: normal; 1675 | -webkit-transition: color .1s ease-in 0; 1676 | transition: color .1s ease-in 0; 1677 | -webkit-font-smoothing: antialiased; 1678 | -moz-osx-font-smoothing: grayscale; 1679 | } 1680 | 1681 | .suggested-media-thumbnail:before { 1682 | right: 50%; 1683 | top: 50%; 1684 | margin: -20px -20px 0 0; 1685 | font-size: 40px; 1686 | } 1687 | 1688 | .suggested-media-thumbnail:after { 1689 | content: "\f132"; 1690 | left: 3%; 1691 | bottom: 2%; 1692 | } 1693 | 1694 | @media (min-width: 601px) { 1695 | .suggested-media-thumbnail { 1696 | width: 12.5%; 1697 | padding: 12.5% 12.5% 0 0; 1698 | } 1699 | } 1700 | 1701 | .is-embed:before { 1702 | content: "\f104"; 1703 | color: #fff; 1704 | color: rgba(255, 255, 255, 0.9); 1705 | } 1706 | 1707 | .is-embed.is-audio:hover:before, 1708 | .is-embed.is-audio:active:before, 1709 | .is-embed.is-audio:focus:before, 1710 | .is-embed.is-tweet:hover:before, 1711 | .is-embed.is-tweet:active:before, 1712 | .is-embed.is-tweet:focus:before { 1713 | color: #fff; 1714 | } 1715 | 1716 | .is-embed.is-video { 1717 | background-color: #23282d; 1718 | } 1719 | 1720 | .is-embed.is-video:hover:before, 1721 | .is-embed.is-video:active:before, 1722 | .is-embed.is-video:focus:before { 1723 | color: rgba(255, 255, 255, 0.2); 1724 | } 1725 | 1726 | .is-embed.is-video:before { 1727 | content: "\f236"; 1728 | } 1729 | 1730 | .is-embed.is-audio { 1731 | background-color: #ff7d44; 1732 | } 1733 | 1734 | .is-embed.is-audio:before { 1735 | content: "\f127"; 1736 | } 1737 | 1738 | .is-embed.is-tweet { 1739 | background-color: #55acee; 1740 | } 1741 | 1742 | .is-embed.is-tweet:before { 1743 | content: "\f301"; 1744 | } 1745 | 1746 | .no-media { 1747 | margin: 0; 1748 | padding: 0; 1749 | border: 0; 1750 | } 1751 | 1752 | /* Actions bar */ 1753 | .press-this-actions { 1754 | position: fixed; 1755 | bottom: 0; 1756 | right: 0; 1757 | width: 100%; 1758 | background: #f1f1f1; 1759 | background: rgba(241, 241, 241, 0.9); 1760 | border-top: 1px solid #e5e5e5; 1761 | } 1762 | 1763 | @media (max-width: 900px) { 1764 | .press-this-actions { 1765 | -webkit-transform: translateY(0); 1766 | -ms-transform: translateY(0); 1767 | transform: translateY(0); 1768 | -webkit-transition: -webkit-transform .3s ease-in-out; 1769 | transition: -webkit-transform .3s ease-in-out; 1770 | transition: transform .3s ease-in-out; 1771 | transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out; 1772 | } 1773 | .press-this-actions.is-hidden { 1774 | -webkit-transform: translateY(100%); 1775 | -ms-transform: translateY(100%); 1776 | transform: translateY(100%); 1777 | } 1778 | } 1779 | 1780 | .add-media { 1781 | float: right; 1782 | margin: 14px 30px 14px 0; 1783 | font-size: 0; 1784 | } 1785 | 1786 | @media (max-width: 320px) { 1787 | .add-media { 1788 | margin: 10px 10px 10px 0; 1789 | } 1790 | } 1791 | 1792 | .insert-media { 1793 | color: #9ea7af; 1794 | float: right; 1795 | margin: 0; 1796 | padding: 0; 1797 | border: 0; 1798 | -webkit-border-radius: 0; 1799 | border-radius: 0; 1800 | background: none; 1801 | -webkit-box-shadow: none; 1802 | box-shadow: none; 1803 | overflow: hidden; 1804 | } 1805 | 1806 | .insert-media:hover, 1807 | .insert-media:focus, 1808 | .insert-media:active { 1809 | color: #23282d; 1810 | } 1811 | 1812 | .insert-media:focus, 1813 | .insert-media:active { 1814 | outline: 0; 1815 | color: #00a0d2; 1816 | -webkit-box-shadow: 1817 | 0 0 0 1px #5b9dd9, 1818 | 0 0 2px 1px rgba(30, 140, 190, .8); 1819 | box-shadow: 1820 | 0 0 0 1px #5b9dd9, 1821 | 0 0 2px 1px rgba(30, 140, 190, .8); 1822 | } 1823 | 1824 | .insert-media .dashicons { 1825 | padding: 11px; 1826 | width: 63px; 1827 | height: 58px; 1828 | font-size: 40px; 1829 | } 1830 | 1831 | @media (max-width: 320px) { 1832 | .insert-media .dashicons { 1833 | width: 55px; 1834 | height: 49px; 1835 | padding: 14px; 1836 | font-size: 20px; 1837 | } 1838 | } 1839 | 1840 | .post-actions { 1841 | float: left; 1842 | margin: 14px 0 14px 30px; 1843 | font-size: 13px; 1844 | } 1845 | 1846 | @media (max-width: 320px) { 1847 | .post-actions { 1848 | margin: 10px 0 10px 10px; 1849 | } 1850 | } 1851 | 1852 | .publish-button .saving-draft, 1853 | .publish-button.is-saving .publish { 1854 | display: none; 1855 | } 1856 | 1857 | .publish-button.is-saving .saving-draft { 1858 | display: inline; 1859 | } 1860 | 1861 | /* TinyMCE styles */ 1862 | .editor .wp-media-buttons { 1863 | float: none; 1864 | } 1865 | 1866 | .editor div.mce-toolbar-grp { 1867 | padding: 0.71429em 0; 1868 | background: none; 1869 | border: 0; 1870 | } 1871 | 1872 | @media (max-height: 400px), (max-width: 320px) { 1873 | .editor div.mce-toolbar-grp { 1874 | padding: 0; 1875 | } 1876 | } 1877 | 1878 | .mce-stack-layout:before, 1879 | .mce-stack-layout:after { 1880 | content: ""; 1881 | display: table; 1882 | } 1883 | 1884 | .mce-stack-layout:after { 1885 | clear: both; 1886 | } 1887 | 1888 | .mce-container.mce-toolbar { 1889 | float: right; 1890 | } 1891 | 1892 | .mce-container.mce-toolbar:nth-child(2) { 1893 | float: left; 1894 | } 1895 | 1896 | @media (max-width: 600px) { 1897 | .mce-first .mce-btn:nth-child(3), 1898 | .mce-first .mce-btn:nth-child(4) { 1899 | position: absolute; 1900 | margin: -1px; 1901 | padding: 0; 1902 | height: 1px; 1903 | width: 1px; 1904 | overflow: hidden; 1905 | clip: rect(0 0 0 0); 1906 | border: 0; 1907 | } 1908 | 1909 | .mce-first .mce-btn:nth-child(3):focus, 1910 | .mce-first .mce-btn:nth-child(4):focus { 1911 | position: static; 1912 | margin: 1px; 1913 | padding: inherit; 1914 | height: auto; 1915 | width: auto; 1916 | overflow: visible; 1917 | clip: auto; 1918 | border: 1px solid #999; 1919 | } 1920 | } 1921 | 1922 | #wp-link-wrap { 1923 | font-size: 13px; 1924 | } 1925 | 1926 | #wp-link-wrap input[type="text"] { 1927 | padding: 3px 5px; 1928 | margin: 1px; 1929 | } 1930 | 1931 | @media screen and (max-width: 782px) { 1932 | #wp-link-wrap { 1933 | font-size: 14px; 1934 | } 1935 | 1936 | #wp-link-wrap input[type="text"] { 1937 | padding: 6px 10px; 1938 | } 1939 | } 1940 | 1941 | #wp-link-wrap .howto { 1942 | color: #666; 1943 | font-style: italic; 1944 | } 1945 | 1946 | /* Options panel (sidebar) */ 1947 | .options-panel { 1948 | position: relative; 1949 | float: left; 1950 | margin-left: -320px; 1951 | width: 320px; 1952 | border-right: 1px solid #e5e5e5; 1953 | font-size: 14px; 1954 | /* Keeps background the full height of the screen, but only visually. Clicks go through. */ 1955 | -webkit-box-shadow: -5001px 5000px 0 5000px #fff, -5000px 5000px 0 5000px #e5e5e5; 1956 | box-shadow: -5001px 5000px 0 5000px #fff, -5000px 5000px 0 5000px #e5e5e5; 1957 | outline: 0; 1958 | } 1959 | 1960 | .options-panel-back { 1961 | position: absolute; 1962 | top: 0; 1963 | left: 0; 1964 | bottom: 0; 1965 | width: 320px; 1966 | outline: 0; 1967 | } 1968 | 1969 | @media (max-width: 900px) { 1970 | .options-panel { 1971 | background: #fff; 1972 | -webkit-transform: translateX(100%); 1973 | -ms-transform: translateX(100%); 1974 | transform: translateX(100%); 1975 | -webkit-transition: -webkit-transform .3s ease-in-out; 1976 | transition: -webkit-transform .3s ease-in-out; 1977 | transition: transform .3s ease-in-out; 1978 | transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out; 1979 | } 1980 | 1981 | .options-panel.is-hidden { 1982 | visibility: hidden; 1983 | } 1984 | 1985 | .options-panel.is-off-screen { 1986 | -webkit-transform: translateX(0); 1987 | -ms-transform: translateX(0); 1988 | transform: translateX(0); 1989 | } 1990 | } 1991 | 1992 | @media (max-width: 320px) { 1993 | .options-panel { 1994 | margin-left: -100%; 1995 | width: 100%; 1996 | border: 0; 1997 | -webkit-box-shadow: -5001px 5000px 0 5000px #fff; 1998 | box-shadow: -5001px 5000px 0 5000px #fff; 1999 | } 2000 | 2001 | .options-panel-back { 2002 | width: 100%; 2003 | } 2004 | } 2005 | 2006 | .post-options { 2007 | background: #fff; 2008 | position: absolute; 2009 | left: 0; 2010 | width: 100%; 2011 | overflow-x: hidden; 2012 | } 2013 | 2014 | .post-options .post-option-contents { 2015 | margin-right: 3px; 2016 | color: #32373c; 2017 | } 2018 | 2019 | .post-option-forward:before { 2020 | position: absolute; 2021 | top: 50%; 2022 | left: 8px; 2023 | margin-top: -10px; 2024 | content: "\f341" 2025 | } 2026 | 2027 | .post-option-back:before { 2028 | content: "\f345"; 2029 | } 2030 | 2031 | .lt-ie9 .options-panel, 2032 | .lt-ie9 .post-options { 2033 | border-right: 1px solid #e5e5e5; 2034 | } 2035 | 2036 | .lt-ie9 .post-options.is-off-screen { 2037 | border: 0; 2038 | } 2039 | 2040 | .post-option { 2041 | position: relative; 2042 | } 2043 | 2044 | .post-options .post-option { 2045 | display: block; 2046 | width: 100%; 2047 | margin: 0; 2048 | padding: 13px 14px 13px 37px; 2049 | border: 0; 2050 | border-bottom: 1px solid #e5e5e5; 2051 | text-decoration: none; 2052 | text-align: right; 2053 | background: none; 2054 | color: #9ea7af; 2055 | text-overflow: ellipsis; 2056 | white-space: nowrap; 2057 | overflow: hidden; 2058 | -webkit-transition: -webkit-transform .3s ease-in-out; 2059 | transition: -webkit-transform .3s ease-in-out; 2060 | transition: transform .3s ease-in-out; 2061 | transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out; 2062 | } 2063 | 2064 | .post-options .post-option:focus { 2065 | outline: 0; 2066 | -webkit-box-shadow: inset -5px 0 0 #00a0d2; 2067 | box-shadow: inset -5px 0 0 #00a0d2; 2068 | border-color: #e5e5e5; 2069 | } 2070 | 2071 | .is-off-screen > .post-option { 2072 | left: 100%; 2073 | } 2074 | 2075 | .is-hidden > .post-option { 2076 | visibility: hidden; 2077 | } 2078 | 2079 | @media (min-width: 1px) { 2080 | .is-off-screen > .post-option { 2081 | left: auto; 2082 | -webkit-transform: translateX(100%); 2083 | -ms-transform: translateX(100%); 2084 | transform: translateX(100%); 2085 | } 2086 | } 2087 | 2088 | .post-option-title { 2089 | display: inline-block; 2090 | margin: 0 8px 0 0; 2091 | font-size: 14px; 2092 | font-weight: 400; 2093 | } 2094 | 2095 | .setting-modal { 2096 | position: relative; 2097 | top: 0; 2098 | right: 0; 2099 | width: 100%; 2100 | overflow: hidden; 2101 | -webkit-transition: -webkit-transform .3s ease-in-out; 2102 | transition: -webkit-transform .3s ease-in-out; 2103 | transition: transform .3s ease-in-out; 2104 | transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out; 2105 | } 2106 | 2107 | .setting-modal.is-hidden { 2108 | visibility: hidden; 2109 | height: 0; 2110 | } 2111 | 2112 | .setting-modal.is-off-screen { 2113 | right: 100%; 2114 | } 2115 | 2116 | @media (min-width: 1px) { 2117 | .setting-modal.is-off-screen { 2118 | right: 0; 2119 | -webkit-transform: translateX(-100%); 2120 | -ms-transform: translateX(-100%); 2121 | transform: translateX(-100%); 2122 | } 2123 | } 2124 | 2125 | .press-this .modal-close { 2126 | display: block; 2127 | width: 100%; 2128 | padding: 13px 14px; 2129 | border: 0; 2130 | border-bottom: 1px solid #e5e5e5; 2131 | background: none; 2132 | color: #00a0d2; 2133 | text-decoration: none; 2134 | text-align: right; 2135 | } 2136 | 2137 | .press-this .modal-close:focus { 2138 | outline: 0; 2139 | -webkit-box-shadow: inset -5px 0 0 #00a0d2; 2140 | box-shadow: inset -5px 0 0 #00a0d2; 2141 | border-color: #e5e5e5; 2142 | } 2143 | 2144 | .setting-title { 2145 | position: relative; 2146 | top: -1px; 2147 | margin-right: 11px; 2148 | } 2149 | 2150 | /* Text editor */ 2151 | #pressthis { 2152 | color: #404040; 2153 | resize: none; 2154 | padding-top: 30px; 2155 | font-size: 16px; 2156 | } 2157 | 2158 | .wp-editor-wrap .quicktags-toolbar { 2159 | background: transparent; 2160 | border: none; 2161 | } 2162 | 2163 | /* Switch editor buttons */ 2164 | .wp-editor-wrap .wp-editor-tools { 2165 | z-index: 0; 2166 | } 2167 | 2168 | .wp-editor-wrap .wp-editor-tabs { 2169 | padding: 2px; 2170 | } 2171 | 2172 | .wp-editor-wrap .wp-switch-editor { 2173 | top: 0; 2174 | margin: 3px 5px 0 0; 2175 | padding: 3px 8px; 2176 | background: #f5f5f5; 2177 | color: #555; 2178 | border-color: #ccc; 2179 | } 2180 | 2181 | .wp-editor-wrap .wp-switch-editor:hover { 2182 | background: #fafafa; 2183 | border-color: #999; 2184 | color: #23282d; 2185 | } 2186 | 2187 | .wp-editor-wrap.tmce-active .switch-tmce, 2188 | .wp-editor-wrap.html-active .switch-html { 2189 | background: #fff; 2190 | border-color: #d8d8d8; 2191 | } 2192 | 2193 | /* Inline link dialog */ 2194 | .wp-link-input input { 2195 | border: 1px solid #ddd; 2196 | -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 ); 2197 | box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 ); 2198 | background-color: #fff; 2199 | color: #32373c; 2200 | outline: none; 2201 | -webkit-transition: 0.05s border-color ease-in-out; 2202 | transition: 0.05s border-color ease-in-out; 2203 | } 2204 | 2205 | /* UI Autocomplete (for inline link and wpLink) */ 2206 | .ui-autocomplete { 2207 | padding: 0; 2208 | margin: 0; 2209 | list-style: none; 2210 | position: absolute; 2211 | z-index: 10000; 2212 | border: 1px solid #5b9dd9; 2213 | -webkit-box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 ); 2214 | box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 ); 2215 | background-color: #fff; 2216 | font-size: 14px; 2217 | } 2218 | 2219 | .ui-autocomplete li { 2220 | margin-bottom: 0; 2221 | padding: 4px 10px; 2222 | white-space: nowrap; 2223 | text-align: right; 2224 | cursor: pointer; 2225 | } 2226 | 2227 | /* Colors for the wplink toolbar autocomplete. */ 2228 | .ui-autocomplete .ui-state-focus { 2229 | background-color: #ddd; 2230 | } 2231 | 2232 | /* Colors for the tags autocomplete. */ 2233 | .wp-tags-autocomplete .ui-state-focus { 2234 | background-color: #0073aa; 2235 | color: #fff; 2236 | } 2237 | -------------------------------------------------------------------------------- /assets/press-this.css: -------------------------------------------------------------------------------- 1 | /* 2 | Press This styles :) 3 | */ 4 | 5 | 6 | /** 7 | * Normalize 8 | * 9 | * normalize.css v3.0.0 | MIT License | git.io/normalize 10 | */ 11 | html { 12 | font-family: sans-serif; 13 | -ms-text-size-adjust: 100%; 14 | -webkit-text-size-adjust: 100%; 15 | } 16 | 17 | body { 18 | margin: 0; 19 | } 20 | 21 | *, 22 | *:before, 23 | *:after { 24 | box-sizing: border-box; 25 | } 26 | @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) { 27 | *, 28 | *:before, 29 | *:after { 30 | -webkit-font-smoothing: antialiased; 31 | } 32 | } 33 | 34 | article, 35 | aside, 36 | details, 37 | figcaption, 38 | figure, 39 | footer, 40 | header, 41 | hgroup, 42 | main, 43 | nav, 44 | section, 45 | summary { 46 | display: block; 47 | } 48 | 49 | audio, 50 | canvas, 51 | progress, 52 | video { 53 | display: inline-block; 54 | vertical-align: baseline; 55 | } 56 | 57 | audio:not([controls]) { 58 | display: none; 59 | height: 0; 60 | } 61 | 62 | [hidden], 63 | template { 64 | display: none; 65 | } 66 | 67 | a { 68 | background: transparent; 69 | } 70 | 71 | a:active, 72 | a:hover { 73 | outline: 0; 74 | } 75 | 76 | abbr[title] { 77 | border-bottom: 1px dotted; 78 | } 79 | 80 | b, 81 | strong { 82 | font-weight: 700; 83 | } 84 | 85 | dfn { 86 | font-style: italic; 87 | } 88 | 89 | h1 { 90 | font-size: 2em; 91 | margin: 0.67em 0; 92 | } 93 | 94 | mark { 95 | background: #ff0; 96 | color: #000; 97 | } 98 | 99 | small { 100 | font-size: 80%; 101 | } 102 | 103 | sub, 104 | sup { 105 | font-size: 75%; 106 | line-height: 0; 107 | position: relative; 108 | vertical-align: baseline; 109 | } 110 | 111 | sup { 112 | top: -0.5em; 113 | } 114 | 115 | sub { 116 | bottom: -0.25em; 117 | } 118 | 119 | img { 120 | border: 0; 121 | } 122 | 123 | svg:not(:root) { 124 | overflow: hidden; 125 | } 126 | 127 | figure { 128 | margin: 1em 40px; 129 | } 130 | 131 | hr { 132 | box-sizing: content-box; 133 | height: 0; 134 | } 135 | 136 | pre { 137 | overflow: auto; 138 | } 139 | 140 | code, 141 | kbd, 142 | pre, 143 | samp { 144 | font-family: monospace, monospace; 145 | font-size: 1em; 146 | } 147 | 148 | button, 149 | input, 150 | optgroup, 151 | select, 152 | textarea { 153 | color: inherit; 154 | font: inherit; 155 | margin: 0; 156 | } 157 | 158 | button { 159 | overflow: visible; 160 | } 161 | 162 | button, 163 | select { 164 | text-transform: none; 165 | } 166 | 167 | button, 168 | html input[type="button"], 169 | input[type="reset"], 170 | input[type="submit"] { 171 | -webkit-appearance: button; 172 | cursor: pointer; 173 | } 174 | 175 | button[disabled], 176 | html input[disabled] { 177 | cursor: default; 178 | } 179 | 180 | button::-moz-focus-inner, 181 | input::-moz-focus-inner { 182 | border: 0; 183 | padding: 0; 184 | } 185 | 186 | input { 187 | line-height: normal; 188 | } 189 | 190 | input[type="checkbox"], 191 | input[type="radio"] { 192 | box-sizing: border-box; 193 | padding: 0; 194 | } 195 | 196 | input[type="number"]::-webkit-inner-spin-button, 197 | input[type="number"]::-webkit-outer-spin-button { 198 | height: auto; 199 | } 200 | 201 | input[type="search"] { 202 | -webkit-appearance: textfield; 203 | box-sizing: content-box; 204 | } 205 | 206 | input[type="search"]::-webkit-search-cancel-button, 207 | input[type="search"]::-webkit-search-decoration { 208 | -webkit-appearance: none; 209 | } 210 | 211 | fieldset { 212 | border: 0; 213 | margin: 0; 214 | padding: 0; 215 | } 216 | 217 | legend { 218 | border: 0; 219 | padding: 0; 220 | } 221 | 222 | textarea { 223 | overflow: auto; 224 | } 225 | 226 | optgroup { 227 | font-weight: 700; 228 | } 229 | 230 | table { 231 | border-collapse: collapse; 232 | border-spacing: 0; 233 | } 234 | 235 | td, 236 | th { 237 | padding: 0; 238 | } 239 | 240 | ::-webkit-input-placeholder { 241 | color: #72777c; 242 | } 243 | 244 | ::-moz-placeholder { 245 | color: #72777c; 246 | opacity: 1; 247 | } 248 | 249 | :-ms-input-placeholder { 250 | color: #72777c; 251 | } 252 | 253 | .clearfix:before, 254 | .clearfix:after { 255 | content: ""; 256 | display: table; 257 | } 258 | .clearfix:after { 259 | clear: both; 260 | } 261 | 262 | .hide-if-js { 263 | display: none; 264 | } 265 | 266 | .screen-reader-text { 267 | position: absolute; 268 | margin: -1px; 269 | padding: 0; 270 | height: 1px; 271 | width: 1px; 272 | overflow: hidden; 273 | clip: rect(0 0 0 0); 274 | border: 0; 275 | } 276 | 277 | 278 | /** 279 | * Typography 280 | * 281 | * Base element typographic styles. 282 | */ 283 | body, 284 | button, 285 | input, 286 | select, 287 | textarea { 288 | color: #404040; 289 | font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; 290 | font-size: 20px; 291 | font-weight: 400; 292 | line-height: 1.6; 293 | } 294 | 295 | h1, 296 | h2, 297 | h3, 298 | h4, 299 | h5, 300 | h6 { 301 | clear: both; 302 | } 303 | 304 | p { 305 | margin-bottom: 1.5em; 306 | } 307 | 308 | b, 309 | strong { 310 | font-weight: 700; 311 | } 312 | 313 | 314 | /** 315 | * Buttons 316 | * 317 | * Pushing buttons is what I do. 318 | */ 319 | 320 | .scan-submit { 321 | display: inline-block; 322 | margin: 0; 323 | padding: 0 10px 1px; 324 | border-width: 1px; 325 | border-style: solid; 326 | border-radius: 3px; 327 | font-size: 13px; 328 | line-height: 2; 329 | text-decoration: none; 330 | white-space: nowrap; 331 | cursor: pointer; 332 | -webkit-appearance: none; 333 | } 334 | 335 | .split-button { 336 | position: relative; 337 | display: inline-block; 338 | vertical-align: middle; 339 | } 340 | 341 | .split-button-body { 342 | display: none; 343 | position: absolute; 344 | bottom: 39px; 345 | right: 0; 346 | border: 1px solid #ddd; 347 | background-color: #fff; 348 | min-width: 180px; 349 | max-width: 100%; 350 | margin: 0; 351 | padding: 8px; 352 | list-style: none; 353 | box-shadow: 1px 0 4px rgba( 0, 0, 0, 0.15 ); 354 | } 355 | 356 | .split-button-body:before, 357 | .split-button-body:after { 358 | position: absolute; 359 | right: 12px; 360 | display: block; 361 | width: 0; 362 | height: 0; 363 | border-style: solid; 364 | border-color: transparent; 365 | content: ""; 366 | } 367 | 368 | .split-button-body:before { 369 | bottom: -18px; 370 | border-top-color: #ccc; 371 | border-width: 9px; 372 | right: 11px; 373 | } 374 | 375 | .split-button-body:after { 376 | bottom: -16px; 377 | border-top-color: #fff; 378 | border-width: 8px; 379 | } 380 | 381 | .split-button-body .split-button-option { 382 | display: block; 383 | padding: 5px 15px; 384 | margin: 0; 385 | width: 100%; 386 | border: 0; 387 | text-align: left; 388 | line-height: 2; 389 | background: none; 390 | color: inherit; 391 | text-decoration: none; 392 | outline: none; 393 | transition: none; 394 | } 395 | 396 | .split-button-body .split-button-option:hover, 397 | .split-button-body .split-button-option:active { 398 | color: inherit; 399 | } 400 | 401 | .is-open .split-button-body { 402 | display: block; 403 | } 404 | 405 | .split-button-primary, 406 | .split-button-toggle { 407 | border-radius: 0; 408 | display: block; 409 | margin: 0; 410 | font-size: 13px; 411 | text-decoration: none; 412 | white-space: nowrap; 413 | cursor: pointer; 414 | -webkit-appearance: none; 415 | line-height: 2; 416 | padding: 0 10px 1px; 417 | background: #0085ba; 418 | border-color: #0073aa #006799 #006799; 419 | border-width: 1px; 420 | border-style: solid; 421 | box-shadow: 0 1px 0 #006799; 422 | color: #fff; 423 | text-shadow: 0 -1px 1px #006799, 424 | 1px 0 1px #006799, 425 | 0 1px 1px #006799, 426 | -1px 0 1px #006799; 427 | } 428 | 429 | .split-button-primary { 430 | border-top-left-radius: 3px; 431 | border-bottom-left-radius: 3px; 432 | border-right: 0 none; 433 | float: left; 434 | } 435 | 436 | .split-button-toggle { 437 | padding: 0; 438 | border-top-right-radius: 3px; 439 | border-bottom-right-radius: 3px; 440 | border-left: 1px solid #006799; 441 | float: right; 442 | } 443 | 444 | .split-button-toggle i { 445 | margin: 4px 20px 3px 0; 446 | padding: 0 10px; 447 | } 448 | 449 | .split-button-primary:hover, 450 | .split-button-toggle:hover { 451 | outline: none; 452 | background: #008ec2; 453 | border-color: #006799; 454 | } 455 | 456 | .split-button-primary:focus, 457 | .split-button-toggle:focus { 458 | outline: none; 459 | box-shadow: 0 1px 0 #0073aa, 460 | 0 0 2px 1px #33b3db; 461 | } 462 | 463 | .split-button-primary:active, 464 | .split-button-toggle:active { 465 | background: #0073aa; 466 | border-color: #006799; 467 | box-shadow: inset 0 2px 10px #006799, 0 1px 0 #0073aa; 468 | } 469 | 470 | /** 471 | * Forms 472 | * 473 | * So many input types. 474 | */ 475 | button, 476 | input, 477 | select, 478 | textarea { 479 | font-size: 100%; 480 | margin: 0; 481 | vertical-align: baseline; 482 | *vertical-align: middle; 483 | } 484 | 485 | [type="checkbox"], 486 | [type="radio"] { 487 | padding: 0; 488 | } 489 | 490 | [type="search"] { 491 | -webkit-appearance: textfield; 492 | box-sizing: content-box; 493 | } 494 | 495 | [type="search"]::-webkit-search-decoration { 496 | -webkit-appearance: none; 497 | } 498 | 499 | button::-moz-focus-inner, 500 | input::-moz-focus-inner { 501 | border: 0; 502 | padding: 0; 503 | } 504 | 505 | [type="text"], 506 | [type="email"], 507 | [type="url"], 508 | [type="password"], 509 | [type="search"], 510 | textarea { 511 | padding: 0.4em 0.75em; 512 | color: #32373c; 513 | border: 1px solid #ccc; 514 | } 515 | 516 | [type="text"]:focus, 517 | [type="email"]:focus, 518 | [type="url"]:focus, 519 | [type="password"]:focus, 520 | [type="search"]:focus, 521 | textarea:focus { 522 | color: #32373c; 523 | outline: 0; 524 | } 525 | 526 | textarea { 527 | overflow: auto; 528 | padding-left: 3px; 529 | vertical-align: top; 530 | } 531 | 532 | 533 | /** 534 | * Links 535 | */ 536 | a { 537 | color: #0073aa; 538 | } 539 | 540 | a:visited { 541 | color: #0073aa; 542 | } 543 | 544 | a:hover, 545 | a:focus, 546 | a:active { 547 | color: #00a0d2; 548 | } 549 | 550 | 551 | /** 552 | * Lists 553 | */ 554 | ul, 555 | ol { 556 | margin: 0 0 1.5em 3em; 557 | } 558 | 559 | ul { 560 | list-style: disc; 561 | } 562 | 563 | ol { 564 | list-style: decimal; 565 | } 566 | 567 | li > ul, 568 | li > ol { 569 | margin-bottom: 0; 570 | margin-left: 1.5em; 571 | } 572 | 573 | dt { 574 | font-weight: 700; 575 | } 576 | 577 | dd { 578 | margin: 0 1.5em 1.5em; 579 | } 580 | 581 | 582 | /** 583 | * Post formats 584 | * 585 | * Complete styles for post formats UI 586 | */ 587 | /* TODO if we remove the
during merge, this can go. */ 588 | #post-formats-select br { 589 | display: none; 590 | } 591 | 592 | .post-format { 593 | width: 1px; 594 | height: 1px; 595 | position: absolute; 596 | top: -9999px; 597 | } 598 | 599 | .lt-ie9 .post-format { 600 | margin: 17px 12px 0 13px; 601 | width: auto; 602 | height: auto; 603 | position: static; 604 | top: auto; 605 | float: left; 606 | width: 16px; 607 | height: 16px; 608 | } 609 | 610 | .post-format-icon { 611 | position: relative; 612 | display: block; 613 | padding: 13px 2px 14px 13px; 614 | cursor: pointer; 615 | } 616 | 617 | .post-format-icon:before, 618 | .post-format-icon:after { 619 | content: ""; 620 | display: inline-block; 621 | width: 20px; 622 | height: 20px; 623 | margin-right: 10px; 624 | font-size: 20px; 625 | line-height: 1; 626 | font-family: dashicons; 627 | text-decoration: inherit; 628 | color: #9ea7af; 629 | font-weight: 400; 630 | font-style: normal; 631 | vertical-align: top; 632 | text-align: center; 633 | transition: color .1s ease-in 0; 634 | -webkit-font-smoothing: antialiased; 635 | -moz-osx-font-smoothing: grayscale; 636 | } 637 | 638 | .post-format-icon:before { 639 | content: "\f109"; 640 | } 641 | 642 | .post-format-icon:after { 643 | display: none; 644 | content: "\f147"; 645 | float: right; 646 | } 647 | 648 | .post-format:checked + .post-format-icon { 649 | box-shadow: inset 6px 0 0 #00a0d2; 650 | background: rgba(46, 162, 204, 0.1); 651 | } 652 | 653 | .post-format:checked + .post-format-icon:before, 654 | .post-format:checked + .post-format-icon:after { 655 | color: #32373c; 656 | } 657 | 658 | .post-format:focus + .post-format-icon { 659 | background: #00a0d2; 660 | color: #fff; 661 | } 662 | 663 | .post-format:focus + .post-format-icon:before, 664 | .post-format:focus + .post-format-icon:after { 665 | color: #fff; 666 | } 667 | 668 | .post-format:checked + .post-format-icon:after { 669 | display: block; 670 | } 671 | 672 | .lt-ie9 .post-format-icon { 673 | margin-left: 16px; 674 | } 675 | 676 | .post-format-aside:before { 677 | content: "\f123"; 678 | } 679 | 680 | .post-format-chat:before { 681 | content: "\f125"; 682 | } 683 | 684 | .post-format-gallery:before { 685 | content: "\f161"; 686 | } 687 | 688 | .post-format-link:before { 689 | content: "\f103"; 690 | } 691 | 692 | .post-format-image:before { 693 | content: "\f128"; 694 | } 695 | 696 | .post-format-quote:before { 697 | content: "\f122"; 698 | } 699 | 700 | .post-format-status:before { 701 | content: "\f130"; 702 | } 703 | 704 | .post-format-video:before { 705 | content: "\f126"; 706 | } 707 | 708 | .post-format-audio:before { 709 | content: "\f127"; 710 | } 711 | 712 | 713 | /** 714 | * Tags 715 | * 716 | * Complete styles for tags UI 717 | */ 718 | .tagsdiv p { 719 | margin: 0; 720 | } 721 | 722 | .tagsdiv .ajaxtag { 723 | position: relative; 724 | } 725 | 726 | .tagsdiv .newtag { 727 | display: block; 728 | position: relative; 729 | padding: 11px 58px 11px 16px; 730 | width: 100%; 731 | border: 0; 732 | border-bottom: 1px solid #e5e5e5; 733 | font-size: 16px; 734 | } 735 | 736 | .tagsdiv .tagadd { 737 | position: absolute; 738 | top: 0; 739 | right: 0; 740 | bottom: 1px; 741 | border: 0; 742 | border-radius: 0; 743 | margin: 0; 744 | padding: 0 16px; 745 | background: #f7f7f7; 746 | border-left: 1px solid #f1f1f1; 747 | box-shadow: none; 748 | } 749 | 750 | .tagsdiv .tagadd:hover, 751 | .tagsdiv .tagadd:active, 752 | .tagsdiv .tagadd:focus { 753 | outline: 0; 754 | background: #2991b7; 755 | border-color: #20708e; 756 | color: #fff; 757 | box-shadow: none; 758 | } 759 | 760 | .tagsdiv .howto { 761 | color: #727272; 762 | font-style: italic; 763 | margin: 10px 0 6px 16px; 764 | } 765 | 766 | /* Tags */ 767 | .tagchecklist { 768 | padding: 16px 28px 5px; 769 | } 770 | 771 | .tagchecklist:before, 772 | .tagchecklist:after { 773 | content: ""; 774 | display: table; 775 | } 776 | 777 | .tagchecklist:after { 778 | clear: both; 779 | } 780 | 781 | .tagchecklist > span { 782 | float: left; 783 | margin-right: 25px; 784 | font-size: 13px; 785 | line-height: 1.8; 786 | white-space: nowrap; 787 | cursor: default; 788 | } 789 | 790 | .tagchecklist > li { 791 | list-style-type: none; 792 | } 793 | 794 | @media (max-width: 600px) { 795 | .tagchecklist > span { 796 | margin-bottom: 15px; 797 | font-size: 16px; 798 | line-height: 1.3; 799 | } 800 | } 801 | 802 | .tagchecklist .ntdelbutton { 803 | position: absolute; 804 | width: 24px; 805 | height: 24px; 806 | border: none; 807 | margin: 0 0 0 -19px; 808 | padding: 0; 809 | background: none; 810 | cursor: pointer; 811 | text-indent: 0;; 812 | position: absolute; 813 | } 814 | 815 | .tagchecklist .ntdelbutton .remove-tag-icon:before { 816 | content: "\f153"; 817 | display: block; 818 | margin-left: 2px; 819 | height: 20px; 820 | width: 20px; 821 | border-radius: 50%; 822 | background: transparent; 823 | color: #0073aa; 824 | /* line-height tweak to vertically center the icon cross browsers */ 825 | font: 400 16px/1.28 dashicons; 826 | text-align: center; 827 | -webkit-font-smoothing: antialiased; 828 | } 829 | 830 | .tagchecklist .ntdelbutton:focus { 831 | outline: 0; 832 | } 833 | 834 | .tagchecklist .ntdelbutton:hover .remove-tag-icon:before, 835 | .tagchecklist .ntdelbutton:focus .remove-tag-icon:before { 836 | color: #c00; 837 | } 838 | 839 | .tagchecklist .ntdelbutton:focus .remove-tag-icon:before { 840 | box-shadow: 841 | 0 0 0 1px #5b9dd9, 842 | 0 0 2px 1px rgba(30, 140, 190, .8); 843 | } 844 | 845 | /* THE TAG CLOUD. */ 846 | .tagsdiv + p { 847 | margin: 0; 848 | } 849 | 850 | .press-this .tagcloud-link { 851 | display: block; 852 | margin: 0 16px 5px; 853 | padding: 0; 854 | text-decoration: none; 855 | outline: 0; 856 | color: inherit; 857 | } 858 | 859 | .press-this .tagcloud-link:hover, 860 | .press-this .tagcloud-link:active { 861 | color: inherit; 862 | } 863 | 864 | .tagcloud-link:focus { 865 | text-decoration: underline; 866 | } 867 | 868 | .popular-tags { 869 | border: none; 870 | line-height: 2em; 871 | padding: 8px 12px 12px; 872 | text-align: justify; 873 | } 874 | 875 | .popular-tags a { 876 | padding: 0 3px; 877 | } 878 | 879 | .the-tagcloud { 880 | margin: 0; 881 | padding: 16px; 882 | } 883 | 884 | .the-tagcloud a { 885 | text-decoration: none; 886 | outline: 0; 887 | } 888 | 889 | .the-tagcloud a:focus { 890 | text-decoration: underline; 891 | } 892 | 893 | .tagcloud h3 { 894 | margin: 2px 0 12px; 895 | } 896 | 897 | 898 | /** 899 | * Categories 900 | * 901 | * Complete styles for post categories UI 902 | */ 903 | input[type="search"].categories-search, 904 | .add-category-name { 905 | display: block; 906 | width: 100%; 907 | padding: 0.85714em 1.07143em; 908 | border: 0; 909 | border-radius: 0; 910 | border-bottom: 1px solid #e5e5e5; 911 | font-size: 14px; 912 | -webkit-appearance: none; 913 | -moz-appearance: none; 914 | appearance: none; 915 | } 916 | 917 | @media (max-width: 600px) { 918 | input[type="search"].categories-search, 919 | .add-category-name { 920 | /* Needs to be 16px to prevent zooming on iOS. Guh. */ 921 | font-size: 16px; 922 | } 923 | } 924 | 925 | .press-this .add-cat-toggle { 926 | float: right; 927 | margin-top: -45px; 928 | line-height: 20px; 929 | padding: 12px 10px 8px; 930 | color: #0073aa; 931 | text-decoration: none; 932 | transition: none; 933 | } 934 | 935 | .press-this .add-cat-toggle:focus { 936 | color: #00a0d2; 937 | } 938 | 939 | .press-this .add-cat-toggle.is-toggled { 940 | padding: 10px; 941 | } 942 | 943 | .press-this .add-cat-toggle.is-toggled .dashicons:before { 944 | content: "\f179"; 945 | } 946 | 947 | .add-category { 948 | position: relative; 949 | border-bottom: 1px solid #e5e5e5; 950 | } 951 | 952 | .add-category.is-hidden { 953 | display: none; 954 | } 955 | 956 | .add-category .add-cat-submit { 957 | position: absolute; 958 | top: 0; 959 | right: 0; 960 | border: 0; 961 | border-radius: 0; 962 | padding: 12px 16px; 963 | background: #f7f7f7; 964 | border-left: 1px solid #f1f1f1; 965 | } 966 | 967 | .add-category .add-cat-submit:hover, 968 | .add-category .add-cat-submit:active, 969 | .add-category .add-cat-submit:focus { 970 | outline: 0; 971 | background: #2991b7; 972 | border-color: #20708e; 973 | color: #fff; 974 | } 975 | 976 | /* Parent category select */ 977 | .postform-wrapper { 978 | padding: 12px; 979 | } 980 | 981 | .postform { 982 | display: block; 983 | margin: 0; 984 | width: 100%; 985 | height: 34px; 986 | border: 0; 987 | border-radius: 0; 988 | border: 1px solid #e5e5e5; 989 | background: #fff; 990 | background-size: 20px 20px; 991 | overflow: hidden; 992 | line-height: 21px; 993 | text-overflow: ellipsis; 994 | text-decoration: none; 995 | vertical-align: top; 996 | white-space: nowrap; 997 | cursor: pointer; 998 | outline: 0; 999 | } 1000 | 1001 | .postform:focus { 1002 | border-color: #0073aa; 1003 | box-shadow: 0 0 0 3px #00a0d2; 1004 | outline: 0; 1005 | -moz-outline: none; 1006 | -moz-user-focus: ignore; 1007 | } 1008 | 1009 | .postform::-ms-expand { 1010 | display: none; 1011 | } 1012 | 1013 | .postform::-ms-value { 1014 | background: none; 1015 | color: #727272; 1016 | } 1017 | 1018 | .postform:-moz-focusring { 1019 | color: transparent; 1020 | text-shadow: 0 0 0 #727272; 1021 | } 1022 | 1023 | /* Category list */ 1024 | .categories-select { 1025 | margin: 0; 1026 | padding: 0; 1027 | list-style: none; 1028 | } 1029 | 1030 | .categories-select ul { 1031 | margin: 0; 1032 | padding: 0; 1033 | list-style: none; 1034 | } 1035 | 1036 | .category { 1037 | position: relative; 1038 | display: block; 1039 | padding: 13px 16px 14px 16px; 1040 | cursor: pointer; 1041 | background: #fff; 1042 | } 1043 | 1044 | .category:focus, 1045 | .category.selected:focus { 1046 | outline: 0; 1047 | background: #00a0d2; 1048 | color: #fff; 1049 | } 1050 | 1051 | .category.selected { 1052 | box-shadow: inset 6px 0 0 #00a0d2; 1053 | background: #E9F5F9; 1054 | } 1055 | 1056 | .category.selected:after { 1057 | display: inline-block; 1058 | content: "\f147"; 1059 | position: absolute; 1060 | top: 13px; 1061 | right: 0; 1062 | width: 20px; 1063 | height: 20px; 1064 | margin-right: 10px; 1065 | font-size: 20px; 1066 | line-height: 1; 1067 | font-family: dashicons; 1068 | text-decoration: inherit; 1069 | color: #23282d; 1070 | font-weight: 400; 1071 | font-style: normal; 1072 | vertical-align: top; 1073 | text-align: center; 1074 | transition: color .1s ease-in 0; 1075 | -webkit-font-smoothing: antialiased; 1076 | -moz-osx-font-smoothing: grayscale; 1077 | } 1078 | 1079 | .category.selected:focus:after { 1080 | color: #fff; 1081 | } 1082 | 1083 | .categories-select ul .category { 1084 | padding-left: 24px; 1085 | } 1086 | 1087 | .categories-select ul ul .category { 1088 | padding-left: 32px; 1089 | } 1090 | 1091 | .categories-select ul ul ul .category { 1092 | padding-left: 40px; 1093 | } 1094 | 1095 | .categories-select ul ul ul ul .category { 1096 | padding-left: 48px; 1097 | } 1098 | 1099 | .categories-select ul ul ul ul ul .category { 1100 | padding-left: 56px; 1101 | } 1102 | 1103 | .categories-select ul ul ul ul ul ul .category { 1104 | padding-left: 64px; 1105 | } 1106 | 1107 | .categories-select .is-hidden { 1108 | display: none; 1109 | } 1110 | 1111 | .categories-select .is-hidden.searched-parent { 1112 | display: block; 1113 | } 1114 | 1115 | /* Category search */ 1116 | .categories-search-wrapper { 1117 | position: relative; 1118 | } 1119 | 1120 | .categories-search-wrapper.is-hidden { 1121 | display: none; 1122 | } 1123 | 1124 | .categories-search-wrapper label { 1125 | position: absolute; 1126 | top: 50%; 1127 | right: 10px; 1128 | margin-top: -10px; 1129 | color: #9ea7af; 1130 | } 1131 | 1132 | 1133 | /** 1134 | * Main 1135 | */ 1136 | html { 1137 | overflow: auto; 1138 | } 1139 | 1140 | body { 1141 | overflow-x: hidden; 1142 | height: 100%; 1143 | } 1144 | 1145 | html { 1146 | background: #fff; 1147 | box-shadow: -10px 0 0 rgba(0, 0, 0, 0.3); 1148 | } 1149 | 1150 | @media (max-width: 900px) { 1151 | body { 1152 | font-size: 16px; 1153 | } 1154 | } 1155 | 1156 | @media (max-width: 320px) { 1157 | body { 1158 | font-size: 14px; 1159 | } 1160 | } 1161 | 1162 | .lt-ie9 { 1163 | overflow: visible; 1164 | } 1165 | 1166 | .adminbar { 1167 | position: relative; 1168 | width: 100%; 1169 | padding: 0 0.8em; 1170 | min-height: 3.2em; 1171 | background: #23282d; 1172 | color: #fff; 1173 | z-index: 9999; 1174 | } 1175 | 1176 | .adminbar:before, 1177 | .adminbar:after { 1178 | content: ""; 1179 | display: table; 1180 | } 1181 | 1182 | .adminbar:after { 1183 | clear: both; 1184 | } 1185 | 1186 | .adminbar .dashicons { 1187 | color: #a0a5aa; /* same as WP admin bar icons */ 1188 | } 1189 | 1190 | .press-this .adminbar button { 1191 | position: absolute; 1192 | top: 50%; 1193 | right: 6px; 1194 | margin-top: -13px; 1195 | padding: 0 10px 1px; 1196 | font-size: 13px; 1197 | text-decoration: none; 1198 | transition: none; 1199 | } 1200 | 1201 | @media (max-width: 320px) { 1202 | .adminbar { 1203 | min-height: 45px; 1204 | } 1205 | } 1206 | 1207 | .current-site { 1208 | margin-top: 0.5625em; 1209 | font-size: 16px; 1210 | line-height: 44px; 1211 | font-weight: 400; 1212 | overflow: hidden; 1213 | white-space: nowrap; 1214 | text-overflow: ellipsis; 1215 | } 1216 | 1217 | @media (max-width: 600px) { 1218 | .current-site { 1219 | margin: 3px 0 0; 1220 | } 1221 | } 1222 | 1223 | @media (max-width: 320px) { 1224 | .current-site { 1225 | margin: 0; 1226 | font-size: 14px; 1227 | } 1228 | } 1229 | 1230 | .current-site-link { 1231 | text-decoration: none; 1232 | } 1233 | 1234 | .current-site-link:focus { 1235 | outline: 0; 1236 | } 1237 | 1238 | .current-site-link:focus .current-site-name{ 1239 | text-decoration: underline; 1240 | } 1241 | 1242 | .current-site-name { 1243 | color: #ededed; 1244 | } 1245 | 1246 | @media (max-width: 320px) { 1247 | .current-site-name { 1248 | font-weight: 600; 1249 | } 1250 | } 1251 | 1252 | .current-site .dashicons-wordpress { 1253 | position: relative; 1254 | top: -1px; 1255 | margin-right: 10px; 1256 | vertical-align: middle; 1257 | } 1258 | 1259 | .options, 1260 | .options.open .on-closed, 1261 | .options.closed .on-open { 1262 | display: none; 1263 | } 1264 | 1265 | @media (max-width: 900px) { 1266 | .options { 1267 | display: block; 1268 | } 1269 | } 1270 | 1271 | .options-panel-back.is-hidden { 1272 | display: none; 1273 | } 1274 | 1275 | .options:focus .dashicons { 1276 | color: #fff; 1277 | text-decoration: none; 1278 | } 1279 | 1280 | .options .dashicons { 1281 | margin-top: 3px; 1282 | } 1283 | 1284 | .options { 1285 | color: #00a0d2; 1286 | } 1287 | 1288 | .scan { 1289 | position: relative; 1290 | border-bottom: 1px solid #e5e5e5; 1291 | } 1292 | 1293 | @media (max-width: 900px) { 1294 | .scan form { 1295 | transition: opacity .3s ease-in-out; 1296 | } 1297 | .scan.is-hidden form { 1298 | opacity: .2; 1299 | pointer-events: none; 1300 | } 1301 | } 1302 | 1303 | .scan-url { 1304 | display: block; 1305 | border: 0; 1306 | padding: 0.85714em 1.07143em; 1307 | font-size: 14px; 1308 | width: 100%; 1309 | } 1310 | 1311 | @media (max-width: 600px) { 1312 | .scan-url { 1313 | font-size: 16px; 1314 | } 1315 | } 1316 | 1317 | .scan-submit { 1318 | position: absolute; 1319 | top: 0; 1320 | right: 0; 1321 | bottom: 0; 1322 | padding: 0 1.07143em; 1323 | background: #f7f7f7; 1324 | border-color: #ddd; 1325 | border: 0; 1326 | border-left: 1px solid #f1f1f1; 1327 | border-radius: 0; 1328 | color: #555; 1329 | font-size: 14px; 1330 | line-height: 1.6; 1331 | } 1332 | 1333 | .scan-submit:hover, 1334 | .scan-submit:focus { 1335 | background: #008ec2; 1336 | border-color: #006799; 1337 | color: #fff; 1338 | outline: 0; 1339 | } 1340 | 1341 | .scan-submit:active { 1342 | background: #0073aa; 1343 | border-color: #006799; 1344 | color: #fff; 1345 | } 1346 | 1347 | .scan-submit:visited { 1348 | color: #555; 1349 | } 1350 | 1351 | .wrapper { 1352 | position: relative; 1353 | margin-bottom: 60px; 1354 | margin-right: 320px; 1355 | } 1356 | 1357 | .wrapper:before, 1358 | .wrapper:after { 1359 | content: ""; 1360 | display: table; 1361 | } 1362 | 1363 | .wrapper:after { 1364 | clear: both; 1365 | } 1366 | 1367 | @media (max-width: 900px) { 1368 | .wrapper { 1369 | margin: 0; 1370 | width: 100%; 1371 | } 1372 | } 1373 | 1374 | .editor-wrapper { 1375 | overflow: auto; 1376 | float: left; 1377 | width: 100%; 1378 | } 1379 | 1380 | .editor-wrapper:before, 1381 | .editor-wrapper:after { 1382 | content: ""; 1383 | display: table; 1384 | } 1385 | 1386 | .editor-wrapper:after { 1387 | clear: both; 1388 | } 1389 | 1390 | .editor { 1391 | padding: 0 1.5em 4.75em; 1392 | max-width: 700px; 1393 | margin: 0 auto; 1394 | } 1395 | 1396 | .spinner { 1397 | height: 20px; 1398 | width: 20px; 1399 | display: inline-block; 1400 | visibility: hidden; 1401 | background: url(spinner.gif) no-repeat center; 1402 | background-size: 20px 20px; 1403 | opacity: 0.7; 1404 | filter: alpha(opacity=70); 1405 | line-height: 1; 1406 | vertical-align: middle; 1407 | } 1408 | 1409 | @media print, 1410 | (-webkit-min-device-pixel-ratio: 1.25), 1411 | (min-resolution: 120dpi) { 1412 | 1413 | .spinner { 1414 | background-image: url(spinner-2x.gif); 1415 | } 1416 | } 1417 | 1418 | .spinner.is-active { 1419 | visibility: visible; 1420 | } 1421 | 1422 | /* Make the text inside the editor textarea white. Prevents a "flash" on loading the page */ 1423 | #pressthis { 1424 | color: #fff; 1425 | } 1426 | 1427 | @media (min-width: 901px) { 1428 | .editor { 1429 | max-width: 760px; 1430 | } 1431 | } 1432 | 1433 | @media (max-width: 320px) { 1434 | .editor { 1435 | padding: 0; 1436 | } 1437 | } 1438 | 1439 | .post-title, 1440 | .post-title-placeholder { 1441 | margin: 0; 1442 | padding: .83em 0; 1443 | width: 100%; 1444 | border-bottom: 1px solid #e5e5e5; 1445 | font-size: 32px; 1446 | line-height: 1.4; 1447 | font-weight: 700; 1448 | } 1449 | 1450 | .post-title:active, 1451 | .post-title:focus, 1452 | .post-title-placeholder:active, 1453 | .post-title-placeholder:focus { 1454 | outline: 0; 1455 | box-shadow: inset 0px -3px 0 #00a0d2; 1456 | border-color: #00a0d2; 1457 | } 1458 | 1459 | @media (max-width: 900px) { 1460 | .post-title, 1461 | .post-title-placeholder { 1462 | font-size: 24px; 1463 | } 1464 | } 1465 | 1466 | @media (max-height: 400px) { 1467 | .post-title, 1468 | .post-title-placeholder { 1469 | padding: 15px 0; 1470 | font-size: 16px; 1471 | } 1472 | } 1473 | 1474 | @media (max-width: 320px) { 1475 | .post-title, 1476 | .post-title-placeholder { 1477 | font-size: 16px; 1478 | font-weight: 600; 1479 | padding: 1.14286em 1.42857em; 1480 | } 1481 | } 1482 | 1483 | .post-title { 1484 | /* IE8 fallback */ 1485 | background: url(data:image/gif;base64,R0lGODlhAQABAJEAAAAAAP///////wAAACH5BAEHAAIALAAAAAABAAEAAAICVAEAOw==); 1486 | background: none, none; 1487 | } 1488 | 1489 | .post-title:before { 1490 | /* Keeps empty container from collapsing */ 1491 | content: "\a0"; 1492 | display: inline-block; 1493 | width: 0; 1494 | speak: none; 1495 | } 1496 | 1497 | .post-title-placeholder { 1498 | position: absolute; 1499 | border: 0; 1500 | color: #82878c; 1501 | z-index: -1; 1502 | } 1503 | 1504 | .post-title-placeholder.is-hidden { 1505 | display: none; 1506 | } 1507 | 1508 | /* Suggested images */ 1509 | .media-list-container { 1510 | position: relative; 1511 | padding: 2px 0; 1512 | border-bottom: 1px solid #e5e5e5; 1513 | display: none; 1514 | } 1515 | 1516 | .media-list-inner-container { 1517 | overflow: auto; 1518 | max-height: 150px; 1519 | max-height: 40vw; 1520 | } 1521 | 1522 | .media-list-container.has-media { 1523 | display: block; 1524 | } 1525 | 1526 | .media-list-inner-container:before, 1527 | .media-list-inner-container:after { 1528 | content: ""; 1529 | display: table; 1530 | } 1531 | 1532 | .media-list-inner-container:after { 1533 | clear: both; 1534 | } 1535 | 1536 | .media-list { 1537 | margin: 0; 1538 | padding: 0; 1539 | } 1540 | 1541 | @media (min-width: 321px) { 1542 | .media-list-inner-container { 1543 | max-height: 250px; 1544 | max-height: 40vw; 1545 | } 1546 | } 1547 | 1548 | @media (min-width: 601px) { 1549 | .media-list-inner-container { 1550 | max-height: 200px; 1551 | max-height: 18.75vw; 1552 | } 1553 | } 1554 | 1555 | .wppt-all-media-list { 1556 | list-style: none; 1557 | margin: 0; 1558 | padding: 0; 1559 | } 1560 | 1561 | .suggested-media-thumbnail:focus, 1562 | .is-embed:focus { 1563 | outline: 0; 1564 | box-shadow: inset 0 0 0 3px #00a0d2; 1565 | } 1566 | 1567 | .suggested-media-thumbnail { 1568 | position: relative; 1569 | display: block; 1570 | float: left; 1571 | width: 16.66%; 1572 | padding: 16.66% 0 0 16.66%; 1573 | background-position: center; 1574 | background-repeat: no-repeat; 1575 | background-size: cover; 1576 | background-color: #d8d8d8; 1577 | color: #fff; 1578 | color: rgba(255, 255, 255, 0.6); 1579 | cursor: pointer; 1580 | } 1581 | 1582 | .suggested-media-thumbnail:hover, 1583 | .suggested-media-thumbnail:active, 1584 | .suggested-media-thumbnail:focus { 1585 | color: #fff; 1586 | } 1587 | 1588 | .suggested-media-thumbnail:before, 1589 | .suggested-media-thumbnail:after { 1590 | display: inline-block; 1591 | position: absolute; 1592 | font-size: 20px; 1593 | line-height: 1; 1594 | font-family: dashicons; 1595 | text-decoration: inherit; 1596 | font-weight: 400; 1597 | font-style: normal; 1598 | transition: color .1s ease-in 0; 1599 | -webkit-font-smoothing: antialiased; 1600 | -moz-osx-font-smoothing: grayscale; 1601 | } 1602 | 1603 | .suggested-media-thumbnail:before { 1604 | left: 50%; 1605 | top: 50%; 1606 | margin: -20px 0 0 -20px; 1607 | font-size: 40px; 1608 | } 1609 | 1610 | .suggested-media-thumbnail:after { 1611 | content: "\f132"; 1612 | right: 3%; 1613 | bottom: 2%; 1614 | } 1615 | 1616 | @media (min-width: 601px) { 1617 | .suggested-media-thumbnail { 1618 | width: 12.5%; 1619 | padding: 12.5% 0 0 12.5%; 1620 | } 1621 | } 1622 | 1623 | .is-embed:before { 1624 | content: "\f104"; 1625 | color: #fff; 1626 | color: rgba(255, 255, 255, 0.9); 1627 | } 1628 | 1629 | .is-embed.is-audio:hover:before, 1630 | .is-embed.is-audio:active:before, 1631 | .is-embed.is-audio:focus:before, 1632 | .is-embed.is-tweet:hover:before, 1633 | .is-embed.is-tweet:active:before, 1634 | .is-embed.is-tweet:focus:before { 1635 | color: #fff; 1636 | } 1637 | 1638 | .is-embed.is-video { 1639 | background-color: #23282d; 1640 | } 1641 | 1642 | .is-embed.is-video:hover:before, 1643 | .is-embed.is-video:active:before, 1644 | .is-embed.is-video:focus:before { 1645 | color: rgba(255, 255, 255, 0.2); 1646 | } 1647 | 1648 | .is-embed.is-video:before { 1649 | content: "\f236"; 1650 | } 1651 | 1652 | .is-embed.is-audio { 1653 | background-color: #ff7d44; 1654 | } 1655 | 1656 | .is-embed.is-audio:before { 1657 | content: "\f127"; 1658 | } 1659 | 1660 | .is-embed.is-tweet { 1661 | background-color: #55acee; 1662 | } 1663 | 1664 | .is-embed.is-tweet:before { 1665 | content: "\f301"; 1666 | } 1667 | 1668 | .no-media { 1669 | margin: 0; 1670 | padding: 0; 1671 | border: 0; 1672 | } 1673 | 1674 | /* Actions bar */ 1675 | .press-this-actions { 1676 | position: fixed; 1677 | bottom: 0; 1678 | left: 0; 1679 | width: 100%; 1680 | background: #f1f1f1; 1681 | background: rgba(241, 241, 241, 0.9); 1682 | border-top: 1px solid #e5e5e5; 1683 | } 1684 | 1685 | @media (max-width: 900px) { 1686 | .press-this-actions { 1687 | -webkit-transform: translateY(0); 1688 | transform: translateY(0); 1689 | transition: -webkit-transform .3s ease-in-out; 1690 | transition: transform .3s ease-in-out; 1691 | transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out; 1692 | } 1693 | .press-this-actions.is-hidden { 1694 | -webkit-transform: translateY(100%); 1695 | transform: translateY(100%); 1696 | } 1697 | } 1698 | 1699 | .add-media { 1700 | float: left; 1701 | margin: 14px 0 14px 30px; 1702 | font-size: 0; 1703 | } 1704 | 1705 | @media (max-width: 320px) { 1706 | .add-media { 1707 | margin: 10px 0 10px 10px; 1708 | } 1709 | } 1710 | 1711 | .insert-media { 1712 | color: #9ea7af; 1713 | float: left; 1714 | margin: 0; 1715 | padding: 0; 1716 | border: 0; 1717 | border-radius: 0; 1718 | background: none; 1719 | box-shadow: none; 1720 | overflow: hidden; 1721 | } 1722 | 1723 | .insert-media:hover, 1724 | .insert-media:focus, 1725 | .insert-media:active { 1726 | color: #23282d; 1727 | } 1728 | 1729 | .insert-media:focus, 1730 | .insert-media:active { 1731 | outline: 0; 1732 | color: #00a0d2; 1733 | box-shadow: 1734 | 0 0 0 1px #5b9dd9, 1735 | 0 0 2px 1px rgba(30, 140, 190, .8); 1736 | } 1737 | 1738 | .insert-media .dashicons { 1739 | padding: 11px; 1740 | width: 63px; 1741 | height: 58px; 1742 | font-size: 40px; 1743 | } 1744 | 1745 | @media (max-width: 320px) { 1746 | .insert-media .dashicons { 1747 | width: 55px; 1748 | height: 49px; 1749 | padding: 14px; 1750 | font-size: 20px; 1751 | } 1752 | } 1753 | 1754 | .post-actions { 1755 | float: right; 1756 | margin: 14px 30px 14px 0; 1757 | font-size: 13px; 1758 | } 1759 | 1760 | @media (max-width: 320px) { 1761 | .post-actions { 1762 | margin: 10px 10px 10px 0; 1763 | } 1764 | } 1765 | 1766 | .publish-button .saving-draft, 1767 | .publish-button.is-saving .publish { 1768 | display: none; 1769 | } 1770 | 1771 | .publish-button.is-saving .saving-draft { 1772 | display: inline; 1773 | } 1774 | 1775 | /* TinyMCE styles */ 1776 | .editor .wp-media-buttons { 1777 | float: none; 1778 | } 1779 | 1780 | .editor div.mce-toolbar-grp { 1781 | padding: 0.71429em 0; 1782 | background: none; 1783 | border: 0; 1784 | } 1785 | 1786 | @media (max-height: 400px), (max-width: 320px) { 1787 | .editor div.mce-toolbar-grp { 1788 | padding: 0; 1789 | } 1790 | } 1791 | 1792 | .mce-stack-layout:before, 1793 | .mce-stack-layout:after { 1794 | content: ""; 1795 | display: table; 1796 | } 1797 | 1798 | .mce-stack-layout:after { 1799 | clear: both; 1800 | } 1801 | 1802 | .mce-container.mce-toolbar { 1803 | float: left; 1804 | } 1805 | 1806 | .mce-container.mce-toolbar:nth-child(2) { 1807 | float: right; 1808 | } 1809 | 1810 | @media (max-width: 600px) { 1811 | .mce-first .mce-btn:nth-child(3), 1812 | .mce-first .mce-btn:nth-child(4) { 1813 | position: absolute; 1814 | margin: -1px; 1815 | padding: 0; 1816 | height: 1px; 1817 | width: 1px; 1818 | overflow: hidden; 1819 | clip: rect(0 0 0 0); 1820 | border: 0; 1821 | } 1822 | 1823 | .mce-first .mce-btn:nth-child(3):focus, 1824 | .mce-first .mce-btn:nth-child(4):focus { 1825 | position: static; 1826 | margin: 1px; 1827 | padding: inherit; 1828 | height: auto; 1829 | width: auto; 1830 | overflow: visible; 1831 | clip: auto; 1832 | border: 1px solid #999; 1833 | } 1834 | } 1835 | 1836 | #wp-link-wrap { 1837 | font-size: 13px; 1838 | } 1839 | 1840 | #wp-link-wrap input[type="text"] { 1841 | padding: 3px 5px; 1842 | margin: 1px; 1843 | } 1844 | 1845 | @media screen and (max-width: 782px) { 1846 | #wp-link-wrap { 1847 | font-size: 14px; 1848 | } 1849 | 1850 | #wp-link-wrap input[type="text"] { 1851 | padding: 6px 10px; 1852 | } 1853 | } 1854 | 1855 | #wp-link-wrap .howto { 1856 | color: #666; 1857 | font-style: italic; 1858 | } 1859 | 1860 | /* Options panel (sidebar) */ 1861 | .options-panel { 1862 | position: relative; 1863 | float: right; 1864 | margin-right: -320px; 1865 | width: 320px; 1866 | border-left: 1px solid #e5e5e5; 1867 | font-size: 14px; 1868 | /* Keeps background the full height of the screen, but only visually. Clicks go through. */ 1869 | box-shadow: 5001px 5000px 0 5000px #fff, 5000px 5000px 0 5000px #e5e5e5; 1870 | outline: 0; 1871 | } 1872 | 1873 | .options-panel-back { 1874 | position: absolute; 1875 | top: 0; 1876 | right: 0; 1877 | bottom: 0; 1878 | width: 320px; 1879 | outline: 0; 1880 | } 1881 | 1882 | @media (max-width: 900px) { 1883 | .options-panel { 1884 | background: #fff; 1885 | -webkit-transform: translateX(-100%); 1886 | transform: translateX(-100%); 1887 | transition: -webkit-transform .3s ease-in-out; 1888 | transition: transform .3s ease-in-out; 1889 | transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out; 1890 | } 1891 | 1892 | .options-panel.is-hidden { 1893 | visibility: hidden; 1894 | } 1895 | 1896 | .options-panel.is-off-screen { 1897 | -webkit-transform: translateX(0); 1898 | transform: translateX(0); 1899 | } 1900 | } 1901 | 1902 | @media (max-width: 320px) { 1903 | .options-panel { 1904 | margin-right: -100%; 1905 | width: 100%; 1906 | border: 0; 1907 | box-shadow: 5001px 5000px 0 5000px #fff; 1908 | } 1909 | 1910 | .options-panel-back { 1911 | width: 100%; 1912 | } 1913 | } 1914 | 1915 | .post-options { 1916 | background: #fff; 1917 | position: absolute; 1918 | right: 0; 1919 | width: 100%; 1920 | overflow-x: hidden; 1921 | } 1922 | 1923 | .post-options .post-option-contents { 1924 | margin-left: 3px; 1925 | color: #32373c; 1926 | } 1927 | 1928 | .post-option-forward:before { 1929 | position: absolute; 1930 | top: 50%; 1931 | right: 8px; 1932 | margin-top: -10px; 1933 | content: "\f345" 1934 | } 1935 | 1936 | .post-option-back:before { 1937 | content: "\f341"; 1938 | } 1939 | 1940 | .lt-ie9 .options-panel, 1941 | .lt-ie9 .post-options { 1942 | border-left: 1px solid #e5e5e5; 1943 | } 1944 | 1945 | .lt-ie9 .post-options.is-off-screen { 1946 | border: 0; 1947 | } 1948 | 1949 | .post-option { 1950 | position: relative; 1951 | } 1952 | 1953 | .post-options .post-option { 1954 | display: block; 1955 | width: 100%; 1956 | margin: 0; 1957 | padding: 13px 37px 13px 14px; 1958 | border: 0; 1959 | border-bottom: 1px solid #e5e5e5; 1960 | text-decoration: none; 1961 | text-align: left; 1962 | background: none; 1963 | color: #9ea7af; 1964 | text-overflow: ellipsis; 1965 | white-space: nowrap; 1966 | overflow: hidden; 1967 | transition: -webkit-transform .3s ease-in-out; 1968 | transition: transform .3s ease-in-out; 1969 | transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out; 1970 | } 1971 | 1972 | .post-options .post-option:focus { 1973 | outline: 0; 1974 | box-shadow: inset 5px 0 0 #00a0d2; 1975 | border-color: #e5e5e5; 1976 | } 1977 | 1978 | .is-off-screen > .post-option { 1979 | right: 100%; 1980 | } 1981 | 1982 | .is-hidden > .post-option { 1983 | visibility: hidden; 1984 | } 1985 | 1986 | @media (min-width: 1px) { 1987 | .is-off-screen > .post-option { 1988 | right: auto; 1989 | -webkit-transform: translateX(-100%); 1990 | transform: translateX(-100%); 1991 | } 1992 | } 1993 | 1994 | .post-option-title { 1995 | display: inline-block; 1996 | margin: 0 0 0 8px; 1997 | font-size: 14px; 1998 | font-weight: 400; 1999 | } 2000 | 2001 | .setting-modal { 2002 | position: relative; 2003 | top: 0; 2004 | left: 0; 2005 | width: 100%; 2006 | overflow: hidden; 2007 | transition: -webkit-transform .3s ease-in-out; 2008 | transition: transform .3s ease-in-out; 2009 | transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out; 2010 | } 2011 | 2012 | .setting-modal.is-hidden { 2013 | visibility: hidden; 2014 | height: 0; 2015 | } 2016 | 2017 | .setting-modal.is-off-screen { 2018 | left: 100%; 2019 | } 2020 | 2021 | @media (min-width: 1px) { 2022 | .setting-modal.is-off-screen { 2023 | left: 0; 2024 | -webkit-transform: translateX(100%); 2025 | transform: translateX(100%); 2026 | } 2027 | } 2028 | 2029 | .press-this .modal-close { 2030 | display: block; 2031 | width: 90%; 2032 | padding: 13px 14px; 2033 | border: 0; 2034 | border-bottom: 1px solid #e5e5e5; 2035 | background: none; 2036 | color: #00a0d2; 2037 | text-decoration: none; 2038 | text-align: left; 2039 | } 2040 | 2041 | .press-this .modal-close:focus { 2042 | outline: 0; 2043 | box-shadow: inset 5px 0 0 #00a0d2; 2044 | border-color: #e5e5e5; 2045 | } 2046 | 2047 | .setting-title { 2048 | position: relative; 2049 | top: -1px; 2050 | margin-left: 11px; 2051 | } 2052 | 2053 | /* Text editor */ 2054 | #pressthis { 2055 | color: #404040; 2056 | resize: none; 2057 | padding-top: 30px; 2058 | font-size: 16px; 2059 | } 2060 | 2061 | .wp-editor-wrap .quicktags-toolbar { 2062 | background: transparent; 2063 | border: none; 2064 | } 2065 | 2066 | /* Switch editor buttons */ 2067 | .wp-editor-wrap .wp-editor-tools { 2068 | z-index: 0; 2069 | } 2070 | 2071 | .wp-editor-wrap .wp-editor-tabs { 2072 | padding: 2px; 2073 | } 2074 | 2075 | .wp-editor-wrap .wp-switch-editor { 2076 | top: 0; 2077 | margin: 3px 0 0 5px; 2078 | padding: 3px 8px; 2079 | background: #f5f5f5; 2080 | color: #555; 2081 | border-color: #ccc; 2082 | } 2083 | 2084 | .wp-editor-wrap .wp-switch-editor:hover { 2085 | background: #fafafa; 2086 | border-color: #999; 2087 | color: #23282d; 2088 | } 2089 | 2090 | .wp-editor-wrap.tmce-active .switch-tmce, 2091 | .wp-editor-wrap.html-active .switch-html { 2092 | background: #fff; 2093 | border-color: #d8d8d8; 2094 | } 2095 | 2096 | /* Inline link dialog */ 2097 | .wp-link-input input { 2098 | border: 1px solid #ddd; 2099 | box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 ); 2100 | background-color: #fff; 2101 | color: #32373c; 2102 | outline: none; 2103 | transition: 0.05s border-color ease-in-out; 2104 | } 2105 | 2106 | /* UI Autocomplete (for inline link and wpLink) */ 2107 | .ui-autocomplete { 2108 | padding: 0; 2109 | margin: 0; 2110 | list-style: none; 2111 | position: absolute; 2112 | z-index: 10000; 2113 | border: 1px solid #5b9dd9; 2114 | box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 ); 2115 | background-color: #fff; 2116 | font-size: 14px; 2117 | } 2118 | 2119 | .ui-autocomplete li { 2120 | margin-bottom: 0; 2121 | padding: 4px 10px; 2122 | white-space: nowrap; 2123 | text-align: left; 2124 | cursor: pointer; 2125 | } 2126 | 2127 | /* Colors for the wplink toolbar autocomplete. */ 2128 | .ui-autocomplete .ui-state-focus { 2129 | background-color: #ddd; 2130 | } 2131 | 2132 | /* Colors for the tags autocomplete. */ 2133 | .wp-tags-autocomplete .ui-state-focus { 2134 | background-color: #0073aa; 2135 | color: #fff; 2136 | } 2137 | -------------------------------------------------------------------------------- /assets/press-this.js: -------------------------------------------------------------------------------- 1 | /** 2 | * PressThis App 3 | * 4 | */ 5 | ( function( $, window ) { 6 | var PressThis = function() { 7 | var editor, $mediaList, $mediaThumbWrap, 8 | $window = $( window ), 9 | $document = $( document ), 10 | saveAlert = false, 11 | sidebarIsOpen = false, 12 | settings = window.wpPressThisConfig || {}, 13 | data = window.wpPressThisData || {}, 14 | smallestWidth = 128, 15 | hasSetFocus = false, 16 | catsCache = [], 17 | isOffScreen = 'is-off-screen', 18 | isHidden = 'is-hidden', 19 | offscreenHidden = isOffScreen + ' ' + isHidden, 20 | iOS = /iPad|iPod|iPhone/.test( window.navigator.userAgent ), 21 | $textEditor = $( '#pressthis' ), 22 | textEditor = $textEditor[0], 23 | textEditorMinHeight = 600, 24 | textLength = 0, 25 | transitionEndEvent = ( function() { 26 | var style = document.documentElement.style; 27 | 28 | if ( typeof style.transition !== 'undefined' ) { 29 | return 'transitionend'; 30 | } 31 | 32 | if ( typeof style.WebkitTransition !== 'undefined' ) { 33 | return 'webkitTransitionEnd'; 34 | } 35 | 36 | return false; 37 | }() ); 38 | 39 | /* *************************************************************** 40 | * HELPER FUNCTIONS 41 | *************************************************************** */ 42 | 43 | /** 44 | * Emulates our PHP __() gettext function, powered by the strings exported in pressThisL10n. 45 | * 46 | * @param key string Key of the string to be translated, as found in pressThisL10n. 47 | * @returns string Original or translated string, or empty string if no key. 48 | */ 49 | function __( key ) { 50 | if ( key && window.pressThisL10n ) { 51 | return window.pressThisL10n[key] || key; 52 | } 53 | 54 | return key || ''; 55 | } 56 | 57 | /** 58 | * Allow only HTTP or protocol relative URLs. 59 | * 60 | * @param url string The URL. 61 | * @returns string Processed URL. 62 | */ 63 | function checkUrl( url ) { 64 | url = $.trim( url || '' ); 65 | 66 | if ( /^(?:https?:)?\/\//.test( url ) ) { 67 | url = wp.sanitize.stripTags( url ); 68 | return url.replace( /["\\]+/g, '' ); 69 | } 70 | 71 | return ''; 72 | } 73 | 74 | /** 75 | * Show UX spinner 76 | */ 77 | function showSpinner() { 78 | $( '.spinner' ).addClass( 'is-active' ); 79 | $( '.post-actions button' ).attr( 'disabled', 'disabled' ); 80 | } 81 | 82 | /** 83 | * Hide UX spinner 84 | */ 85 | function hideSpinner() { 86 | $( '.spinner' ).removeClass( 'is-active' ); 87 | $( '.post-actions button' ).removeAttr( 'disabled' ); 88 | } 89 | 90 | function textEditorResize( reset ) { 91 | var pageYOffset, height; 92 | 93 | if ( editor && ! editor.isHidden() ) { 94 | return; 95 | } 96 | 97 | reset = ( reset === 'reset' ) || ( textLength && textLength > textEditor.value.length ); 98 | height = textEditor.style.height; 99 | 100 | if ( reset ) { 101 | pageYOffset = window.pageYOffset; 102 | 103 | textEditor.style.height = 'auto'; 104 | textEditor.style.height = Math.max( textEditor.scrollHeight, textEditorMinHeight ) + 'px'; 105 | window.scrollTo( window.pageXOffset, pageYOffset ); 106 | } else if ( parseInt( textEditor.style.height, 10 ) < textEditor.scrollHeight ) { 107 | textEditor.style.height = textEditor.scrollHeight + 'px'; 108 | } 109 | 110 | textLength = textEditor.value.length; 111 | } 112 | 113 | function mceGetCursorOffset() { 114 | if ( ! editor ) { 115 | return false; 116 | } 117 | 118 | var node = editor.selection.getNode(), 119 | range, view, offset; 120 | 121 | if ( editor.wp && editor.wp.getView && ( view = editor.wp.getView( node ) ) ) { 122 | offset = view.getBoundingClientRect(); 123 | } else { 124 | range = editor.selection.getRng(); 125 | 126 | try { 127 | offset = range.getClientRects()[0]; 128 | } catch( er ) {} 129 | 130 | if ( ! offset ) { 131 | offset = node.getBoundingClientRect(); 132 | } 133 | } 134 | 135 | return offset.height ? offset : false; 136 | } 137 | 138 | // Make sure the caret is always visible. 139 | function mceKeyup( event ) { 140 | var VK = window.tinymce.util.VK, 141 | key = event.keyCode; 142 | 143 | // Bail on special keys. 144 | if ( key <= 47 && ! ( key === VK.SPACEBAR || key === VK.ENTER || key === VK.DELETE || key === VK.BACKSPACE || key === VK.UP || key === VK.LEFT || key === VK.DOWN || key === VK.UP ) ) { 145 | return; 146 | // OS keys, function keys, num lock, scroll lock 147 | } else if ( ( key >= 91 && key <= 93 ) || ( key >= 112 && key <= 123 ) || key === 144 || key === 145 ) { 148 | return; 149 | } 150 | 151 | mceScroll( key ); 152 | } 153 | 154 | function mceScroll( key ) { 155 | var cursorTop, cursorBottom, editorBottom, 156 | offset = mceGetCursorOffset(), 157 | bufferTop = 50, 158 | bufferBottom = 65, 159 | VK = window.tinymce.util.VK; 160 | 161 | if ( ! offset ) { 162 | return; 163 | } 164 | 165 | cursorTop = offset.top + editor.iframeElement.getBoundingClientRect().top; 166 | cursorBottom = cursorTop + offset.height; 167 | cursorTop = cursorTop - bufferTop; 168 | cursorBottom = cursorBottom + bufferBottom; 169 | editorBottom = $window.height(); 170 | 171 | // Don't scroll if the node is taller than the visible part of the editor 172 | if ( editorBottom < offset.height ) { 173 | return; 174 | } 175 | 176 | if ( cursorTop < 0 && ( key === VK.UP || key === VK.LEFT || key === VK.BACKSPACE ) ) { 177 | window.scrollTo( window.pageXOffset, cursorTop + window.pageYOffset ); 178 | } else if ( cursorBottom > editorBottom ) { 179 | window.scrollTo( window.pageXOffset, cursorBottom + window.pageYOffset - editorBottom ); 180 | } 181 | } 182 | 183 | /** 184 | * Replace emoji images with chars and sanitize the text content. 185 | */ 186 | function getTitleText() { 187 | var $element = $( '#title-container' ); 188 | 189 | $element.find( 'img.emoji' ).each( function() { 190 | var $image = $( this ); 191 | $image.replaceWith( $( '' ).text( $image.attr( 'alt' ) ) ); 192 | }); 193 | 194 | return wp.sanitize.stripTagsAndEncodeText( $element.text() ); 195 | } 196 | 197 | /** 198 | * Prepare the form data for saving. 199 | */ 200 | function prepareFormData() { 201 | var $form = $( '#pressthis-form' ), 202 | $input = $( '' ); 203 | 204 | editor && editor.save(); 205 | 206 | $( '#post_title' ).val( getTitleText() ); 207 | 208 | // Make sure to flush out the tags with tagBox before saving 209 | if ( window.tagBox ) { 210 | $( 'div.tagsdiv' ).each( function() { 211 | window.tagBox.flushTags( this, false, 1 ); 212 | } ); 213 | } 214 | 215 | // Get selected categories 216 | $( '.categories-select .category' ).each( function( i, element ) { 217 | var $cat = $( element ); 218 | 219 | if ( $cat.hasClass( 'selected' ) ) { 220 | // Have to append a node as we submit the actual form on preview 221 | $form.append( $input.clone().val( $cat.attr( 'data-term-id' ) || '' ) ); 222 | } 223 | }); 224 | } 225 | 226 | /** 227 | * Submit the post form via AJAX, and redirect to the proper screen if published vs saved as a draft. 228 | * 229 | * @param action string publish|draft 230 | */ 231 | function submitPost( action ) { 232 | var data; 233 | 234 | saveAlert = false; 235 | showSpinner(); 236 | 237 | if ( 'publish' === action ) { 238 | $( '#post_status' ).val( 'publish' ); 239 | } 240 | 241 | prepareFormData(); 242 | data = $( '#pressthis-form' ).serialize(); 243 | 244 | $.ajax( { 245 | type: 'post', 246 | url: window.ajaxurl, 247 | data: data 248 | }).always( function() { 249 | hideSpinner(); 250 | clearNotices(); 251 | $( '.publish-button' ).removeClass( 'is-saving' ); 252 | }).done( function( response ) { 253 | if ( ! response.success ) { 254 | renderError( response.data.errorMessage ); 255 | } else if ( response.data.redirect ) { 256 | if ( window.opener && ( settings.redirInParent || response.data.force ) ) { 257 | try { 258 | window.opener.location.href = response.data.redirect; 259 | 260 | window.setTimeout( function() { 261 | window.self.close(); 262 | }, 200 ); 263 | } catch( er ) { 264 | window.location.href = response.data.redirect; 265 | } 266 | } else { 267 | window.location.href = response.data.redirect; 268 | } 269 | } 270 | }).fail( function() { 271 | renderError( __( 'serverError' ) ); 272 | }); 273 | } 274 | 275 | /** 276 | * Inserts the media a user has selected from the presented list inside the editor, as an image or embed, based on type 277 | * 278 | * @param type string img|embed 279 | * @param src string Source URL 280 | * @param link string Optional destination link, for images (defaults to src) 281 | */ 282 | function insertSelectedMedia( $element ) { 283 | var src, link, newContent = ''; 284 | 285 | src = checkUrl( $element.attr( 'data-wp-src' ) || '' ); 286 | link = checkUrl( data.u ); 287 | 288 | if ( $element.hasClass( 'is-image' ) ) { 289 | if ( ! link ) { 290 | link = src; 291 | } 292 | 293 | newContent = ''; 294 | } else { 295 | newContent = '[embed]' + src + '[/embed]'; 296 | } 297 | 298 | if ( editor && ! editor.isHidden() ) { 299 | if ( ! hasSetFocus ) { 300 | editor.setContent( '

' + newContent + '

' + editor.getContent() ); 301 | } else { 302 | editor.execCommand( 'mceInsertContent', false, newContent ); 303 | } 304 | } else if ( window.QTags ) { 305 | window.QTags.insertContent( newContent ); 306 | } 307 | } 308 | 309 | /** 310 | * Save a new user-generated category via AJAX 311 | */ 312 | function saveNewCategory() { 313 | var data, 314 | name = $( '#new-category' ).val(); 315 | 316 | if ( ! name ) { 317 | return; 318 | } 319 | 320 | data = { 321 | action: 'press-this-add-category', 322 | post_id: $( '#post_ID' ).val() || 0, 323 | name: name, 324 | new_cat_nonce: $( '#_ajax_nonce-add-category' ).val() || '', 325 | parent: $( '#new-category-parent' ).val() || 0 326 | }; 327 | 328 | $.post( window.ajaxurl, data, function( response ) { 329 | if ( ! response.success ) { 330 | renderError( response.data.errorMessage ); 331 | } else { 332 | var $parent, $ul, 333 | $wrap = $( 'ul.categories-select' ); 334 | 335 | $.each( response.data, function( i, newCat ) { 336 | var $node = $( '
  • ' ).append( $( '