adding some text gradient CSS

This commit is contained in:
Brian 2023-12-12 14:00:23 -07:00
parent afd34e9b4e
commit 5048abc3e6
Signed by: brian
GPG Key ID: DE1A5390A3B84CD8

View File

@ -0,0 +1,45 @@
.text-gradient {
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
position: relative;
z-index: 1;
}
.text-gradient.text-primary {
background-image: linear-gradient(310deg, var(--primary-text-color-gradient-start), var(--primary-text-color-gradient-end));
}
.text-primary {
color: var(--primary-text-color);
}
.text-gradient.text-info {
background-image: linear-gradient(310deg, var(--text-info-color-gradient-start), var(--text-info-color-gradient-end));
}
.text-info {
color: var(--text-info-color);
}
.text-gradient.text-success {
background-image: linear-gradient(310deg, var(--text-success-color-gradient-start), var(--text-success-color-gradient-end));
color: hsl(86, 81.4%, 46.3%);
}
.text-success {
color: var(--text-success-color);
}
.text-gradient.text-warning {
background-image: linear-gradient(310deg, var(--text-warning-color-gradient-start), var(--text-warning-color-gradient-end));
color: hsl(47, 96.2%, 59.2%);
}
.text-warning {
color: var(--text-warning-color);
}
.text-gradient.text-danger {
background-image: linear-gradient(310deg, var(--text-danger-color-gradient-start), var(--text-danger-color-gradient-end));
color: hsl(0, 95%, 47.1%);
}
.text-danger {
color: var(--text-danger-color);
}