mirror of
https://github.com/WordPress/WordPress.git
synced 2024-09-19 19:11:32 +02:00
5bd111eb76
This will be the final sync from GitHub before placing that repository into read-only mode. All further changes should now flow entirely through Trac.
For a full list of changes since [49633], see 1d5a895...53acd9b.
Props poena, luminuu, kjellr, ryelle, allancole, melchoyce, felipeelia, aljullu, kebbet, chaton666, Clorith, mkaz, ingereck, paaljoachim.
See #51526.
Built from https://develop.svn.wordpress.org/trunk@49726
git-svn-id: http://core.svn.wordpress.org/trunk@49449 1a063a9b-81f0-0310-95a4-ce76da25c4cd
149 lines
3.2 KiB
SCSS
149 lines
3.2 KiB
SCSS
// Gutenberg text color options
|
|
|
|
.has-black-color[class] {
|
|
color: var(--global--color-black);
|
|
}
|
|
|
|
.has-gray-color[class] {
|
|
color: var(--global--color-gray);
|
|
}
|
|
|
|
.has-dark-gray-color[class] {
|
|
color: var(--global--color-dark-gray);
|
|
}
|
|
|
|
.has-green-color[class] {
|
|
color: var(--global--color-green);
|
|
}
|
|
|
|
.has-blue-color[class] {
|
|
color: var(--global--color-blue);
|
|
}
|
|
|
|
.has-purple-color[class] {
|
|
color: var(--global--color-purple);
|
|
}
|
|
|
|
.has-red-color[class] {
|
|
color: var(--global--color-red);
|
|
}
|
|
|
|
.has-orange-color[class] {
|
|
color: var(--global--color-orange);
|
|
}
|
|
|
|
.has-yellow-color[class] {
|
|
color: var(--global--color-yellow);
|
|
}
|
|
|
|
.has-white-color[class] {
|
|
color: var(--global--color-white);
|
|
}
|
|
|
|
// Gutenberg background-color options
|
|
.has-background {
|
|
|
|
a,
|
|
p,
|
|
h1,
|
|
h2,
|
|
h3,
|
|
h4,
|
|
h5,
|
|
h6 {
|
|
color: currentColor;
|
|
}
|
|
}
|
|
|
|
.has-black-background-color[class] {
|
|
background-color: var(--global--color-black);
|
|
}
|
|
|
|
.has-gray-background-color[class] {
|
|
background-color: var(--global--color-gray);
|
|
}
|
|
|
|
.has-dark-gray-background-color[class] {
|
|
background-color: var(--global--color-dark-gray);
|
|
}
|
|
|
|
.has-green-background-color[class] {
|
|
background-color: var(--global--color-green);
|
|
}
|
|
|
|
.has-blue-background-color[class] {
|
|
background-color: var(--global--color-blue);
|
|
}
|
|
|
|
.has-purple-background-color[class] {
|
|
background-color: var(--global--color-purple);
|
|
}
|
|
|
|
.has-red-background-color[class] {
|
|
background-color: var(--global--color-red);
|
|
}
|
|
|
|
.has-orange-background-color[class] {
|
|
background-color: var(--global--color-orange);
|
|
}
|
|
|
|
.has-yellow-background-color[class] {
|
|
background-color: var(--global--color-yellow);
|
|
}
|
|
|
|
.has-white-background-color[class] {
|
|
background-color: var(--global--color-white);
|
|
}
|
|
|
|
:not(.has-text-color) {
|
|
|
|
&.has-black-background-color[class],
|
|
&.has-gray-background-color[class],
|
|
&.has-dark-gray-background-color[class] {
|
|
color: var(--global--color-white);
|
|
}
|
|
|
|
&.has-green-background-color[class],
|
|
&.has-blue-background-color[class],
|
|
&.has-purple-background-color[class],
|
|
&.has-red-background-color[class],
|
|
&.has-orange-background-color[class],
|
|
&.has-yellow-background-color[class],
|
|
&.has-white-background-color[class] {
|
|
color: var(--global--color-dark-gray);
|
|
}
|
|
}
|
|
|
|
// Custom gradients
|
|
.has-purple-to-yellow-gradient-background {
|
|
background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-yellow));
|
|
}
|
|
|
|
.has-yellow-to-purple-gradient-background {
|
|
background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-purple));
|
|
}
|
|
|
|
.has-green-to-yellow-gradient-background {
|
|
background: linear-gradient(160deg, var(--global--color-green), var(--global--color-yellow));
|
|
}
|
|
|
|
.has-yellow-to-green-gradient-background {
|
|
background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-green));
|
|
}
|
|
|
|
.has-red-to-yellow-gradient-background {
|
|
background: linear-gradient(160deg, var(--global--color-red), var(--global--color-yellow));
|
|
}
|
|
|
|
.has-yellow-to-red-gradient-background {
|
|
background: linear-gradient(160deg, var(--global--color-yellow), var(--global--color-red));
|
|
}
|
|
|
|
.has-purple-to-red-gradient-background {
|
|
background: linear-gradient(160deg, var(--global--color-purple), var(--global--color-red));
|
|
}
|
|
|
|
.has-red-to-purple-gradient-background {
|
|
background: linear-gradient(160deg, var(--global--color-red), var(--global--color-purple));
|
|
}
|