forms-rtl.css 28 KB

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