Skip to content

Commit 2b40f5c

Browse files
zombieJzombieJ
committed
chore: fallback of old bro
1 parent c9cc945 commit 2b40f5c

File tree

2 files changed

+72
-62
lines changed

2 files changed

+72
-62
lines changed

‎tests/__snapshots__/conic.spec.tsx.snap

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,11 @@ exports[`Circle.conic gapDegree 1`] = `
4141
>
4242
<div
4343
style="width: 100%; height: 100%;"
44-
/>
44+
>
45+
<div
46+
style="width: 100%; height: 100%;"
47+
/>
48+
</div>
4549
</foreignobject>
4650
</svg>
4751
</DocumentFragment>
@@ -88,7 +92,11 @@ exports[`Circle.conic should work 1`] = `
8892
>
8993
<div
9094
style="width: 100%; height: 100%;"
91-
/>
95+
>
96+
<div
97+
style="width: 100%; height: 100%;"
98+
/>
99+
</div>
92100
</foreignobject>
93101
</svg>
94102
</DocumentFragment>

‎tests/__snapshots__/index.spec.js.snap

Lines changed: 62 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -89,90 +89,92 @@ exports[`Progress Circle should gradient works and circles have different gradie
8989
role="presentation"
9090
viewBox="0 0 100 100"
9191
>
92-
<defs>
93-
<linearGradient
94-
id="rc_progress_TEST_OR_SSR-gradient"
95-
x1="100%"
96-
x2="0%"
97-
y1="0%"
98-
y2="0%"
99-
>
100-
<stop
101-
offset="0%"
102-
stop-color="#108ee9"
103-
/>
104-
<stop
105-
offset="100%"
106-
stop-color="#87d068"
107-
/>
108-
</linearGradient>
109-
</defs>
11092
<circle
11193
class="rc-progress-circle-trail"
11294
cx="50"
11395
cy="50"
11496
r="47"
11597
stroke="#D9D9D9"
116-
stroke-linecap="round"
98+
stroke-linecap="butt"
11799
stroke-width="1"
118100
style="stroke: #D9D9D9; stroke-dasharray: 295.3097094374406px 295.3097094374406; stroke-dashoffset: 0; transform: rotate(-90deg); transform-origin: 50px 50px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; fill-opacity: 0;"
119101
/>
120-
<circle
121-
class="rc-progress-circle-path"
122-
cx="50"
123-
cy="50"
124-
opacity="1"
125-
r="47"
126-
stroke="url(#rc_progress_TEST_OR_SSR-gradient)"
127-
stroke-linecap="round"
128-
stroke-width="6"
129-
style="stroke-dasharray: 295.3097094374406px 295.3097094374406; stroke-dashoffset: 32.53097094374406; transform: rotate(-90deg); transform-origin: 50px 50px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; fill-opacity: 0; transition-duration: 0s, 0s;"
130-
/>
102+
<mask
103+
id="rc_progress_TEST_OR_SSR-gradient-conic"
104+
>
105+
<circle
106+
class="rc-progress-circle-path"
107+
cx="50"
108+
cy="50"
109+
opacity="1"
110+
r="47"
111+
stroke="#FFF"
112+
stroke-linecap="butt"
113+
stroke-width="6"
114+
style="stroke-dasharray: 295.3097094374406px 295.3097094374406; stroke-dashoffset: 29.53097094374406; transform: rotate(-90deg); transform-origin: 50px 50px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; fill-opacity: 0; transition-duration: 0s, 0s;"
115+
/>
116+
</mask>
117+
<foreignObject
118+
height="100"
119+
mask="url(#rc_progress_TEST_OR_SSR-gradient-conic)"
120+
width="100"
121+
x="0"
122+
y="0"
123+
>
124+
<div
125+
style="width: 100%; height: 100%;"
126+
>
127+
<div
128+
style="width: 100%; height: 100%;"
129+
/>
130+
</div>
131+
</foreignObject>
131132
</svg>
132133
<svg
133134
class="rc-progress-circle"
134135
role="presentation"
135136
viewBox="0 0 100 100"
136137
>
137-
<defs>
138-
<linearGradient
139-
id="rc_progress_TEST_OR_SSR-gradient"
140-
x1="100%"
141-
x2="0%"
142-
y1="0%"
143-
y2="0%"
144-
>
145-
<stop
146-
offset="0%"
147-
stop-color="#108ee9"
148-
/>
149-
<stop
150-
offset="100%"
151-
stop-color="#87d068"
152-
/>
153-
</linearGradient>
154-
</defs>
155138
<circle
156139
class="rc-progress-circle-trail"
157140
cx="50"
158141
cy="50"
159142
r="47"
160143
stroke="#D9D9D9"
161-
stroke-linecap="round"
144+
stroke-linecap="butt"
162145
stroke-width="1"
163146
style="stroke: #D9D9D9; stroke-dasharray: 295.3097094374406px 295.3097094374406; stroke-dashoffset: 0; transform: rotate(-90deg); transform-origin: 50px 50px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; fill-opacity: 0;"
164147
/>
165-
<circle
166-
class="rc-progress-circle-path"
167-
cx="50"
168-
cy="50"
169-
opacity="1"
170-
r="47"
171-
stroke="url(#rc_progress_TEST_OR_SSR-gradient)"
172-
stroke-linecap="round"
173-
stroke-width="6"
174-
style="stroke-dasharray: 295.3097094374406px 295.3097094374406; stroke-dashoffset: 32.53097094374406; transform: rotate(-90deg); transform-origin: 50px 50px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; fill-opacity: 0; transition-duration: 0s, 0s;"
175-
/>
148+
<mask
149+
id="rc_progress_TEST_OR_SSR-gradient-conic"
150+
>
151+
<circle
152+
class="rc-progress-circle-path"
153+
cx="50"
154+
cy="50"
155+
opacity="1"
156+
r="47"
157+
stroke="#FFF"
158+
stroke-linecap="butt"
159+
stroke-width="6"
160+
style="stroke-dasharray: 295.3097094374406px 295.3097094374406; stroke-dashoffset: 29.53097094374406; transform: rotate(-90deg); transform-origin: 50px 50px; transition: stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s, opacity .3s ease 0s; fill-opacity: 0; transition-duration: 0s, 0s;"
161+
/>
162+
</mask>
163+
<foreignObject
164+
height="100"
165+
mask="url(#rc_progress_TEST_OR_SSR-gradient-conic)"
166+
width="100"
167+
x="0"
168+
y="0"
169+
>
170+
<div
171+
style="width: 100%; height: 100%;"
172+
>
173+
<div
174+
style="width: 100%; height: 100%;"
175+
/>
176+
</div>
177+
</foreignObject>
176178
</svg>
177179
</div>
178180
`;

0 commit comments

Comments
 (0)