wp/wp-admin/css/dashboard-rtl.css
changeset 21 48c4eec2b7e6
parent 19 3d72ae0968f4
child 22 8c2e4d02f4ef
equal deleted inserted replaced
20:7b1b88e27a20 21:48c4eec2b7e6
   119 /* Welcome Panel */
   119 /* Welcome Panel */
   120 .welcome-panel {
   120 .welcome-panel {
   121 	position: relative;
   121 	position: relative;
   122 	overflow: auto;
   122 	overflow: auto;
   123 	margin: 16px 0;
   123 	margin: 16px 0;
   124 	background-color: #e7ebfd;
   124 	background-color: #151515;
   125 	font-size: 14px;
   125 	font-size: 14px;
   126 	line-height: 1.3;
   126 	line-height: 1.3;
   127 	clear: both;
   127 	clear: both;
   128 }
   128 }
   129 
   129 
   145 	font-size: inherit;
   145 	font-size: inherit;
   146 	line-height: inherit;
   146 	line-height: inherit;
   147 }
   147 }
   148 
   148 
   149 .welcome-panel-header {
   149 .welcome-panel-header {
   150 	--about-header-image-width: 521px;
       
   151 	--about-header-bg-width: calc(var(--about-header-image-width) * 0.55);
       
   152 	--about-header-bg-offset-inline: 2rem;
       
   153 
       
   154 	position: relative;
   150 	position: relative;
       
   151 	color: #fff;
   155 }
   152 }
   156 
   153 
   157 .welcome-panel-header-image {
   154 .welcome-panel-header-image {
   158 	position: absolute;
   155 	position: absolute !important;
   159 	top: -1rem;
   156 	top: 0;
   160 	left: var(--about-header-bg-offset-inline);
   157 	left: 0;
   161 	bottom: 0;
   158 	bottom: 0;
   162 	width: var(--about-header-bg-width);
   159 	right: 0;
   163 	height: auto;
   160 	z-index: 0 !important;
       
   161 	overflow: hidden;
   164 }
   162 }
   165 
   163 
   166 .welcome-panel-header-image svg {
   164 .welcome-panel-header-image svg {
       
   165 	display: block;
       
   166 	margin: auto;
   167 	width: 100%;
   167 	width: 100%;
   168 	height: auto;
   168 	height: 100%;
   169 }
   169 }
   170 
   170 
   171 .welcome-panel-header a {
   171 .rtl .welcome-panel-header-image svg {
       
   172 	transform: scaleX(-1);
       
   173 }
       
   174 
       
   175 .welcome-panel-header * {
   172 	color: inherit;
   176 	color: inherit;
       
   177 	position: relative;
       
   178 	z-index: 1;
   173 }
   179 }
   174 
   180 
   175 .welcome-panel-header a:focus,
   181 .welcome-panel-header a:focus,
   176 .welcome-panel-header a:hover {
   182 .welcome-panel-header a:hover {
   177 	color: inherit;
   183 	color: inherit;
   207 	top: 8px;
   213 	top: 8px;
   208 	right: 0;
   214 	right: 0;
   209 	transition: all .1s ease-in-out;
   215 	transition: all .1s ease-in-out;
   210 	content: '\f335';
   216 	content: '\f335';
   211 	font-size: 24px;
   217 	font-size: 24px;
   212 	color: #1d2327;
   218 	color: #fff;
   213 }
   219 }
   214 
   220 
   215 .welcome-panel .welcome-panel-close {
   221 .welcome-panel .welcome-panel-close {
   216 	color: #1d2327;
   222 	color: #fff;
   217 }
   223 }
   218 
   224 
   219 .welcome-panel .welcome-panel-close:hover,
   225 .welcome-panel .welcome-panel-close:hover,
   220 .welcome-panel .welcome-panel-close:focus,
   226 .welcome-panel .welcome-panel-close:focus,
   221 .welcome-panel .welcome-panel-close:hover::before,
   227 .welcome-panel .welcome-panel-close:hover::before,
   222 .welcome-panel .welcome-panel-close:focus::before {
   228 .welcome-panel .welcome-panel-close:focus::before {
   223 	color: #2271b1;
   229 	color: #fff972;
   224 }
   230 }
   225 
   231 
   226 /* @deprecated 5.9.0 -- Button removed from panel. */
   232 /* @deprecated 5.9.0 -- Button removed from panel. */
   227 .wp-core-ui .welcome-panel .button.button-hero {
   233 .wp-core-ui .welcome-panel .button.button-hero {
   228 	margin: 15px 0 3px 13px;
   234 	margin: 15px 0 3px 13px;
   244 	margin-right: auto;
   250 	margin-right: auto;
   245 	margin-left: auto;
   251 	margin-left: auto;
   246 	max-width: 1500px;
   252 	max-width: 1500px;
   247 	width: 100%;
   253 	width: 100%;
   248 	padding: 48px 48px 80px 0;
   254 	padding: 48px 48px 80px 0;
   249 	padding-left: calc(var(--about-header-bg-width) + (var(--about-header-bg-offset-inline) * 2));
       
   250 }
   255 }
   251 
   256 
   252 .welcome-panel .welcome-panel-column-container {
   257 .welcome-panel .welcome-panel-column-container {
   253 	box-sizing: border-box;
   258 	box-sizing: border-box;
   254 	width: 100%;
   259 	width: 100%;
   263 }
   268 }
   264 
   269 
   265 [class*="welcome-panel-icon"] {
   270 [class*="welcome-panel-icon"] {
   266 	height: 60px;
   271 	height: 60px;
   267 	width: 60px;
   272 	width: 60px;
   268 	background-color: #1d2327;
       
   269 	background-position: center;
   273 	background-position: center;
   270 	background-size: 24px 24px;
   274 	background-size: 24px 24px;
   271 	background-repeat: no-repeat;
   275 	background-repeat: no-repeat;
   272 	border-radius: 100%;
   276 	border-radius: 100%;
       
   277 }
       
   278 
       
   279 .welcome-panel-column > svg {
       
   280 	margin-top: 4px;
   273 }
   281 }
   274 
   282 
   275 .welcome-panel-column {
   283 .welcome-panel-column {
   276 	display: grid;
   284 	display: grid;
   277 	grid-template-columns: min-content 1fr;
   285 	grid-template-columns: min-content 1fr;
   549 
   557 
   550 .community-events .event-info {
   558 .community-events .event-info {
   551 	display: block;
   559 	display: block;
   552 }
   560 }
   553 
   561 
       
   562 .community-events .ce-separator::before {
       
   563 	content: "\2022";
       
   564 }
       
   565 
   554 .event-icon {
   566 .event-icon {
   555 	height: 18px;
   567 	height: 18px;
   556 	padding-left: 10px;
   568 	padding-left: 10px;
   557 	width: 18px;
   569 	width: 18px;
   558 	display: none; /* Hide on smaller screens */
   570 	display: none; /* Hide on smaller screens */
   880 	color: #646970; /* white background on the dashboard but #f0f0f1 on list tables */
   892 	color: #646970; /* white background on the dashboard but #f0f0f1 on list tables */
   881 }
   893 }
   882 
   894 
   883 #future-posts ul,
   895 #future-posts ul,
   884 #published-posts ul {
   896 #published-posts ul {
   885 	clear: both;
   897 	margin: 8px -12px 0 -12px;
   886 	margin-bottom: 0;
       
   887 }
   898 }
   888 
   899 
   889 #future-posts li,
   900 #future-posts li,
   890 #published-posts li {
   901 #published-posts li {
   891 	margin-bottom: 8px;
   902 	display: grid;
   892 }
   903 	grid-template-columns: clamp(160px, calc(2vw + 140px), 200px) auto;
   893 
   904 	column-gap: 10px;
   894 #future-posts ul span,
       
   895 #published-posts ul span {
       
   896 	display: inline-block;
       
   897 	margin-left: 5px;
       
   898 	min-width: 150px;
       
   899 	color: #646970;
   905 	color: #646970;
       
   906 	padding: 4px 12px;
       
   907 }
       
   908 
       
   909 #future-posts li:nth-child(odd),
       
   910 #published-posts li:nth-child(odd) {
       
   911 	background-color: #f6f7f7;
   900 }
   912 }
   901 
   913 
   902 .activity-block {
   914 .activity-block {
   903 	border-bottom: 1px solid #f0f0f1;
   915 	border-bottom: 1px solid #f0f0f1;
   904 	margin: 0 -12px;
   916 	margin: 0 -12px 6px -12px;
   905 	padding: 8px 12px 4px;
   917 	padding: 8px 12px 4px;
   906 }
   918 }
   907 
   919 
   908 .activity-block:last-child {
   920 .activity-block:last-child {
   909 	border-bottom: none;
   921 	border-bottom: none;
       
   922 	margin-bottom: 0;
   910 }
   923 }
   911 
   924 
   912 .activity-block .subsubsub li {
   925 .activity-block .subsubsub li {
   913 	color: #dcdcde;
   926 	color: #dcdcde;
   914 }
   927 }
  1185 #dashboard_php_nag .dashicons-warning {
  1198 #dashboard_php_nag .dashicons-warning {
  1186 	color: #dba617;
  1199 	color: #dba617;
  1187 	padding-left: 6px;
  1200 	padding-left: 6px;
  1188 }
  1201 }
  1189 
  1202 
  1190 #dashboard_php_nag.php-insecure .dashicons-warning {
  1203 #dashboard_php_nag.php-no-security-updates .dashicons-warning,
       
  1204 #dashboard_php_nag.php-version-lower-than-future-minimum .dashicons-warning {
  1191 	color: #d63638;
  1205 	color: #d63638;
  1192 }
  1206 }
  1193 
  1207 
  1194 #dashboard_php_nag h2 {
  1208 #dashboard_php_nag h2 {
  1195 	display: inline-block;
  1209 	display: inline-block;
  1197 
  1211 
  1198 #dashboard_php_nag p {
  1212 #dashboard_php_nag p {
  1199 	margin: 12px 0;
  1213 	margin: 12px 0;
  1200 }
  1214 }
  1201 
  1215 
  1202 #dashboard_php_nag h3 {
       
  1203 	font-weight: 600;
       
  1204 }
       
  1205 
       
  1206 #dashboard_php_nag .button .dashicons-external {
  1216 #dashboard_php_nag .button .dashicons-external {
  1207 	line-height: 25px;
  1217 	line-height: 25px;
       
  1218 }
       
  1219 
       
  1220 .bigger-bolder-text {
       
  1221 	font-weight: 600;
       
  1222 	font-size: 14px;
  1208 }
  1223 }
  1209 
  1224 
  1210 /* =Media Queries
  1225 /* =Media Queries
  1211 -------------------------------------------------------------- */
  1226 -------------------------------------------------------------- */
  1212 
  1227 
  1349 @media screen and (max-width: 1180px) and (min-width: 783px) {
  1364 @media screen and (max-width: 1180px) and (min-width: 783px) {
  1350 	.welcome-panel-column {
  1365 	.welcome-panel-column {
  1351 		grid-template-columns: 1fr;
  1366 		grid-template-columns: 1fr;
  1352 	}
  1367 	}
  1353 
  1368 
  1354 	[class*="welcome-panel-icon"] {
  1369 	[class*="welcome-panel-icon"],
       
  1370 	.welcome-panel-column > svg {
  1355 		display: none;
  1371 		display: none;
  1356 	}
  1372 	}
  1357 }
  1373 }
  1358 
  1374 
  1359 @media screen and (max-width: 782px) {
  1375 @media screen and (max-width: 782px) {
  1360 	.welcome-panel-header {
       
  1361 		--about-header-bg-width: calc(var(--about-header-image-width) * 0.4);
       
  1362 		--about-header-bg-offset-inline: 1rem;
       
  1363 	}
       
  1364 
       
  1365 	.welcome-panel-header-image {
       
  1366 		top: 2rem;
       
  1367 	}
       
  1368 
       
  1369 	.welcome-panel .welcome-panel-column-container {
  1376 	.welcome-panel .welcome-panel-column-container {
  1370 		grid-template-columns: 1fr;
  1377 		grid-template-columns: 1fr;
  1371 		box-sizing: border-box;
  1378 		box-sizing: border-box;
  1372 		padding: 32px;
  1379 		padding: 32px;
  1373 		width: 100%;
  1380 		width: 100%;
  1454 @media screen and (max-width: 360px) {
  1461 @media screen and (max-width: 360px) {
  1455 	.welcome-panel-column {
  1462 	.welcome-panel-column {
  1456 		grid-template-columns: 1fr;
  1463 		grid-template-columns: 1fr;
  1457 	}
  1464 	}
  1458 
  1465 
  1459 	[class*="welcome-panel-icon"] {
  1466 	[class*="welcome-panel-icon"],
       
  1467 	.welcome-panel-column > svg {
  1460 		display: none;
  1468 		display: none;
  1461 	}
  1469 	}
  1462 }
  1470 }
  1463 
  1471 
  1464 @media screen and (min-width: 355px) {
  1472 @media screen and (min-width: 355px) {