/* not a part of filter bar, but derived from it, so here for now */
border-bottom: 4px solid #fff;
border-bottom: 4px solid #646970;
.filter-links li > a:hover,
.filter-links li > a:focus,
.show-filters .filter-links a.current:hover,
.show-filters .filter-links a.current:focus {
.wp-filter .search-form {
.wp-filter .search-form input[type="search"] {
.wp-filter .search-form select {
/* Use flexbox only on the plugins install page. The `filter-links` and search form children will become flex items. */
.plugin-install-php .wp-filter {
justify-content: space-between;
.wp-filter .search-form.search-plugins {
/* This element is a flex item: the inherited float won't have any effect. */
.wp-filter .search-form.search-plugins select,
.wp-filter .search-form.search-plugins .wp-filter-search {
.wp-filter .button.drawer-toggle {
border-color: transparent;
background-color: transparent;
vertical-align: baseline;
.wp-filter .drawer-toggle:before {
font: normal 16px/1 dashicons;
vertical-align: text-bottom;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
.wp-filter .button.drawer-toggle:hover,
.wp-filter .drawer-toggle:hover:before,
.wp-filter .button.drawer-toggle:focus,
.wp-filter .drawer-toggle:focus:before {
background-color: transparent;
.wp-filter .button.drawer-toggle:hover,
.wp-filter .button.drawer-toggle:focus:active {
border-color: transparent;
.wp-filter .button.drawer-toggle:focus {
.wp-filter .button.drawer-toggle:active {
.wp-filter .drawer-toggle.current:before {
.wp-filter .favorites-form {
border-top: 1px solid #f0f0f1;
.show-filters .filter-drawer,
.show-favorites-form .favorites-form {
.show-filters .filter-links a.current {
.show-filters .wp-filter .button.drawer-toggle {
.show-filters .wp-filter .drawer-toggle:hover,
.show-filters .wp-filter .drawer-toggle:focus {
.show-filters .wp-filter .drawer-toggle:before {
border: 1px solid #dcdcde;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
.filter-drawer .filter-group-feature {
.filter-drawer .filter-group-feature input,
.filter-drawer .filter-group-feature label {
.filter-drawer .filter-group-feature input {
.filter-group .filter-group-feature label {
margin: 14px 0px 14px 23px;
.filter-drawer .buttons {
.filter-drawer .filter-group + .buttons {
.filter-drawer .buttons .button span {
.wp-filter .button.clear-filters {
.wp-filter .button-link.edit-filters {
border: 1px solid #dcdcde;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
.filters-applied .filter-group,
.filters-applied .filter-drawer .buttons,
.filters-applied .filter-drawer br {
.filters-applied .filtered-by {
.filters-applied .filter-drawer {
.show-filters .favorites-form,
.show-filters .content-filterable,
.show-filters.filters-applied.loading-content .content-filterable,
.loading-content .content-filterable,
.error .content-filterable {
.show-filters.filters-applied .content-filterable {
.loading-content .spinner {
@media only screen and (max-width: 1120px) {
border-bottom: 1px solid #f0f0f1;
@media only screen and (max-width: 1000px) {
.wp-filter .media-toolbar-primary,
.wp-filter .media-toolbar-secondary,
.wp-filter .search-form {
float: none; /* Remove float from media-views.css */
@media only screen and (max-width: 782px) {
@media only screen and (max-width: 320px) {
.wp-filter .drawer-toggle {
.wp-filter .search-form input[type="search"] {
/*------------------------------------------------------------------------------
------------------------------------------------------------------------------*/
border: 1px solid #c3c4c7;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
div[class="update-message"] { /* back-compat for pre-4.6 */
padding: 0.5em 12px 0.5em 0;
.form-table td .notice p {
text-decoration: underline;
.wp-core-ui .notice.is-dismissible {
.notice-dismiss:hover:before,
.notice-dismiss:active:before,
.notice-dismiss:focus:before {
0 0 2px 1px rgba(79, 148, 212, 0.8);
border-left-color: #00a32a;
.notice-success.notice-alt {
background-color: #edfaef;
border-left-color: #dba617;
.notice-warning.notice-alt {
background-color: #fcf9e8;
border-left-color: #d63638;
.notice-error.notice-alt {
background-color: #fcf0f1;
border-left-color: #72aee6;
.notice-info.notice-alt {
background-color: #f0f6fc;
.update-message p:before,
.updating-message p:before,
.updated-message p:before,
.import-php .updating-message:before,
.button.updating-message:before,
.button.updated-message:before,
.button.installed:before,
.button.installing:before {
font: normal 20px/1 'dashicons';
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;