Skip to content

Commit 716ff8c

Browse files
authored
Revert "feat(pride): pride 2025" (#13224)
Revert "feat(pride): pride 2025 (#13065)" This reverts commit 18c67b3.
1 parent 1ec3bdf commit 716ff8c

File tree

7 files changed

+6
-228
lines changed

7 files changed

+6
-228
lines changed

client/src/homepage/homepage-hero/index.scss

Lines changed: 0 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -63,37 +63,13 @@
6363
}
6464

6565
p {
66-
font-size: 1.2rem;
6766
font-weight: 300;
6867
}
6968

7069
h1,
7170
p {
7271
text-shadow: var(--contrast-boost-shadow);
7372
}
74-
75-
p > span {
76-
position: relative;
77-
78-
&:after {
79-
background: linear-gradient(
80-
90deg,
81-
var(--pride-0) 0%,
82-
var(--pride-1) 20%,
83-
var(--pride-2) 40%,
84-
var(--pride-3) 60%,
85-
var(--pride-4) 80%,
86-
var(--pride-5) 100%
87-
);
88-
bottom: -0.1rem;
89-
box-shadow: var(--contrast-boost-shadow);
90-
content: "";
91-
height: 0.15rem;
92-
left: 0;
93-
position: absolute;
94-
right: 0;
95-
}
96-
}
9773
}
9874

9975
.homepage-hero-bg {

client/src/homepage/homepage-hero/index.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export function HomepageHero() {
1414
<br /> by Developers
1515
</h1>
1616
<p>
17-
<span>United in love.</span> Documenting{" "}
17+
Documenting web technologies, including{" "}
1818
<a
1919
href={`/${locale}/docs/Web/CSS`}
2020
data-glean={`${HOMEPAGE_HERO}: css`}
@@ -43,7 +43,7 @@ export function HomepageHero() {
4343
placeholder="What are you looking for?"
4444
/>
4545
</section>
46-
<Mandala pride={true} extraClasses="homepage-hero-bg animate-colors" />
46+
<Mandala extraClasses="homepage-hero-bg" />
4747
</div>
4848
);
4949
}

client/src/ui/atoms/logo/index.scss

Lines changed: 2 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -11,38 +11,9 @@
1111
margin-top: 0.3rem;
1212
}
1313

14-
#pride-gradient {
15-
:nth-child(1) {
16-
stop-color: var(--pride-0);
17-
}
18-
19-
:nth-child(2) {
20-
stop-color: var(--pride-1);
21-
}
22-
23-
:nth-child(3) {
24-
stop-color: var(--pride-2);
25-
}
26-
27-
:nth-child(4) {
28-
stop-color: var(--pride-3);
29-
}
30-
31-
:nth-child(5) {
32-
stop-color: var(--pride-4);
33-
}
34-
35-
:nth-child(6) {
36-
stop-color: var(--pride-5);
37-
}
38-
}
39-
40-
.logo-m {
41-
fill: url("#pride-gradient-v");
42-
}
43-
14+
.logo-m,
4415
.logo-_ {
45-
fill: url("#pride-gradient-h");
16+
fill: var(--text-link);
4617
}
4718

4819
.logo-text {

client/src/ui/atoms/logo/index.tsx

Lines changed: 0 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -19,36 +19,6 @@ export function Logo() {
1919
return (
2020
<a href={`/${locale}/`} className="logo" aria-label="MDN homepage">
2121
{(plus && <MDNPlusLogo />) || (docs && <MDNDocsLogo />) || <MDNLogo />}
22-
<svg width="0" height="0">
23-
<defs>
24-
<linearGradient id="pride-gradient">
25-
<stop offset="0" />
26-
<stop offset=".2" />
27-
<stop offset=".4" />
28-
<stop offset=".6" />
29-
<stop offset=".8" />
30-
<stop offset="1" />
31-
</linearGradient>
32-
<linearGradient
33-
href="#pride-gradient"
34-
id="pride-gradient-v"
35-
x1="0"
36-
x2="0"
37-
y1="0"
38-
y2="1"
39-
gradientUnits="objectBoundingBox"
40-
/>
41-
<linearGradient
42-
href="#pride-gradient"
43-
id="pride-gradient-h"
44-
x1="0"
45-
x2="1"
46-
y1="0"
47-
y2="0"
48-
gradientUnits="objectBoundingBox"
49-
/>
50-
</defs>
51-
</svg>
5222
</a>
5323
);
5424
}

client/src/ui/base/_themes.scss

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -653,12 +653,6 @@ body,
653653
--mdn-background-light: #{$mdn-theme-light-background-primary};
654654
--mdn-background-light-grey: #{$mdn-color-neutral-10};
655655
--color-announcement-banner-accent: #{$mdn-color-light-theme-pink-40};
656-
--pride-0: #e50000;
657-
--pride-1: #e68d00;
658-
--pride-2: #e6d600;
659-
--pride-3: #008100;
660-
--pride-4: #004cff;
661-
--pride-5: #760188;
662656
}
663657

