Skip to content

Commit ae59558

Browse files
niklas-wortmannniklas-wortmann
committed
docs(index): support blm movement
1 parent 3d6e4c5 commit ae59558

File tree

6 files changed

+48
-188
lines changed

6 files changed

+48
-188
lines changed

‎docs_app/content/marketing/index.html‎

Lines changed: 23 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -1,64 +1,26 @@
1-
<!-- FULL HEADER BLOCK -->
2-
<header>
3-
4-
<!-- BACKGROUND IMAGE -->
5-
<div class="hero"></div>
6-
7-
<!-- INTRO SECTION -->
8-
<section id="intro">
9-
10-
<!-- LOGO -->
11-
<div class="hero-logo">
12-
<img src="generated/images/marketing/home/Rx_Logo-512-512.png" alt="RxJS logo"/>
13-
</div>
14-
15-
<!-- CONTAINER -->
16-
<div class="homepage-container">
17-
<div class="headline-container">
18-
<h2 class="hero-headline no-toc">RxJS</h2>
19-
<span class="hero-subheadline">Reactive Extensions Library for JavaScript</span>
20-
</div>
21-
<a class="button hero-cta" href="/guide/overview">Get Started</a>
22-
<a class="button hero-cta" href="/api">API Docs</a>
23-
</div>
24-
25-
</section>
26-
27-
</header>
28-
291
<!-- MAIN CONTENT -->
30-
<article>
31-
32-
<h1 class="no-anchor no-toc" style="display: none"></h1>
33-
34-
<div class="home-rows">
35-
36-
<aio-announcement-bar></aio-announcement-bar>
37-
38-
<!-- Group 1 -->
39-
<div layout="row" layout-xs="column" class="home-row homepage-container">
40-
41-
<div class="text-container">
42-
<div class="text-block promo-1-desc l-pad-top-2">
43-
<div class="text-headline">Reactive Extensions Library for JavaScript</div>
44-
<p class="text-body">
45-
RxJS is a library for reactive programming using Observables, to make it easier to compose asynchronous or callback-based code. This project is a rewrite of Reactive-Extensions/RxJS with better performance, better modularity, better debuggable call stacks, while staying mostly backwards compatible, with some breaking changes that reduce the API surface
46-
</p>
47-
</div>
48-
</div>
2+
<article class="blm-background">
3+
4+
<div layout="row" layout-xs="column" class="home-row homepage-container">
5+
<div class="text-container blm-container">
6+
<h1 class="no-anchor no-toc" style="font-size: 3rem; line-height: inherit">BLACK LIVES MATTER</h1>
7+
<p class="blm-text">
8+
We stand in solidarity with the Black Lives Matter movement. We believe that technologists must not be silent in the fight to end racial inequality. </p>
9+
<p class="blm-text">
10+
We ask you to stand with us and help educate your team members and those in your network on how to help dismantle a system that oppresses Black people. Find a list of starting resources here:
11+
<ul style="list-style-type: none; line-height: inherit; padding-inline-start: 0">
12+
<li class="blm-list-item"><a class="blm-text" href="https://www.youtube.com/watch?v=-aCn72iXO9s">Let's get to the root of racial injustice by Megan Ming Francis</a></li>
13+
<li class="blm-list-item"><a class="blm-text" href="http://www.changecadet.com/blog/2020/5/30/what-leaders-can-do-for-black-employees">What Leaders can do for Black Employees by Dr. Akilah Cadet</a></li>
14+
<li class="blm-list-item"><a class="blm-text" href="https://blacktechpipeline.substack.com/p/hey-employers-do-black-lives-matter">Hey Employers: Do Black Lives Matter? by Pariss Athena</a></li>
15+
<li class="blm-list-item"><a class="blm-text" href="https://safiyaunoble.com/">Algorithms of Oppression by Safiya Umoja Noble</a></li>
16+
<li class="blm-list-item"><a class="blm-text" href="https://www.rageinsidethemachine.com/">Rage Inside The Machine by Robert Smith</a></li>
17+
<li class="blm-list-item"><a class="blm-text" href="https://www.sarawb.com/">Technically Wrong by Sara Wachter-Boettcher</a></li>
18+
</ul>
19+
</p>
20+
<p class="blm-text">
21+
In solidarity, we ask you to consider financially supporting efforts such as <a class="blm-text" href="https://secure.actblue.com/donate/ms_blm_homepage_2019">Black Lives Matter</a>,
22+
<a class="blm-text" href="https://support.eji.org/give/153413/#!/donation/checkout">The Equal Justice Initiative</a> or local charity organizations.
23+
</p>
4924
</div>
50-
<hr>
51-
<div layout="row" layout-xs="column" class="home-row homepage-container">
52-
<div layout="row" layout-xs="column" class="home-row">
53-
<a href="code-of-conduct">
54-
<div class="card">
55-
<div class="card-text-container">
56-
<p>Please pay attention to our</p>
57-
<div class="text-headline">Code of Conduct</div>
58-
</div>
59-
</div>
60-
</a>
61-
</div>
62-
</div><!-- end of home rows -->
63-
25+
</div>
6426
</article>

