Skip to content

Commit aa380fb

Browse files
palewirepalewire
authored
Merge branch 'master' into simplify-about
2 parents 80cb574 + 2e8882a commit aa380fb

File tree

5 files changed

+152
-112
lines changed

5 files changed

+152
-112
lines changed

‎_sass/_nav.scss

Lines changed: 0 additions & 105 deletions
Original file line numberDiff line numberDiff line change
@@ -117,77 +117,7 @@ body {
117117
padding-left: 0;
118118
}
119119

120-
/*Main logo animation on the front page of the Jupyter website */
121-
.main-logo {
122-
height: calc(100% - 20px);
123-
margin-top: 10px;
124-
padding-left: 20px;
125-
}
126-
127-
@-webkit-keyframes fadeIn { from { opacity:0;} to { opacity:1;} }
128-
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
129-
@keyframes fadeIn { from { opacity:0;} to { opacity:1;} }
130-
/*This entire section related to fading is for the front page with the Jupyter logo*/
131-
.fade-in {
132-
-webkit-animation:fadeIn ease-in 1; /* call our keyframe named fadeIn, use animation ease-in and repeat it only 1 time */
133-
-moz-animation:fadeIn ease-in 1;
134-
animation:fadeIn ease-in 1;
135-
136-
-webkit-animation-duration:1s;
137-
-moz-animation-duration:1s;
138-
animation-duration:1s;
139-
140-
-webkit-animation-fill-mode:forwards; /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
141-
-moz-animation-fill-mode:forwards;
142-
animation-fill-mode:forwards;
143-
144-
opacity:0; /* make things invisible upon start */
145-
}
146-
147-
.fade-in.one {
148-
-webkit-animation-delay: 0.3s;
149-
-moz-animation-delay: 0.3s;
150-
animation-delay: 0.3s;
151-
}
152-
153-
.fade-in.two {
154-
-webkit-animation-delay: 0.7s;
155-
-moz-animation-delay:0.7s;
156-
animation-delay: 0.7s;
157-
}
158-
159-
.fade-in.three {
160-
-webkit-animation-delay: 1.1s;
161-
-moz-animation-delay: 1.1s;
162-
animation-delay: 1.1s;
163-
}
164-
165-
.jumbotron {
166-
background-color: white;
167-
margin-top:30px;
168-
overflow: hidden;
169-
}
170-
171-
.jumbotron img {
172-
margin: 0 auto;
173-
}
174-
175-
.jumbotron-text {
176-
padding-bottom: 32px;
177-
text-align: center;
178-
}
179-
180-
.img-container {
181-
height: 100%;
182-
margin: 0 auto;
183-
position: absolute;
184-
text-align: center;
185-
width: 95%;
186-
}
187120

188-
.img-container img {
189-
vertical-align: middle;
190-
}
191121

192122
/* Reusable elements */
193123

@@ -338,28 +268,6 @@ body {
338268
margin-bottom: 16px;
339269
}
340270

341-
/* JupyterHub section on front page */
342-
/* Feature-middle is for the JupyterHub features that are in the middle that need to be offset to sit on the track */
343-
.feature-middle {
344-
margin-top: 40px;
345-
}
346-
347-
.hubfeature {
348-
text-align: center;
349-
}
350-
351-
.hubfeature img {
352-
margin: 0 auto;
353-
}
354-
355-
.hubfeatures {
356-
background: url("../assets/line.svg");
357-
background-position: top center;
358-
background-repeat: no-repeat;
359-
/* Padding that is used to make the hubfeature circles sit on track */
360-
padding-top: 48px;
361-
}
362-
363271
/* Architecture section on front page */
364272
/* Some padding above the cards */
365273
.architecturecontent {
@@ -660,18 +568,9 @@ body {
660568
.notebook-feature {
661569
padding-top: 40px;
662570
}
663-
.hubfeatures{
664-
background: none;
665-
}
666571
#data {
667572
padding-top: 40px;
668573
}
669-
.hubfeature h2 {
670-
text-align: center;
671-
}
672-
#hublogo {
673-
width: 60%;
674-
}
675574
.architecturedescription h2 {
676575
text-align: center;
677576
}
@@ -755,7 +654,6 @@ body {
755654
}
756655

