diff -r 490d5cc509ed -r cf61fcea0001 wp/wp-admin/css/dashboard-rtl.css --- a/wp/wp-admin/css/dashboard-rtl.css Tue Jun 09 11:14:17 2015 +0000 +++ b/wp/wp-admin/css/dashboard-rtl.css Mon Oct 14 17:39:30 2019 +0200 @@ -56,10 +56,6 @@ min-height: 0; } -/*------------------------------------------------------------------------------ - 9.0 - Dashboard -------------------------------------------------------------------------------*/ - #dashboard-widgets-wrap { overflow: hidden; margin: 0 -8px; @@ -102,63 +98,82 @@ } /* Welcome Panel */ -.welcome-panel { +.welcome-panel, +.try-gutenberg-panel { position: relative; overflow: auto; margin: 16px 0; padding: 23px 10px 0; border: 1px solid #e5e5e5; - -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04); box-shadow: 0 1px 1px rgba(0,0,0,0.04); background: #fff; font-size: 13px; line-height: 2.1em; } -.welcome-panel h3 { +.welcome-panel h2, +.try-gutenberg-panel h2 { margin: 0; font-size: 21px; - font-weight: normal; + font-weight: 400; line-height: 1.2; } -.welcome-panel h4 { +.welcome-panel h3 { margin: 1.33em 0 0; font-size: 16px; } -.welcome-panel li { +.try-gutenberg-panel h3 { + margin: 17px 0 0; + font-size: 16px; + line-height: 1.4; +} + +.welcome-panel li, +.try-gutenberg-panel li { font-size: 14px; } -.welcome-panel p { - color: #777; +.welcome-panel p, +.try-gutenberg-panel p { + color: #72777c; } -.welcome-panel a { +.welcome-panel a, +.try-gutenberg-action a { text-decoration: none; } -.welcome-panel .about-description { +.welcome-panel .about-description, +.try-gutenberg-panel .about-description { font-size: 16px; margin: 0; } -.welcome-panel .welcome-panel-close { - position: absolute; - top: 5px; - left: 10px; - padding: 20px 3px 0 15px; - font-size: 13px; - text-decoration: none; - line-height: 1; +.try-gutenberg-panel-content hr { + margin: 20px -23px 0 -23px; + border-top: 1px solid #f3f4f5; + border-bottom: none; } -#welcome-panel.welcome-panel .welcome-panel-close:before { +.welcome-panel .welcome-panel-close, +.try-gutenberg-panel .try-gutenberg-panel-close { position: absolute; - right: -18px; - margin-top: -2px; - -webkit-transition: all .1s ease-in-out; + z-index: 10; + top: 10px; + left: 10px; + padding: 10px 21px 10px 15px; + font-size: 13px; + line-height: 1.23076923; /* Chrome rounding, needs to be 16px equivalent */ + text-decoration: none; +} + +.welcome-panel .welcome-panel-close:before, +.try-gutenberg-panel .try-gutenberg-panel-close:before { + position: absolute; + top: 8px; + right: 0; transition: all .1s ease-in-out; } @@ -170,14 +185,25 @@ white-space: normal; } -.welcome-panel-content { - margin-right: 13px; +.welcome-panel-content, +.try-gutenberg-panel-content { + margin: 0 13px; max-width: 1500px; } +.try-gutenberg-panel img { + margin-top: 23px; + width: calc( 100% - 40px ); + border: 1px solid #f3f4f5; +} + +.try-gutenberg-panel .install-now.updating-message:before, +.try-gutenberg-panel .install-now.updated-message:before { + margin-top: 11px; +} + .welcome-panel .welcome-panel-column-container { clear: both; - overflow: hidden; position: relative; } @@ -187,6 +213,10 @@ float: right; } +.try-gutenberg-panel .try-gutenberg-panel-column > * { + padding-left: 40px; +} + .ie8 .welcome-panel .welcome-panel-column { min-width: 230px; } @@ -195,28 +225,59 @@ width: 36%; } +.try-gutenberg-panel .try-gutenberg-panel-column-container { + display: -ms-grid; + display: grid; + -ms-grid-columns: 36% 32% 32%; + grid-template-columns: 36% 32% 32%; + margin-bottom: 13px; +} + +.try-gutenberg-panel .try-gutenberg-panel-column:not(.try-gutenberg-panel-image-column) { + display: -ms-grid; + display: grid; + -ms-grid-rows: auto 100px; + grid-template-rows: auto 100px; +} + .welcome-panel-column p.hide-if-no-customize { margin-top: 10px; } -.welcome-panel-column p { +.welcome-panel-column p, +.try-gutenberg-panel-column p { margin-top: 7px; - color: #464646; + color: #444; +} + +.welcome-panel .welcome-widgets-menus { + line-height: 16px; +} + +.welcome-panel .welcome-panel-column ul { + margin: 0.8em 0 1em 1em; +} + +.welcome-panel .welcome-panel-column li { + line-height: 16px; + list-style-type: none; + padding: 0 0 8px; } .welcome-panel .welcome-icon { - display: block; - padding: 0 0 8px; background: transparent !important; } -.welcome-panel .welcome-icon:before { +/* Welcome Panel and Right Now common Icons style */ + +.welcome-panel .welcome-icon:before, +#dashboard_right_now li a:before, +#dashboard_right_now li span:before { color: #82878c; - font: normal 20px/1 'dashicons'; + font: normal 20px/1 dashicons; speak: none; display: inline-block; padding: 0 0 0 10px; - top: -1px; position: relative; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; @@ -224,47 +285,223 @@ vertical-align: top; } +/* Welcome Panel specific Icons styles */ + .welcome-panel .welcome-write-blog:before, .welcome-panel .welcome-edit-page:before { - content:'\f119'; + content: "\f119"; top: -3px; } .welcome-panel .welcome-add-page:before { - content:'\f132'; + content: "\f132"; + top: -1px; } .welcome-panel .welcome-view-site:before { - content:'\f115'; + content: "\f115"; top: -2px; } .welcome-panel .welcome-widgets-menus:before { - content:'\f116'; + content: "\f116"; top: -2px; } .welcome-panel .welcome-comments:before { - content:'\f117'; + content: "\f117"; top: -1px; } .welcome-panel .welcome-learn-more:before { - content:'\f118'; + content: "\f118"; top: -1px; } -.welcome-panel .welcome-widgets-menus { - line-height: 16px; +/* Right Now specific Icons styles */ + +#dashboard_right_now li a:before, +#dashboard_right_now li > span:before { /* get only the first level span to exclude screen-reader-text in mu-storage */ + content: "\f159"; /* generic icon for items added by CPTs ? */ + padding: 0 0 0 5px; +} + +#dashboard_right_now .page-count a:before, +#dashboard_right_now .page-count span:before { + content: "\f105"; +} + +#dashboard_right_now .post-count a:before, +#dashboard_right_now .post-count span:before { + content: "\f109"; +} + +#dashboard_right_now .comment-count a:before { + content: "\f101"; +} + +#dashboard_right_now .comment-mod-count a:before { + content: "\f125"; +} + +#dashboard_right_now .storage-count a:before { + content: "\f104"; +} + +#dashboard_right_now .storage-count.warning a:before { + content: "\f153"; +} + +/* Dashboard WordPress events */ + +.community-events-errors { + margin: 0; +} + +.community-events-loading { + padding: 10px 12px 8px; +} + +.community-events { + margin-bottom: 6px; + padding: 0 12px; +} + +.community-events .spinner { + float: none; + margin: 5px 2px 0; + vertical-align: top; +} + +.community-events-errors[aria-hidden="true"], +.community-events-errors [aria-hidden="true"], +.community-events-loading[aria-hidden="true"], +.community-events[aria-hidden="true"], +.community-events [aria-hidden="true"] { + display: none; +} + +.community-events .activity-block:first-child, +.community-events h2 { + padding-top: 12px; + padding-bottom: 10px; +} + +.community-events-form { + margin: 15px 0 5px; +} + +.community-events-form .regular-text { + width: 40%; + height: 29px; + margin: 0; + vertical-align: top; +} + +.community-events li.event-none { + border-right: 4px solid #00a0d2; +} + +.community-events-form label { + display: inline-block; + vertical-align: top; + line-height: 28px; + height: 28px; } -.welcome-panel .welcome-panel-column ul { - margin: 0.8em 0 1em 1em; +.community-events .activity-block > p { + margin-bottom: 0; + display: inline; +} + +.community-events-toggle-location { + vertical-align: middle; +} + +#community-events-submit { + margin-right: 3px; + margin-left: 3px; +} + +/* Needs higher specificity than #dashboard-widgets .button-link */ +#dashboard-widgets .community-events-cancel.button-link { + vertical-align: top; + /* Same properties as the submit button for cross-browsers alignment. */ + line-height: 26px; + height: 28px; + text-decoration: underline; +} + +.community-events ul { + background-color: #fafafa; + padding-right: 0; + padding-left: 0; + padding-bottom: 0; +} + +.community-events li { + margin: 0; + padding: 8px 12px; + color: #72777c; +} +.community-events li:first-child { + border-top: 1px solid #eee; +} + +.community-events li ~ li { + border-top: 1px solid #eee; } -.welcome-panel .welcome-panel-column li { - line-height: 16px; - list-style-type: none; +.community-events .activity-block.last { + border-bottom: 1px solid #eee; + padding-top: 0; + margin-top: -1px; +} + +.community-events .event-info { + display: block; +} + +.event-icon { + height: 18px; + padding-left: 10px; + width: 18px; + display: none; /* Hide on smaller screens */ +} + +.event-icon:before { + color: #82878C; + font-size: 18px; +} +.event-meetup .event-icon:before { + content: "\f484"; +} +.event-wordcamp .event-icon:before { + content: "\f486"; +} + +.community-events .event-title { + font-weight: 600; + display: block; +} + +.community-events .event-date, +.community-events .event-time { + display: block; +} + +.community-events-footer { + margin-top: 0; + margin-bottom: 0; + padding: 12px; + border-top: 1px solid #eee; + color: #ddd; +} + +/* Safari 10 + VoiceOver specific: without this, the hidden text gets read out before the link. */ +.community-events-footer .screen-reader-text { + height: inherit; + white-space: nowrap; } /* Dashboard WordPress news */ @@ -274,32 +511,33 @@ padding: 0; } -#dashboard_primary .widget-loading, -#dashboard_primary .dashboard-widget-control-form { +#dashboard_primary .widget-loading { padding: 12px 12px 0; + margin-bottom: 1em !important; /* Needs to override `.postbox .inside > p:last-child` in common.css */ +} + +/* Notice when JS is off. */ +#dashboard_primary .inside .notice { + margin: 0; } body #dashboard-widgets .postbox form .submit { margin: 0; } -.dashboard-widget-control-form { - overflow: hidden; -} - +/* Used only for configurable widgets. */ .dashboard-widget-control-form p { margin-top: 0; } .rssSummary { - color: #777; + color: #72777c; margin-top: 4px; } #dashboard_primary .rss-widget { - border-bottom: 1px solid #eee; font-size: 13px; - padding: 8px 12px 10px; + padding: 0 12px 0; } #dashboard_primary .rss-widget:last-child { @@ -308,12 +546,12 @@ } #dashboard_primary .rss-widget a { - font-weight: normal; + font-weight: 400; } #dashboard_primary .rss-widget span, #dashboard_primary .rss-widget span.rss-date { - color: #777; + color: #72777c; } #dashboard_primary .rss-widget span.rss-date { @@ -321,14 +559,17 @@ } #dashboard_primary .rss-widget ul li { - margin-bottom: 8px; + padding: 4px 0; + margin: 0; } /* Dashboard right now */ #dashboard_right_now ul { margin: 0; - overflow: hidden; + /* contain floats but don't use overflow: hidden */ + display: inline-block; + width: 100%; } #dashboard_right_now li { @@ -338,12 +579,10 @@ } #dashboard_right_now .inside { - overflow: hidden; padding: 0; } #dashboard_right_now .main { - overflow: hidden; padding: 0 12px 11px; } @@ -362,25 +601,23 @@ overflow: hidden; } -#dashboard-widgets h4.mu-storage { - margin-bottom: 10px; +#dashboard-widgets h3.mu-storage { + margin: 0 0 10px; + padding: 0; + font-size: 14px; + font-weight: 400; } /* Dashboard right now - Colors */ -#dashboard_right_now li a:before, -#dashboard_right_now li span:before { - color: #82878c; -} - #dashboard_right_now .sub { - color: #777; + color: #555d66; background: #f5f5f5; border-top: 1px solid #eee; padding: 10px 12px 6px 12px; } -#dashboard_right_now .sub h4 { +#dashboard_right_now .sub h3 { color: #555; } @@ -393,49 +630,6 @@ color: #d54e21; } -/* Dashboard right now - Icons */ -#dashboard_right_now li a:before, -#dashboard_right_now li span:before { - content: '\f159'; - font: normal 20px/1 'dashicons'; - speak: none; - display: block; - float: right; - margin: 0 0 0 5px; - padding: 0; - text-indent: 0; - text-align: center; - position: relative; - -webkit-font-smoothing: antialiased; - text-decoration: none !important; -} - -#dashboard_right_now .page-count a:before, -#dashboard_right_now .page-count span:before { - content: '\f105'; -} - -#dashboard_right_now .post-count a:before, -#dashboard_right_now .post-count span:before { - content: '\f109'; -} - -#dashboard_right_now .comment-count a:before { - content: '\f101'; -} - -#dashboard_right_now .comment-mod-count a:before { - content: '\f125'; -} - -#dashboard_right_now .storage-count a:before { - content: '\f104'; -} - -#dashboard_right_now .storage-count.warning a:before { - content: '\f153'; -} - /* Dashboard Quick Draft */ #dashboard_quick_press .inside { @@ -450,7 +644,6 @@ } #dashboard_quick_press form { - overflow: hidden; margin: 12px; } @@ -475,8 +668,6 @@ #dashboard_quick_press input, #dashboard_quick_press textarea { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; } @@ -496,7 +687,7 @@ #title-wrap #title-prompt-text, .textarea-wrap #content-prompt-text { - color: #777; + color: #72777c; } #title-wrap #title-prompt-text { @@ -540,18 +731,13 @@ border: none; } -#dashboard_quick_press .drafts h4 { - margin: 0 12px 8px; - font-weight: normal; -} - #dashboard_quick_press .drafts .view-all { float: left; margin: 0 0 0 12px; } #dashboard_primary a.rsswidget { - font-weight: normal; + font-weight: 400; } #dashboard_quick_press .drafts ul { @@ -562,7 +748,7 @@ margin-bottom: 1em; } #dashboard_quick_press .drafts li time { - color: #777; + color: #72777c; } #dashboard_quick_press .drafts p { @@ -571,38 +757,42 @@ } #dashboard_quick_press .draft-title { - overflow: hidden; + word-wrap: break-word; } #dashboard_quick_press .draft-title a, #dashboard_quick_press .draft-title time { - float: right; margin: 0 0 0 5px; } +/* Dashboard common styles */ + +#dashboard-widgets h4, /* Back-compat for pre-4.4 */ +#dashboard-widgets h3, +#dashboard_quick_press .drafts h2 { + margin: 0 12px 8px; + padding: 0; + font-size: 14px; + font-weight: 400; + color: #23282d; +} + +#dashboard_quick_press .drafts h2 { + line-height: inherit; +} + +#dashboard-widgets .inside h4, /* Back-compat for pre-4.4 */ +#dashboard-widgets .inside h3 { + margin-right: 0; + margin-left: 0; +} + /* Dashboard activity widget */ -#dashboard-widgets #dashboard_activity h4 { - margin: 0 12px 8px 0; - font-weight: normal; -} - -#dashboard-widgets #dashboard_activity h4.comment-meta { - margin: 0; -} - -#dashboard_activity h4.comment-meta { - margin-bottom: 4px; -} - -#dashboard_activity ul { - padding: 0 12px; -} - #dashboard_activity .comment-meta span.approve:before { - content: '\f227'; - font: 20px/.5 "dashicons"; - margin-right: 12px; + content: "\f227"; + font: 20px/.5 dashicons; + margin-right: 5px; vertical-align: middle; position: relative; top: -1px; @@ -610,18 +800,18 @@ } #dashboard_activity .inside { - padding: 0; margin: 0; + padding-bottom: 0; } #dashboard_activity .no-activity { overflow: hidden; - padding: 0 12px 12px; + padding: 0 0 12px; text-align: center; } #dashboard_activity .no-activity p { - color: #999; + color: #72777c; font-size: 16px; } @@ -630,8 +820,8 @@ } #dashboard_activity .no-activity .smiley:before { - content: '\f328'; - font: normal 120px/1 'dashicons'; + content: "\f328"; + font: normal 120px/1 dashicons; speak: none; display: block; margin: 0 0 0 5px; @@ -645,11 +835,16 @@ #dashboard_activity .subsubsub { float: none; - border-top: 1px solid #eeeeee; - margin-top: 0; + border-top: 1px solid #eee; + margin: 0 -12px; padding: 8px 12px 4px; } +#dashboard_activity .subsubsub a .count, +#dashboard_activity .subsubsub a.current .count { + color: #72777c; /* white background on the dashboard but #f1f1f1 on list tables */ +} + #future-posts ul, #published-posts ul { clear: both; @@ -658,22 +853,21 @@ #future-posts li, #published-posts li { - overflow: hidden; margin-bottom: 8px; } #future-posts ul span, #published-posts ul span { - color: #777; - float: right; - margin-left: 8px; + display: inline-block; + margin-left: 5px; min-width: 150px; + color: #72777c; } .activity-block { border-bottom: 1px solid #eee; - overflow: hidden; - padding: 8px 0 4px; + margin: 0 -12px; + padding: 8px 12px 4px; } .activity-block:last-child { @@ -702,7 +896,7 @@ #activity-widget #the-comment-list .avatar { position: absolute; - top: 13px; + top: 12px; } #activity-widget #the-comment-list .dashboard-comment-wrap { @@ -713,11 +907,6 @@ margin: 1em 0; } -#activity-widget #the-comment-list .comment-item h4 { - font-size: 13px; - color: #999; -} - #activity-widget #the-comment-list .comment-item p.row-actions { margin: 4px 0 0 0; } @@ -753,12 +942,17 @@ margin: 10px; } -.edit-box { +.postbox .button-link .edit-box { display: none; } -h3:hover .edit-box { - display: inline; +.edit-box { + opacity: 0; +} + +.hndle:hover .edit-box, +.edit-box:focus { + opacity: 1; } #dashboard-widgets form .input-text-wrap input { @@ -780,31 +974,18 @@ min-width: 0; } -#dashboard-widgets a { +#dashboard-widgets a, +#dashboard-widgets .button-link { text-decoration: none; } -#dashboard-widgets h3 a { +#dashboard-widgets h2 a { text-decoration: underline; } -#dashboard-widgets h3 .postbox-title-action { - position: absolute; - left: 10px; - padding: 0; - top: 5px; -} - -.js #dashboard-widgets h3 .postbox-title-action { - left: 33px; -} - -#dashboard-widgets h4 { - color: #23282d; - font-weight: normal; - font-size: 14px; - margin: 0 0 .2em; - padding: 0; +#dashboard-widgets .hndle .postbox-title-action { + float: left; + line-height: 1.2; } #dashboard_plugins h5 { @@ -815,11 +996,11 @@ #latest-comments #the-comment-list { position: relative; + margin: 0 -12px; } #activity-widget #the-comment-list .comment, #activity-widget #the-comment-list .pingback { - -webkit-box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.06); box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.06); } @@ -828,7 +1009,11 @@ } #activity-widget #latest-comments #the-comment-list .comment-item { - padding: 1em 12px; + /* the row-actions paragraph is output only for users with 'edit_comment' capabilities, + for other users this needs a min height equal to the gravatar image */ + min-height: 50px; + margin: 0; + padding: 12px; } #latest-comments #the-comment-list .pingback { @@ -839,15 +1024,15 @@ border-top: none; } -#latest-comments #the-comment-list .comment-item h4 { +#latest-comments #the-comment-list .comment-meta { line-height: 1.5em; - margin-top: 0; + margin: 0; color: #666; } -#latest-comments #the-comment-list .comment-item h4 cite { +#latest-comments #the-comment-list .comment-meta cite { font-style: normal; - font-weight: normal; + font-weight: 400; } #latest-comments #the-comment-list .comment-item blockquote, @@ -889,9 +1074,9 @@ } a.rsswidget { - font-size: 14px; + font-size: 13px; font-weight: 600; - line-height: 1.7em; + line-height: 1.4em; } .rss-widget ul li { @@ -900,7 +1085,7 @@ } .rss-widget span.rss-date { - color: #999; + color: #72777c; font-size: 13px; margin-right: 3px; } @@ -913,11 +1098,10 @@ } .rss-widget cite:before { - content: '\2014'; + content: "\2014"; } .dashboard-comment-wrap { - overflow: hidden; word-wrap: break-word; } @@ -949,20 +1133,18 @@ background-image: none; border-color: #edc048; color: #fff; - -webkit-box-shadow: none; box-shadow: none; } -#dashboard_browser_nag.postbox.browser-insecure h3 { +#dashboard_browser_nag.postbox.browser-insecure h2 { border-bottom-color: #cd5a5a; color: #fff; } -#dashboard_browser_nag.postbox h3 { +#dashboard_browser_nag.postbox h2 { border-bottom-color: #f6e2ac; background: transparent none; color: #fff; - -webkit-box-shadow: none; box-shadow: none; } @@ -970,9 +1152,7 @@ color: #fff; } -/* Make the browser nags easier to read with Open Sans */ - -#dashboard_browser_nag h3.hndle { +#dashboard_browser_nag h2.hndle { border: none; font-weight: 600; font-size: 20px; @@ -1019,6 +1199,11 @@ min-height: 0; } + #dashboard-widgets #postbox-container-3 .empty-container:after, + #dashboard-widgets #postbox-container-4 .empty-container:after { + display: none; + } + #wpbody #wpbody-content #dashboard-widgets.columns-1 .postbox-container { width: 100%; } @@ -1039,6 +1224,10 @@ .columns-prefs .columns-prefs-4 { display: none; } + + .metabox-holder .postbox-container .empty-container:after { + display: block; + } } /* three columns on the dash */ @@ -1061,6 +1250,25 @@ height: 0; min-height: 0; } + + #dashboard-widgets #postbox-container-4 .empty-container:after { + display: none; + } + + .metabox-holder .postbox-container .empty-container:after { + display: block; + } +} + +@media screen and (max-width: 1024px) { + .try-gutenberg-panel .try-gutenberg-panel-column-container { + -ms-grid-columns: 50% 50%; + grid-template-columns: 50% 50%; + } + + .try-gutenberg-panel .try-gutenberg-panel-image-column { + display: none; + } } @media screen and (max-width: 870px) { @@ -1071,6 +1279,11 @@ width: 100%; } + .try-gutenberg-panel .try-gutenberg-panel-column-container { + -ms-grid-columns: 100%; + grid-template-columns: 100%; + } + .welcome-panel .welcome-panel-column li { display: inline-block; margin-left: 13px; @@ -1079,7 +1292,6 @@ .welcome-panel .welcome-panel-column ul { margin: 0.4em 0 0; } - } @media screen and ( max-width: 782px ) { @@ -1088,24 +1300,84 @@ width: 30px; margin: 4px 0 5px 10px; } + + .community-events-toggle-location { + height: 38px; + vertical-align: baseline; + } + + .community-events-form .regular-text { + height: 32px; + } + + #community-events-submit { + margin-bottom: 0; + /* Override .wp-core-ui .button */ + vertical-align: top; + } + + .community-events-form label, + #dashboard-widgets .community-events-cancel.button-link { + /* Same properties as the submit button for cross-browsers alignment. */ + font-size: 14px; + line-height: normal; + height: auto; + padding: 6px 0; + border: 1px solid transparent; + } + + .community-events .spinner { + margin-top: 7px; + } } /* Smartphone */ @media screen and (max-width: 600px) { /* Keep the close icon from overlapping the Welcome text. */ - .welcome-panel .welcome-panel-close { + .welcome-panel .welcome-panel-close, + .try-gutenberg-panel .try-gutenberg-panel-close { overflow: hidden; - text-indent: 100%; + text-indent: 40px; white-space: nowrap; width: 20px; height: 20px; - left: 0; padding: 5px; + top: 5px; + left: 5px; } /* Make the close icon larger for tappability. */ - #welcome-panel.welcome-panel .welcome-panel-close:before { + .welcome-panel .welcome-panel-close:before, + .try-gutenberg-panel .try-gutenberg-panel-close:before { font-size: 20px; - margin: 0; + top: 5px; + right: -35px; } } + +@media screen and (min-width: 355px) { + .community-events .event-info { + display: table-row; + float: right; + max-width: 59%; + } + + .event-icon, + .event-icon[aria-hidden="true"] { + display: table-cell; + } + + .event-info-inner { + display: table-cell; + } + + .community-events .event-date-time { + float: left; + max-width: 39%; + } + + .community-events .event-date, + .community-events .event-time { + text-align: left; + } +}