# code-snippets/3.10.0-beta.1/css/common/_banners.scss

Code Snippets, version 3.10.0-beta.1. 44 lines.

- Page: https://pluginprobe.com/plugins/code-snippets/3.10.0-beta.1/code/css/common/_banners.scss
- Raw: https://pluginprobe.com/plugins/code-snippets/3.10.0-beta.1/raw/css/common/_banners.scss
- Modified: 2026-06-19T15:56:12+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/code-snippets/3.10.0-beta.1/code/css/common/_banners.scss#L10-L20`.

```scss
@use '../common/theme';
@use 'sass:map';
@use 'sass:list';

@mixin banners {
	.banner {
		border: 0;
		border-radius: 5px;
		display: flex;
		align-items: center;
		padding: 6px 10px;
		gap: 8px;
		margin: 0;

		.banner-dismiss {
			position: unset;
			margin-inline-start: auto;
			padding: 0;

			&, &::before {
				color: inherit;
			}
		}

		.wp-core-ui &.is-dismissible {
			position: unset;
			padding-inline-end: 10px;
		}
	}

	@each $name, $colors in theme.$notices {
		.banner-#{$name} {
			color: list.nth($colors, 2);
			background-color: list.nth($colors, 1);
		}
	}

	.banner-success::before {
		content: '✓';
		font-weight: bold;
		font-size: 16px;
	}
}

```