‎docs_app/src/app/app.component.html‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -66,8 +66,3 @@
6666
<div *ngIf="hasFloatingToc" class="toc-container no-print" [style.max-height.px]="tocMaxHeight" (mousewheel)="restrainScrolling($event)">
6767
<aio-lazy-ce selector="aio-toc"></aio-lazy-ce>
6868
</div>
69-
70-
<footer class="no-print">
71-
<aio-footer [nodes]="footerNodes" [versionInfo]="versionInfo" ></aio-footer>
72-
</footer>
73-

‎docs_app/src/app/layout/footer/footer.component.html‎

Lines changed: 0 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +0,0 @@
1-
2-
<p>
3-
Code licensed under an <a href="https://www.apache.org/licenses/LICENSE-2.0">Apache-2.0 License</a>.
4-
Documentation licensed under
5-
<a href="http://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a>.
6-
</p>
7-
<p>
8-
Version {{versionInfo?.full}}.
9-
</p>
10-
<!-- TODO: twitter widget (but only on pages that use twitter) -->

‎docs_app/src/styles/1-layouts/_footer.scss‎

Lines changed: 0 additions & 110 deletions
Original file line numberDiff line numberDiff line change
@@ -1,110 +0,0 @@
1-
footer {
2-
position: relative;
3-
line-height: 24px;
4-
flex: 1;
5-
padding: 48px;
6-
z-index: 0;
7-
background-color: $pink;
8-
color: $offwhite;
9-
font-weight: 300;
10-
11-
aio-footer {
12-
position: relative;
13-
z-index: 0;
14-
}
15-
16-
.footer-block {
17-
margin: 0 24px;
18-
vertical-align: top;
19-
}
20-
21-
a {
22-
color: $offwhite;
23-
font-weight: 300;
24-
text-decoration: none;
25-
z-index: 20;
26-
position: relative;
27-
&:hover {
28-
text-decoration: underline;
29-
}
30-
&:visited {
31-
text-decoration: none;
32-
}
33-
}
34-
a.action {
35-
cursor: pointer;
36-
}
37-
h3 {
38-
font-size: 16px;
39-
text-transform: uppercase;
40-
font-weight: 400;
41-
margin: 0 0 16px;
42-
}
43-
p {
44-
text-align: center;
45-
margin: 10px 0px 5px;
46-
47-
@media (max-width: 480px) {
48-
text-align: left;
49-
}
50-
}
51-
52-
div.grid-fluid {
53-
display: -ms-flexbox;
54-
display: -webkit-flex;
55-
display: flex;
56-
57-
justify-content: center;
58-
59-
text-align: left;
60-
margin: 0 0 40px;
61-
62-
ul {
63-
list-style-position: inside;
64-
padding: 0px;
65-
margin: 0px;
66-
67-
li {
68-
list-style-type: none;
69-
padding: 0px;
70-
text-align: left;
71-
}
72-
}
73-
74-
@media (max-width: 480px) {
75-
flex-direction: column;
76-
.footer-block {
77-
margin: 8px 24px;
78-
}
79-
}
80-
}
81-
82-
83-
84-
85-
@media (max-width: 700px) {
86-
h3 {
87-
font-size: 110%;
88-
}
89-
}
90-
@media (max-width: 600px) {
91-
h3 {
92-
font-size: 100%;
93-
}
94-
}
95-
}
96-
97-
footer::after {
98-
content: "";
99-
position: absolute;
100-
z-index: -1;
101-
top: 0;
102-
bottom: 0;
103-
left: 0;
104-
right: 0;
105-
//background:
106-
// url('../src/assets/images/logos/angular/angular_whiteTransparent_withMargin.png') top 0 left 0 repeat,
107-
// url('../src/assets/images/logos/angular/angular_whiteTransparent_withMargin.png') top 80px left 160px repeat;
108-
//opacity: 0.05;
109-
background-size: 320px auto;
110-
}

‎docs_app/src/styles/1-layouts/_marketing-layout.scss‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -456,3 +456,25 @@ div[layout=row]{
456456
.page-features .marketing-banner {
457457
margin-bottom: 20px;
458458
}
459+
460+
.blm-background {
461+
background-color: black;
462+
color: white;
463+
display: flex;
464+
min-height: calc(100vh - 64px)
465+
}
466+
467+
.text-container.blm-container {
468+
text-align: center;
469+
line-height: inherit;
470+
max-width: inherit;
471+
}
472+
473+
.blm-text {
474+
font-size: 2rem;
475+
line-height: inherit
476+
}
477+
478+
.blm-list-item {
479+
margin: 10px 0
480+
}

‎docs_app/src/styles/1-layouts/_top-menu.scss‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ mat-toolbar.mat-toolbar {
1111
left: 0;
1212
z-index: 10;
1313
box-shadow: 0 2px 5px 0 rgba(0,0,0,0.30);
14+
background-color: black !important;
1415

1516
mat-toolbar-row {
1617
padding: 0 16px 0 0;
@@ -24,11 +25,11 @@ mat-toolbar.mat-toolbar {
2425

2526
// HOME PAGE OVERRIDE: TOPNAV TOOLBAR
2627
aio-shell.page-home mat-toolbar.mat-toolbar {
27-
background-color: $pink;
28+
background-color: black;
2829

2930
@media (min-width: 481px) {
3031
&:not(.transitioning) {
31-
background-color: $pink;
32+
background-color: black;
3233
transition: background-color .2s linear;
3334
}
3435
}

0 commit comments

Comments
 (0)