wp/wp-admin/css/forms.css
changeset 16 a86126ab1dd4
parent 9 177826044cd9
child 18 be944660c56a
equal deleted inserted replaced
15:3d4e9c994f10 16:a86126ab1dd4
     1 /* Include margin and padding in the width calculation of input and textarea. */
     1 /* Include margin and padding in the width calculation of input and textarea. */
     2 input,
     2 input,
       
     3 select,
       
     4 textarea,
       
     5 button {
       
     6 	box-sizing: border-box;
       
     7 	font-family: inherit;
       
     8 	font-size: inherit;
       
     9 	font-weight: inherit;
       
    10 }
       
    11 
       
    12 textarea,
       
    13 input {
       
    14 	font-size: 14px;
       
    15 }
       
    16 
     3 textarea {
    17 textarea {
     4 	box-sizing: border-box;
    18 	overflow: auto;
       
    19 	padding: 2px 6px;
       
    20 	/* inherits font size 14px */
       
    21 	line-height: 1.42857143; /* 20px */
       
    22 	resize: vertical;
       
    23 }
       
    24 
       
    25 label {
       
    26 	cursor: pointer;
       
    27 }
       
    28 
       
    29 input,
       
    30 select {
       
    31 	margin: 0 1px;
       
    32 }
       
    33 
       
    34 textarea.code {
       
    35 	padding: 4px 6px 1px 6px;
     5 }
    36 }
     6 
    37 
     7 input[type="text"],
    38 input[type="text"],
     8 input[type="password"],
    39 input[type="password"],
     9 input[type="checkbox"],
       
    10 input[type="color"],
    40 input[type="color"],
    11 input[type="date"],
    41 input[type="date"],
    12 input[type="datetime"],
    42 input[type="datetime"],
    13 input[type="datetime-local"],
    43 input[type="datetime-local"],
    14 input[type="email"],
    44 input[type="email"],
    15 input[type="month"],
    45 input[type="month"],
    16 input[type="number"],
    46 input[type="number"],
    17 input[type="search"],
    47 input[type="search"],
    18 input[type="radio"],
       
    19 input[type="tel"],
    48 input[type="tel"],
    20 input[type="text"],
       
    21 input[type="time"],
    49 input[type="time"],
    22 input[type="url"],
    50 input[type="url"],
    23 input[type="week"],
    51 input[type="week"],
    24 select,
    52 select,
    25 textarea {
    53 textarea {
    26 	border: 1px solid #ddd;
    54 	box-shadow: 0 0 0 transparent;
    27 	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.07);
    55 	border-radius: 4px;
       
    56 	border: 1px solid #7e8993;
    28 	background-color: #fff;
    57 	background-color: #fff;
    29 	color: #32373c;
    58 	color: #32373c;
    30 	outline: none;
    59 }
    31 	transition: 0.05s border-color ease-in-out;
    60 
       
    61 input[type="text"],
       
    62 input[type="password"],
       
    63 input[type="date"],
       
    64 input[type="datetime"],
       
    65 input[type="datetime-local"],
       
    66 input[type="email"],
       
    67 input[type="month"],
       
    68 input[type="number"],
       
    69 input[type="search"],
       
    70 input[type="tel"],
       
    71 input[type="time"],
       
    72 input[type="url"],
       
    73 input[type="week"] {
       
    74 	padding: 0 8px;
       
    75 	/* inherits font size 14px */
       
    76 	line-height: 2; /* 28px */
       
    77 	/* Only necessary for IE11 */
       
    78 	min-height: 30px;
       
    79 }
       
    80 
       
    81 ::-webkit-datetime-edit {
       
    82 	/* inherits font size 14px */
       
    83 	line-height: 1.85714286; /* 26px */
    32 }
    84 }
    33 
    85 
    34 input[type="text"]:focus,
    86 input[type="text"]:focus,
    35 input[type="password"]:focus,
    87 input[type="password"]:focus,
    36 input[type="color"]:focus,
    88 input[type="color"]:focus,
    40 input[type="email"]:focus,
    92 input[type="email"]:focus,
    41 input[type="month"]:focus,
    93 input[type="month"]:focus,
    42 input[type="number"]:focus,
    94 input[type="number"]:focus,
    43 input[type="search"]:focus,
    95 input[type="search"]:focus,
    44 input[type="tel"]:focus,
    96 input[type="tel"]:focus,
    45 input[type="text"]:focus,
       
    46 input[type="time"]:focus,
    97 input[type="time"]:focus,
    47 input[type="url"]:focus,
    98 input[type="url"]:focus,
    48 input[type="week"]:focus,
    99 input[type="week"]:focus,
    49 input[type="checkbox"]:focus,
   100 input[type="checkbox"]:focus,
    50 input[type="radio"]:focus,
   101 input[type="radio"]:focus,
    51 select:focus,
   102 select:focus,
    52 textarea:focus {
   103 textarea:focus {
    53 	border-color: #5b9dd9;
   104 	border-color: #007cba;
    54 	box-shadow: 0 0 2px rgba(30, 140, 190, 0.8);
   105 	box-shadow: 0 0 0 1px #007cba;
    55 	/* Only visible in Windows High Contrast mode */
   106 	/* Only visible in Windows High Contrast mode */
    56 	outline: 2px solid transparent;
   107 	outline: 2px solid transparent;
    57 }
   108 }
    58 
   109 
    59 /* rtl:ignore */
   110 /* rtl:ignore */
    60 input[type="email"],
   111 input[type="email"],
    61 input[type="url"] {
   112 input[type="url"] {
    62 	direction: ltr;
   113 	direction: ltr;
    63 }
   114 }
    64 
   115 
    65 /* Vertically align the number selector with the input. */
       
    66 input[type="number"] {
       
    67 	height: 28px;
       
    68 	line-height: 1;
       
    69 }
       
    70 
       
    71 input[type="checkbox"],
   116 input[type="checkbox"],
    72 input[type="radio"] {
   117 input[type="radio"] {
    73 	border: 1px solid #b4b9be;
   118 	border: 1px solid #7e8993;
       
   119 	border-radius: 4px;
    74 	background: #fff;
   120 	background: #fff;
    75 	color: #555;
   121 	color: #555;
    76 	clear: none;
   122 	clear: none;
    77 	cursor: pointer;
   123 	cursor: pointer;
    78 	display: inline-block;
   124 	display: inline-block;
    79 	line-height: 0;
   125 	line-height: 0;
    80 	height: 16px;
   126 	height: 1rem;
    81 	margin: -4px 4px 0 0;
   127 	margin: -0.25rem 0.25rem 0 0;
    82 	outline: 0;
   128 	outline: 0;
    83 	padding: 0 !important;
   129 	padding: 0 !important;
    84 	text-align: center;
   130 	text-align: center;
    85 	vertical-align: middle;
   131 	vertical-align: middle;
    86 	width: 16px;
   132 	width: 1rem;
    87 	min-width: 16px;
   133 	min-width: 1rem;
    88 	-webkit-appearance: none;
   134 	-webkit-appearance: none;
    89 	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
   135 	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    90 	transition: .05s border-color ease-in-out;
   136 	transition: .05s border-color ease-in-out;
    91 }
   137 }
    92 
   138 
    94 	color: #82878c;
   140 	color: #82878c;
    95 }
   141 }
    96 
   142 
    97 .wp-core-ui input[type="reset"]:hover,
   143 .wp-core-ui input[type="reset"]:hover,
    98 .wp-core-ui input[type="reset"]:active {
   144 .wp-core-ui input[type="reset"]:active {
    99 	color: #00a0d2;
   145 	color: #006799;
   100 }
   146 }
   101 
   147 
   102 td > input[type="checkbox"],
   148 td > input[type="checkbox"],
   103 .wp-admin p input[type="checkbox"],
   149 .wp-admin p input[type="checkbox"],
   104 .wp-admin p input[type="radio"] {
   150 .wp-admin p input[type="radio"] {
   113 	margin-top: -2px;
   159 	margin-top: -2px;
   114 }
   160 }
   115 
   161 
   116 input[type="radio"] {
   162 input[type="radio"] {
   117 	border-radius: 50%;
   163 	border-radius: 50%;
   118 	margin-right: 4px;
   164 	margin-right: 0.25rem;
   119 	line-height: 10px;
   165 	/* 10px not sure if still necessary, comes from the MP6 redesign in r26072 */
   120 }
   166 	line-height: 0.71428571;
   121 
   167 }
   122 input[type="checkbox"]:checked:before,
   168 
   123 input[type="radio"]:checked:before {
   169 input[type="checkbox"]:checked::before,
       
   170 input[type="radio"]:checked::before {
   124 	float: left;
   171 	float: left;
   125 	display: inline-block;
   172 	display: inline-block;
   126 	vertical-align: middle;
   173 	vertical-align: middle;
   127 	width: 16px;
   174 	width: 1rem;
   128 	font: normal 21px/1 dashicons;
       
   129 	speak: none;
   175 	speak: none;
   130 	-webkit-font-smoothing: antialiased;
   176 	-webkit-font-smoothing: antialiased;
   131 	-moz-osx-font-smoothing: grayscale;
   177 	-moz-osx-font-smoothing: grayscale;
   132 }
   178 }
   133 
   179 
   134 input[type="checkbox"]:checked:before {
   180 input[type="checkbox"]:checked::before {
   135 	content: "\f147";
   181 	/* Use the "Yes" SVG Dashicon */
   136 	margin: -3px 0 0 -4px;
   182 	content: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27%231e8cbe%27%2F%3E%3C%2Fsvg%3E");
   137 	color: #1e8cbe;
   183 	margin: -0.1875rem 0 0 -0.25rem;
   138 }
   184 	height: 1.3125rem;
   139 
   185 	width: 1.3125rem;
   140 input[type="radio"]:checked:before {
   186 }
   141 	content: "\2022";
   187 
   142 	text-indent: -9999px;
   188 input[type="radio"]:checked::before {
   143 	border-radius: 50px;
   189 	content: "";
   144 	font-size: 24px;
   190 	border-radius: 50%;
   145 	width: 6px;
   191 	width: 0.5rem; /* 8px */
   146 	height: 6px;
   192 	height: 0.5rem; /* 8px */
   147 	margin: 4px;
   193 	margin: 0.1875rem; /* 3px */
   148 	line-height: 16px;
       
   149 	background-color: #1e8cbe;
   194 	background-color: #1e8cbe;
       
   195 	/* 16px not sure if still necessary, comes from the MP6 redesign in r26072 */
       
   196 	line-height: 1.14285714;
   150 }
   197 }
   151 
   198 
   152 @-moz-document url-prefix() {
   199 @-moz-document url-prefix() {
   153 	input[type="checkbox"],
   200 	input[type="checkbox"],
   154 	input[type="radio"],
   201 	input[type="radio"],
   164 
   211 
   165 input[type="search"]::-webkit-search-decoration {
   212 input[type="search"]::-webkit-search-decoration {
   166 	display: none;
   213 	display: none;
   167 }
   214 }
   168 
   215 
   169 .ie8 input[type="password"] {
       
   170 	font-family: sans-serif;
       
   171 }
       
   172 
       
   173 textarea,
       
   174 input,
       
   175 select,
       
   176 button {
       
   177 	font-family: inherit;
       
   178 	font-size: inherit;
       
   179 	font-weight: inherit;
       
   180 }
       
   181 
       
   182 textarea,
       
   183 input,
       
   184 select {
       
   185 	font-size: 14px;
       
   186 	padding: 3px 5px;
       
   187 	border-radius: 0; /* Reset mobile webkit's default element styling */
       
   188 }
       
   189 
       
   190 textarea {
       
   191 	overflow: auto;
       
   192 	padding: 2px 6px;
       
   193 	line-height: 1.4;
       
   194 	resize: vertical;
       
   195 }
       
   196 
       
   197 .wp-admin input[type="file"] {
   216 .wp-admin input[type="file"] {
   198 	padding: 3px 0;
   217 	padding: 3px 0;
   199 	cursor: pointer;
   218 	cursor: pointer;
   200 }
       
   201 
       
   202 label {
       
   203 	cursor: pointer;
       
   204 }
       
   205 
       
   206 input,
       
   207 select {
       
   208 	margin: 1px;
       
   209 	padding: 3px 5px;
       
   210 }
       
   211 
       
   212 input.code {
       
   213 	padding-top: 6px;
       
   214 }
       
   215 
       
   216 textarea.code {
       
   217 	line-height: 1.4;
       
   218 	padding: 4px 6px 1px 6px;
       
   219 }
   219 }
   220 
   220 
   221 input.readonly,
   221 input.readonly,
   222 input[readonly],
   222 input[readonly],
   223 textarea.readonly,
   223 textarea.readonly,
   305 
   305 
   306 /*------------------------------------------------------------------------------
   306 /*------------------------------------------------------------------------------
   307   2.0 - Forms
   307   2.0 - Forms
   308 ------------------------------------------------------------------------------*/
   308 ------------------------------------------------------------------------------*/
   309 
   309 
   310 
   310 /* Select styles are based on the default button in buttons.css */
   311 .wp-admin select {
   311 .wp-core-ui select {
   312 	padding: 2px;
   312 	font-size: 14px;
   313 	line-height: 28px;
   313 	line-height: 2; /* 28px */
   314 	height: 28px;
   314 	color: #32373c;
       
   315 	border-color: #7e8993;
       
   316 	box-shadow: none;
       
   317 	border-radius: 3px;
       
   318 	padding: 0 24px 0 8px;
       
   319 	min-height: 30px;
       
   320 	max-width: 25rem;
       
   321 	-webkit-appearance: none;
       
   322 	/* The SVG is arrow-down-alt2 from Dashicons. */
       
   323 	background: #fff url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E') no-repeat right 5px top 55%;
       
   324 	background-size: 16px 16px;
       
   325 	cursor: pointer;
   315 	vertical-align: middle;
   326 	vertical-align: middle;
   316 }
   327 }
   317 
   328 
       
   329 .wp-core-ui select:hover {
       
   330 	color: #007cba;
       
   331 }
       
   332 
       
   333 .wp-core-ui select:focus {
       
   334 	border-color: #007cba;
       
   335 	color: #016087;
       
   336 	box-shadow: 0 0 0 1px #007cba;
       
   337 }
       
   338 
       
   339 .wp-core-ui select:active {
       
   340 	border-color: #999;
       
   341 	box-shadow: none;
       
   342 }
       
   343 
       
   344 .wp-core-ui select.disabled,
       
   345 .wp-core-ui select:disabled {
       
   346 	color: #a0a5aa;
       
   347 	border-color: #ddd;
       
   348 	background-color: #f7f7f7;
       
   349 	/* The SVG is arrow-down-alt2 from Dashicons. */
       
   350 	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23a0a5aa%22%2F%3E%3C%2Fsvg%3E');
       
   351 	box-shadow: none;
       
   352 	text-shadow: 0 1px 0 #fff;
       
   353 	cursor: default;
       
   354 	transform: none;
       
   355 }
       
   356 
       
   357 /* Reset Firefox inner outline that appears on :focus. */
       
   358 /* This ruleset overrides the color change on :focus thus needs to be after select:focus. */
       
   359 .wp-core-ui select:-moz-focusring {
       
   360 	color: transparent;
       
   361 	text-shadow: 0 0 0 #016087;
       
   362 }
       
   363 
       
   364 /* Remove background focus style from IE11 while keeping focus style available on option elements. */
       
   365 .wp-core-ui select::-ms-value {
       
   366 	background: transparent;
       
   367 	color: #555;
       
   368 }
       
   369 
       
   370 .wp-core-ui select:hover::-ms-value {
       
   371 	color: #007cba;
       
   372 }
       
   373 
       
   374 .wp-core-ui select:focus::-ms-value {
       
   375 	color: #016087;
       
   376 }
       
   377 
       
   378 .wp-core-ui select.disabled::-ms-value,
       
   379 .wp-core-ui select:disabled::-ms-value {
       
   380 	color: #a0a5aa;
       
   381 }
       
   382 
       
   383 /* Hide the native down arrow for select element on IE. */
       
   384 .wp-core-ui select::-ms-expand {
       
   385 	display: none;
       
   386 }
       
   387 
   318 .wp-admin .button-cancel {
   388 .wp-admin .button-cancel {
       
   389 	display: inline-block;
       
   390 	min-height: 28px;
   319 	padding: 0 5px;
   391 	padding: 0 5px;
   320 	line-height: 2;
   392 	line-height: 2;
   321 }
   393 }
   322 
   394 
   323 .meta-box-sortables select {
   395 .meta-box-sortables select {
   324 	max-width: 100%;
   396 	max-width: 100%;
   325 }
   397 }
   326 
   398 
   327 .wp-admin select[multiple] {
   399 .meta-box-sortables input {
       
   400 	vertical-align: middle;
       
   401 }
       
   402 
       
   403 .misc-pub-post-status select {
       
   404 	margin-top: 0;
       
   405 }
       
   406 
       
   407 .wp-core-ui select[multiple] {
   328 	height: auto;
   408 	height: auto;
       
   409 	padding-right: 8px;
       
   410 	background: #fff;
   329 }
   411 }
   330 
   412 
   331 .submit {
   413 .submit {
   332 	padding: 1.5em 0;
   414 	padding: 1.5em 0;
   333 	margin: 5px 0;
   415 	margin: 5px 0;
   379 	width: 25em;
   461 	width: 25em;
   380 }
   462 }
   381 
   463 
   382 input.small-text {
   464 input.small-text {
   383 	width: 50px;
   465 	width: 50px;
   384 	padding: 1px 6px;
   466 	padding: 0 6px;
       
   467 }
       
   468 
       
   469 label input.small-text {
       
   470 	margin-top: -4px;
   385 }
   471 }
   386 
   472 
   387 input[type="number"].small-text {
   473 input[type="number"].small-text {
   388 	width: 65px;
   474 	width: 65px;
       
   475 	padding-right: 0;
   389 }
   476 }
   390 
   477 
   391 input.tiny-text {
   478 input.tiny-text {
   392 	width: 35px;
   479 	width: 35px;
   393 }
   480 }
   394 
   481 
   395 input[type="number"].tiny-text {
   482 input[type="number"].tiny-text {
   396 	width: 45px;
   483 	width: 45px;
       
   484 	padding-right: 0;
   397 }
   485 }
   398 
   486 
   399 #doaction,
   487 #doaction,
   400 #doaction2,
   488 #doaction2,
   401 #post-query-submit {
   489 #post-query-submit {
   402 	margin: 1px 8px 0 0;
   490 	margin: 0 8px 0 0;
   403 }
       
   404 
       
   405 .tablenav #changeit,
       
   406 .tablenav #delete_all,
       
   407 .tablenav #clear-recent-list,
       
   408 .wp-filter #delete_all {
       
   409 	margin-top: 1px;
       
   410 }
   491 }
   411 
   492 
   412 .tablenav .actions select {
   493 .tablenav .actions select {
   413 	float: left;
   494 	float: left;
   414 	margin-right: 6px;
   495 	margin-right: 6px;
   415 	max-width: 200px;
   496 	max-width: 12.5rem;
   416 }
       
   417 
       
   418 .ie8 .tablenav .actions select {
       
   419 	width: 155px;
       
   420 }
       
   421 
       
   422 .ie8 .tablenav .actions select#cat {
       
   423 	width: 200px;
       
   424 }
   497 }
   425 
   498 
   426 #timezone_string option {
   499 #timezone_string option {
   427 	margin-left: 1em;
   500 	margin-left: 1em;
   428 }
   501 }
   429 
   502 
   430 .wp-hide-pw > .dashicons,
   503 .wp-hide-pw > .dashicons,
   431 .wp-cancel-pw > .dashicons {
   504 .wp-cancel-pw > .dashicons {
   432 	position: relative;
   505 	position: relative;
   433 	top: 3px;
   506 	top: 3px;
       
   507 	width: 1.25rem;
       
   508 	height: 1.25rem;
       
   509 	top: 0.25rem;
       
   510 	font-size: 20px;
   434 }
   511 }
   435 
   512 
   436 .wp-cancel-pw .dashicons-no {
   513 .wp-cancel-pw .dashicons-no {
   437 	display: none;
   514 	display: none;
   438 }
   515 }
   522 
   599 
   523 .wp-pwd [type="text"],
   600 .wp-pwd [type="text"],
   524 .wp-pwd [type="password"] {
   601 .wp-pwd [type="password"] {
   525 	margin-bottom: 0;
   602 	margin-bottom: 0;
   526 	/* Same height as the buttons */
   603 	/* Same height as the buttons */
   527 	line-height: 20px;
   604 	min-height: 30px;
   528 	min-height: 28px;
   605 }
   529 	max-height: 40px;
   606 
       
   607 /* Hide the Edge "reveal password" native button */
       
   608 .wp-pwd input::-ms-reveal {
       
   609 	display: none;
   530 }
   610 }
   531 
   611 
   532 #pass1-text,
   612 #pass1-text,
   533 .show-password #pass1 {
   613 .show-password #pass1 {
   534 	display: none;
   614 	display: none;
   553 
   633 
   554 .search-box input[name="s"],
   634 .search-box input[name="s"],
   555 .tablenav .search-plugins input[name="s"],
   635 .tablenav .search-plugins input[name="s"],
   556 .tagsdiv .newtag {
   636 .tagsdiv .newtag {
   557 	float: left;
   637 	float: left;
   558 	height: 28px;
       
   559 	margin: 0 4px 0 0;
   638 	margin: 0 4px 0 0;
   560 }
   639 }
   561 
   640 
   562 .js.plugins-php .search-box .wp-filter-search {
   641 .js.plugins-php .search-box .wp-filter-search {
   563 	margin: 0;
   642 	margin: 0;
   564 	width: 280px;
   643 	width: 280px;
   565 	font-size: 16px;
       
   566 	font-weight: 300;
       
   567 	line-height: 1.5;
       
   568 	padding: 3px 5px;
       
   569 	height: 32px;
       
   570 }
   644 }
   571 
   645 
   572 input[type="text"].ui-autocomplete-loading,
   646 input[type="text"].ui-autocomplete-loading,
   573 input[type="email"].ui-autocomplete-loading {
   647 input[type="email"].ui-autocomplete-loading {
   574 	background-image: url(../images/loading.gif);
   648 	background-image: url(../images/loading.gif);
   676 .form-table p.timezone-info {
   750 .form-table p.timezone-info {
   677 	margin: 1em 0;
   751 	margin: 1em 0;
   678 }
   752 }
   679 
   753 
   680 .form-table td fieldset label {
   754 .form-table td fieldset label {
   681 	margin: 0.25em 0 0.5em !important;
   755 	margin: 0.35em 0 0.5em !important;
   682 	display: inline-block;
   756 	display: inline-block;
       
   757 }
       
   758 
       
   759 .form-table td fieldset p label { 
       
   760 	margin-top: 0 !important;
   683 }
   761 }
   684 
   762 
   685 .form-table td fieldset label,
   763 .form-table td fieldset label,
   686 .form-table td fieldset p,
   764 .form-table td fieldset p,
   687 .form-table td fieldset li {
   765 .form-table td fieldset li {
   688 	line-height: 1.4em;
   766 	line-height: 1.4;
   689 }
   767 }
   690 
   768 
   691 .form-table input.tog,
   769 .form-table input.tog,
   692 .form-table input[type="radio"] {
   770 .form-table input[type="radio"] {
   693 	margin-top: -4px;
   771 	margin-top: -4px;
   792 	position: relative;
   870 	position: relative;
   793 	margin-top: 20px;
   871 	margin-top: 20px;
   794 	padding: 0.7em 2em 1em;
   872 	padding: 0.7em 2em 1em;
   795 	min-width: 255px;
   873 	min-width: 255px;
   796 	max-width: 520px;
   874 	max-width: 520px;
   797 	border: 1px solid #e5e5e5;
   875 	border: 1px solid #ccd0d4;
   798 	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
   876 	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
   799 	background: #fff;
   877 	background: #fff;
   800 	box-sizing: border-box;
   878 	box-sizing: border-box;
   801 }
   879 }
   802 
   880 
   915 	min-width: 10em;
   993 	min-width: 10em;
   916 }
   994 }
   917 
   995 
   918 .options-general-php input.small-text {
   996 .options-general-php input.small-text {
   919 	width: 56px;
   997 	width: 56px;
       
   998 	margin: -2px 0;
   920 }
   999 }
   921 
  1000 
   922 .options-general-php .spinner {
  1001 .options-general-php .spinner {
   923 	float: none;
  1002 	float: none;
   924 	margin: -3px 3px 0;
  1003 	margin: -3px 3px 0;
   965 	margin-bottom: 5px;
  1044 	margin-bottom: 5px;
   966 }
  1045 }
   967 
  1046 
   968 #search-users,
  1047 #search-users,
   969 #search-sites {
  1048 #search-sites {
   970 	max-width: 100%;
  1049 	max-width: 60%;
   971 }
  1050 }
   972 
  1051 
   973 /*------------------------------------------------------------------------------
  1052 /*------------------------------------------------------------------------------
   974    Credentials check dialog for Install and Updates
  1053    Credentials check dialog for Install and Updates
   975 ------------------------------------------------------------------------------*/
  1054 ------------------------------------------------------------------------------*/
  1099 	margin-bottom: 1.3em;
  1178 	margin-bottom: 1.3em;
  1100 }
  1179 }
  1101 
  1180 
  1102 .tools-privacy-policy-page input.button,
  1181 .tools-privacy-policy-page input.button,
  1103 .tools-privacy-policy-page select {
  1182 .tools-privacy-policy-page select {
  1104 	margin-left: 6px;
  1183 	margin: 0 1px 0 6px;
  1105 }
  1184 }
  1106 
  1185 
  1107 .tools-privacy-edit {
  1186 .tools-privacy-edit {
  1108 	margin: 1.5em 0;
  1187 	margin: 1.5em 0;
  1109 }
  1188 }
  1110 
  1189 
  1111 .tools-privacy-policy-page span {
  1190 .tools-privacy-policy-page span {
  1112 	line-height: 2em;
  1191 	line-height: 2;
  1113 }
  1192 }
  1114 
  1193 
  1115 .privacy_requests .column-email {
  1194 .privacy_requests .column-email {
  1116 	width: 40%;
  1195 	width: 40%;
  1117 }
  1196 }
  1129 	border-left: 4px solid #fff;
  1208 	border-left: 4px solid #fff;
  1130 	background: #fff;
  1209 	background: #fff;
  1131 	box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  1210 	box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  1132 }
  1211 }
  1133 
  1212 
       
  1213 .privacy_requests .row-actions {
       
  1214 	color: #72777c;
       
  1215 }
       
  1216 
       
  1217 .privacy_requests .row-actions.processing {
       
  1218 	position: static;
       
  1219 }
       
  1220 
  1134 .privacy_requests tbody .has-request-results th {
  1221 .privacy_requests tbody .has-request-results th {
  1135 	box-shadow: none;
  1222 	box-shadow: none;
  1136 }
  1223 }
  1137 
  1224 
  1138 .privacy_requests tbody .request-results th .notice {
  1225 .privacy_requests tbody .request-results th .notice {
  1147 .privacy_requests tbody .has-request-results td {
  1234 .privacy_requests tbody .has-request-results td {
  1148 	box-shadow: none;
  1235 	box-shadow: none;
  1149 }
  1236 }
  1150 
  1237 
  1151 .privacy_requests .next_steps .button {
  1238 .privacy_requests .next_steps .button {
  1152 	height: auto;
  1239 	word-wrap: break-word;
  1153 	line-height: 1.5;
  1240 	white-space: normal;
  1154 	padding: 4px 10px;
       
  1155 	word-break: break-all;
       
  1156 	white-space: unset;
       
  1157 }
  1241 }
  1158 
  1242 
  1159 .privacy_requests .status-request-confirmed th,
  1243 .privacy_requests .status-request-confirmed th,
  1160 .privacy_requests .status-request-confirmed td {
  1244 .privacy_requests .status-request-confirmed td {
  1161 	background-color: #f7fcfe;
  1245 	background-color: #f7fcfe;
  1201 	padding-bottom: .5em;
  1285 	padding-bottom: .5em;
  1202 	display: block;
  1286 	display: block;
  1203 }
  1287 }
  1204 
  1288 
  1205 .wp-privacy-request-form input {
  1289 .wp-privacy-request-form input {
  1206 	line-height: 1.5;
       
  1207 	margin: 0;
  1290 	margin: 0;
  1208 }
  1291 }
  1209 
  1292 
  1210 .email-personal-data::before {
  1293 .email-personal-data::before {
  1211 	display: inline-block;
  1294 	display: inline-block;
  1237 	textarea {
  1320 	textarea {
  1238 		-webkit-appearance: none;
  1321 		-webkit-appearance: none;
  1239 	}
  1322 	}
  1240 
  1323 
  1241 	input[type="text"],
  1324 	input[type="text"],
       
  1325 	input[type="password"],
       
  1326 	input[type="date"],
       
  1327 	input[type="datetime"],
       
  1328 	input[type="datetime-local"],
  1242 	input[type="email"],
  1329 	input[type="email"],
       
  1330 	input[type="month"],
       
  1331 	input[type="number"],
  1243 	input[type="search"],
  1332 	input[type="search"],
  1244 	input[type="password"],
  1333 	input[type="tel"],
  1245 	input[type="number"] {
  1334 	input[type="time"],
       
  1335 	input[type="url"],
       
  1336 	input[type="week"] {
  1246 		-webkit-appearance: none;
  1337 		-webkit-appearance: none;
  1247 		padding: 6px 10px;
  1338 		padding: 3px 10px;
  1248 	}
  1339 		/* Only necessary for IE11 */
  1249 
  1340 		min-height: 40px;
  1250 	input[type="number"] {
  1341 	}
  1251 		height: 40px;
  1342 
  1252 	}
  1343 	::-webkit-datetime-edit {
  1253 
  1344 		line-height: 1.875; /* 30px */
  1254 	input.code {
       
  1255 		padding-bottom: 5px;
       
  1256 		padding-top: 10px;
       
  1257 	}
  1345 	}
  1258 
  1346 
  1259 	input[type="checkbox"],
  1347 	input[type="checkbox"],
  1260 	.widefat th input[type="checkbox"],
  1348 	.widefat th input[type="checkbox"],
  1261 	.widefat thead td input[type="checkbox"],
  1349 	.widefat thead td input[type="checkbox"],
  1262 	.widefat tfoot td input[type="checkbox"] {
  1350 	.widefat tfoot td input[type="checkbox"] {
  1263 		-webkit-appearance: none;
  1351 		-webkit-appearance: none;
  1264 		padding: 10px;
       
  1265 	}
  1352 	}
  1266 
  1353 
  1267 	.widefat th input[type="checkbox"],
  1354 	.widefat th input[type="checkbox"],
  1268 	.widefat thead td input[type="checkbox"],
  1355 	.widefat thead td input[type="checkbox"],
  1269 	.widefat tfoot td input[type="checkbox"] {
  1356 	.widefat tfoot td input[type="checkbox"] {
  1272 
  1359 
  1273 	input[type="checkbox"]:checked:before,
  1360 	input[type="checkbox"]:checked:before,
  1274 	.widefat th input[type="checkbox"]:before,
  1361 	.widefat th input[type="checkbox"]:before,
  1275 	.widefat thead td input[type="checkbox"]:before,
  1362 	.widefat thead td input[type="checkbox"]:before,
  1276 	.widefat tfoot td input[type="checkbox"]:before {
  1363 	.widefat tfoot td input[type="checkbox"]:before {
  1277 		font: normal 30px/1 dashicons;
  1364 		width: 1.875rem;
  1278 		margin: -3px -5px;
  1365 		height: 1.875rem;
       
  1366 		margin: -0.1875rem -0.3125rem;
  1279 	}
  1367 	}
  1280 
  1368 
  1281 	input[type="radio"],
  1369 	input[type="radio"],
  1282 	input[type="checkbox"] {
  1370 	input[type="checkbox"] {
  1283 		height: 25px;
  1371 		height: 1.5625rem;
  1284 		width: 25px;
  1372 		width: 1.5625rem;
  1285 	}
  1373 	}
  1286 
  1374 
  1287 	.wp-admin p input[type="checkbox"],
  1375 	.wp-admin p input[type="checkbox"],
  1288 	.wp-admin p input[type="radio"] {
  1376 	.wp-admin p input[type="radio"] {
  1289 		margin-top: -3px;
  1377 		margin-top: -0.1875rem;
  1290 	}
  1378 	}
  1291 
  1379 
  1292 	input[type="radio"]:checked:before {
  1380 	input[type="radio"]:checked:before {
  1293 		vertical-align: middle;
  1381 		vertical-align: middle;
  1294 		width: 9px;
  1382 		width: 0.5625rem;
  1295 		height: 9px;
  1383 		height: 0.5625rem;
  1296 		margin: 7px;
  1384 		margin: 0.4375rem;
  1297 		line-height: 16px;
  1385 		line-height: 0.76190476;
  1298 	}
  1386 	}
  1299 
  1387 
  1300 	.wp-upload-form input[type="submit"] {
  1388 	.wp-upload-form input[type="submit"] {
  1301 		margin-top: 10px;
  1389 		margin-top: 10px;
  1302 	}
  1390 	}
  1303 
  1391 
  1304 	#wpbody select {
  1392 	.wp-core-ui select,
  1305 		height: 36px;
  1393 	.wp-admin .form-table select {
       
  1394 		min-height: 40px;
  1306 		font-size: 16px;
  1395 		font-size: 16px;
       
  1396 		line-height: 1.625; /* 26px */
       
  1397 		padding: 5px 24px 5px 8px;
  1307 	}
  1398 	}
  1308 
  1399 
  1309 	.wp-admin .button-cancel {
  1400 	.wp-admin .button-cancel {
  1310 		padding: 0;
  1401 		margin-bottom: 0;
       
  1402 		padding: 2px 0;
  1311 		font-size: 14px;
  1403 		font-size: 14px;
       
  1404 		vertical-align: middle;
  1312 	}
  1405 	}
  1313 
  1406 
  1314 	#adduser .form-field input,
  1407 	#adduser .form-field input,
  1315 	#createuser .form-field input {
  1408 	#createuser .form-field input {
  1316 		width: 100%;
  1409 		width: 100%;
  1356 	.form-table td select,
  1449 	.form-table td select,
  1357 	.form-table td textarea,
  1450 	.form-table td textarea,
  1358 	.form-table span.description,
  1451 	.form-table span.description,
  1359 	#profile-page .form-table textarea {
  1452 	#profile-page .form-table textarea {
  1360 		width: 100%;
  1453 		width: 100%;
  1361 		font-size: 16px;
       
  1362 		line-height: 1.5;
       
  1363 		padding: 7px 10px;
       
  1364 		display: block;
  1454 		display: block;
  1365 		max-width: none;
  1455 		max-width: none;
  1366 		box-sizing: border-box;
  1456 		box-sizing: border-box;
  1367 	}
  1457 	}
  1368 
  1458 
  1369 	.form-table .form-required.form-invalid td:after {
  1459 	.form-table .form-required.form-invalid td:after {
  1370 		float: right;
  1460 		float: right;
  1371 		margin: -30px 3px 0 0;
  1461 		margin: -30px 3px 0 0;
  1372 	}
       
  1373 
       
  1374 	#wpbody .form-table td select {
       
  1375 		height: 40px;
       
  1376 	}
  1462 	}
  1377 
  1463 
  1378 	input[type="text"].small-text,
  1464 	input[type="text"].small-text,
  1379 	input[type="search"].small-text,
  1465 	input[type="search"].small-text,
  1380 	input[type="password"].small-text,
  1466 	input[type="password"].small-text,
  1402 		height: 90px;
  1488 		height: 90px;
  1403 		margin-bottom: 20px;
  1489 		margin-bottom: 20px;
  1404 	}
  1490 	}
  1405 
  1491 
  1406 	p.search-box input[name="s"] {
  1492 	p.search-box input[name="s"] {
  1407 		height: auto;
       
  1408 		float: none;
  1493 		float: none;
  1409 		width: 100%;
  1494 		width: 100%;
  1410 		margin-bottom: 10px;
  1495 		margin-bottom: 10px;
  1411 		vertical-align: middle;
  1496 		vertical-align: middle;
  1412 		-webkit-appearance: none;
       
  1413 	}
  1497 	}
  1414 
  1498 
  1415 	p.search-box input[type="submit"] {
  1499 	p.search-box input[type="submit"] {
  1416 		margin-bottom: 10px;
  1500 		margin-bottom: 10px;
  1417 	}
  1501 	}
  1418 
  1502 
  1419 	.form-table span.description {
  1503 	.form-table span.description {
  1420 		display: inline;
  1504 		display: inline;
  1421 		padding: 4px 0 0;
  1505 		padding: 4px 0 0;
  1422 		line-height: 1.4em;
  1506 		line-height: 1.4;
  1423 		font-size: 14px;
  1507 		font-size: 14px;
  1424 	}
  1508 	}
  1425 
  1509 
  1426 	.form-table th {
  1510 	.form-table th {
  1427 		padding-top: 10px;
  1511 		padding: 10px 0 0 0;
  1428 		padding-bottom: 0;
       
  1429 		border-bottom: 0;
  1512 		border-bottom: 0;
  1430 	}
  1513 	}
  1431 
  1514 
  1432 	.form-table td {
  1515 	.form-table td {
  1433 		margin-bottom: 0;
  1516 		margin-bottom: 0;
  1434 		padding-bottom: 6px;
  1517 		padding: 4px 0 6px 0;
  1435 		padding-top: 4px;
       
  1436 		padding-left: 0;
       
  1437 	}
  1518 	}
  1438 
  1519 
  1439 	.form-table.permalink-structure td code {
  1520 	.form-table.permalink-structure td code {
  1440 		margin-left: 32px;
  1521 		margin-left: 32px;
       
  1522 		display: inline-block;
  1441 	}
  1523 	}
  1442 
  1524 
  1443 	.form-table.permalink-structure td input[type="text"] {
  1525 	.form-table.permalink-structure td input[type="text"] {
  1444 		margin-left: 32px;
  1526 		margin-left: 32px;
  1445 		margin-top: 4px;
  1527 		margin-top: 4px;
  1450 		width: 100%;
  1532 		width: 100%;
  1451 	}
  1533 	}
  1452 
  1534 
  1453 	.form-table label {
  1535 	.form-table label {
  1454 		font-size: 14px;
  1536 		font-size: 14px;
       
  1537 	}
       
  1538 
       
  1539 	.background-position-control .button-group > label {
       
  1540 		font-size: 0;
  1455 	}
  1541 	}
  1456 
  1542 
  1457 	.form-table fieldset label {
  1543 	.form-table fieldset label {
  1458 		display: block;
  1544 		display: block;
  1459 	}
  1545 	}
  1472 	/* New Password */
  1558 	/* New Password */
  1473 	.wp-pwd {
  1559 	.wp-pwd {
  1474 		position: relative;
  1560 		position: relative;
  1475 	}
  1561 	}
  1476 
  1562 
  1477 	.wp-pwd [type="text"],
  1563 	/* Needs higher specificity than normal input type text and password. */
  1478 	.wp-pwd [type="password"] {
  1564 	#profile-page .form-table #pass1 {
  1479 		padding-right: 88px;
  1565 		padding-right: 90px;
  1480 	}
  1566 	}
  1481 
  1567 
  1482 	.wp-pwd button.button {
  1568 	.wp-pwd button.button {
  1483 		background: transparent;
  1569 		background: transparent;
  1484 		border: 1px solid transparent;
  1570 		border: 1px solid transparent;
  1487 		margin: 0;
  1573 		margin: 0;
  1488 		padding: 5px 9px;
  1574 		padding: 5px 9px;
  1489 		position: absolute;
  1575 		position: absolute;
  1490 		right: 0;
  1576 		right: 0;
  1491 		top: 0;
  1577 		top: 0;
       
  1578 		width: 2.375rem;
       
  1579 		height: 2.375rem;
       
  1580 		min-width: 40px;
       
  1581 		min-height: 40px;
  1492 	}
  1582 	}
  1493 
  1583 
  1494 	.wp-pwd button.wp-hide-pw {
  1584 	.wp-pwd button.wp-hide-pw {
  1495 		right: 40px;
  1585 		right: 2.5rem;
  1496 	}
  1586 	}
  1497 
  1587 
  1498 	.wp-pwd button.button:hover,
  1588 	.wp-pwd button.button:hover,
  1499 	.wp-pwd button.button:focus {
  1589 	.wp-pwd button.button:focus {
  1500 		background: transparent;
  1590 		background: transparent;
  1508 
  1598 
  1509 	.wp-pwd .button .text {
  1599 	.wp-pwd .button .text {
  1510 		display: none;
  1600 		display: none;
  1511 	}
  1601 	}
  1512 
  1602 
       
  1603 	.wp-pwd [type="text"],
       
  1604 	.wp-pwd [type="password"] {
       
  1605 		line-height: 2;
       
  1606 		padding-right: 5rem;
       
  1607 	}
       
  1608 
  1513 	.wp-cancel-pw .dashicons-no {
  1609 	.wp-cancel-pw .dashicons-no {
  1514 		display: inline-block;
  1610 		display: inline-block;
  1515 	}
  1611 	}
  1516 
  1612 
  1517 	.options-general-php input[type="text"].small-text {
  1613 	.options-general-php input[type="text"].small-text {
  1544 
  1640 
  1545 	.wp-list-table.privacy_requests.widefat th input,
  1641 	.wp-list-table.privacy_requests.widefat th input,
  1546 	.wp-list-table.privacy_requests.widefat thead td input {
  1642 	.wp-list-table.privacy_requests.widefat thead td input {
  1547 		margin-left: 5px;
  1643 		margin-left: 5px;
  1548 	}
  1644 	}
       
  1645 
       
  1646 	.wp-privacy-request-form-field input[type="text"] {
       
  1647 		width: 100%;
       
  1648 		margin-bottom: 10px;
       
  1649 		vertical-align: middle;
       
  1650 	}
       
  1651 
  1549 	.regular-text {
  1652 	.regular-text {
  1550 		max-width: 100%;
  1653 		max-width: 100%;
  1551 	}
  1654 	}
  1552 }
  1655 }
  1553 
  1656