WenPai-org/wpmind
WenPai-org/wpmind
3
0
Fork 0
mirror of https://github.com/WenPai-org/wpmind.git synced 2025-08-04 03:29:33 +08:00
Code Issues Projects Releases 1 Packages Wiki Activity Actions

added mixin for text gradient

Browse source
This commit is contained in:
Nikita 2023-08-05 17:20:10 +03:00
parent ac974ec727
commit 12432fc35d
6 changed files with 24 additions and 36 deletions
Download patch file Download diff file Expand all files Collapse all files

22
src/admin/page-welcome/style.scss
View file

@ -1,19 +1,10 @@
@import "../../mixins/text-gradient";
.mind-admin-page-welcome {
.mind-inline-logo {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 12px;
vertical-align: bottom;
letter-spacing: 0;
font-size: 0.95em;
// Gradient.
@supports (-webkit-background-clip: text) {
background: linear-gradient(to right, var(--mind-brand-color), var(--mind-brand-color-2));
background-clip: text;
-webkit-text-fill-color: transparent;
}
@include text-gradient(var(--mind-brand-color), var(--mind-brand-color-2));
}
.mind-admin-content {
@ -38,12 +29,7 @@
cursor: pointer;
margin-left: 8px;
// Gradient.
@supports (-webkit-background-clip: text) {
background: linear-gradient(to right, var(--mind-brand-color), var(--mind-brand-color-2));
background-clip: text;
-webkit-text-fill-color: transparent;
}
@include text-gradient(var(--mind-brand-color), var(--mind-brand-color-2));
}
}
}

10
src/admin/style.scss
View file

@ -1,4 +1,5 @@
@import "../variables";
@import "../mixins/text-gradient";
:root {
--mind-admin-page-offset: 15px;
@ -50,6 +51,8 @@
align-items: center;
margin-right: auto;
@include text-gradient(var(--mind-brand-color), var(--mind-brand-color-2));
h1 {
margin: 6px 10px;
font-size: 14px;
@ -62,13 +65,6 @@
height: auto;
color: var(--mind-brand-color);
}
// Gradient.
@supports (-webkit-background-clip: text) {
background: linear-gradient(to right, var(--mind-brand-color), var(--mind-brand-color-2));
background-clip: text;
-webkit-text-fill-color: transparent;
}
}
.mind-admin-content {

4
src/editor/extensions/post-toolbar/style.scss
View file

@ -1,3 +1,5 @@
@import "../../../mixins/text-gradient";
.mind-post-toolbar-toggle {
flex: 100%;
white-space: nowrap;
@ -9,6 +11,8 @@
color: var(--mind-brand-color);
font-weight: 500;
@include text-gradient(var(--mind-brand-color), var(--mind-brand-color-2));
&::after {
content: "";
position: absolute;

4
src/editor/popup/components/not-connected-screen/style.scss
View file

@ -1,3 +1,5 @@
@import "../../../../mixins/text-gradient";
.mind-popup-not-connected {
width: 440px;
}
@ -36,6 +38,8 @@
color: var(--mind-brand-color);
font-weight: 500;
@include text-gradient(var(--mind-brand-color), var(--mind-brand-color-2));
&::after {
content: "";
position: absolute;

11
src/editor/style.scss
View file

@ -1,12 +1 @@
@import "../variables";
// Gradients for logos.
@supports (-webkit-background-clip: text) {
.mind-post-toolbar-toggle button,
.mind-popup-footer-logo,
.mind-popup-connected-screen-button {
background: linear-gradient(to right, var(--mind-brand-color), var(--mind-brand-color-2));
background-clip: text;
-webkit-text-fill-color: transparent;
}
}

9
src/mixins/_text-gradient.scss Normal file
View file

@ -0,0 +1,9 @@
@mixin text-gradient($color1, $color2) {
color: $color1;
@supports (-webkit-background-clip: text) {
background: linear-gradient(to right, $color1, $color2);
background-clip: text;
-webkit-text-fill-color: transparent;
}
}