You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

2200 lines
34 KiB

  1. /*
  2. Press This styles :)
  3. */
  4. /**
  5. * Normalize
  6. *
  7. * normalize.css v3.0.0 | MIT License | git.io/normalize
  8. */
  9. html {
  10. font-family: sans-serif;
  11. -ms-text-size-adjust: 100%;
  12. -webkit-text-size-adjust: 100%;
  13. }
  14. body {
  15. margin: 0;
  16. }
  17. *,
  18. *:before,
  19. *:after {
  20. -webkit-box-sizing: border-box;
  21. -moz-box-sizing: border-box;
  22. box-sizing: border-box;
  23. }
  24. @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) {
  25. *,
  26. *:before,
  27. *:after {
  28. -webkit-font-smoothing: antialiased;
  29. }
  30. }
  31. article,
  32. aside,
  33. details,
  34. figcaption,
  35. figure,
  36. footer,
  37. header,
  38. hgroup,
  39. main,
  40. nav,
  41. section,
  42. summary {
  43. display: block;
  44. }
  45. audio,
  46. canvas,
  47. progress,
  48. video {
  49. display: inline-block;
  50. vertical-align: baseline;
  51. }
  52. audio:not([controls]) {
  53. display: none;
  54. height: 0;
  55. }
  56. [hidden],
  57. template {
  58. display: none;
  59. }
  60. a {
  61. background: transparent;
  62. }
  63. a:active,
  64. a:hover {
  65. outline: 0;
  66. }
  67. abbr[title] {
  68. border-bottom: 1px dotted;
  69. }
  70. b,
  71. strong {
  72. font-weight: 700;
  73. }
  74. dfn {
  75. font-style: italic;
  76. }
  77. h1 {
  78. font-size: 2em;
  79. margin: 0.67em 0;
  80. }
  81. mark {
  82. background: #ff0;
  83. color: #000;
  84. }
  85. small {
  86. font-size: 80%;
  87. }
  88. sub,
  89. sup {
  90. font-size: 75%;
  91. line-height: 0;
  92. position: relative;
  93. vertical-align: baseline;
  94. }
  95. sup {
  96. top: -0.5em;
  97. }
  98. sub {
  99. bottom: -0.25em;
  100. }
  101. img {
  102. border: 0;
  103. }
  104. svg:not(:root) {
  105. overflow: hidden;
  106. }
  107. figure {
  108. margin: 1em 40px;
  109. }
  110. hr {
  111. -webkit-box-sizing: content-box;
  112. -moz-box-sizing: content-box;
  113. box-sizing: content-box;
  114. height: 0;
  115. }
  116. pre {
  117. overflow: auto;
  118. }
  119. code,
  120. kbd,
  121. pre,
  122. samp {
  123. font-family: monospace, monospace;
  124. font-size: 1em;
  125. }
  126. button,
  127. input,
  128. optgroup,
  129. select,
  130. textarea {
  131. color: inherit;
  132. font: inherit;
  133. margin: 0;
  134. }
  135. button {
  136. overflow: visible;
  137. }
  138. button,
  139. select {
  140. text-transform: none;
  141. }
  142. button,
  143. html input[type="button"],
  144. input[type="reset"],
  145. input[type="submit"] {
  146. -webkit-appearance: button;
  147. cursor: pointer;
  148. }
  149. button[disabled],
  150. html input[disabled] {
  151. cursor: default;
  152. }
  153. button::-moz-focus-inner,
  154. input::-moz-focus-inner {
  155. border: 0;
  156. padding: 0;
  157. }
  158. input {
  159. line-height: normal;
  160. }
  161. input[type="checkbox"],
  162. input[type="radio"] {
  163. -webkit-box-sizing: border-box;
  164. -moz-box-sizing: border-box;
  165. box-sizing: border-box;
  166. padding: 0;
  167. }
  168. input[type="number"]::-webkit-inner-spin-button,
  169. input[type="number"]::-webkit-outer-spin-button {
  170. height: auto;
  171. }
  172. input[type="search"] {
  173. -webkit-appearance: textfield;
  174. -webkit-box-sizing: content-box;
  175. -moz-box-sizing: content-box;
  176. box-sizing: content-box;
  177. }
  178. input[type="search"]::-webkit-search-cancel-button,
  179. input[type="search"]::-webkit-search-decoration {
  180. -webkit-appearance: none;
  181. }
  182. fieldset {
  183. border: 0;
  184. margin: 0;
  185. padding: 0;
  186. }
  187. legend {
  188. border: 0;
  189. padding: 0;
  190. }
  191. textarea {
  192. overflow: auto;
  193. }
  194. optgroup {
  195. font-weight: 700;
  196. }
  197. table {
  198. border-collapse: collapse;
  199. border-spacing: 0;
  200. }
  201. td,
  202. th {
  203. padding: 0;
  204. }
  205. ::-webkit-input-placeholder {
  206. color: #72777c;
  207. }
  208. ::-moz-placeholder {
  209. color: #72777c;
  210. opacity: 1;
  211. }
  212. :-ms-input-placeholder {
  213. color: #72777c;
  214. }
  215. .clearfix:before,
  216. .clearfix:after {
  217. content: "";
  218. display: table;
  219. }
  220. .clearfix:after {
  221. clear: both;
  222. }
  223. .hide-if-js {
  224. display: none;
  225. }
  226. .screen-reader-text {
  227. position: absolute;
  228. margin: -1px;
  229. padding: 0;
  230. height: 1px;
  231. width: 1px;
  232. overflow: hidden;
  233. clip: rect(0 0 0 0);
  234. border: 0;
  235. }
  236. /**
  237. * Typography
  238. *
  239. * Base element typographic styles.
  240. */
  241. body,
  242. button,
  243. input,
  244. select,
  245. textarea {
  246. color: #404040;
  247. font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  248. font-size: 20px;
  249. font-weight: 400;
  250. line-height: 1.6;
  251. }
  252. h1,
  253. h2,
  254. h3,
  255. h4,
  256. h5,
  257. h6 {
  258. clear: both;
  259. }
  260. p {
  261. margin-bottom: 1.5em;
  262. }
  263. b,
  264. strong {
  265. font-weight: 700;
  266. }
  267. /**
  268. * Buttons
  269. *
  270. * Pushing buttons is what I do.
  271. */
  272. .scan-submit {
  273. display: inline-block;
  274. margin: 0;
  275. padding: 0 10px 1px;
  276. border-width: 1px;
  277. border-style: solid;
  278. -webkit-border-radius: 3px;
  279. border-radius: 3px;
  280. font-size: 13px;
  281. line-height: 2;
  282. text-decoration: none;
  283. white-space: nowrap;
  284. cursor: pointer;
  285. -webkit-appearance: none;
  286. }
  287. .split-button {
  288. position: relative;
  289. display: inline-block;
  290. vertical-align: middle;
  291. }
  292. .split-button-body {
  293. display: none;
  294. position: absolute;
  295. bottom: 39px;
  296. right: 0;
  297. border: 1px solid #ddd;
  298. background-color: #fff;
  299. min-width: 180px;
  300. max-width: 100%;
  301. margin: 0;
  302. padding: 8px;
  303. list-style: none;
  304. -webkit-box-shadow: 1px 0 4px rgba( 0, 0, 0, 0.15 );
  305. box-shadow: 1px 0 4px rgba( 0, 0, 0, 0.15 );
  306. }
  307. .split-button-body:before,
  308. .split-button-body:after {
  309. position: absolute;
  310. right: 12px;
  311. display: block;
  312. width: 0;
  313. height: 0;
  314. border-style: solid;
  315. border-color: transparent;
  316. content: "";
  317. }
  318. .split-button-body:before {
  319. bottom: -18px;
  320. border-top-color: #ccc;
  321. border-width: 9px;
  322. right: 11px;
  323. }
  324. .split-button-body:after {
  325. bottom: -16px;
  326. border-top-color: #fff;
  327. border-width: 8px;
  328. }
  329. .split-button-body .split-button-option {
  330. display: block;
  331. padding: 5px 15px;
  332. margin: 0;
  333. width: 100%;
  334. text-align: left;
  335. line-height: 2;
  336. }
  337. .is-open .split-button-body {
  338. display: block;
  339. }
  340. .split-button-primary,
  341. .split-button-toggle {
  342. -webkit-border-radius: 0;
  343. border-radius: 0;
  344. display: block;
  345. margin: 0;
  346. font-size: 13px;
  347. text-decoration: none;
  348. white-space: nowrap;
  349. cursor: pointer;
  350. -webkit-appearance: none;
  351. line-height: 2;
  352. padding: 0 10px 1px;
  353. background: #0085ba;
  354. border-color: #0073aa #006799 #006799;
  355. border-width: 1px;
  356. border-style: solid;
  357. -webkit-box-shadow: 0 1px 0 #006799;
  358. box-shadow: 0 1px 0 #006799;
  359. color: #fff;
  360. text-shadow: 0 -1px 1px #006799,
  361. 1px 0 1px #006799,
  362. 0 1px 1px #006799,
  363. -1px 0 1px #006799;
  364. }
  365. .split-button-primary {
  366. -webkit-border-top-left-radius: 3px;
  367. border-top-left-radius: 3px;
  368. -webkit-border-bottom-left-radius: 3px;
  369. border-bottom-left-radius: 3px;
  370. border-right: 0 none;
  371. float: left;
  372. }
  373. .split-button-toggle {
  374. padding: 0;
  375. -webkit-border-top-right-radius: 3px;
  376. border-top-right-radius: 3px;
  377. -webkit-border-bottom-right-radius: 3px;
  378. border-bottom-right-radius: 3px;
  379. border-left: 1px solid #006799;
  380. float: right;
  381. }
  382. .split-button-toggle i {
  383. margin: 4px 20px 3px 0;
  384. padding: 0 10px;
  385. }
  386. .split-button-primary:hover,
  387. .split-button-toggle:hover {
  388. outline: none;
  389. background: #008ec2;
  390. border-color: #006799;
  391. }
  392. .split-button-primary:focus,
  393. .split-button-toggle:focus {
  394. outline: none;
  395. -webkit-box-shadow: 0 1px 0 #0073aa,
  396. 0 0 2px 1px #33b3db;
  397. box-shadow: 0 1px 0 #0073aa,
  398. 0 0 2px 1px #33b3db;
  399. }
  400. .split-button-primary:active,
  401. .split-button-toggle:active {
  402. background: #0073aa;
  403. border-color: #006799;
  404. -webkit-box-shadow: inset 0 2px 10px #006799, 0 1px 0 #0073aa;
  405. box-shadow: inset 0 2px 10px #006799, 0 1px 0 #0073aa;
  406. }
  407. /**
  408. * Forms
  409. *
  410. * So many input types.
  411. */
  412. button,
  413. input,
  414. select,
  415. textarea {
  416. font-size: 100%;
  417. margin: 0;
  418. vertical-align: baseline;
  419. *vertical-align: middle;
  420. }
  421. [type="checkbox"],
  422. [type="radio"] {
  423. padding: 0;
  424. }
  425. [type="search"] {
  426. -webkit-appearance: textfield;
  427. -webkit-box-sizing: content-box;
  428. -moz-box-sizing: content-box;
  429. box-sizing: content-box;
  430. }
  431. [type="search"]::-webkit-search-decoration {
  432. -webkit-appearance: none;
  433. }
  434. button::-moz-focus-inner,
  435. input::-moz-focus-inner {
  436. border: 0;
  437. padding: 0;
  438. }
  439. [type="text"],
  440. [type="email"],
  441. [type="url"],
  442. [type="password"],
  443. [type="search"],
  444. textarea {
  445. padding: 0.4em 0.75em;
  446. color: #32373c;
  447. border: 1px solid #ccc;
  448. }
  449. [type="text"]:focus,
  450. [type="email"]:focus,
  451. [type="url"]:focus,
  452. [type="password"]:focus,
  453. [type="search"]:focus,
  454. textarea:focus {
  455. color: #32373c;
  456. outline: 0;
  457. }
  458. textarea {
  459. overflow: auto;
  460. padding-left: 3px;
  461. vertical-align: top;
  462. }
  463. /**
  464. * Links
  465. */
  466. a {
  467. color: #0073aa;
  468. }
  469. a:visited {
  470. color: #0073aa;
  471. }
  472. a:hover,
  473. a:focus,
  474. a:active {
  475. color: #00a0d2;
  476. }
  477. /**
  478. * Lists
  479. */
  480. ul,
  481. ol {
  482. margin: 0 0 1.5em 3em;
  483. }
  484. ul {
  485. list-style: disc;
  486. }
  487. ol {
  488. list-style: decimal;
  489. }
  490. li > ul,
  491. li > ol {
  492. margin-bottom: 0;
  493. margin-left: 1.5em;
  494. }
  495. dt {
  496. font-weight: 700;
  497. }
  498. dd {
  499. margin: 0 1.5em 1.5em;
  500. }
  501. /**
  502. * Post formats
  503. *
  504. * Complete styles for post formats UI
  505. */
  506. /* TODO if we remove the <br> during merge, this can go. */
  507. #post-formats-select br {
  508. display: none;
  509. }
  510. .post-format {
  511. width: 1px;
  512. height: 1px;
  513. position: absolute;
  514. top: -9999px;
  515. }
  516. .lt-ie9 .post-format {
  517. margin: 17px 12px 0 13px;
  518. width: auto;
  519. height: auto;
  520. position: static;
  521. top: auto;
  522. float: left;
  523. width: 16px;
  524. height: 16px;
  525. }
  526. .post-format-icon {
  527. position: relative;
  528. display: block;
  529. padding: 13px 2px 14px 13px;
  530. cursor: pointer;
  531. }
  532. .post-format-icon:before,
  533. .post-format-icon:after {
  534. content: "";
  535. display: inline-block;
  536. width: 20px;
  537. height: 20px;
  538. margin-right: 10px;
  539. font-size: 20px;
  540. line-height: 1;
  541. font-family: dashicons;
  542. text-decoration: inherit;
  543. color: #9ea7af;
  544. font-weight: 400;
  545. font-style: normal;
  546. vertical-align: top;
  547. text-align: center;
  548. -webkit-transition: color .1s ease-in 0;
  549. transition: color .1s ease-in 0;
  550. -webkit-font-smoothing: antialiased;
  551. -moz-osx-font-smoothing: grayscale;
  552. }
  553. .post-format-icon:before {
  554. content: "\f109";
  555. }
  556. .post-format-icon:after {
  557. display: none;
  558. content: "\f147";
  559. float: right;
  560. }
  561. .post-format:checked + .post-format-icon {
  562. -webkit-box-shadow: inset 6px 0 0 #00a0d2;
  563. box-shadow: inset 6px 0 0 #00a0d2;
  564. background: rgba(46, 162, 204, 0.1);
  565. }
  566. .post-format:checked + .post-format-icon:before,
  567. .post-format:checked + .post-format-icon:after {
  568. color: #32373c;
  569. }
  570. .post-format:focus + .post-format-icon {
  571. background: #00a0d2;
  572. color: #fff;
  573. }
  574. .post-format:focus + .post-format-icon:before,
  575. .post-format:focus + .post-format-icon:after {
  576. color: #fff;
  577. }
  578. .post-format:checked + .post-format-icon:after {
  579. display: block;
  580. }
  581. .lt-ie9 .post-format-icon {
  582. margin-left: 16px;
  583. }
  584. .post-format-aside:before {
  585. content: "\f123";
  586. }
  587. .post-format-image:before {
  588. content: "\f128";
  589. }
  590. .post-format-video:before {
  591. content: "\f126";
  592. }
  593. .post-format-audio:before {
  594. content: "\f127";
  595. }
  596. .post-format-quote:before {
  597. content: "\f122";
  598. }
  599. .post-format-link:before {
  600. content: "\f103";
  601. }
  602. .post-format-gallery:before {
  603. content: "\f161";
  604. }
  605. /**
  606. * Tags
  607. *
  608. * Complete styles for tags UI
  609. */
  610. .tagsdiv p {
  611. margin: 0;
  612. }
  613. .tagsdiv .ajaxtag {
  614. position: relative;
  615. }
  616. .tagsdiv .newtag {
  617. display: block;
  618. position: relative;
  619. padding: 11px 58px 11px 16px;
  620. width: 100%;
  621. border: 0;
  622. border-bottom: 1px solid #e5e5e5;
  623. font-size: 16px;
  624. }
  625. .tagsdiv .tagadd {
  626. position: absolute;
  627. top: 0;
  628. right: 0;
  629. bottom: 1px;
  630. border: 0;
  631. -webkit-border-radius: 0;
  632. border-radius: 0;
  633. margin: 0;
  634. padding: 0 16px;
  635. background: #f7f7f7;
  636. border-left: 1px solid #f1f1f1;
  637. -webkit-box-shadow: none;
  638. box-shadow: none;
  639. }
  640. .tagsdiv .tagadd:hover,
  641. .tagsdiv .tagadd:active,
  642. .tagsdiv .tagadd:focus {
  643. outline: 0;
  644. background: #2991b7;
  645. border-color: #20708e;
  646. color: #fff;
  647. -webkit-box-shadow: none;
  648. box-shadow: none;
  649. }
  650. .tagsdiv .howto {
  651. color: #727272;
  652. font-style: italic;
  653. margin: 10px 0 6px 16px;
  654. }
  655. /* Tags */
  656. .tagchecklist {
  657. padding: 16px 28px 5px;
  658. }
  659. .tagchecklist:before,
  660. .tagchecklist:after {
  661. content: "";
  662. display: table;
  663. }
  664. .tagchecklist:after {
  665. clear: both;
  666. }
  667. .tagchecklist > span {
  668. float: left;
  669. margin-right: 25px;
  670. font-size: 13px;
  671. line-height: 1.8;
  672. white-space: nowrap;
  673. cursor: default;
  674. }
  675. @media (max-width: 600px) {
  676. .tagchecklist > span {
  677. margin-bottom: 15px;
  678. font-size: 16px;
  679. line-height: 1.3;
  680. }
  681. }
  682. .tagchecklist .ntdelbutton {
  683. position: absolute;
  684. width: 24px;
  685. height: 24px;
  686. border: none;
  687. margin: 0 0 0 -19px;
  688. padding: 0;
  689. background: none;
  690. cursor: pointer;
  691. text-indent: 0;;
  692. position: absolute;
  693. }
  694. .tagchecklist .ntdelbutton .remove-tag-icon:before {
  695. content: "\f153";
  696. display: block;
  697. margin-left: 2px;
  698. height: 20px;
  699. width: 20px;
  700. -webkit-border-radius: 50%;
  701. border-radius: 50%;
  702. background: transparent;
  703. color: #0073aa;
  704. /* line-height tweak to vertically center the icon cross browsers */
  705. font: 400 16px/1.28 dashicons;
  706. text-align: center;
  707. -webkit-font-smoothing: antialiased;
  708. }
  709. .tagchecklist .ntdelbutton:focus {
  710. outline: 0;
  711. }
  712. .tagchecklist .ntdelbutton:hover .remove-tag-icon:before,
  713. .tagchecklist .ntdelbutton:focus .remove-tag-icon:before {
  714. color: #c00;
  715. }
  716. .tagchecklist .ntdelbutton:focus .remove-tag-icon:before {
  717. -webkit-box-shadow:
  718. 0 0 0 1px #5b9dd9,
  719. 0 0 2px 1px rgba(30, 140, 190, .8);
  720. box-shadow:
  721. 0 0 0 1px #5b9dd9,
  722. 0 0 2px 1px rgba(30, 140, 190, .8);
  723. }
  724. /* THE TAG CLOUD. */
  725. .tagsdiv + p {
  726. margin: 0;
  727. }
  728. .press-this .tagcloud-link {
  729. display: block;
  730. margin: 0 16px 5px;
  731. padding: 0;
  732. text-decoration: none;
  733. outline: 0;
  734. }
  735. .tagcloud-link:focus {
  736. text-decoration: underline;
  737. }
  738. .popular-tags {
  739. border: none;
  740. line-height: 2em;
  741. padding: 8px 12px 12px;
  742. text-align: justify;
  743. }
  744. .popular-tags a {
  745. padding: 0 3px;
  746. }
  747. .the-tagcloud {
  748. margin: 0;
  749. padding: 16px;
  750. }
  751. .the-tagcloud a {
  752. text-decoration: none;
  753. outline: 0;
  754. }
  755. .the-tagcloud a:focus {
  756. text-decoration: underline;
  757. }
  758. .tagcloud h3 {
  759. margin: 2px 0 12px;
  760. }
  761. /**
  762. * Categories
  763. *
  764. * Complete styles for post categories UI
  765. */
  766. input[type="search"].categories-search,
  767. .add-category-name {
  768. display: block;
  769. width: 100%;
  770. padding: 0.85714em 1.07143em;
  771. border: 0;
  772. -webkit-border-radius: 0;
  773. border-radius: 0;
  774. border-bottom: 1px solid #e5e5e5;
  775. font-size: 14px;
  776. -webkit-appearance: none;
  777. -moz-appearance: none;
  778. appearance: none;
  779. }
  780. @media (max-width: 600px) {
  781. input[type="search"].categories-search,
  782. .add-category-name {
  783. /* Needs to be 16px to prevent zooming on iOS. Guh. */
  784. font-size: 16px;
  785. }
  786. }
  787. .press-this .add-cat-toggle {
  788. float: right;
  789. margin-top: -45px;
  790. line-height: 20px;
  791. padding: 12px 10px 8px;
  792. color: #0073aa;
  793. }
  794. .press-this .add-cat-toggle:focus {
  795. text-decoration: none;
  796. color: #00a0d2;
  797. }
  798. .press-this .add-cat-toggle.is-toggled {
  799. padding: 10px;
  800. }
  801. .press-this .add-cat-toggle.is-toggled .dashicons:before {
  802. content: "\f179";
  803. }
  804. .add-category {
  805. position: relative;
  806. border-bottom: 1px solid #e5e5e5;
  807. }
  808. .add-category.is-hidden {
  809. display: none;
  810. }
  811. .add-category .add-cat-submit {
  812. position: absolute;
  813. top: 0;
  814. right: 0;
  815. border: 0;
  816. -webkit-border-radius: 0;
  817. border-radius: 0;
  818. padding: 12px 16px;
  819. background: #f7f7f7;
  820. border-left: 1px solid #f1f1f1;
  821. }
  822. .add-category .add-cat-submit:hover,
  823. .add-category .add-cat-submit:active,
  824. .add-category .add-cat-submit:focus {
  825. outline: 0;
  826. background: #2991b7;
  827. border-color: #20708e;
  828. color: #fff;
  829. }
  830. /* Parent category select */
  831. .postform-wrapper {
  832. padding: 12px;
  833. }
  834. .postform {
  835. display: block;
  836. margin: 0;
  837. width: 100%;
  838. height: 34px;
  839. border: 0;
  840. -webkit-border-radius: 0;
  841. border-radius: 0;
  842. border: 1px solid #e5e5e5;
  843. background: #fff;
  844. -webkit-background-size: 20px 20px;
  845. background-size: 20px 20px;
  846. overflow: hidden;
  847. line-height: 21px;
  848. text-overflow: ellipsis;
  849. text-decoration: none;
  850. vertical-align: top;
  851. white-space: nowrap;
  852. cursor: pointer;
  853. outline: 0;
  854. }
  855. .postform:focus {
  856. border-color: #0073aa;
  857. -webkit-box-shadow: 0 0 0 3px #00a0d2;
  858. box-shadow: 0 0 0 3px #00a0d2;
  859. outline: 0;
  860. -moz-outline: none;
  861. -moz-user-focus: ignore;
  862. }
  863. .postform::-ms-expand {
  864. display: none;
  865. }
  866. .postform::-ms-value {
  867. background: none;
  868. color: #727272;
  869. }
  870. .postform:-moz-focusring {
  871. color: transparent;
  872. text-shadow: 0 0 0 #727272;
  873. }
  874. /* Category list */
  875. .categories-select {
  876. margin: 0;
  877. padding: 0;
  878. list-style: none;
  879. }
  880. .categories-select ul {
  881. margin: 0;
  882. padding: 0;
  883. list-style: none;
  884. }
  885. .category {
  886. position: relative;
  887. display: block;
  888. padding: 13px 16px 14px 16px;
  889. cursor: pointer;
  890. background: #fff;
  891. }
  892. .category:focus,
  893. .category.selected:focus {
  894. outline: 0;
  895. background: #00a0d2;
  896. color: #fff;
  897. }
  898. .category.selected {
  899. -webkit-box-shadow: inset 6px 0 0 #00a0d2;
  900. box-shadow: inset 6px 0 0 #00a0d2;
  901. background: #E9F5F9;
  902. }
  903. .category.selected:after {
  904. display: inline-block;
  905. content: "\f147";
  906. position: absolute;
  907. top: 13px;
  908. right: 0;
  909. width: 20px;
  910. height: 20px;
  911. margin-right: 10px;
  912. font-size: 20px;
  913. line-height: 1;
  914. font-family: dashicons;
  915. text-decoration: inherit;
  916. color: #23282d;
  917. font-weight: 400;
  918. font-style: normal;
  919. vertical-align: top;
  920. text-align: center;
  921. -webkit-transition: color .1s ease-in 0;
  922. transition: color .1s ease-in 0;
  923. -webkit-font-smoothing: antialiased;
  924. -moz-osx-font-smoothing: grayscale;
  925. }
  926. .category.selected:focus:after {
  927. color: #fff;
  928. }
  929. .categories-select ul .category {
  930. padding-left: 24px;
  931. }
  932. .categories-select ul ul .category {
  933. padding-left: 32px;
  934. }
  935. .categories-select ul ul ul .category {
  936. padding-left: 40px;
  937. }
  938. .categories-select ul ul ul ul .category {
  939. padding-left: 48px;
  940. }
  941. .categories-select ul ul ul ul ul .category {
  942. padding-left: 56px;
  943. }
  944. .categories-select ul ul ul ul ul ul .category {
  945. padding-left: 64px;
  946. }
  947. .categories-select .is-hidden {
  948. display: none;
  949. }
  950. .categories-select .is-hidden.searched-parent {
  951. display: block;
  952. }
  953. /* Category search */
  954. .categories-search-wrapper {
  955. position: relative;
  956. }
  957. .categories-search-wrapper.is-hidden {
  958. display: none;
  959. }
  960. .categories-search-wrapper label {
  961. position: absolute;
  962. top: 50%;
  963. right: 10px;
  964. margin-top: -10px;
  965. color: #9ea7af;
  966. }
  967. /**
  968. * Main
  969. */
  970. html {
  971. overflow: auto;
  972. }
  973. body {
  974. overflow-x: hidden;
  975. height: 100%;
  976. }
  977. html {
  978. background: #fff;
  979. -webkit-box-shadow: -10px 0 0 rgba(0, 0, 0, 0.3);
  980. box-shadow: -10px 0 0 rgba(0, 0, 0, 0.3);
  981. }
  982. @media (max-width: 900px) {
  983. body {
  984. font-size: 16px;
  985. }
  986. }
  987. @media (max-width: 320px) {
  988. body {
  989. font-size: 14px;
  990. }
  991. }
  992. .lt-ie9 {
  993. overflow: visible;
  994. }
  995. .adminbar {
  996. position: relative;
  997. width: 100%;
  998. padding: 0 0.8em;
  999. min-height: 3.2em;
  1000. background: #23282d;
  1001. color: #fff;
  1002. z-index: 9999;
  1003. }
  1004. .adminbar:before,
  1005. .adminbar:after {
  1006. content: "";
  1007. display: table;
  1008. }
  1009. .adminbar:after {
  1010. clear: both;
  1011. }
  1012. .adminbar .dashicons {
  1013. color: #a0a5aa; /* same as WP admin bar icons */
  1014. }
  1015. .press-this .adminbar button {
  1016. position: absolute;
  1017. top: 50%;
  1018. right: 6px;
  1019. margin-top: -13px;
  1020. padding: 0 10px 1px;
  1021. font-size: 13px;
  1022. }
  1023. @media (max-width: 320px) {
  1024. .adminbar {
  1025. min-height: 45px;
  1026. }
  1027. }
  1028. .current-site {
  1029. margin-top: 0.5625em;
  1030. font-size: 16px;
  1031. line-height: 44px;
  1032. font-weight: 400;
  1033. overflow: hidden;
  1034. white-space: nowrap;
  1035. text-overflow: ellipsis;
  1036. }
  1037. @media (max-width: 600px) {
  1038. .current-site {
  1039. margin: 3px 0 0;
  1040. }
  1041. }
  1042. @media (max-width: 320px) {
  1043. .current-site {
  1044. margin: 0;
  1045. font-size: 14px;
  1046. }
  1047. }
  1048. .current-site-link {
  1049. text-decoration: none;
  1050. }
  1051. .current-site-link:focus {
  1052. outline: 0;
  1053. }
  1054. .current-site-link:focus .current-site-name{
  1055. text-decoration: underline;
  1056. }
  1057. .current-site-name {
  1058. color: #ededed;
  1059. }
  1060. @media (max-width: 320px) {
  1061. .current-site-name {
  1062. font-weight: 600;
  1063. }
  1064. }
  1065. .current-site .dashicons-wordpress {
  1066. position: relative;
  1067. top: -1px;
  1068. margin-right: 10px;
  1069. vertical-align: middle;
  1070. }
  1071. .options,
  1072. .options.open .on-closed,
  1073. .options.closed .on-open {
  1074. display: none;
  1075. }
  1076. @media (max-width: 900px) {
  1077. .options {
  1078. display: block;
  1079. }
  1080. }
  1081. .options-panel-back.is-hidden {
  1082. display: none;
  1083. }
  1084. .options:focus .dashicons {
  1085. color: #fff;
  1086. text-decoration: none;
  1087. }
  1088. .options .dashicons {
  1089. margin-top: 3px;
  1090. }
  1091. .options {
  1092. color: #00a0d2;
  1093. }
  1094. .alert {
  1095. position: relative;
  1096. margin: 0;
  1097. padding: 16px 50px;
  1098. border-bottom: 1px solid #e5e5e5;
  1099. font-size: 14px;
  1100. }
  1101. .alert:before {
  1102. content: "";
  1103. position: absolute;
  1104. top: 50%;
  1105. left: 30px;
  1106. width: 8px;
  1107. height: 8px;
  1108. margin-top: -4px;
  1109. -webkit-border-radius: 50%;
  1110. border-radius: 50%;
  1111. background: #00a0d2;
  1112. }
  1113. @media (max-width: 600px) {
  1114. .alert {
  1115. padding: 16px 35px;
  1116. }
  1117. .alert:before {
  1118. left: 15px;
  1119. }
  1120. }
  1121. .alert.is-error:before {
  1122. background: red;
  1123. }
  1124. .scan {
  1125. position: relative;
  1126. border-bottom: 1px solid #e5e5e5;
  1127. }
  1128. @media (max-width: 900px) {
  1129. .scan form {
  1130. -webkit-transition: opacity .3s ease-in-out;
  1131. transition: opacity .3s ease-in-out;
  1132. }
  1133. .scan.is-hidden form {
  1134. opacity: .2;
  1135. pointer-events: none;
  1136. }
  1137. }
  1138. .scan-url {
  1139. display: block;
  1140. border: 0;
  1141. padding: 0.85714em 1.07143em;
  1142. font-size: 14px;
  1143. width: 100%;
  1144. }
  1145. @media (max-width: 600px) {
  1146. .scan-url {
  1147. font-size: 16px;
  1148. }
  1149. }
  1150. .scan-submit {
  1151. position: absolute;
  1152. top: 0;
  1153. right: 0;
  1154. bottom: 0;
  1155. padding: 0 1.07143em;
  1156. background: #f7f7f7;
  1157. border-color: #ddd;
  1158. border: 0;
  1159. border-left: 1px solid #f1f1f1;
  1160. -webkit-border-radius: 0;
  1161. border-radius: 0;
  1162. color: #555;
  1163. font-size: 14px;
  1164. line-height: 1.6;
  1165. }
  1166. .scan-submit:hover,
  1167. .scan-submit:focus {
  1168. background: #008ec2;
  1169. border-color: #006799;
  1170. color: #fff;
  1171. outline: 0;
  1172. }
  1173. .scan-submit:active {
  1174. background: #0073aa;
  1175. border-color: #006799;
  1176. color: #fff;
  1177. }
  1178. .scan-submit:visited {
  1179. color: #555;
  1180. }
  1181. .wrapper {
  1182. position: relative;
  1183. margin-bottom: 60px;
  1184. margin-right: 320px;
  1185. }
  1186. .wrapper:before,
  1187. .wrapper:after {
  1188. content: "";
  1189. display: table;
  1190. }
  1191. .wrapper:after {
  1192. clear: both;
  1193. }
  1194. @media (max-width: 900px) {
  1195. .wrapper {
  1196. margin: 0;
  1197. width: 100%;
  1198. }
  1199. }
  1200. .editor-wrapper {
  1201. overflow: auto;
  1202. float: left;
  1203. width: 100%;
  1204. }
  1205. .editor-wrapper:before,
  1206. .editor-wrapper:after {
  1207. content: "";
  1208. display: table;
  1209. }
  1210. .editor-wrapper:after {
  1211. clear: both;
  1212. }
  1213. .editor {
  1214. padding: 0 1.5em 4.75em;
  1215. max-width: 700px;
  1216. margin: 0 auto;
  1217. }
  1218. .spinner {
  1219. height: 20px;
  1220. width: 20px;
  1221. display: inline-block;
  1222. visibility: hidden;
  1223. background: url(../images/spinner.gif) no-repeat center;
  1224. -webkit-background-size: 20px 20px;
  1225. background-size: 20px 20px;
  1226. opacity: 0.7;
  1227. filter: alpha(opacity=70);
  1228. line-height: 1;
  1229. vertical-align: middle;
  1230. }
  1231. @media print,
  1232. (-webkit-min-device-pixel-ratio: 1.25),
  1233. (min-resolution: 120dpi) {
  1234. .spinner {
  1235. background-image: url(../images/spinner-2x.gif);
  1236. }
  1237. }
  1238. .spinner.is-active {
  1239. visibility: visible;
  1240. }
  1241. /* Make the text inside the editor textarea white. Prevents a "flash" on loading the page */
  1242. #pressthis {
  1243. color: #fff;
  1244. }
  1245. @media (min-width: 901px) {
  1246. .editor {
  1247. max-width: 760px;
  1248. }
  1249. }
  1250. @media (max-width: 320px) {
  1251. .editor {
  1252. padding: 0;
  1253. }
  1254. }
  1255. .post-title,
  1256. .post-title-placeholder {
  1257. margin: 0;
  1258. padding: .83em 0;
  1259. width: 100%;
  1260. border-bottom: 1px solid #e5e5e5;
  1261. font-size: 32px;
  1262. line-height: 1.4;
  1263. font-weight: 700;
  1264. }
  1265. .post-title:active,
  1266. .post-title:focus,
  1267. .post-title-placeholder:active,
  1268. .post-title-placeholder:focus {
  1269. outline: 0;
  1270. -webkit-box-shadow: inset 0px -3px 0 #00a0d2;
  1271. box-shadow: inset 0px -3px 0 #00a0d2;
  1272. border-color: #00a0d2;
  1273. }
  1274. @media (max-width: 900px) {
  1275. .post-title,
  1276. .post-title-placeholder {
  1277. font-size: 24px;
  1278. }
  1279. }
  1280. @media (max-height: 400px) {
  1281. .post-title,
  1282. .post-title-placeholder {
  1283. padding: 15px 0;
  1284. font-size: 16px;
  1285. }
  1286. }
  1287. @media (max-width: 320px) {
  1288. .post-title,
  1289. .post-title-placeholder {
  1290. font-size: 16px;
  1291. font-weight: 600;
  1292. padding: 1.14286em 1.42857em;
  1293. }
  1294. }
  1295. .post-title {
  1296. /* IE8 fallback */
  1297. background: url(data:image/gif;base64,R0lGODlhAQABAJEAAAAAAP///////wAAACH5BAEHAAIALAAAAAABAAEAAAICVAEAOw==);
  1298. background: none, none;
  1299. }
  1300. .post-title:before {
  1301. /* Keeps empty container from collapsing */
  1302. content: "\a0";
  1303. display: inline-block;
  1304. width: 0;
  1305. speak: none;
  1306. }
  1307. .post-title-placeholder {
  1308. position: absolute;
  1309. border: 0;
  1310. color: #82878c;
  1311. z-index: -1;
  1312. }
  1313. .post-title-placeholder.is-hidden {
  1314. display: none;
  1315. }
  1316. /* Suggested images */
  1317. .media-list-container {
  1318. position: relative;
  1319. padding: 2px 0;
  1320. border-bottom: 1px solid #e5e5e5;
  1321. display: none;
  1322. }
  1323. .media-list-inner-container {
  1324. overflow: auto;
  1325. max-height: 150px;
  1326. max-height: 40vw;
  1327. }
  1328. .media-list-container.has-media {
  1329. display: block;
  1330. }
  1331. .media-list-inner-container:before,
  1332. .media-list-inner-container:after {
  1333. content: "";
  1334. display: table;
  1335. }
  1336. .media-list-inner-container:after {
  1337. clear: both;
  1338. }
  1339. .media-list {
  1340. margin: 0;
  1341. padding: 0;
  1342. }
  1343. @media (min-width: 321px) {
  1344. .media-list-inner-container {
  1345. max-height: 250px;
  1346. max-height: 40vw;
  1347. }
  1348. }
  1349. @media (min-width: 601px) {
  1350. .media-list-inner-container {
  1351. max-height: 200px;
  1352. max-height: 18.75vw;
  1353. }
  1354. }
  1355. .wppt-all-media-list {
  1356. list-style: none;
  1357. margin: 0;
  1358. padding: 0;
  1359. }
  1360. .suggested-media-thumbnail:focus,
  1361. .is-embed:focus {
  1362. outline: 0;
  1363. -webkit-box-shadow: inset 0 0 0 3px #00a0d2;
  1364. box-shadow: inset 0 0 0 3px #00a0d2;
  1365. }
  1366. .suggested-media-thumbnail {
  1367. position: relative;
  1368. display: block;
  1369. float: left;
  1370. width: 16.66%;
  1371. padding: 16.66% 0 0 16.66%;
  1372. background-position: center;
  1373. background-repeat: no-repeat;
  1374. -webkit-background-size: cover;
  1375. background-size: cover;
  1376. background-color: #d8d8d8;
  1377. color: #fff;
  1378. color: rgba(255, 255, 255, 0.6);
  1379. cursor: pointer;
  1380. }
  1381. .suggested-media-thumbnail:hover,
  1382. .suggested-media-thumbnail:active,
  1383. .suggested-media-thumbnail:focus {
  1384. color: #fff;
  1385. }
  1386. .suggested-media-thumbnail:before,
  1387. .suggested-media-thumbnail:after {
  1388. display: inline-block;
  1389. position: absolute;
  1390. font-size: 20px;
  1391. line-height: 1;
  1392. font-family: dashicons;
  1393. text-decoration: inherit;
  1394. font-weight: 400;
  1395. font-style: normal;
  1396. -webkit-transition: color .1s ease-in 0;
  1397. transition: color .1s ease-in 0;
  1398. -webkit-font-smoothing: antialiased;
  1399. -moz-osx-font-smoothing: grayscale;
  1400. }
  1401. .suggested-media-thumbnail:before {
  1402. left: 50%;
  1403. top: 50%;
  1404. margin: -20px 0 0 -20px;
  1405. font-size: 40px;
  1406. }
  1407. .suggested-media-thumbnail:after {
  1408. content: "\f132";
  1409. right: 3%;
  1410. bottom: 2%;
  1411. }
  1412. @media (min-width: 601px) {
  1413. .suggested-media-thumbnail {
  1414. width: 12.5%;
  1415. padding: 12.5% 0 0 12.5%;
  1416. }
  1417. }
  1418. .is-embed:before {
  1419. content: "\f104";
  1420. color: #fff;
  1421. color: rgba(255, 255, 255, 0.9);
  1422. }
  1423. .is-embed.is-audio:hover:before,
  1424. .is-embed.is-audio:active:before,
  1425. .is-embed.is-audio:focus:before,
  1426. .is-embed.is-tweet:hover:before,
  1427. .is-embed.is-tweet:active:before,
  1428. .is-embed.is-tweet:focus:before {
  1429. color: #fff;
  1430. }
  1431. .is-embed.is-video {
  1432. background-color: #23282d;
  1433. }
  1434. .is-embed.is-video:hover:before,
  1435. .is-embed.is-video:active:before,
  1436. .is-embed.is-video:focus:before {
  1437. color: rgba(255, 255, 255, 0.2);
  1438. }
  1439. .is-embed.is-video:before {
  1440. content: "\f236";
  1441. }
  1442. .is-embed.is-audio {
  1443. background-color: #ff7d44;
  1444. }
  1445. .is-embed.is-audio:before {
  1446. content: "\f127";
  1447. }
  1448. .is-embed.is-tweet {
  1449. background-color: #55acee;
  1450. }
  1451. .is-embed.is-tweet:before {
  1452. content: "\f301";
  1453. }
  1454. .no-media {
  1455. margin: 0;
  1456. padding: 0;
  1457. border: 0;
  1458. }
  1459. /* Actions bar */
  1460. .press-this-actions {
  1461. position: fixed;
  1462. bottom: 0;
  1463. left: 0;
  1464. width: 100%;
  1465. background: #f1f1f1;
  1466. background: rgba(241, 241, 241, 0.9);
  1467. border-top: 1px solid #e5e5e5;
  1468. }
  1469. @media (max-width: 900px) {
  1470. .press-this-actions {
  1471. -webkit-transform: translateY(0);
  1472. -ms-transform: translateY(0);
  1473. transform: translateY(0);
  1474. -webkit-transition: -webkit-transform .3s ease-in-out;
  1475. transition: -webkit-transform .3s ease-in-out;
  1476. transition: transform .3s ease-in-out;
  1477. transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
  1478. }
  1479. .press-this-actions.is-hidden {
  1480. -webkit-transform: translateY(100%);
  1481. -ms-transform: translateY(100%);
  1482. transform: translateY(100%);
  1483. }
  1484. }
  1485. .add-media {
  1486. float: left;
  1487. margin: 14px 0 14px 30px;
  1488. font-size: 0;
  1489. }
  1490. @media (max-width: 320px) {
  1491. .add-media {
  1492. margin: 10px 0 10px 10px;
  1493. }
  1494. }
  1495. .insert-media {
  1496. color: #9ea7af;
  1497. float: left;
  1498. margin: 0;
  1499. padding: 0;
  1500. border: 0;
  1501. border-right: 1px solid #e5e5e5;
  1502. -webkit-border-radius: 0;
  1503. border-radius: 0;
  1504. background: none;
  1505. -webkit-box-shadow: none;
  1506. box-shadow: none;
  1507. overflow: hidden;
  1508. }
  1509. .insert-media:hover,
  1510. .insert-media:focus,
  1511. .insert-media:active {
  1512. margin: 0;
  1513. background: none;
  1514. border-color: #e5e5e5;
  1515. color: #23282d;
  1516. }
  1517. .insert-media:focus,
  1518. .insert-media:active {
  1519. outline: 0;
  1520. color: #00a0d2;
  1521. text-decoration: none;
  1522. }
  1523. .insert-media .dashicons {
  1524. padding: 11px;
  1525. width: 63px;
  1526. height: 58px;
  1527. font-size: 40px;
  1528. }
  1529. @media (max-width: 320px) {
  1530. .insert-media .dashicons {
  1531. width: 55px;
  1532. height: 49px;
  1533. padding: 14px;
  1534. font-size: 20px;
  1535. }
  1536. }
  1537. .post-actions {
  1538. float: right;
  1539. margin: 14px 30px 14px 0;
  1540. font-size: 13px;
  1541. }
  1542. @media (max-width: 320px) {
  1543. .post-actions {
  1544. margin: 10px 10px 10px 0;
  1545. }
  1546. }
  1547. .publish-button .saving-draft,
  1548. .publish-button.is-saving .publish {
  1549. display: none;
  1550. }
  1551. .publish-button.is-saving .saving-draft {
  1552. display: inline;
  1553. }
  1554. /* TinyMCE styles */
  1555. .editor .wp-media-buttons {
  1556. float: none;
  1557. }
  1558. .editor div.mce-toolbar-grp {
  1559. padding: 0.71429em 0;
  1560. background: none;
  1561. border: 0;
  1562. }
  1563. @media (max-height: 400px), (max-width: 320px) {
  1564. .editor div.mce-toolbar-grp {
  1565. padding: 0;
  1566. }
  1567. }
  1568. .mce-stack-layout:before,
  1569. .mce-stack-layout:after {
  1570. content: "";
  1571. display: table;
  1572. }
  1573. .mce-stack-layout:after {
  1574. clear: both;
  1575. }
  1576. .mce-container.mce-toolbar {
  1577. float: left;
  1578. }
  1579. .mce-container.mce-toolbar:nth-child(2) {
  1580. float: right;
  1581. }
  1582. @media (max-width: 600px) {
  1583. .mce-first .mce-btn:nth-child(3),
  1584. .mce-first .mce-btn:nth-child(4) {
  1585. position: absolute;
  1586. margin: -1px;
  1587. padding: 0;
  1588. height: 1px;
  1589. width: 1px;
  1590. overflow: hidden;
  1591. clip: rect(0 0 0 0);
  1592. border: 0;
  1593. }
  1594. .mce-first .mce-btn:nth-child(3):focus,
  1595. .mce-first .mce-btn:nth-child(4):focus {
  1596. position: static;
  1597. margin: 1px;
  1598. padding: inherit;
  1599. height: auto;
  1600. width: auto;
  1601. overflow: visible;
  1602. clip: auto;
  1603. border: 1px solid #999;
  1604. }
  1605. }
  1606. #wp-link-wrap {
  1607. font-size: 13px;
  1608. }
  1609. #wp-link-wrap input[type="text"] {
  1610. padding: 3px 5px;
  1611. margin: 1px;
  1612. }
  1613. @media screen and (max-width: 782px) {
  1614. #wp-link-wrap {
  1615. font-size: 14px;
  1616. }
  1617. #wp-link-wrap input[type="text"] {
  1618. padding: 6px 10px;
  1619. }
  1620. }
  1621. #wp-link-wrap .howto {
  1622. color: #666;
  1623. font-style: italic;
  1624. }
  1625. /* Options panel (sidebar) */
  1626. .options-panel {
  1627. position: relative;
  1628. float: right;
  1629. margin-right: -320px;
  1630. width: 320px;
  1631. border-left: 1px solid #e5e5e5;
  1632. font-size: 14px;
  1633. /* Keeps background the full height of the screen, but only visually. Clicks go through. */
  1634. -webkit-box-shadow: 5001px 5000px 0 5000px #fff, 5000px 5000px 0 5000px #e5e5e5;
  1635. box-shadow: 5001px 5000px 0 5000px #fff, 5000px 5000px 0 5000px #e5e5e5;
  1636. outline: 0;
  1637. }
  1638. .options-panel-back {
  1639. position: absolute;
  1640. top: 0;
  1641. right: 0;
  1642. bottom: 0;
  1643. width: 320px;
  1644. outline: 0;
  1645. }
  1646. @media (max-width: 900px) {
  1647. .options-panel {
  1648. background: #fff;
  1649. -webkit-transform: translateX(-100%);
  1650. -ms-transform: translateX(-100%);
  1651. transform: translateX(-100%);
  1652. -webkit-transition: -webkit-transform .3s ease-in-out;
  1653. transition: -webkit-transform .3s ease-in-out;
  1654. transition: transform .3s ease-in-out;
  1655. transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
  1656. }
  1657. .options-panel.is-hidden {
  1658. visibility: hidden;
  1659. }
  1660. .options-panel.is-off-screen {
  1661. -webkit-transform: translateX(0);
  1662. -ms-transform: translateX(0);
  1663. transform: translateX(0);
  1664. }
  1665. }
  1666. @media (max-width: 320px) {
  1667. .options-panel {
  1668. margin-right: -100%;
  1669. width: 100%;
  1670. border: 0;
  1671. -webkit-box-shadow: 5001px 5000px 0 5000px #fff;
  1672. box-shadow: 5001px 5000px 0 5000px #fff;
  1673. }
  1674. .options-panel-back {
  1675. width: 100%;
  1676. }
  1677. }
  1678. .post-options {
  1679. background: #fff;
  1680. position: absolute;
  1681. right: 0;
  1682. width: 100%;
  1683. overflow-x: hidden;
  1684. }
  1685. .post-options .post-option-contents {
  1686. margin-left: 3px;
  1687. color: #32373c;
  1688. }
  1689. .post-option-forward:before {
  1690. position: absolute;
  1691. top: 50%;
  1692. right: 8px;
  1693. margin-top: -10px;
  1694. content: "\f345"
  1695. }
  1696. .post-option-back:before {
  1697. content: "\f341";
  1698. }
  1699. .lt-ie9 .options-panel,
  1700. .lt-ie9 .post-options {
  1701. border-left: 1px solid #e5e5e5;
  1702. }
  1703. .lt-ie9 .post-options.is-off-screen {
  1704. border: 0;
  1705. }
  1706. .post-option {
  1707. position: relative;
  1708. }
  1709. .post-options .post-option {
  1710. display: block;
  1711. width: 100%;
  1712. padding: 13px 37px 13px 14px;
  1713. border-bottom: 1px solid #e5e5e5;
  1714. text-decoration: none;
  1715. text-align: left;
  1716. color: #9ea7af;
  1717. text-overflow: ellipsis;
  1718. white-space: nowrap;
  1719. overflow: hidden;
  1720. -webkit-transition: -webkit-transform .3s ease-in-out;
  1721. transition: -webkit-transform .3s ease-in-out;
  1722. transition: transform .3s ease-in-out;
  1723. transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
  1724. }
  1725. .post-options .post-option:focus {
  1726. outline: 0;
  1727. -webkit-box-shadow: inset 5px 0 0 #00a0d2;
  1728. box-shadow: inset 5px 0 0 #00a0d2;
  1729. border-color: #e5e5e5;
  1730. }
  1731. .is-off-screen > .post-option {
  1732. right: 100%;
  1733. }
  1734. .is-hidden > .post-option {
  1735. visibility: hidden;
  1736. }
  1737. @media (min-width: 1px) {
  1738. .is-off-screen > .post-option {
  1739. right: auto;
  1740. -webkit-transform: translateX(-100%);
  1741. -ms-transform: translateX(-100%);
  1742. transform: translateX(-100%);
  1743. }
  1744. }
  1745. .post-option-title {
  1746. display: inline-block;
  1747. margin: 0 0 0 8px;
  1748. font-size: 14px;
  1749. font-weight: 400;
  1750. }
  1751. .setting-modal {
  1752. position: relative;
  1753. top: 0;
  1754. left: 0;
  1755. width: 100%;
  1756. overflow: hidden;
  1757. -webkit-transition: -webkit-transform .3s ease-in-out;
  1758. transition: -webkit-transform .3s ease-in-out;
  1759. transition: transform .3s ease-in-out;
  1760. transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
  1761. }
  1762. .setting-modal.is-hidden {
  1763. visibility: hidden;
  1764. height: 0;
  1765. }
  1766. .setting-modal.is-off-screen {
  1767. left: 100%;
  1768. }
  1769. @media (min-width: 1px) {
  1770. .setting-modal.is-off-screen {
  1771. left: 0;
  1772. -webkit-transform: translateX(100%);
  1773. -ms-transform: translateX(100%);
  1774. transform: translateX(100%);
  1775. }
  1776. }
  1777. .press-this .modal-close {
  1778. display: block;
  1779. width: 100%;
  1780. padding: 13px 14px;
  1781. border-bottom: 1px solid #e5e5e5;
  1782. color: #00a0d2;
  1783. text-decoration: none;
  1784. text-align: left;
  1785. }
  1786. .press-this .modal-close:focus {
  1787. outline: 0;
  1788. -webkit-box-shadow: inset 5px 0 0 #00a0d2;
  1789. box-shadow: inset 5px 0 0 #00a0d2;
  1790. border-color: #e5e5e5;
  1791. }
  1792. .setting-title {
  1793. position: relative;
  1794. top: -1px;
  1795. margin-left: 11px;
  1796. }
  1797. /* Text editor */
  1798. #pressthis {
  1799. color: #404040;
  1800. resize: none;
  1801. padding-top: 30px;
  1802. font-size: 16px;
  1803. }
  1804. .wp-editor-wrap .quicktags-toolbar {
  1805. background: transparent;
  1806. border: none;
  1807. }
  1808. /* Switch editor buttons */
  1809. .wp-editor-wrap .wp-editor-tools {
  1810. z-index: 0;
  1811. }
  1812. .wp-editor-wrap .wp-editor-tabs {
  1813. padding: 2px;
  1814. }
  1815. .wp-editor-wrap .wp-switch-editor {
  1816. top: 0;
  1817. margin: 3px 0 0 5px;
  1818. padding: 3px 8px;
  1819. background: #f5f5f5;
  1820. color: #555;
  1821. border-color: #ccc;
  1822. }
  1823. .wp-editor-wrap .wp-switch-editor:hover {
  1824. background: #fafafa;
  1825. border-color: #999;
  1826. color: #23282d;
  1827. }
  1828. .wp-editor-wrap.tmce-active .switch-tmce,
  1829. .wp-editor-wrap.html-active .switch-html {
  1830. background: #fff;
  1831. border-color: #d8d8d8;
  1832. }
  1833. /* Inline link dialog */
  1834. .wp-link-input input {
  1835. border: 1px solid #ddd;
  1836. -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 );
  1837. box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 );
  1838. background-color: #fff;
  1839. color: #32373c;
  1840. outline: none;
  1841. -webkit-transition: 0.05s border-color ease-in-out;
  1842. transition: 0.05s border-color ease-in-out;
  1843. }
  1844. /* UI Autocomplete (for inline link and wpLink) */
  1845. .ui-autocomplete {
  1846. padding: 0;
  1847. margin: 0;
  1848. list-style: none;
  1849. position: absolute;
  1850. z-index: 10000;
  1851. border: 1px solid #5b9dd9;
  1852. -webkit-box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 );
  1853. box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 );
  1854. background-color: #fff;
  1855. font-size: 14px;
  1856. }
  1857. .ui-autocomplete li {
  1858. margin-bottom: 0;
  1859. padding: 4px 10px;
  1860. white-space: nowrap;
  1861. text-align: left;
  1862. cursor: pointer;
  1863. }
  1864. /* Colors for the wplink toolbar autocomplete. */
  1865. .ui-autocomplete .ui-state-focus {
  1866. background-color: #ddd;
  1867. }
  1868. /* Colors for the tags autocomplete. */
  1869. .wp-tags-autocomplete .ui-state-focus {
  1870. background-color: #0073aa;
  1871. color: #fff;
  1872. }