dashboard.css 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383
  1. #wpbody-content #dashboard-widgets.columns-1 .postbox-container {
  2. width: 100%;
  3. }
  4. #wpbody-content #dashboard-widgets.columns-2 .postbox-container {
  5. width: 49.5%;
  6. }
  7. #wpbody-content #dashboard-widgets.columns-2 #postbox-container-2,
  8. #wpbody-content #dashboard-widgets.columns-2 #postbox-container-3,
  9. #wpbody-content #dashboard-widgets.columns-2 #postbox-container-4 {
  10. float: right;
  11. width: 50.5%;
  12. }
  13. #wpbody-content #dashboard-widgets.columns-3 .postbox-container {
  14. width: 33.5%;
  15. }
  16. #wpbody-content #dashboard-widgets.columns-3 #postbox-container-1 {
  17. width: 33%;
  18. }
  19. #wpbody-content #dashboard-widgets.columns-3 #postbox-container-3,
  20. #wpbody-content #dashboard-widgets.columns-3 #postbox-container-4 {
  21. float: right;
  22. }
  23. #wpbody-content #dashboard-widgets.columns-4 .postbox-container {
  24. width: 25%;
  25. }
  26. #dashboard-widgets .postbox-container {
  27. width: 25%;
  28. }
  29. #dashboard-widgets-wrap .columns-3 #postbox-container-4 .empty-container {
  30. border: none !important;
  31. }
  32. .ie8 #wpbody-content #dashboard-widgets .postbox-container {
  33. width: 49.5%;
  34. }
  35. .ie8 #wpbody-content #dashboard-widgets #postbox-container-2,
  36. .ie8 #wpbody-content #dashboard-widgets #postbox-container-3,
  37. .ie8 #wpbody-content #dashboard-widgets #postbox-container-4 {
  38. float: right;
  39. width: 50.5%;
  40. }
  41. .ie8 #dashboard-widgets #postbox-container-3 .empty-container,
  42. .ie8 #dashboard-widgets #postbox-container-4 .empty-container {
  43. border: 0 none;
  44. height: 0;
  45. min-height: 0;
  46. }
  47. #dashboard-widgets-wrap {
  48. overflow: hidden;
  49. margin: 0 -8px;
  50. }
  51. #dashboard-widgets .postbox .inside {
  52. margin-bottom: 0;
  53. }
  54. #dashboard-widgets .meta-box-sortables {
  55. margin: 0 8px;
  56. min-height: 100px;
  57. }
  58. /* @todo: this was originally in this section, but likely belongs elsewhere */
  59. #the-comment-list td.comment p.comment-author {
  60. margin-top: 0;
  61. margin-left: 0;
  62. }
  63. #the-comment-list p.comment-author img {
  64. float: left;
  65. margin-right: 8px;
  66. }
  67. #the-comment-list p.comment-author strong a {
  68. border: none;
  69. }
  70. #the-comment-list td {
  71. vertical-align: top;
  72. }
  73. #the-comment-list td.comment {
  74. word-wrap: break-word;
  75. }
  76. #the-comment-list td.comment img {
  77. max-width: 100%;
  78. }
  79. /* Welcome Panel */
  80. .welcome-panel,
  81. .try-gutenberg-panel {
  82. position: relative;
  83. overflow: auto;
  84. margin: 16px 0;
  85. padding: 23px 10px 0;
  86. border: 1px solid #e5e5e5;
  87. box-shadow: 0 1px 1px rgba(0,0,0,0.04);
  88. background: #fff;
  89. font-size: 13px;
  90. line-height: 2.1em;
  91. }
  92. .welcome-panel h2,
  93. .try-gutenberg-panel h2 {
  94. margin: 0;
  95. font-size: 21px;
  96. font-weight: 400;
  97. line-height: 1.2;
  98. }
  99. .welcome-panel h3 {
  100. margin: 1.33em 0 0;
  101. font-size: 16px;
  102. }
  103. .try-gutenberg-panel h3 {
  104. margin: 17px 0 0;
  105. font-size: 16px;
  106. line-height: 1.4;
  107. }
  108. .welcome-panel li,
  109. .try-gutenberg-panel li {
  110. font-size: 14px;
  111. }
  112. .welcome-panel p,
  113. .try-gutenberg-panel p {
  114. color: #72777c;
  115. }
  116. .welcome-panel a,
  117. .try-gutenberg-action a {
  118. text-decoration: none;
  119. }
  120. .welcome-panel .about-description,
  121. .try-gutenberg-panel .about-description {
  122. font-size: 16px;
  123. margin: 0;
  124. }
  125. .try-gutenberg-panel-content hr {
  126. margin: 20px -23px 0 -23px;
  127. border-top: 1px solid #f3f4f5;
  128. border-bottom: none;
  129. }
  130. .welcome-panel .welcome-panel-close,
  131. .try-gutenberg-panel .try-gutenberg-panel-close {
  132. position: absolute;
  133. z-index: 10;
  134. top: 10px;
  135. right: 10px;
  136. padding: 10px 15px 10px 21px;
  137. font-size: 13px;
  138. line-height: 1.23076923; /* Chrome rounding, needs to be 16px equivalent */
  139. text-decoration: none;
  140. }
  141. .welcome-panel .welcome-panel-close:before,
  142. .try-gutenberg-panel .try-gutenberg-panel-close:before {
  143. position: absolute;
  144. top: 8px;
  145. left: 0;
  146. transition: all .1s ease-in-out;
  147. }
  148. .wp-core-ui .welcome-panel .button.button-hero {
  149. margin: 15px 13px 3px 0;
  150. padding: 12px 36px;
  151. height: auto;
  152. line-height: 1.4285714;
  153. white-space: normal;
  154. }
  155. .welcome-panel-content,
  156. .try-gutenberg-panel-content {
  157. margin: 0 13px;
  158. max-width: 1500px;
  159. }
  160. .try-gutenberg-panel img {
  161. margin-top: 23px;
  162. width: calc( 100% - 40px );
  163. border: 1px solid #f3f4f5;
  164. }
  165. .try-gutenberg-panel .install-now.updating-message:before,
  166. .try-gutenberg-panel .install-now.updated-message:before {
  167. margin-top: 11px;
  168. }
  169. .welcome-panel .welcome-panel-column-container {
  170. clear: both;
  171. position: relative;
  172. }
  173. .welcome-panel .welcome-panel-column {
  174. width: 32%;
  175. min-width: 200px;
  176. float: left;
  177. }
  178. .try-gutenberg-panel .try-gutenberg-panel-column > * {
  179. padding-right: 40px;
  180. }
  181. .ie8 .welcome-panel .welcome-panel-column {
  182. min-width: 230px;
  183. }
  184. .welcome-panel .welcome-panel-column:first-child {
  185. width: 36%;
  186. }
  187. .try-gutenberg-panel .try-gutenberg-panel-column-container {
  188. display: -ms-grid;
  189. display: grid;
  190. -ms-grid-columns: 36% 32% 32%;
  191. grid-template-columns: 36% 32% 32%;
  192. margin-bottom: 13px;
  193. }
  194. .try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) {
  195. display: -ms-grid;
  196. display: grid;
  197. -ms-grid-rows: auto 100px;
  198. grid-template-rows: auto 100px;
  199. }
  200. .welcome-panel-column p.hide-if-no-customize {
  201. margin-top: 10px;
  202. }
  203. .welcome-panel-column p,
  204. .try-gutenberg-panel-column p {
  205. margin-top: 7px;
  206. color: #444;
  207. }
  208. .welcome-panel .welcome-widgets-menus {
  209. line-height: 16px;
  210. }
  211. .welcome-panel .welcome-panel-column ul {
  212. margin: 0.8em 1em 1em 0;
  213. }
  214. .welcome-panel .welcome-panel-column li {
  215. line-height: 16px;
  216. list-style-type: none;
  217. padding: 0 0 8px;
  218. }
  219. .welcome-panel .welcome-icon {
  220. background: transparent !important;
  221. }
  222. /* Welcome Panel and Right Now common Icons style */
  223. .welcome-panel .welcome-icon:before,
  224. #dashboard_right_now li a:before,
  225. #dashboard_right_now li span:before {
  226. color: #82878c;
  227. font: normal 20px/1 dashicons;
  228. speak: none;
  229. display: inline-block;
  230. padding: 0 10px 0 0;
  231. position: relative;
  232. -webkit-font-smoothing: antialiased;
  233. -moz-osx-font-smoothing: grayscale;
  234. text-decoration: none !important;
  235. vertical-align: top;
  236. }
  237. /* Welcome Panel specific Icons styles */
  238. .welcome-panel .welcome-write-blog:before,
  239. .welcome-panel .welcome-edit-page:before {
  240. content: "\f119";
  241. top: -3px;
  242. }
  243. .welcome-panel .welcome-add-page:before {
  244. content: "\f132";
  245. top: -1px;
  246. }
  247. .welcome-panel .welcome-view-site:before {
  248. content: "\f115";
  249. top: -2px;
  250. }
  251. .welcome-panel .welcome-widgets-menus:before {
  252. content: "\f116";
  253. top: -2px;
  254. }
  255. .welcome-panel .welcome-comments:before {
  256. content: "\f117";
  257. top: -1px;
  258. }
  259. .welcome-panel .welcome-learn-more:before {
  260. content: "\f118";
  261. top: -1px;
  262. }
  263. /* Right Now specific Icons styles */
  264. #dashboard_right_now li a:before,
  265. #dashboard_right_now li > span:before { /* get only the first level span to exclude screen-reader-text in mu-storage */
  266. content: "\f159"; /* generic icon for items added by CPTs ? */
  267. padding: 0 5px 0 0;
  268. }
  269. #dashboard_right_now .page-count a:before,
  270. #dashboard_right_now .page-count span:before {
  271. content: "\f105";
  272. }
  273. #dashboard_right_now .post-count a:before,
  274. #dashboard_right_now .post-count span:before {
  275. content: "\f109";
  276. }
  277. #dashboard_right_now .comment-count a:before {
  278. content: "\f101";
  279. }
  280. #dashboard_right_now .comment-mod-count a:before {
  281. content: "\f125";
  282. }
  283. #dashboard_right_now .storage-count a:before {
  284. content: "\f104";
  285. }
  286. #dashboard_right_now .storage-count.warning a:before {
  287. content: "\f153";
  288. }
  289. /* Dashboard WordPress events */
  290. .community-events-errors {
  291. margin: 0;
  292. }
  293. .community-events-loading {
  294. padding: 10px 12px 8px;
  295. }
  296. .community-events {
  297. margin-bottom: 6px;
  298. padding: 0 12px;
  299. }
  300. .community-events .spinner {
  301. float: none;
  302. margin: 5px 2px 0;
  303. vertical-align: top;
  304. }
  305. .community-events-errors[aria-hidden="true"],
  306. .community-events-errors [aria-hidden="true"],
  307. .community-events-loading[aria-hidden="true"],
  308. .community-events[aria-hidden="true"],
  309. .community-events [aria-hidden="true"] {
  310. display: none;
  311. }
  312. .community-events .activity-block:first-child,
  313. .community-events h2 {
  314. padding-top: 12px;
  315. padding-bottom: 10px;
  316. }
  317. .community-events-form {
  318. margin: 15px 0 5px;
  319. }
  320. .community-events-form .regular-text {
  321. width: 40%;
  322. height: 29px;
  323. margin: 0;
  324. vertical-align: top;
  325. }
  326. .community-events li.event-none {
  327. border-left: 4px solid #00a0d2;
  328. }
  329. .community-events-form label {
  330. display: inline-block;
  331. vertical-align: top;
  332. line-height: 28px;
  333. height: 28px;
  334. }
  335. .community-events .activity-block > p {
  336. margin-bottom: 0;
  337. display: inline;
  338. }
  339. .community-events-toggle-location {
  340. vertical-align: middle;
  341. }
  342. #community-events-submit {
  343. margin-left: 3px;
  344. margin-right: 3px;
  345. }
  346. /* Needs higher specificity than #dashboard-widgets .button-link */
  347. #dashboard-widgets .community-events-cancel.button-link {
  348. vertical-align: top;
  349. /* Same properties as the submit button for cross-browsers alignment. */
  350. line-height: 26px;
  351. height: 28px;
  352. text-decoration: underline;
  353. }
  354. .community-events ul {
  355. background-color: #fafafa;
  356. padding-left: 0;
  357. padding-right: 0;
  358. padding-bottom: 0;
  359. }
  360. .community-events li {
  361. margin: 0;
  362. padding: 8px 12px;
  363. color: #72777c;
  364. }
  365. .community-events li:first-child {
  366. border-top: 1px solid #eee;
  367. }
  368. .community-events li ~ li {
  369. border-top: 1px solid #eee;
  370. }
  371. .community-events .activity-block.last {
  372. border-bottom: 1px solid #eee;
  373. padding-top: 0;
  374. margin-top: -1px;
  375. }
  376. .community-events .event-info {
  377. display: block;
  378. }
  379. .event-icon {
  380. height: 18px;
  381. padding-right: 10px;
  382. width: 18px;
  383. display: none; /* Hide on smaller screens */
  384. }
  385. .event-icon:before {
  386. color: #82878C;
  387. font-size: 18px;
  388. }
  389. .event-meetup .event-icon:before {
  390. content: "\f484";
  391. }
  392. .event-wordcamp .event-icon:before {
  393. content: "\f486";
  394. }
  395. .community-events .event-title {
  396. font-weight: 600;
  397. display: block;
  398. }
  399. .community-events .event-date,
  400. .community-events .event-time {
  401. display: block;
  402. }
  403. .community-events-footer {
  404. margin-top: 0;
  405. margin-bottom: 0;
  406. padding: 12px;
  407. border-top: 1px solid #eee;
  408. color: #ddd;
  409. }
  410. /* Safari 10 + VoiceOver specific: without this, the hidden text gets read out before the link. */
  411. .community-events-footer .screen-reader-text {
  412. height: inherit;
  413. white-space: nowrap;
  414. }
  415. /* Dashboard WordPress news */
  416. #dashboard_primary .inside {
  417. margin: 0;
  418. padding: 0;
  419. }
  420. #dashboard_primary .widget-loading {
  421. padding: 12px 12px 0;
  422. margin-bottom: 1em !important; /* Needs to override `.postbox .inside > p:last-child` in common.css */
  423. }
  424. /* Notice when JS is off. */
  425. #dashboard_primary .inside .notice {
  426. margin: 0;
  427. }
  428. body #dashboard-widgets .postbox form .submit {
  429. margin: 0;
  430. }
  431. /* Used only for configurable widgets. */
  432. .dashboard-widget-control-form p {
  433. margin-top: 0;
  434. }
  435. .rssSummary {
  436. color: #72777c;
  437. margin-top: 4px;
  438. }
  439. #dashboard_primary .rss-widget {
  440. font-size: 13px;
  441. padding: 0 12px 0;
  442. }
  443. #dashboard_primary .rss-widget:last-child {
  444. border-bottom: none;
  445. padding-bottom: 8px;
  446. }
  447. #dashboard_primary .rss-widget a {
  448. font-weight: 400;
  449. }
  450. #dashboard_primary .rss-widget span,
  451. #dashboard_primary .rss-widget span.rss-date {
  452. color: #72777c;
  453. }
  454. #dashboard_primary .rss-widget span.rss-date {
  455. margin-left: 12px;
  456. }
  457. #dashboard_primary .rss-widget ul li {
  458. padding: 4px 0;
  459. margin: 0;
  460. }
  461. /* Dashboard right now */
  462. #dashboard_right_now ul {
  463. margin: 0;
  464. /* contain floats but don't use overflow: hidden */
  465. display: inline-block;
  466. width: 100%;
  467. }
  468. #dashboard_right_now li {
  469. width: 50%;
  470. float: left;
  471. margin-bottom: 10px;
  472. }
  473. #dashboard_right_now .inside {
  474. padding: 0;
  475. }
  476. #dashboard_right_now .main {
  477. padding: 0 12px 11px;
  478. }
  479. #dashboard_right_now .main p {
  480. margin: 0;
  481. }
  482. #dashboard_right_now #wp-version-message .button {
  483. float: right;
  484. position: relative;
  485. top: -5px;
  486. margin-left: 5px;
  487. }
  488. .mu-storage {
  489. overflow: hidden;
  490. }
  491. #dashboard-widgets h3.mu-storage {
  492. margin: 0 0 10px;
  493. padding: 0;
  494. font-size: 14px;
  495. font-weight: 400;
  496. }
  497. /* Dashboard right now - Colors */
  498. #dashboard_right_now .sub {
  499. color: #555d66;
  500. background: #f5f5f5;
  501. border-top: 1px solid #eee;
  502. padding: 10px 12px 6px 12px;
  503. }
  504. #dashboard_right_now .sub h3 {
  505. color: #555;
  506. }
  507. #dashboard_right_now .sub p {
  508. margin: 0 0 1em;
  509. }
  510. #dashboard_right_now .warning a:before,
  511. #dashboard_right_now .warning span:before {
  512. color: #d54e21;
  513. }
  514. /* Dashboard Quick Draft */
  515. #dashboard_quick_press .inside {
  516. margin: 0;
  517. padding: 0;
  518. }
  519. #dashboard_quick_press div.updated {
  520. margin-bottom: 10px;
  521. border: 1px solid #eee;
  522. border-width: 1px 1px 1px 0;
  523. }
  524. #dashboard_quick_press form {
  525. margin: 12px;
  526. }
  527. #dashboard_quick_press .drafts,
  528. #dashboard_quick_press .easy-blogging {
  529. padding: 10px 0 0;
  530. }
  531. /* Dashboard Quick Draft - Form styling */
  532. input#save-post {
  533. float: left;
  534. }
  535. form.initial-form.quickpress-open label.prompt {
  536. font-style: normal;
  537. }
  538. form.initial-form.quickpress-open input#title {
  539. height: auto;
  540. }
  541. #dashboard_quick_press input,
  542. #dashboard_quick_press textarea {
  543. box-sizing: border-box;
  544. margin: 0;
  545. }
  546. #dashboard_quick_press textarea {
  547. resize: vertical;
  548. }
  549. #dashboard-widgets .postbox form .submit {
  550. margin: -39px 0;
  551. float: right;
  552. }
  553. #description-wrap {
  554. margin-top: 12px;
  555. }
  556. #title-wrap #title-prompt-text,
  557. .textarea-wrap #content-prompt-text {
  558. color: #72777c;
  559. }
  560. #title-wrap #title-prompt-text {
  561. font-size: 1.1em;
  562. padding: 7px 8px;
  563. }
  564. .input-text-wrap,
  565. .textarea-wrap {
  566. position: relative;
  567. }
  568. .input-text-wrap .prompt,
  569. .textarea-wrap .prompt {
  570. position: absolute;
  571. }
  572. .textarea-wrap #content-prompt-text {
  573. font-size: 1.1em;
  574. padding: 7px 8px;
  575. }
  576. .textarea-wrap textarea#content {
  577. margin: 0 0 8px;
  578. padding: 6px 7px;
  579. }
  580. #quick-press textarea#content {
  581. min-height: 90px;
  582. max-height: 1300px;
  583. resize: none;
  584. }
  585. /* Dashboard Quick Draft - Drafts list */
  586. .js #dashboard_quick_press .drafts {
  587. border-top: 1px solid #eee;
  588. }
  589. #dashboard_quick_press .drafts abbr {
  590. border: none;
  591. }
  592. #dashboard_quick_press .drafts .view-all {
  593. float: right;
  594. margin: 0 12px 0 0;
  595. }
  596. #dashboard_primary a.rsswidget {
  597. font-weight: 400;
  598. }
  599. #dashboard_quick_press .drafts ul {
  600. margin: 0 12px;
  601. }
  602. #dashboard_quick_press .drafts li {
  603. margin-bottom: 1em;
  604. }
  605. #dashboard_quick_press .drafts li time {
  606. color: #72777c;
  607. }
  608. #dashboard_quick_press .drafts p {
  609. margin: 0;
  610. word-wrap: break-word;
  611. }
  612. #dashboard_quick_press .draft-title {
  613. word-wrap: break-word;
  614. }
  615. #dashboard_quick_press .draft-title a,
  616. #dashboard_quick_press .draft-title time {
  617. margin: 0 5px 0 0;
  618. }
  619. /* Dashboard common styles */
  620. #dashboard-widgets h4, /* Back-compat for pre-4.4 */
  621. #dashboard-widgets h3,
  622. #dashboard_quick_press .drafts h2 {
  623. margin: 0 12px 8px;
  624. padding: 0;
  625. font-size: 14px;
  626. font-weight: 400;
  627. color: #23282d;
  628. }
  629. #dashboard_quick_press .drafts h2 {
  630. line-height: inherit;
  631. }
  632. #dashboard-widgets .inside h4, /* Back-compat for pre-4.4 */
  633. #dashboard-widgets .inside h3 {
  634. margin-left: 0;
  635. margin-right: 0;
  636. }
  637. /* Dashboard activity widget */
  638. #dashboard_activity .comment-meta span.approve:before {
  639. content: "\f227";
  640. font: 20px/.5 dashicons;
  641. margin-left: 5px;
  642. vertical-align: middle;
  643. position: relative;
  644. top: -1px;
  645. margin-right: 2px;
  646. }
  647. #dashboard_activity .inside {
  648. margin: 0;
  649. padding-bottom: 0;
  650. }
  651. #dashboard_activity .no-activity {
  652. overflow: hidden;
  653. padding: 0 0 12px;
  654. text-align: center;
  655. }
  656. #dashboard_activity .no-activity p {
  657. color: #72777c;
  658. font-size: 16px;
  659. }
  660. #dashboard_activity .no-activity .smiley {
  661. margin-top: 0;
  662. }
  663. #dashboard_activity .no-activity .smiley:before {
  664. content: "\f328";
  665. font: normal 120px/1 dashicons;
  666. speak: none;
  667. display: block;
  668. margin: 0 5px 0 0;
  669. padding: 0;
  670. text-indent: 0;
  671. text-align: center;
  672. position: relative;
  673. -webkit-font-smoothing: antialiased;
  674. text-decoration: none !important;
  675. }
  676. #dashboard_activity .subsubsub {
  677. float: none;
  678. border-top: 1px solid #eee;
  679. margin: 0 -12px;
  680. padding: 8px 12px 4px;
  681. }
  682. #dashboard_activity .subsubsub a .count,
  683. #dashboard_activity .subsubsub a.current .count {
  684. color: #72777c; /* white background on the dashboard but #f1f1f1 on list tables */
  685. }
  686. #future-posts ul,
  687. #published-posts ul {
  688. clear: both;
  689. margin-bottom: 0;
  690. }
  691. #future-posts li,
  692. #published-posts li {
  693. margin-bottom: 8px;
  694. }
  695. #future-posts ul span,
  696. #published-posts ul span {
  697. display: inline-block;
  698. margin-right: 5px;
  699. min-width: 150px;
  700. color: #72777c;
  701. }
  702. .activity-block {
  703. border-bottom: 1px solid #eee;
  704. margin: 0 -12px;
  705. padding: 8px 12px 4px;
  706. }
  707. .activity-block:last-child {
  708. border-bottom: none;
  709. }
  710. .activity-block .subsubsub li {
  711. color: #ddd;
  712. }
  713. /* Dashboard activity widget - Comments */
  714. /* @todo: needs serious de-duplication */
  715. #activity-widget #the-comment-list tr.undo,
  716. #activity-widget #the-comment-list div.undo {
  717. background: none;
  718. padding: 6px 0;
  719. margin-left: 12px;
  720. }
  721. #activity-widget #the-comment-list .comment-item {
  722. background: #fafafa;
  723. padding: 12px;
  724. position: relative;
  725. }
  726. #activity-widget #the-comment-list .avatar {
  727. position: absolute;
  728. top: 12px;
  729. }
  730. #activity-widget #the-comment-list .dashboard-comment-wrap {
  731. padding-left: 63px;
  732. }
  733. #activity-widget #the-comment-list .dashboard-comment-wrap blockquote {
  734. margin: 1em 0;
  735. }
  736. #activity-widget #the-comment-list .comment-item p.row-actions {
  737. margin: 4px 0 0 0;
  738. }
  739. #activity-widget #the-comment-list .comment-item:first-child {
  740. border-top: 1px solid #eeeeee;
  741. }
  742. #activity-widget #the-comment-list .unapproved {
  743. background-color: #fef7f1;
  744. }
  745. #activity-widget #the-comment-list .unapproved:before {
  746. content: "";
  747. display: block;
  748. position: absolute;
  749. left: 0;
  750. top: 0;
  751. bottom: 0;
  752. background: #d54e21;
  753. width: 4px;
  754. }
  755. #activity-widget #the-comment-list .spam-undo-inside .avatar,
  756. #activity-widget #the-comment-list .trash-undo-inside .avatar {
  757. position: relative;
  758. top: 0;
  759. }
  760. /* Browse happy box */
  761. #dashboard-widgets #dashboard_browser_nag.postbox .inside {
  762. margin: 10px;
  763. }
  764. .postbox .button-link .edit-box {
  765. display: none;
  766. }
  767. .edit-box {
  768. opacity: 0;
  769. }
  770. .hndle:hover .edit-box,
  771. .edit-box:focus {
  772. opacity: 1;
  773. }
  774. #dashboard-widgets form .input-text-wrap input {
  775. width: 100%;
  776. }
  777. #dashboard-widgets form .textarea-wrap textarea {
  778. width: 100%;
  779. }
  780. #dashboard-widgets .postbox form .submit {
  781. float: none;
  782. margin: .5em 0 0;
  783. padding: 0;
  784. border: none;
  785. }
  786. #dashboard-widgets-wrap #dashboard-widgets .postbox form .submit #publish {
  787. min-width: 0;
  788. }
  789. #dashboard-widgets a,
  790. #dashboard-widgets .button-link {
  791. text-decoration: none;
  792. }
  793. #dashboard-widgets h2 a {
  794. text-decoration: underline;
  795. }
  796. #dashboard-widgets .hndle .postbox-title-action {
  797. float: right;
  798. line-height: 1.2;
  799. }
  800. #dashboard_plugins h5 {
  801. font-size: 14px;
  802. }
  803. /* Recent Comments */
  804. #latest-comments #the-comment-list {
  805. position: relative;
  806. margin: 0 -12px;
  807. }
  808. #activity-widget #the-comment-list .comment,
  809. #activity-widget #the-comment-list .pingback {
  810. box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.06);
  811. }
  812. #activity-widget .comments #the-comment-list .alt {
  813. background-color: transparent;
  814. }
  815. #activity-widget #latest-comments #the-comment-list .comment-item {
  816. /* the row-actions paragraph is output only for users with 'edit_comment' capabilities,
  817. for other users this needs a min height equal to the gravatar image */
  818. min-height: 50px;
  819. margin: 0;
  820. padding: 12px;
  821. }
  822. #latest-comments #the-comment-list .pingback {
  823. padding-left: 12px !important;
  824. }
  825. #latest-comments #the-comment-list .comment-item:first-child {
  826. border-top: none;
  827. }
  828. #latest-comments #the-comment-list .comment-meta {
  829. line-height: 1.5em;
  830. margin: 0;
  831. color: #666;
  832. }
  833. #latest-comments #the-comment-list .comment-meta cite {
  834. font-style: normal;
  835. font-weight: 400;
  836. }
  837. #latest-comments #the-comment-list .comment-item blockquote,
  838. #latest-comments #the-comment-list .comment-item blockquote p {
  839. margin: 0;
  840. padding: 0;
  841. display: inline;
  842. }
  843. #latest-comments #the-comment-list .comment-item p.row-actions {
  844. margin: 3px 0 0;
  845. padding: 0;
  846. font-size: 13px;
  847. }
  848. /* QuickDraft */
  849. #title-wrap label,
  850. #description-wrap label {
  851. cursor: text;
  852. }
  853. #title-wrap #title {
  854. padding: 2px 6px;
  855. font-size: 1.3em;
  856. outline: none;
  857. }
  858. #title-wrap #title-prompt-text {
  859. font-size: 1.1em;
  860. padding: 5px 8px;
  861. }
  862. /* Feeds */
  863. .rss-widget ul {
  864. margin: 0;
  865. padding: 0;
  866. list-style: none;
  867. }
  868. a.rsswidget {
  869. font-size: 13px;
  870. font-weight: 600;
  871. line-height: 1.4em;
  872. }
  873. .rss-widget ul li {
  874. line-height: 1.5em;
  875. margin-bottom: 12px;
  876. }
  877. .rss-widget span.rss-date {
  878. color: #72777c;
  879. font-size: 13px;
  880. margin-left: 3px;
  881. }
  882. .rss-widget cite {
  883. display: block;
  884. text-align: right;
  885. margin: 0 0 1em;
  886. padding: 0;
  887. }
  888. .rss-widget cite:before {
  889. content: "\2014";
  890. }
  891. .dashboard-comment-wrap {
  892. word-wrap: break-word;
  893. }
  894. /* Browser Nag */
  895. #dashboard_browser_nag a.update-browser-link {
  896. font-size: 1.2em;
  897. font-weight: 600;
  898. }
  899. #dashboard_browser_nag a {
  900. text-decoration: underline;
  901. }
  902. #dashboard_browser_nag p.browser-update-nag.has-browser-icon {
  903. padding-right: 125px;
  904. }
  905. #dashboard_browser_nag .browser-icon {
  906. margin-top: -35px;
  907. }
  908. #dashboard_browser_nag.postbox.browser-insecure {
  909. background-color: #ac1b1b;
  910. border-color: #ac1b1b;
  911. }
  912. #dashboard_browser_nag.postbox {
  913. background-color: #e29808;
  914. background-image: none;
  915. border-color: #edc048;
  916. color: #fff;
  917. box-shadow: none;
  918. }
  919. #dashboard_browser_nag.postbox.browser-insecure h2 {
  920. border-bottom-color: #cd5a5a;
  921. color: #fff;
  922. }
  923. #dashboard_browser_nag.postbox h2 {
  924. border-bottom-color: #f6e2ac;
  925. background: transparent none;
  926. color: #fff;
  927. box-shadow: none;
  928. }
  929. #dashboard_browser_nag a {
  930. color: #fff;
  931. }
  932. #dashboard_browser_nag h2.hndle {
  933. border: none;
  934. font-weight: 600;
  935. font-size: 20px;
  936. padding-top: 10px;
  937. }
  938. .postbox#dashboard_browser_nag p a.dismiss {
  939. font-size: 14px;
  940. }
  941. .postbox#dashboard_browser_nag p,
  942. .postbox#dashboard_browser_nag a,
  943. .postbox#dashboard_browser_nag p.browser-update-nag {
  944. font-size: 16px;
  945. }
  946. /* =Media Queries
  947. -------------------------------------------------------------- */
  948. /* one column on the dash */
  949. @media only screen and (max-width: 799px) {
  950. #wpbody-content #dashboard-widgets .postbox-container {
  951. width: 100%;
  952. }
  953. }
  954. /* two columns on the dash, but keep the setting if one is selected */
  955. @media only screen and (min-width: 800px) and (max-width: 1499px) {
  956. #wpbody-content #dashboard-widgets .postbox-container {
  957. width: 49.5%;
  958. }
  959. #wpbody-content #dashboard-widgets #postbox-container-2,
  960. #wpbody-content #dashboard-widgets #postbox-container-3,
  961. #wpbody-content #dashboard-widgets #postbox-container-4 {
  962. float: right;
  963. width: 50.5%;
  964. }
  965. #dashboard-widgets #postbox-container-3 .empty-container,
  966. #dashboard-widgets #postbox-container-4 .empty-container {
  967. border: 0 none;
  968. height: 0;
  969. min-height: 0;
  970. }
  971. #dashboard-widgets #postbox-container-3 .empty-container:after,
  972. #dashboard-widgets #postbox-container-4 .empty-container:after {
  973. display: none;
  974. }
  975. #wpbody #wpbody-content #dashboard-widgets.columns-1 .postbox-container {
  976. width: 100%;
  977. }
  978. #wpbody #wpbody-content .metabox-holder.columns-1 .postbox-container .empty-container {
  979. border: 0 none;
  980. height: 0;
  981. min-height: 0;
  982. }
  983. /* show the radio buttons for column prefs only for one or two columns */
  984. .index-php .screen-layout,
  985. .index-php .columns-prefs {
  986. display: block;
  987. }
  988. .columns-prefs .columns-prefs-3,
  989. .columns-prefs .columns-prefs-4 {
  990. display: none;
  991. }
  992. .metabox-holder .postbox-container .empty-container:after {
  993. display: block;
  994. }
  995. }
  996. /* three columns on the dash */
  997. @media only screen and (min-width: 1500px) and (max-width: 1800px) {
  998. #wpbody-content #dashboard-widgets .postbox-container {
  999. width: 33.5%;
  1000. }
  1001. #wpbody-content #dashboard-widgets #postbox-container-1 {
  1002. width: 33%;
  1003. }
  1004. #wpbody-content #dashboard-widgets #postbox-container-3,
  1005. #wpbody-content #dashboard-widgets #postbox-container-4 {
  1006. float: right;
  1007. }
  1008. #dashboard-widgets #postbox-container-4 .empty-container {
  1009. border: 0 none;
  1010. height: 0;
  1011. min-height: 0;
  1012. }
  1013. #dashboard-widgets #postbox-container-4 .empty-container:after {
  1014. display: none;
  1015. }
  1016. .metabox-holder .postbox-container .empty-container:after {
  1017. display: block;
  1018. }
  1019. }
  1020. @media screen and (max-width: 1024px) {
  1021. .try-gutenberg-panel .try-gutenberg-panel-column-container {
  1022. -ms-grid-columns: 50% 50%;
  1023. grid-template-columns: 50% 50%;
  1024. }
  1025. .try-gutenberg-panel .try-gutenberg-panel-image-column {
  1026. display: none;
  1027. }
  1028. }
  1029. @media screen and (max-width: 870px) {
  1030. .welcome-panel .welcome-panel-column,
  1031. .welcome-panel .welcome-panel-column:first-child {
  1032. display: block;
  1033. float: none;
  1034. width: 100%;
  1035. }
  1036. .try-gutenberg-panel .try-gutenberg-panel-column-container {
  1037. -ms-grid-columns: 100%;
  1038. grid-template-columns: 100%;
  1039. }
  1040. .welcome-panel .welcome-panel-column li {
  1041. display: inline-block;
  1042. margin-right: 13px;
  1043. }
  1044. .welcome-panel .welcome-panel-column ul {
  1045. margin: 0.4em 0 0;
  1046. }
  1047. }
  1048. @media screen and ( max-width: 782px ) {
  1049. #dashboard_recent_comments #the-comment-list .comment-item .avatar {
  1050. height: 30px;
  1051. width: 30px;
  1052. margin: 4px 10px 5px 0;
  1053. }
  1054. .community-events-toggle-location {
  1055. height: 38px;
  1056. vertical-align: baseline;
  1057. }
  1058. .community-events-form .regular-text {
  1059. height: 32px;
  1060. }
  1061. #community-events-submit {
  1062. margin-bottom: 0;
  1063. /* Override .wp-core-ui .button */
  1064. vertical-align: top;
  1065. }
  1066. .community-events-form label,
  1067. #dashboard-widgets .community-events-cancel.button-link {
  1068. /* Same properties as the submit button for cross-browsers alignment. */
  1069. font-size: 14px;
  1070. line-height: normal;
  1071. height: auto;
  1072. padding: 6px 0;
  1073. border: 1px solid transparent;
  1074. }
  1075. .community-events .spinner {
  1076. margin-top: 7px;
  1077. }
  1078. }
  1079. /* Smartphone */
  1080. @media screen and (max-width: 600px) {
  1081. /* Keep the close icon from overlapping the Welcome text. */
  1082. .welcome-panel .welcome-panel-close,
  1083. .try-gutenberg-panel .try-gutenberg-panel-close {
  1084. overflow: hidden;
  1085. text-indent: 40px;
  1086. white-space: nowrap;
  1087. width: 20px;
  1088. height: 20px;
  1089. padding: 5px;
  1090. top: 5px;
  1091. right: 5px;
  1092. }
  1093. /* Make the close icon larger for tappability. */
  1094. .welcome-panel .welcome-panel-close:before,
  1095. .try-gutenberg-panel .try-gutenberg-panel-close:before {
  1096. font-size: 20px;
  1097. top: 5px;
  1098. left: -35px;
  1099. }
  1100. }
  1101. @media screen and (min-width: 355px) {
  1102. .community-events .event-info {
  1103. display: table-row;
  1104. float: left;
  1105. max-width: 59%;
  1106. }
  1107. .event-icon,
  1108. .event-icon[aria-hidden="true"] {
  1109. display: table-cell;
  1110. }
  1111. .event-info-inner {
  1112. display: table-cell;
  1113. }
  1114. .community-events .event-date-time {
  1115. float: right;
  1116. max-width: 39%;
  1117. }
  1118. .community-events .event-date,
  1119. .community-events .event-time {
  1120. text-align: right;
  1121. }
  1122. }