664658
.light {

client/src/ui/molecules/mandala/index.scss

Lines changed: 0 additions & 118 deletions
Original file line numberDiff line numberDiff line change
@@ -40,122 +40,4 @@
4040
textPath[href="#circle5"] {
4141
font-size: 1rem;
4242
}
43-
44-
&.pride:not(.animate-colors) {
45-
textPath {
46-
opacity: 0.9;
47-
}
48-
49-
textPath[href="#circle1"] {
50-
fill: var(--pride-0);
51-
}
52-
53-
textPath[href="#circle2"] {
54-
fill: var(--pride-1);
55-
}
56-
57-
textPath[href="#circle3"] {
58-
fill: var(--pride-2);
59-
}
60-
61-
textPath[href="#circle4"] {
62-
fill: var(--pride-3);
63-
}
64-
65-
textPath[href="#circle5"] {
66-
fill: var(--pride-4);
67-
}
68-
69-
textPath[href="#circle6"] {
70-
fill: var(--pride-5);
71-
font-size: 0.9rem;
72-
font-weight: 500;
73-
}
74-
}
75-
76-
&.pride.animate-colors {
77-
svg > text > textPath > tspan {
78-
animation: mandala-color-change 50s infinite;
79-
animation-timing-function: ease-in-out;
80-
fill: var(--mandala-primary);
81-
}
82-
83-
textPath[href="#circle1"] > tspan {
84-
animation-delay: -15s;
85-
fill: var(--mandala-accent-1);
86-
}
87-
88-
textPath[href="#circle2"] > tspan {
89-
animation-delay: -20s;
90-
fill: var(--mandala-accent-2);
91-
}
92-
93-
textPath[href="#circle3"] > tspan {
94-
animation-delay: -30s;
95-
fill: var(--mandala-accent-3);
96-
}
97-
98-
textPath[href="#circle5"] > tspan {
99-
animation-delay: -40s;
100-
fill: var(--mandala-accent-4);
101-
}
102-
}
103-
104-
@keyframes mandala-color-change {
105-
0% {
106-
fill: var(--mandala-primary);
107-
}
108-
109-
10% {
110-
fill: var(--mandala-primary);
111-
}
112-
113-
15% {
114-
fill: var(--mandala-accent-1);
115-
}
116-
117-
20% {
118-
fill: var(--mandala-primary);
119-
}
120-
121-
25% {
122-
fill: var(--mandala-primary);
123-
}
124-
125-
30% {
126-
fill: var(--mandala-accent-2);
127-
}
128-
129-
35% {
130-
fill: var(--mandala-primary);
131-
}
132-
133-
40% {
134-
fill: var(--mandala-primary);
135-
}
136-
137-
50% {
138-
fill: var(--mandala-accent-3);
139-
}
140-
141-
55% {
142-
fill: var(--mandala-primary);
143-
}
144-
145-
60% {
146-
fill: var(--mandala-primary);
147-
}
148-
149-
65% {
150-
fill: var(--mandala-accent-4);
151-
}
152-
153-
70% {
154-
fill: var(--mandala-primary);
155-
}
156-
157-
100% {
158-
fill: var(--mandala-primary);
159-
}
160-
}
16143
}

client/src/ui/molecules/mandala/index.tsx

Lines changed: 2 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,9 @@
11
import "./index.scss";
22

3-
function Mandala({
4-
extraClasses = null,
5-
pride = false,
6-
}: {
7-
extraClasses?: string | null;
8-
pride?: boolean;
9-
}) {
3+
function Mandala({ extraClasses = null }: { extraClasses?: string | null }) {
104
return (
115
<div
12-
className={`mandala-container ${extraClasses || ""} ${pride ? "pride" : ""}`}
6+
className={`mandala-container ${extraClasses || ""}`}
137
aria-hidden="true"
148
>
159
<div className="mandala-translate">
@@ -131,15 +125,6 @@ function Mandala({
131125
<tspan>&lt;&gt;</tspan>&lt;/&gt;
132126
</textPath>
133127
</text>
134-
{pride && (
135-
<text dy="70" textLength="754">
136-
<textPath textLength="754" href="#circle6">
137-
<tspan>--&lt;3()</tspan>&nbsp;&nbsp; --&lt;3()&nbsp;&nbsp;
138-
<tspan>--&lt;3()</tspan>&nbsp;&nbsp; --&lt;3()&nbsp;&nbsp;
139-
<tspan>--&lt;3()</tspan>&nbsp;&nbsp; --&lt;3()&nbsp;&nbsp;
140-
</textPath>
141-
</text>
142-
)}
143128
</svg>
144129
</div>
145130
</div>

0 commit comments

Comments
 (0)