Skip to content

Commit 1b1919b

Browse files
palewirepalewire
authored
Merge branch 'master' into orange-footer
2 parents b601c33 + 2e8882a commit 1b1919b

File tree

5 files changed

+152
-114
lines changed

5 files changed

+152
-114
lines changed

‎_sass/_nav.scss

Lines changed: 0 additions & 107 deletions
Original file line numberDiff line numberDiff line change
@@ -79,78 +79,6 @@ body {
7979
color: #E46E2E;
8080
}
8181

82-
/*Main logo animation on the front page of the Jupyter website */
83-
.main-logo {
84-
height: calc(100% - 20px);
85-
margin-top: 10px;
86-
padding-left: 20px;
87-
}
88-
89-
@-webkit-keyframes fadeIn { from { opacity:0;} to { opacity:1;} }
90-
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
91-
@keyframes fadeIn { from { opacity:0;} to { opacity:1;} }
92-
/*This entire section related to fading is for the front page with the Jupyter logo*/
93-
.fade-in {
94-
-webkit-animation:fadeIn ease-in 1; /* call our keyframe named fadeIn, use animation ease-in and repeat it only 1 time */
95-
-moz-animation:fadeIn ease-in 1;
96-
animation:fadeIn ease-in 1;
97-
98-
-webkit-animation-duration:1s;
99-
-moz-animation-duration:1s;
100-
animation-duration:1s;
101-
102-
-webkit-animation-fill-mode:forwards; /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
103-
-moz-animation-fill-mode:forwards;
104-
animation-fill-mode:forwards;
105-
106-
opacity:0; /* make things invisible upon start */
107-
}
108-
109-
.fade-in.one {
110-
-webkit-animation-delay: 0.3s;
111-
-moz-animation-delay: 0.3s;
112-
animation-delay: 0.3s;
113-
}
114-
115-
.fade-in.two {
116-
-webkit-animation-delay: 0.7s;
117-
-moz-animation-delay:0.7s;
118-
animation-delay: 0.7s;
119-
}
120-
121-
.fade-in.three {
122-
-webkit-animation-delay: 1.1s;
123-
-moz-animation-delay: 1.1s;
124-
animation-delay: 1.1s;
125-
}
126-
127-
.jumbotron {
128-
background-color: white;
129-
margin-top:30px;
130-
overflow: hidden;
131-
}
132-
133-
.jumbotron img {
134-
margin: 0 auto;
135-
}
136-
137-
.jumbotron-text {
138-
padding-bottom: 32px;
139-
text-align: center;
140-
}
141-
142-
.img-container {
143-
height: 100%;
144-
margin: 0 auto;
145-
position: absolute;
146-
text-align: center;
147-
width: 95%;
148-
}
149-
150-
.img-container img {
151-
vertical-align: middle;
152-
}
153-
15482
/* Reusable elements */
15583

15684
/* Header section of each page */
@@ -347,28 +275,6 @@ body {
347275
opacity: 0.65;
348276
}
349277

350-
/* JupyterHub section on front page */
351-
/* Feature-middle is for the JupyterHub features that are in the middle that need to be offset to sit on the track */
352-
.feature-middle {
353-
margin-top: 40px;
354-
}
355-
356-
.hubfeature {
357-
text-align: center;
358-
}
359-
360-
.hubfeature img {
361-
margin: 0 auto;
362-
}
363-
364-
.hubfeatures {
365-
background: url("../assets/line.svg");
366-
background-position: top center;
367-
background-repeat: no-repeat;
368-
/* Padding that is used to make the hubfeature circles sit on track */
369-
padding-top: 48px;
370-
}
371-
372278
/* Architecture section on front page */
373279
/* Some padding above the cards */
374280
.architecturecontent {
@@ -672,18 +578,9 @@ body {
672578
.notebook-feature {
673579
padding-top: 40px;
674580
}
675-
.hubfeatures{
676-
background: none;
677-
}
678581
#data {
679582
padding-top: 40px;
680583
}
681-
.hubfeature h2 {
682-
text-align: center;
683-
}
684-
#hublogo {
685-
width: 60%;
686-
}
687584
.architecturedescription h2 {
688585
text-align: center;
689586
}
@@ -767,7 +664,6 @@ body {
767664
}
768665

769666
@media (max-width: 768px) {
770-
771667
p {
772668
font-size: 16px;
773669
font-weight: 400;
@@ -815,9 +711,6 @@ body {
815711
body {
816712
padding-top: 50px;
817713
}
818-
.jumbotron {
819-
margin-right: 5%;
820-
}
821714
}
822715

823716
/* 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/footer";
13+
@import "components/jumbotron";
14+
@import "components/jupyterhub";

0 commit comments

Comments
 (0)