Skip to content

Commit 5ca12dd

Browse files
authored
fix: features popup for light theme (#2196)
1 parent 698e9f1 commit 5ca12dd

File tree

1 file changed

+32
-31
lines changed

1 file changed

+32
-31
lines changed

studio/src/components/dashboard/NewFeaturesPopup.tsx

Lines changed: 32 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -19,24 +19,24 @@ export default function NewFeaturesPopup() {
1919

2020
return (
2121
<div className="group relative w-[195px] overflow-hidden rounded-lg p-[1px] before:absolute before:inset-0 before:z-[-1] before:rounded-lg before:bg-gradient-to-r before:from-[hsla(271,91%,65%,1)] before:to-[hsla(330,81%,60%,1)] before:content-['']">
22-
<div className="relative z-10 flex h-full w-full flex-col items-start justify-center gap-4 rounded-lg bg-[#15121C] p-3">
22+
<div className="relative z-10 flex h-full w-full flex-col items-start justify-center gap-4 rounded-lg bg-card p-3">
2323
<div className="flex w-full flex-col gap-1.5">
2424
<div className="flex w-full items-start justify-between">
25-
<h2 className="text-base font-semibold leading-tight text-white">
25+
<h2 className="text-base font-semibold leading-tight text-card-foreground">
2626
Cosmo Connect
2727
<br />
2828
is here!
2929
</h2>
3030
<Button
3131
variant="ghost"
3232
size="icon"
33-
className="h-4 w-4 cursor-pointer text-white/50 opacity-0 transition-all duration-300 group-hover:opacity-100"
33+
className="h-4 w-4 cursor-pointer text-muted-foreground opacity-0 transition-all duration-300 group-hover:opacity-100"
3434
onClick={handleClosePopup}
3535
>
3636
<Cross2Icon />
3737
</Button>
3838
</div>
39-
<p className="text-sm leading-snug text-white/50">
39+
<p className="text-sm leading-snug text-muted-foreground">
4040
A new way to unify your
4141
<br />
4242
API ecosystem
@@ -46,7 +46,7 @@ export default function NewFeaturesPopup() {
4646
href="https://wundergraph.com/connect"
4747
target="_blank"
4848
rel="noreferrer"
49-
className="flex items-center gap-x-1 text-sm font-medium text-white hover:underline"
49+
className="flex items-center gap-x-1 text-sm font-medium text-card-foreground hover:underline"
5050
>
5151
Learn more
5252
<MdArrowOutward className="h-4 w-4" />
@@ -59,131 +59,132 @@ export default function NewFeaturesPopup() {
5959
viewBox="0 0 172 112"
6060
fill="none"
6161
xmlns="http://www.w3.org/2000/svg"
62+
className="text-foreground"
6263
>
6364
<g opacity="0.4" clip-path="url(#clip0_354_8)">
6465
<path
6566
d="M167.149 98L167.334 98.2697L167.647 98.3621L167.448 98.6212L167.457 98.948L167.149 98.8385L166.841 98.948L166.85 98.6212L166.651 98.3621L166.964 98.2697L167.149 98Z"
66-
fill="white"
67+
fill="currentColor"
6768
fill-opacity="0.4"
6869
/>
6970
<path
7071
d="M158.193 48L158.393 48.2922L158.733 48.3924L158.517 48.6732L158.527 49.0273L158.193 48.9086L157.859 49.0273L157.869 48.6732L157.653 48.3924L157.993 48.2922L158.193 48Z"
71-
fill="white"
72+
fill="currentColor"
7273
fill-opacity="0.6"
7374
/>
7475
<path
7576
d="M148.404 36L148.679 36.4009L149.145 36.5383L148.849 36.9236L148.862 37.4094L148.404 37.2466L147.946 37.4094L147.96 36.9236L147.663 36.5383L148.129 36.4009L148.404 36Z"
76-
fill="white"
77+
fill="currentColor"
7778
fill-opacity="0.4"
7879
/>
7980
<path
8081
d="M134.415 48L134.694 48.4065L135.166 48.5458L134.866 48.9364L134.879 49.429L134.415 49.2639L133.951 49.429L133.964 48.9364L133.664 48.5458L134.136 48.4065L134.415 48Z"
81-
fill="white"
82+
fill="currentColor"
8283
fill-opacity="0.5"
8384
/>
8485
<path
8586
d="M1.27529 29L1.50463 29.3346L1.89376 29.4493L1.64637 29.7709L1.65752 30.1764L1.27529 30.0405L0.89306 30.1764L0.904213 29.7709L0.656828 29.4493L1.04595 29.3346L1.27529 29Z"
86-
fill="white"
87+
fill="currentColor"
8788
fill-opacity="0.4"
8889
/>
8990
<path
9091
d="M61.3616 107L61.6214 107.379L62.0621 107.509L61.7819 107.873L61.7945 108.333L61.3616 108.179L60.9286 108.333L60.9413 107.873L60.6611 107.509L61.1018 107.379L61.3616 107Z"
91-
fill="white"
92+
fill="currentColor"
9293
fill-opacity="0.6"
9394
/>
9495
<path
9596
d="M144.459 61L144.753 61.4289L145.251 61.576L144.934 61.9881L144.949 62.5079L144.459 62.3337L143.969 62.5079L143.983 61.9881L143.666 61.576L144.165 61.4289L144.459 61Z"
96-
fill="white"
97+
fill="currentColor"
9798
fill-opacity="0.3"
9899
/>
99100
<path
100101
d="M36.3255 6L36.5725 6.36046L36.9917 6.48402L36.7252 6.83035L36.7372 7.26718L36.3255 7.12076L35.9137 7.26718L35.9258 6.83035L35.6593 6.48402L36.0784 6.36046L36.3255 6Z"
101-
fill="white"
102+
fill="currentColor"
102103
fill-opacity="0.4"
103104
/>
104105
<path
105106
d="M97.5475 98L97.8729 98.4747L98.4249 98.6374L98.0739 99.0936L98.0898 99.6689L97.5475 99.476L97.0053 99.6689L97.0211 99.0936L96.6702 98.6374L97.2222 98.4747L97.5475 98Z"
106-
fill="white"
107+
fill="currentColor"
107108
fill-opacity="0.5"
108109
/>
109110
<path
110111
d="M152.437 81L152.723 81.4177L153.209 81.5609L152.9 81.9622L152.914 82.4684L152.437 82.2988L151.96 82.4684L151.974 81.9622L151.665 81.5609L152.15 81.4177L152.437 81Z"
111-
fill="white"
112+
fill="currentColor"
112113
fill-opacity="0.4"
113114
/>
114115
<path
115116
d="M114.176 2L114.37 2.28354L114.7 2.38074L114.49 2.65317L114.5 2.99678L114.176 2.88161L113.852 2.99678L113.862 2.65317L113.652 2.38074L113.982 2.28354L114.176 2Z"
116-
fill="white"
117+
fill="currentColor"
117118
fill-opacity="0.3"
118119
/>
119120
<path
120121
d="M21.4439 45L21.7326 45.4214L22.2226 45.5658L21.9111 45.9707L21.9252 46.4813L21.4439 46.3102L20.9625 46.4813L20.9766 45.9707L20.6651 45.5658L21.1551 45.4214L21.4439 45Z"
121-
fill="white"
122+
fill="currentColor"
122123
fill-opacity="0.6"
123124
/>
124125
<path
125126
d="M3.29337 56L3.52908 56.3439L3.92902 56.4618L3.67476 56.7923L3.68622 57.2091L3.29337 57.0694L2.90051 57.2091L2.91197 56.7923L2.65771 56.4618L3.05765 56.3439L3.29337 56Z"
126-
fill="white"
127+
fill="currentColor"
127128
fill-opacity="0.4"
128129
/>
129130
<path
130131
d="M148.289 21L148.523 21.3415L148.92 21.4586L148.667 21.7867L148.679 22.2005L148.289 22.0618L147.899 22.2005L147.91 21.7867L147.657 21.4586L148.055 21.3415L148.289 21Z"
131-
fill="white"
132+
fill="currentColor"
132133
fill-opacity="0.6"
133134
/>
134135
<path
135136
d="M128.593 7L128.934 7.49805L129.513 7.66878L129.145 8.14731L129.162 8.75088L128.593 8.54858L128.024 8.75088L128.041 8.14731L127.672 7.66878L128.252 7.49805L128.593 7Z"
136-
fill="white"
137+
fill="currentColor"
137138
fill-opacity="0.4"
138139
/>
139140
<path
140141
d="M75.2941 27L75.5301 27.3443L75.9305 27.4624L75.676 27.7932L75.6875 28.2105L75.2941 28.0706L74.9008 28.2105L74.9123 27.7932L74.6578 27.4624L75.0582 27.3443L75.2941 27Z"
141-
fill="white"
142+
fill="currentColor"
142143
fill-opacity="0.5"
143144
/>
144145
<path
145146
d="M30.5281 65L30.8466 65.4647L31.387 65.624L31.0434 66.0705L31.0589 66.6337L30.5281 66.445L29.9973 66.6337L30.0128 66.0705L29.6692 65.624L30.2096 65.4647L30.5281 65Z"
146-
fill="white"
147+
fill="currentColor"
147148
fill-opacity="0.6"
148149
/>
149150
<path
150151
d="M43.1377 106L43.3186 106.264L43.6254 106.354L43.4303 106.608L43.4391 106.928L43.1377 106.82L42.8364 106.928L42.8451 106.608L42.6501 106.354L42.9569 106.264L43.1377 106Z"
151-
fill="white"
152+
fill="currentColor"
152153
fill-opacity="0.3"
153154
/>
154155
<path
155156
d="M85.5896 59L85.9298 59.4964L86.507 59.6665L86.1401 60.1435L86.1566 60.745L85.5896 60.5434L85.0226 60.745L85.0392 60.1435L84.6722 59.6665L85.2494 59.4964L85.5896 59Z"
156-
fill="white"
157+
fill="currentColor"
157158
fill-opacity="0.4"
158159
/>
159160
<path
160161
d="M55.5021 110L55.8114 110.451L56.3362 110.606L56.0026 111.04L56.0176 111.587L55.5021 111.403L54.9865 111.587L55.0016 111.04L54.6679 110.606L55.1928 110.451L55.5021 110Z"
161-
fill="white"
162+
fill="currentColor"
162163
fill-opacity="0.5"
163164
/>
164165
<path
165166
d="M120.365 78L120.627 78.381L121.07 78.5116L120.788 78.8777L120.801 79.3395L120.365 79.1847L119.93 79.3395L119.943 78.8777L119.661 78.5116L120.104 78.381L120.365 78Z"
166-
fill="white"
167+
fill="currentColor"
167168
fill-opacity="0.6"
168169
/>
169170
<path
170171
d="M120.171 53L120.364 53.2811L120.691 53.3774L120.483 53.6474L120.492 53.988L120.171 53.8739L119.85 53.988L119.86 53.6474L119.652 53.3774L119.979 53.2811L120.171 53Z"
171-
fill="white"
172+
fill="currentColor"
172173
fill-opacity="0.6"
173174
/>
174175
<path
175176
d="M48.3321 8L48.5815 8.36387L49.0046 8.4886L48.7356 8.83821L48.7477 9.27917L48.3321 9.13137L47.9165 9.27917L47.9286 8.83821L47.6596 8.4886L48.0827 8.36387L48.3321 8Z"
176-
fill="white"
177+
fill="currentColor"
177178
fill-opacity="0.4"
178179
/>
179180
<path
180181
d="M170.44 13L170.727 13.4194L171.215 13.5631L170.905 13.966L170.919 14.4742L170.44 14.3039L169.961 14.4742L169.975 13.966L169.665 13.5631L170.153 13.4194L170.44 13Z"
181-
fill="white"
182+
fill="currentColor"
182183
fill-opacity="0.5"
183184
/>
184185
<path
185186
d="M3.42133 3L3.70218 3.40979L4.17869 3.55025L3.87575 3.94398L3.88941 4.44058L3.42133 4.27413L2.95326 4.44058L2.96692 3.94398L2.66398 3.55025L3.14049 3.40979L3.42133 3Z"
186-
fill="white"
187+
fill="currentColor"
187188
fill-opacity="0.4"
188189
/>
189190
</g>
@@ -192,7 +193,7 @@ export default function NewFeaturesPopup() {
192193
<rect
193194
width="171"
194195
height="112"
195-
fill="white"
196+
fill="currentColor"
196197
transform="translate(0.625)"
197198
/>
198199
</clipPath>

0 commit comments

Comments
 (0)