757656
@media (max-width: 768px) {
758-
759657
p {
760658
font-size: 16px;
761659
font-weight: 400;
@@ -803,9 +701,6 @@ body {
803701
body {
804702
padding-top: 50px;
805703
}
806-
.jumbotron {
807-
margin-right: 5%;
808-
}
809704
}
810705

811706
/* Extra small devices (these are mostly fixes to make sure elements act correctly to look good) */

‎_sass/components/_jumbotron.scss

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
/*Main logo animation on the front page of the Jupyter website */
2+
3+
@-webkit-keyframes fadeIn { from { opacity:0;} to { opacity:1;} }
4+
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
5+
@keyframes fadeIn { from { opacity:0;} to { opacity:1;} }
6+
/*This entire section related to fading is for the front page with the Jupyter logo*/
7+
.fade-in {
8+
-webkit-animation:fadeIn ease-in 1; /* call our keyframe named fadeIn, use animation ease-in and repeat it only 1 time */
9+
-moz-animation:fadeIn ease-in 1;
10+
animation:fadeIn ease-in 1;
11+
12+
-webkit-animation-duration:1s;
13+
-moz-animation-duration:1s;
14+
animation-duration:1s;
15+
16+
-webkit-animation-fill-mode:forwards; /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
17+
-moz-animation-fill-mode:forwards;
18+
animation-fill-mode:forwards;
19+
20+
opacity:0; /* make things invisible upon start */
21+
}
22+
23+
.jumbotron {
24+
background-color: white;
25+
margin-top:30px;
26+
overflow: hidden;
27+
@media (max-width: 768px) {
28+
margin-right: 5%;
29+
}
30+
.main-logo {
31+
height: calc(100% - 20px);
32+
margin-top: 10px;
33+
padding-left: 20px;
34+
}
35+
.fade-in.one {
36+
-webkit-animation-delay: 0.3s;
37+
-moz-animation-delay: 0.3s;
38+
animation-delay: 0.3s;
39+
}
40+
.fade-in.two {
41+
-webkit-animation-delay: 0.7s;
42+
-moz-animation-delay:0.7s;
43+
animation-delay: 0.7s;
44+
}
45+
.fade-in.three {
46+
-webkit-animation-delay: 1.1s;
47+
-moz-animation-delay: 1.1s;
48+
animation-delay: 1.1s;
49+
}
50+
.jumbotron-image-container {
51+
height: 100%;
52+
margin: 0 auto;
53+
position: absolute;
54+
text-align: center;
55+
width: 95%;
56+
img {
57+
margin: 0 auto;
58+
vertical-align: middle;
59+
}
60+
}
61+
}
62+
63+
.jumbotron-text {
64+
padding-bottom: 32px;
65+
text-align: center;
66+
}

‎_sass/components/_jupyterhub.scss

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
/* JupyterHub section on front page */
2+
/* Feature-middle is for the JupyterHub features that are in the middle that need to be offset to sit on the track */
3+
4+
.jupyterhub {
5+
.feature-middle {
6+
margin-top: 40px;
7+
}
8+
9+
.hublogo {
10+
margin-left: auto;
11+
margin-right: auto;
12+
max-width: 600px;
13+
}
14+
15+
.hubfeature {
16+
text-align: center;
17+
img {
18+
margin: 0 auto;
19+
}
20+
}
21+
22+
.hubdescription {
23+
margin-bottom: -36px;
24+
}
25+
26+
.hubfeatures {
27+
background: url("../assets/line.svg");
28+
background-position: top center;
29+
background-repeat: no-repeat;
30+
/* Padding that is used to make the hubfeature circles sit on track */
31+
padding-top: 48px;
32+
}
33+
34+
.hubbutton {
35+
text-align: center;
36+
margin-top: 24px;
37+
}
38+
39+
@media (max-width: 992px) {
40+
.hublogo {
41+
max-width: 80%;
42+
}
43+
.hubfeatures{
44+
background: none;
45+
}
46+
.hubfeature h2 {
47+
text-align: center;
48+
}
49+
}
50+
}

‎assets/css/main.scss

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,3 +10,5 @@
1010
@import "gallery";
1111
@import "syntax";
1212
@import "components/logogrid";
13+
@import "components/jumbotron";
14+
@import "components/jupyterhub";

0 commit comments

Comments
 (0)