home *** CD-ROM | disk | FTP | other *** search
/ HTML Examples / WP.iso / wordpress / wp-admin / css / forms-rtl.css < prev    next >
Encoding:
Cascading Style Sheet File  |  2017-11-08  |  24.2 KB  |  1,398 lines
  1. /* Include margin and padding in the width calculation of input and textarea. */
  2. input,
  3. textarea {
  4.     box-sizing: border-box;
  5. }
  6.  
  7. input[type="text"],
  8. input[type="password"],
  9. input[type="checkbox"],
  10. input[type="color"],
  11. input[type="date"],
  12. input[type="datetime"],
  13. input[type="datetime-local"],
  14. input[type="email"],
  15. input[type="month"],
  16. input[type="number"],
  17. input[type="search"],
  18. input[type="radio"],
  19. input[type="tel"],
  20. input[type="text"],
  21. input[type="time"],
  22. input[type="url"],
  23. input[type="week"],
  24. select,
  25. textarea {
  26.     border: 1px solid #ddd;
  27.     box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 );
  28.     background-color: #fff;
  29.     color: #32373c;
  30.     outline: none;
  31.     transition: 0.05s border-color ease-in-out;
  32. }
  33.  
  34. input[type="text"]:focus,
  35. input[type="password"]:focus,
  36. input[type="color"]:focus,
  37. input[type="date"]:focus,
  38. input[type="datetime"]:focus,
  39. input[type="datetime-local"]:focus,
  40. input[type="email"]:focus,
  41. input[type="month"]:focus,
  42. input[type="number"]:focus,
  43. input[type="search"]:focus,
  44. input[type="tel"]:focus,
  45. input[type="text"]:focus,
  46. input[type="time"]:focus,
  47. input[type="url"]:focus,
  48. input[type="week"]:focus,
  49. input[type="checkbox"]:focus,
  50. input[type="radio"]:focus,
  51. select:focus,
  52. textarea:focus {
  53.     border-color: #5b9dd9;
  54.     box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );
  55. }
  56.  
  57. /* rtl:ignore */
  58. input[type="email"],
  59. input[type="url"] {
  60.     direction: ltr;
  61. }
  62.  
  63. /* Vertically align the number selector with the input. */
  64. input[type="number"] {
  65.     height: 28px;
  66.     line-height: 1;
  67. }
  68.  
  69. input[type="checkbox"],
  70. input[type="radio"] {
  71.     border: 1px solid #b4b9be;
  72.     background: #fff;
  73.     color: #555;
  74.     clear: none;
  75.     cursor: pointer;
  76.     display: inline-block;
  77.     line-height: 0;
  78.     height: 16px;
  79.     margin: -4px 0 0 4px;
  80.     outline: 0;
  81.     padding: 0 !important;
  82.     text-align: center;
  83.     vertical-align: middle;
  84.     width: 16px;
  85.     min-width: 16px;
  86.     -webkit-appearance: none;
  87.     box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.1 );
  88.     transition: .05s border-color ease-in-out;
  89. }
  90.  
  91. input[type="radio"]:checked + label:before {
  92.     color: #82878c;
  93. }
  94.  
  95. .wp-core-ui input[type="reset"]:hover,
  96. .wp-core-ui input[type="reset"]:active {
  97.     color: #00a0d2;
  98. }
  99.  
  100. td > input[type="checkbox"],
  101. .wp-admin p input[type="checkbox"],
  102. .wp-admin p input[type="radio"] {
  103.     margin-top: 0;
  104. }
  105.  
  106. .wp-admin p label input[type="checkbox"] {
  107.     margin-top: -4px;
  108. }
  109.  
  110. .wp-admin p label input[type="radio"] {
  111.     margin-top: -2px;
  112. }
  113.  
  114. input[type="radio"] {
  115.     border-radius: 50%;
  116.     margin-left: 4px;
  117.     line-height: 10px;
  118. }
  119.  
  120. input[type="checkbox"]:checked:before,
  121. input[type="radio"]:checked:before {
  122.     float: right;
  123.     display: inline-block;
  124.     vertical-align: middle;
  125.     width: 16px;
  126.     font: normal 21px/1 dashicons;
  127.     speak: none;
  128.     -webkit-font-smoothing: antialiased;
  129.     -moz-osx-font-smoothing: grayscale;
  130. }
  131.  
  132. input[type="checkbox"]:checked:before {
  133.     content: "\f147";
  134.     margin: -3px -4px 0 0;
  135.     color: #1e8cbe;
  136. }
  137.  
  138. input[type="radio"]:checked:before {
  139.     content: "\2022";
  140.     text-indent: -9999px;
  141.     border-radius: 50px;
  142.     font-size: 24px;
  143.     width: 6px;
  144.     height: 6px;
  145.     margin: 4px;
  146.     line-height: 16px;
  147.     background-color: #1e8cbe;
  148. }
  149.  
  150. @-moz-document url-prefix() {
  151.     input[type="checkbox"],
  152.     input[type="radio"],
  153.     .form-table input.tog {
  154.         margin-bottom: -1px;
  155.     }
  156. }
  157.  
  158. /* Search */
  159. input[type="search"] {
  160.     -webkit-appearance: textfield;
  161. }
  162.  
  163. input[type="search"]::-webkit-search-decoration {
  164.     display: none;
  165. }
  166.  
  167. .ie8 input[type="password"] {
  168.     font-family: sans-serif;
  169. }
  170.  
  171. textarea,
  172. input,
  173. select,
  174. button {
  175.     font-family: inherit;
  176.     font-size: inherit;
  177.     font-weight: inherit;
  178. }
  179.  
  180. textarea,
  181. input,
  182. select {
  183.     font-size: 14px;
  184.     padding: 3px 5px;
  185.     border-radius: 0; /* Reset mobile webkit's default element styling */
  186. }
  187.  
  188. textarea {
  189.     overflow: auto;
  190.     padding: 2px 6px;
  191.     line-height: 1.4;
  192.     resize: vertical;
  193. }
  194.  
  195. .wp-admin input[type="file"] {
  196.     padding: 3px 0;
  197.     cursor: pointer;
  198. }
  199.  
  200. label {
  201.     cursor: pointer;
  202. }
  203.  
  204. input,
  205. select {
  206.     margin: 1px;
  207.     padding: 3px 5px;
  208. }
  209.  
  210. input.code {
  211.     padding-top: 6px;
  212. }
  213.  
  214. textarea.code {
  215.     line-height: 1.4;
  216.     padding: 4px 6px 1px 6px;
  217. }
  218.  
  219. input.readonly,
  220. input[readonly],
  221. textarea.readonly,
  222. textarea[readonly] {
  223.     background-color: #eee;
  224. }
  225.  
  226. ::-webkit-input-placeholder {
  227.     color: #72777c;
  228. }
  229.  
  230. ::-moz-placeholder {
  231.    color: #72777c;
  232.    opacity: 1;
  233. }
  234.  
  235. :-ms-input-placeholder {
  236.     color: #72777c;
  237. }
  238.  
  239. .form-invalid input, .form-invalid input:focus,
  240. .form-invalid select, .form-invalid select:focus {
  241.     border-color: #dc3232 !important;
  242.  box-shadow: 0 0 2px rgba( 204, 0, 0, 0.8 );
  243. }
  244.  
  245. .form-table .form-required.form-invalid td:after {
  246.     content: "\f534";
  247.     font: normal 20px/1 dashicons;
  248.     color: #dc3232;
  249.     margin-right: -25px;
  250.     vertical-align: middle;
  251. }
  252.  
  253. /* Adjust error indicator for password layout */
  254. .form-table .form-required.user-pass1-wrap.form-invalid td:after {
  255.     content: '';
  256. }
  257.  
  258. .form-table .form-required.user-pass1-wrap.form-invalid .password-input-wrapper:after {
  259.     content: '\f534';
  260.     font: normal 20px/1 dashicons;
  261.     color: #dc3232;
  262.     margin: 0 -29px 0 6px;
  263.     vertical-align: middle;
  264. }
  265.  
  266. .form-input-tip {
  267.     color: #666;
  268. }
  269.  
  270. input:disabled,
  271. input.disabled,
  272. select:disabled,
  273. select.disabled,
  274. textarea:disabled,
  275. textarea.disabled {
  276.     background: rgba( 255, 255, 255, 0.5 );
  277.     border-color: rgba( 222, 222, 222, 0.75 );
  278.     box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 );
  279.     color: rgba( 51, 51, 51, 0.5 );
  280. }
  281.  
  282. input[type="file"]:disabled,
  283. input[type="file"].disabled,
  284. input[type="range"]:disabled,
  285. input[type="range"].disabled {
  286.     background: none;
  287.     box-shadow: none;
  288.     cursor: default;
  289. }
  290.  
  291. input[type="checkbox"]:disabled,
  292. input[type="checkbox"].disabled,
  293. input[type="radio"]:disabled,
  294. input[type="radio"].disabled,
  295. input[type="checkbox"]:disabled:checked:before,
  296. input[type="checkbox"].disabled:checked:before,
  297. input[type="radio"]:disabled:checked:before,
  298. input[type="radio"].disabled:checked:before {
  299.     opacity: 0.7;
  300. }
  301.  
  302. /*------------------------------------------------------------------------------
  303.   2.0 - Forms
  304. ------------------------------------------------------------------------------*/
  305.  
  306.  
  307. .wp-admin select {
  308.     padding: 2px;
  309.     line-height: 28px;
  310.     height: 28px;
  311.     vertical-align: middle;
  312. }
  313.  
  314. .wp-admin .button-cancel {
  315.     padding: 0 5px;
  316.     line-height: 2;
  317. }
  318.  
  319. .meta-box-sortables select {
  320.     max-width: 100%;
  321. }
  322.  
  323. .wp-admin select[multiple] {
  324.     height: auto;
  325. }
  326.  
  327. .submit {
  328.     padding: 1.5em 0;
  329.     margin: 5px 0;
  330.     border-bottom-right-radius: 3px;
  331.     border-bottom-left-radius: 3px;
  332.     border: none;
  333. }
  334.  
  335. form p.submit a.cancel:hover {
  336.     text-decoration: none;
  337. }
  338.  
  339. p.submit {
  340.     text-align: right;
  341.     max-width: 100%;
  342.     margin-top: 20px;
  343.     padding-top: 10px;
  344. }
  345.  
  346. .textright p.submit {
  347.     border: none;
  348.     text-align: left;
  349. }
  350.  
  351. table.form-table + p.submit,
  352. table.form-table + input + p.submit,
  353. table.form-table + input + input + p.submit {
  354.     border-top: none;
  355.     padding-top: 0;
  356. }
  357.  
  358. #minor-publishing-actions input,
  359. #major-publishing-actions input,
  360. #minor-publishing-actions .preview {
  361.     text-align: center;
  362. }
  363.  
  364. textarea.all-options,
  365. input.all-options {
  366.     width: 250px;
  367. }
  368.  
  369. input.large-text,
  370. textarea.large-text {
  371.     width: 99%;
  372. }
  373.  
  374. .regular-text {
  375.     width: 25em;
  376. }
  377.  
  378. input.small-text {
  379.     width: 50px;
  380.     padding: 1px 6px;
  381. }
  382.  
  383. input[type="number"].small-text {
  384.     width: 65px;
  385. }
  386.  
  387. input.tiny-text {
  388.     width: 35px;
  389. }
  390.  
  391. input[type="number"].tiny-text {
  392.     width: 45px;
  393. }
  394.  
  395. #doaction,
  396. #doaction2,
  397. #post-query-submit {
  398.     margin: 1px 0 0 8px;
  399. }
  400.  
  401. .tablenav #changeit,
  402. .tablenav #delete_all,
  403. .tablenav #clear-recent-list,
  404. .wp-filter #delete_all {
  405.     margin-top: 1px;
  406. }
  407.  
  408. .tablenav .actions select {
  409.     float: right;
  410.     margin-left: 6px;
  411.     max-width: 200px;
  412. }
  413.  
  414. .ie8 .tablenav .actions select {
  415.     width: 155px;
  416. }
  417.  
  418. .ie8 .tablenav .actions select#cat {
  419.     width: 200px;
  420. }
  421.  
  422. #timezone_string option {
  423.     margin-right: 1em;
  424. }
  425.  
  426. button.wp-hide-pw > .dashicons {
  427.     position: relative;
  428.     top: 3px;
  429. }
  430.  
  431. label,
  432. #your-profile label + a {
  433.     vertical-align: middle;
  434. }
  435.  
  436. fieldset label,
  437. #your-profile label + a {
  438.     vertical-align: middle;
  439. }
  440.  
  441. .options-media-php label[for*="_size_"],
  442. #misc-publishing-actions label {
  443.     vertical-align: baseline;
  444. }
  445.  
  446. #pass-strength-result {
  447.     background-color: #eee;
  448.     border: 1px solid #ddd;
  449.     color: #23282d;
  450.     margin: -2px 1px 5px 5px;
  451.     padding: 3px 5px;
  452.     text-align: center;
  453.     width: 25em;
  454.     box-sizing: border-box;
  455.     opacity: 0;
  456. }
  457.  
  458. #pass-strength-result.short {
  459.     background-color: #f1adad;
  460.     border-color: #e35b5b;
  461.     opacity: 1;
  462. }
  463.  
  464. #pass-strength-result.bad {
  465.     background-color: #fbc5a9;
  466.     border-color: #f78b53;
  467.     opacity: 1;
  468. }
  469.  
  470. #pass-strength-result.good {
  471.     background-color: #ffe399;
  472.     border-color: #ffc733;
  473.     opacity: 1;
  474. }
  475.  
  476. #pass-strength-result.strong {
  477.     background-color: #c1e1b9;
  478.     border-color: #83c373;
  479.     opacity: 1;
  480. }
  481.  
  482. #pass1.short, #pass1-text.short {
  483.     border-color: #e35b5b;
  484. }
  485.  
  486. #pass1.bad, #pass1-text.bad {
  487.     border-color: #f78b53;
  488. }
  489.  
  490. #pass1.good, #pass1-text.good {
  491.     border-color: #ffc733;
  492. }
  493.  
  494. #pass1.strong, #pass1-text.strong {
  495.     border-color: #83c373;
  496. }
  497.  
  498. .pw-weak {
  499.     display:none;
  500. }
  501.  
  502. .indicator-hint {
  503.     padding-top: 8px;
  504. }
  505.  
  506. #pass1-text,
  507. .show-password #pass1 {
  508.     display: none;
  509. }
  510.  
  511. .show-password #pass1-text
  512. {
  513.     display: inline-block;
  514. }
  515.  
  516. .form-table span.description.important {
  517.     font-size: 12px;
  518. }
  519.  
  520. p.search-box {
  521.     float: left;
  522.     margin: 0;
  523. }
  524.  
  525. .network-admin.themes-php p.search-box {
  526.     clear: right;
  527. }
  528.  
  529. .search-box input[name="s"],
  530. .tablenav .search-plugins input[name="s"],
  531. .tagsdiv .newtag {
  532.     float: right;
  533.     height: 28px;
  534.     margin: 0 0 0 4px;
  535. }
  536.  
  537. .js.plugins-php .search-box .wp-filter-search {
  538.     margin: 0;
  539.     width: 280px;
  540.     font-size: 16px;
  541.     font-weight: 300;
  542.     line-height: 1.5;
  543.     padding: 3px 5px;
  544.     height: 32px;
  545. }
  546.  
  547. input[type="text"].ui-autocomplete-loading,
  548. input[type="email"].ui-autocomplete-loading {
  549.     background-image: url(../images/loading.gif);
  550.     background-repeat: no-repeat;
  551.     background-position: left center;
  552.     visibility: visible;
  553. }
  554.  
  555. input.ui-autocomplete-input.open {
  556.     border-bottom-color: transparent;
  557. }
  558.  
  559. ul#add-to-blog-users {
  560.     margin: 0 14px 0 0;
  561. }
  562.  
  563. .ui-autocomplete {
  564.     padding: 0;
  565.     margin: 0;
  566.     list-style: none;
  567.     position: absolute;
  568.     z-index: 10000;
  569.     border: 1px solid #5b9dd9;
  570.     box-shadow: 0 1px 2px rgba( 30, 140, 190, 0.8 );
  571.     background-color: #fff;
  572. }
  573.  
  574. .ui-autocomplete li {
  575.     margin-bottom: 0;
  576.     padding: 4px 10px;
  577.     white-space: nowrap;
  578.     text-align: right;
  579.     cursor: pointer;
  580. }
  581.  
  582. /* Colors for the wplink toolbar autocomplete. */
  583. .ui-autocomplete .ui-state-focus {
  584.     background-color: #ddd;
  585. }
  586.  
  587. /* Colors for the tags autocomplete. */
  588. .wp-tags-autocomplete .ui-state-focus {
  589.     background-color: #0073aa;
  590.     color: #fff;
  591. }
  592.  
  593. /*------------------------------------------------------------------------------
  594.   15.0 - Comments Screen
  595. ------------------------------------------------------------------------------*/
  596.  
  597. .form-table {
  598.     border-collapse: collapse;
  599.     margin-top: 0.5em;
  600.     width: 100%;
  601.     clear: both;
  602. }
  603.  
  604. .form-table,
  605. .form-table td,
  606. .form-table th,
  607. .form-table td p {
  608.     font-size: 14px;
  609. }
  610.  
  611. .form-table td {
  612.     margin-bottom: 9px;
  613.     padding: 15px 10px;
  614.     line-height: 1.3;
  615.     vertical-align: middle;
  616. }
  617.  
  618. .form-table th,
  619. .form-wrap label {
  620.     color: #23282d;
  621.     font-weight: 400;
  622.     text-shadow: none;
  623.     vertical-align: baseline;
  624. }
  625.  
  626. .form-table th {
  627.     vertical-align: top;
  628.     text-align: right;
  629.     padding: 20px 0 20px 10px;
  630.     width: 200px;
  631.     line-height: 1.3;
  632.     font-weight: 600;
  633. }
  634.  
  635. .form-table th.th-full, /* Not used by core. Back-compat for pre-4.8 */
  636. .form-table .td-full {
  637.     width: auto;
  638.     padding: 20px 0 20px 10px;
  639.     font-weight: 400;
  640. }
  641.  
  642. .form-table td p {
  643.     margin-top: 4px;
  644.     margin-bottom: 0;
  645. }
  646.  
  647. .form-table .date-time-doc {
  648.     margin-top: 1em;
  649. }
  650.  
  651. .form-table p.timezone-info {
  652.     margin: 1em 0;
  653. }
  654.  
  655. .form-table td fieldset label {
  656.     margin: 0.25em 0 0.5em !important;
  657.     display: inline-block;
  658. }
  659.  
  660. .form-table td fieldset label,
  661. .form-table td fieldset p,
  662. .form-table td fieldset li {
  663.     line-height: 1.4em;
  664. }
  665.  
  666. .form-table input.tog,
  667. .form-table input[type="radio"] {
  668.     margin-top: -4px;
  669.     margin-left: 4px;
  670.     float: none;
  671. }
  672.  
  673. .form-table .pre {
  674.     padding: 8px;
  675.     margin: 0;
  676. }
  677.  
  678. table.form-table td .updated {
  679.     font-size: 13px;
  680. }
  681.  
  682. table.form-table td .updated p {
  683.     font-size: 13px;
  684.     margin: 0.3em 0;
  685. }
  686.  
  687. /*------------------------------------------------------------------------------
  688.   18.0 - Users
  689. ------------------------------------------------------------------------------*/
  690.  
  691. #profile-page .form-table textarea {
  692.     width: 500px;
  693.     margin-bottom: 6px;
  694. }
  695.  
  696. #profile-page .form-table #rich_editing {
  697.     margin-left: 5px
  698. }
  699.  
  700. #your-profile legend {
  701.     font-size: 22px;
  702. }
  703.  
  704. #display_name {
  705.     width: 15em;
  706. }
  707.  
  708. #adduser .form-field input,
  709. #createuser .form-field input {
  710.     width: 25em;
  711. }
  712.  
  713. .color-option {
  714.     display: inline-block;
  715.     width: 24%;
  716.     padding: 5px 15px 15px;
  717.     box-sizing: border-box;
  718.     margin-bottom: 3px;
  719. }
  720.  
  721. .color-option:hover,
  722. .color-option.selected {
  723.     background: #ddd;
  724. }
  725.  
  726. .color-palette {
  727.     width: 100%;
  728.     border-spacing: 0;
  729.     border-collapse: collapse;
  730. }
  731. .color-palette td {
  732.     height: 20px;
  733.     padding: 0;
  734.     border: none;
  735. }
  736.  
  737. .color-option {
  738.     cursor: pointer;
  739. }
  740.  
  741. /*------------------------------------------------------------------------------
  742.   19.0 - Tools
  743. ------------------------------------------------------------------------------*/
  744.  
  745. .tool-box .title {
  746.     margin: 8px 0;
  747.     font-size: 18px;
  748.     font-weight: 400;
  749.     line-height: 24px;
  750. }
  751.  
  752. .label-responsive {
  753.     vertical-align: middle;
  754. }
  755.  
  756. #export-filters p {
  757.     margin: 0 0 1em;
  758. }
  759.  
  760. #export-filters p.submit {
  761.     margin: 7px 0 5px;
  762. }
  763.  
  764. /* Card styles */
  765.  
  766. .card {
  767.     position: relative;
  768.     margin-top: 20px;
  769.     padding: 0.7em 2em 1em;
  770.     min-width: 255px;
  771.     max-width: 520px;
  772.     border: 1px solid #e5e5e5;
  773.     box-shadow: 0 1px 1px rgba(0,0,0,0.04);
  774.     background: #fff;
  775. }
  776.  
  777. /* Press this styles */
  778.  
  779. .pressthis h4 {
  780.     margin: 2em 0 1em;
  781. }
  782.  
  783. .pressthis textarea {
  784.     width: 100%;
  785.     font-size: 1em;
  786. }
  787.  
  788. #pressthis-code-wrap {
  789.     overflow: auto;
  790. }
  791.  
  792. .pressthis-bookmarklet-wrapper {
  793.     margin: 20px 0 8px;
  794.     vertical-align: top;
  795.     position: relative;
  796.     z-index: 1;
  797. }
  798.  
  799. .pressthis-bookmarklet,
  800. .pressthis-bookmarklet:hover,
  801. .pressthis-bookmarklet:focus,
  802. .pressthis-bookmarklet:active {
  803.     display: inline-block;
  804.     position: relative;
  805.     cursor: move;
  806.     color: #32373c;
  807.     background: #e5e5e5;
  808.     border-radius: 5px;
  809.     border: 1px solid #b4b9be;
  810.     font-style: normal;
  811.     line-height: 16px;
  812.     font-size: 14px;
  813.     text-decoration: none;
  814. }
  815.  
  816. .pressthis-bookmarklet:active {
  817.     outline: none;
  818. }
  819.  
  820. .pressthis-bookmarklet:after {
  821.     content: "";
  822.     width: 70%;
  823.     height: 55%;
  824.     z-index: -1;
  825.     position: absolute;
  826.     left: 10px;
  827.     bottom: 9px;
  828.     background: transparent;
  829.     -webkit-transform: skew(-20deg) rotate(-6deg);
  830.     transform: skew(-20deg) rotate(-6deg);
  831.     box-shadow: 0 10px 8px rgba(0, 0, 0, 0.6);
  832. }
  833.  
  834. .pressthis-bookmarklet:hover:after {
  835.     -webkit-transform: skew(-20deg) rotate(-9deg);
  836.     transform: skew(-20deg) rotate(-9deg);
  837.     box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
  838. }
  839.  
  840. .pressthis-bookmarklet span {
  841.     display: inline-block;
  842.     margin: 0px 0 0;
  843.     padding: 0px 9px 8px 12px;
  844. }
  845.  
  846. .pressthis-bookmarklet span:before {
  847.     color: #72777c;
  848.     font: normal 20px/1 dashicons;
  849.     content: "\f157";
  850.     position: relative;
  851.     display: inline-block;
  852.     top: 4px;
  853.     margin-left: 4px;
  854. }
  855.  
  856. .pressthis-js-toggle {
  857.     margin-right: 10px;
  858.     padding: 0;
  859.     height: auto;
  860.     vertical-align: top;
  861. }
  862.  
  863. /* to override the button class being applied */
  864. .pressthis-js-toggle.button.button {
  865.     margin-right: 10px;
  866.     padding: 0;
  867.     height: auto;
  868.     vertical-align: top;
  869. }
  870.  
  871. .pressthis-js-toggle .dashicons {
  872.     margin: 5px 7px 6px 8px;
  873.     color: #555d66;
  874. }
  875.  
  876. /*------------------------------------------------------------------------------
  877.   20.0 - Settings
  878. ------------------------------------------------------------------------------*/
  879.  
  880. .timezone-info code {
  881.     white-space: nowrap;
  882. }
  883.  
  884. .defaultavatarpicker .avatar {
  885.     margin: 2px 0;
  886.     vertical-align: middle;
  887. }
  888.  
  889. .options-general-php .date-time-text {
  890.     display: inline-block;
  891.     min-width: 10em;
  892. }
  893.  
  894. .options-general-php input.small-text {
  895.     width: 56px;
  896. }
  897.  
  898. .options-general-php .spinner {
  899.     float: none;
  900.     margin: -3px 3px 0;
  901. }
  902.  
  903. .settings-php .language-install-spinner,
  904. .options-general-php .language-install-spinner {
  905.     display: inline-block;
  906.     float: none;
  907.     margin: -3px 5px 0;
  908.     vertical-align: middle;
  909. }
  910.  
  911. .form-table.permalink-structure .available-structure-tags li {
  912.     float: right;
  913.     margin-left: 5px;
  914. }
  915.  
  916. /*------------------------------------------------------------------------------
  917.   21.0 - Network Admin
  918. ------------------------------------------------------------------------------*/
  919.  
  920. .setup-php textarea {
  921.     max-width: 100%;
  922. }
  923.  
  924. .form-field #site-address {
  925.     max-width: 25em;
  926. }
  927.  
  928. .form-field #domain {
  929.     max-width: 22em;
  930. }
  931.  
  932. .form-field #site-title,
  933. .form-field #admin-email,
  934. .form-field #path,
  935. .form-field #blog_registered,
  936. .form-field #blog_last_updated {
  937.     max-width: 25em;
  938. }
  939.  
  940. .form-field #path {
  941.     margin-bottom: 5px;
  942. }
  943.  
  944. #search-users,
  945. #search-sites {
  946.     max-width: 100%;
  947. }
  948.  
  949. /*------------------------------------------------------------------------------
  950.    Credentials check dialog for Install and Updates
  951. ------------------------------------------------------------------------------*/
  952.  
  953. .request-filesystem-credentials-dialog {
  954.     display: none;
  955.     /* The customizer uses visibility: hidden on the body for full-overlays. */
  956.     visibility: visible;
  957. }
  958.  
  959. .request-filesystem-credentials-dialog .notification-dialog {
  960.     top: 10%;
  961.     max-height: 85%;
  962. }
  963.  
  964. .request-filesystem-credentials-dialog-content {
  965.     margin: 25px;
  966. }
  967.  
  968. #request-filesystem-credentials-title {
  969.     font-size: 1.3em;
  970.     margin: 1em 0;
  971. }
  972.  
  973. .request-filesystem-credentials-form legend {
  974.     font-size: 1em;
  975.     padding: 1.33em 0;
  976.     font-weight: 600;
  977. }
  978.  
  979. .request-filesystem-credentials-form input[type="text"],
  980. .request-filesystem-credentials-form input[type="password"] {
  981.     display: block;
  982. }
  983.  
  984. .request-filesystem-credentials-dialog input[type="text"],
  985. .request-filesystem-credentials-dialog input[type="password"] {
  986.     width: 100%;
  987. }
  988.  
  989. .request-filesystem-credentials-form .field-title {
  990.     font-weight: 600;
  991. }
  992.  
  993. .request-filesystem-credentials-dialog label[for="hostname"],
  994. .request-filesystem-credentials-dialog label[for="public_key"],
  995. .request-filesystem-credentials-dialog label[for="private_key"] {
  996.     display: block;
  997.     margin-bottom: 1em;
  998. }
  999.  
  1000. .request-filesystem-credentials-dialog .ftp-username,
  1001. .request-filesystem-credentials-dialog .ftp-password {
  1002.     float: right;
  1003.     width: 48%;
  1004. }
  1005.  
  1006. .request-filesystem-credentials-dialog .ftp-password {
  1007.     margin-right: 4%;
  1008. }
  1009.  
  1010. .request-filesystem-credentials-dialog .request-filesystem-credentials-action-buttons {
  1011.     text-align: left;
  1012. }
  1013.  
  1014. .request-filesystem-credentials-dialog label[for="ftp"] {
  1015.     margin-left: 10px;
  1016. }
  1017.  
  1018. .request-filesystem-credentials-dialog #auth-keys-desc {
  1019.     margin-bottom: 0;
  1020. }
  1021.  
  1022. #request-filesystem-credentials-dialog .button:not(:last-child) {
  1023.     margin-left: 10px;
  1024. }
  1025.  
  1026. #request-filesystem-credentials-form .cancel-button {
  1027.     display: none;
  1028. }
  1029.  
  1030. #request-filesystem-credentials-dialog .cancel-button {
  1031.     display: inline;
  1032. }
  1033.  
  1034. .request-filesystem-credentials-dialog .ftp-username,
  1035. .request-filesystem-credentials-dialog .ftp-password {
  1036.     float: none;
  1037.     width: auto;
  1038. }
  1039.  
  1040. .request-filesystem-credentials-dialog .ftp-username {
  1041.     margin-bottom: 1em;
  1042. }
  1043.  
  1044. .request-filesystem-credentials-dialog .ftp-password {
  1045.     margin: 0;
  1046. }
  1047.  
  1048. .request-filesystem-credentials-dialog .ftp-password em {
  1049.     color: #888;
  1050. }
  1051.  
  1052. .request-filesystem-credentials-dialog label {
  1053.     display: block;
  1054.     line-height: 1.5;
  1055.     margin-bottom: 1em;
  1056. }
  1057.  
  1058. .request-filesystem-credentials-form legend {
  1059.     padding-bottom: 0;
  1060. }
  1061.  
  1062. .request-filesystem-credentials-form #ssh-keys legend {
  1063.     font-size: 1.3em;
  1064. }
  1065.  
  1066. .request-filesystem-credentials-form .notice {
  1067.     margin: 0 0 20px 0;
  1068.     clear: both;
  1069. }
  1070.  
  1071.  
  1072. /* =Media Queries
  1073. -------------------------------------------------------------- */
  1074.  
  1075. @media screen and ( max-width: 782px ) {
  1076.     /* Input Elements */
  1077.     textarea {
  1078.         -webkit-appearance: none;
  1079.     }
  1080.  
  1081.     input[type="text"],
  1082.     input[type="email"],
  1083.     input[type="search"],
  1084.     input[type="password"],
  1085.     input[type="number"] {
  1086.         -webkit-appearance: none;
  1087.         padding: 6px 10px;
  1088.     }
  1089.  
  1090.     input[type="number"] {
  1091.         height: 40px;
  1092.     }
  1093.  
  1094.     input.code {
  1095.         padding-bottom: 5px;
  1096.         padding-top: 10px;
  1097.     }
  1098.  
  1099.     input[type="checkbox"],
  1100.     .widefat th input[type="checkbox"],
  1101.     .widefat thead td input[type="checkbox"],
  1102.     .widefat tfoot td input[type="checkbox"] {
  1103.         -webkit-appearance: none;
  1104.         padding: 10px;
  1105.     }
  1106.  
  1107.     .widefat th input[type="checkbox"],
  1108.     .widefat thead td input[type="checkbox"],
  1109.     .widefat tfoot td input[type="checkbox"] {
  1110.         margin-bottom: 8px;
  1111.     }
  1112.  
  1113.     input[type="checkbox"]:checked:before,
  1114.     .widefat th input[type="checkbox"]:before,
  1115.     .widefat thead td input[type="checkbox"]:before,
  1116.     .widefat tfoot td input[type="checkbox"]:before {
  1117.         font: normal 30px/1 dashicons;
  1118.         margin: -3px -5px;
  1119.     }
  1120.  
  1121.     input[type="radio"],
  1122.     input[type="checkbox"] {
  1123.         height: 25px;
  1124.         width: 25px;
  1125.     }
  1126.  
  1127.     .wp-admin p input[type="checkbox"],
  1128.     .wp-admin p input[type="radio"] {
  1129.         margin-top: -3px;
  1130.     }
  1131.  
  1132.     input[type="radio"]:checked:before {
  1133.         vertical-align: middle;
  1134.         width: 9px;
  1135.         height: 9px;
  1136.         margin: 7px;
  1137.         line-height: 16px;
  1138.     }
  1139.  
  1140.     .wp-upload-form input[type="submit"] {
  1141.         margin-top: 10px;
  1142.     }
  1143.  
  1144.     #wpbody select {
  1145.         height: 36px;
  1146.         font-size: 16px;
  1147.     }
  1148.  
  1149.     .wp-admin .button-cancel {
  1150.         padding: 0;
  1151.         font-size: 14px;
  1152.     }
  1153.  
  1154.     #adduser .form-field input,
  1155.     #createuser .form-field input {
  1156.         width: 100%;
  1157.     }
  1158.  
  1159.     .form-table {
  1160.         box-sizing: border-box;
  1161.     }
  1162.  
  1163.     .form-table th,
  1164.     .form-table td,
  1165.     .label-responsive {
  1166.         display: block;
  1167.         width: auto;
  1168.         vertical-align: middle;
  1169.     }
  1170.  
  1171.     .label-responsive {
  1172.         margin: 0.5em 0;
  1173.     }
  1174.  
  1175.     .export-filters li {
  1176.         margin-bottom: 0;
  1177.     }
  1178.  
  1179.     .form-table .color-palette td {
  1180.         display: table-cell;
  1181.         width: 15px;
  1182.     }
  1183.  
  1184.     .form-table table.color-palette {
  1185.         margin-left: 10px;
  1186.     }
  1187.  
  1188.     textarea,
  1189.     input {
  1190.         font-size: 16px;
  1191.     }
  1192.  
  1193.     .form-table td input[type="text"],
  1194.     .form-table td input[type="email"],
  1195.     .form-table td input[type="password"],
  1196.     .form-table td select,
  1197.     .form-table td textarea,
  1198.     .form-table span.description,
  1199.     #profile-page .form-table textarea {
  1200.         width: 100%;
  1201.         font-size: 16px;
  1202.         line-height: 1.5;
  1203.         padding: 7px 10px;
  1204.         display: block;
  1205.         max-width: none;
  1206.         box-sizing: border-box;
  1207.     }
  1208.  
  1209.     .form-table .form-required.form-invalid td:after {
  1210.         float: left;
  1211.         margin: -30px 0 0 3px;
  1212.     }
  1213.  
  1214.     #wpbody .form-table td select {
  1215.         height: 40px;
  1216.     }
  1217.  
  1218.     input[type="text"].small-text,
  1219.     input[type="search"].small-text,
  1220.     input[type="password"].small-text,
  1221.     input[type="number"].small-text,
  1222.     input[type="number"].small-text,
  1223.     .form-table input[type="text"].small-text {
  1224.         width: auto;
  1225.         max-width: 4.375em; /* 70px, enough for 4 digits to fit comfortably */
  1226.         display: inline;
  1227.         padding: 3px 6px;
  1228.         margin: 0 3px;
  1229.     }
  1230.  
  1231.     #pass-strength-result {
  1232.         width: 100%;
  1233.         box-sizing: border-box;
  1234.         padding: 8px;
  1235.     }
  1236.  
  1237.     p.search-box {
  1238.         float: none;
  1239.         position: absolute;
  1240.         bottom: 0;
  1241.         width: 98%;
  1242.         height: 90px;
  1243.         margin-bottom: 20px;
  1244.     }
  1245.  
  1246.     p.search-box input[name="s"] {
  1247.         height: auto;
  1248.         float: none;
  1249.         width: 100%;
  1250.         margin-bottom: 10px;
  1251.         vertical-align: middle;
  1252.         -webkit-appearance: none;
  1253.     }
  1254.  
  1255.     p.search-box input[type="submit"] {
  1256.         margin-bottom: 10px;
  1257.     }
  1258.  
  1259.     .form-table span.description {
  1260.         display: inline;
  1261.         padding: 4px 0 0;
  1262.         line-height: 1.4em;
  1263.         font-size: 14px;
  1264.     }
  1265.  
  1266.     .form-table th {
  1267.         padding-top: 10px;
  1268.         padding-bottom: 0;
  1269.         border-bottom: 0;
  1270.     }
  1271.  
  1272.     .form-table td {
  1273.         margin-bottom: 0;
  1274.         padding-bottom: 6px;
  1275.         padding-top: 4px;
  1276.         padding-right: 0;
  1277.     }
  1278.  
  1279.     .form-table.permalink-structure td code {
  1280.         margin-right: 32px;
  1281.     }
  1282.  
  1283.     .form-table.permalink-structure td input[type="text"] {
  1284.         margin-right: 32px;
  1285.         margin-top: 4px;
  1286.         width: 96%;
  1287.     }
  1288.  
  1289.     .form-table input.regular-text {
  1290.         width: 100%;
  1291.     }
  1292.  
  1293.     .form-table label {
  1294.         font-size: 14px;
  1295.     }
  1296.  
  1297.     .form-table fieldset label {
  1298.         display: block;
  1299.     }
  1300.  
  1301.     #utc-time,
  1302.     #local-time {
  1303.         display: block;
  1304.         float: none;
  1305.         margin-top: 0.5em;
  1306.     }
  1307.  
  1308.     .form-field #domain {
  1309.         max-width: none;
  1310.     }
  1311.  
  1312.     /* New Password */
  1313.     .wp-pwd {
  1314.         position: relative;
  1315.     }
  1316.  
  1317.     .wp-pwd [type="text"],
  1318.     .wp-pwd [type="password"] {
  1319.         padding-left: 40px;
  1320.     }
  1321.  
  1322.     .wp-pwd button.button {
  1323.         background: transparent;
  1324.         border: none;
  1325.         box-shadow: none;
  1326.         line-height: 2;
  1327.         margin: 0;
  1328.         padding: 5px 10px;
  1329.         position: absolute;
  1330.         left: 0;
  1331.         top: 0;
  1332.     }
  1333.  
  1334.     .wp-pwd button.button:hover,
  1335.     .wp-pwd button.button:focus,
  1336.     .wp-pwd button.button:active {
  1337.         background: transparent;
  1338.     }
  1339.  
  1340.     .wp-pwd .button .text {
  1341.         display: none;
  1342.     }
  1343.  
  1344.     .options-general-php input[type="text"].small-text {
  1345.         max-width: 6.25em;
  1346.         margin: 0;
  1347.     }
  1348. }
  1349.  
  1350. @media only screen and (max-width: 768px) {
  1351.     .form-field input[type="text"],
  1352.     .form-field input[type="email"],
  1353.     .form-field input[type="password"],
  1354.     .form-field select,
  1355.     .form-field textarea {
  1356.         width: 99%;
  1357.     }
  1358.  
  1359.     .form-wrap .form-field {
  1360.         padding:0;
  1361.     }
  1362.  
  1363.     /* users */
  1364.     #profile-page .form-table textarea {
  1365.         max-width: 400px;
  1366.         width: auto;
  1367.     }
  1368. }
  1369.  
  1370. @media only screen and (max-height: 480px), screen and (max-width: 450px) {
  1371.     /*  Request Credentials / File Editor Warning */
  1372.     .request-filesystem-credentials-dialog .notification-dialog,
  1373.     .file-editor-warning .notification-dialog {
  1374.         width: 100%;
  1375.         height: 100%;
  1376.         max-height: 100%;
  1377.         position: fixed;
  1378.         top: 0;
  1379.         margin: 0;
  1380.         right: 0;
  1381.     }
  1382. }
  1383.  
  1384. /* Smartphone */
  1385. @media screen and (max-width: 600px) {
  1386.     /* Color Picker Options */
  1387.     .color-option {
  1388.         width: 49%;
  1389.     }
  1390. }
  1391.  
  1392. @media only screen and (max-width: 320px) {
  1393.     .options-general-php .date-time-text.date-time-custom-text {
  1394.         min-width: 0;
  1395.         margin-left: 0.5em;
  1396.     }
  1397. }
  1398.