woocommerce/assets/css/marketplace-suggestions.scss

/**
 * marketplace-suggestions.scss
 * Styling for in-product marketplace suggestions.
 */

@import "mixins";
@import "variables";

a.suggestion-dismiss {
	border: none;
	box-shadow: none;
	color: #ccc;
}

a.suggestion-dismiss:hover {
	color: #aaa;
}

a.suggestion-dismiss::before {

	@include iconbeforedashicons( "\f335" );

	font-size: 1.5em;
}

.marketplace-table-banner {

	h2 {
		color: #555;
	}

	td {
		vertical-align: middle;
	}

	td.marketplace-table-title {
		border-left: 4px solid $woocommerce;
		padding-left: 4em;
	}

	td.marketplace-table-linkout {
		text-align: right;
		padding-right: 1em;

		a.button {
			margin-right: 0.5em;
		}

		a.suggestion-dismiss {
			position: relative;
			top: 4px;
		}
	}
}

@media screen and (max-width: 782px) {

	.marketplace-table-banner {
		display: none;
	}
}

.marketplace-suggestions-container[data-marketplace-suggestions-context="products-list-empty-body"] {
	margin-top: 4em;
	text-align: left;

	.marketplace-listitem-container {
		align-items: center;
		display: flex;
		border-top: 1px solid #ccc;
		margin-top: 2em;

		.marketplace-listitem-container-content {
			flex: 1 0 70%;

			h4 {
				margin: 1.33em 0 0.5em;
			}
		}

		.marketplace-listitem-container-cta {
			flex: 1 1 30%;
			padding-top: 1.33em;
			text-align: right;

			a.button {
				display: inline-block;
				min-width: 120px;
				text-align: center;
			}

			.suggestion-dismiss {
				text-decoration: none;
				position: relative;
				top: 7px;
			}
		}

		p {
			margin: 0;
		}

	}

}