Skip to content

Commit ab570f3

Browse files
9bow9bow
committed
Edge 메뉴 콘텐츠 추가 (PyTorchKorea#54)
1 parent ae8dc50 commit ab570f3

30 files changed

+1127
-2
lines changed

‎_includes/footer_scripts.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717

1818
scrollToAnchor.bind();
1919

20-
var hasStaticHeader = $(".blog-header, .blog-detail-header, .resources-header, .get-started-header, .features-header, .ecosystem-header, .hub-header, .mobile-header, .coc-header").length > 0;
20+
var hasStaticHeader = $(".blog-header, .blog-detail-header, .resources-header, .get-started-header, .features-header, .ecosystem-header, .hub-header, .mobile-header, .coc-header, .announcement-header").length > 0;
2121

2222
if (!hasStaticHeader) {
2323
$(window).on("scroll", function() {

‎_sass/announcement.scss

+310
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,310 @@
1+
.announcement {
2+
.hero-content {
3+
top: $mobile_header_height + 80px;
4+
height: 250px;
5+
position: relative;
6+
margin-bottom: 120px;
7+
justify-content: center;
8+
9+
@include desktop {
10+
top: $mobile_header_height + 110px;
11+
height: 350px;
12+
}
13+
14+
h1 {
15+
font-size: rem(60px);
16+
text-transform: uppercase;
17+
font-weight: lighter;
18+
letter-spacing: 1.08px;
19+
margin-bottom: rem(10px);
20+
line-height: 1.05;
21+
color: $white;
22+
23+
@include desktop {
24+
font-size: rem(72px);
25+
}
26+
27+
}
28+
29+
h1.small {
30+
font-size: 40px;
31+
@include desktop {
32+
font-size: 58px;
33+
}
34+
}
35+
36+
.lead {
37+
margin-bottom: rem(25px);
38+
padding-top: rem(30px);
39+
color: $white;
40+
width: 100%;
41+
}
42+
}
43+
44+
.row {
45+
justify-content: center;
46+
}
47+
48+
.main-content {
49+
margin-bottom: 5rem;
50+
padding-bottom: 0;
51+
}
52+
53+
.main-background {
54+
height: 370px;
55+
@include desktop {
56+
height: 450px;
57+
}
58+
59+
}
60+
61+
.card-container {
62+
display: grid;
63+
grid-template-columns: repeat(2, 1fr);
64+
gap: 20px;
65+
padding-top: 3rem;
66+
.card {
67+
border: none;
68+
display: block;
69+
a {
70+
color: $black;
71+
}
72+
.card-body {
73+
display: flex;
74+
flex-direction: column;
75+
height: 100%;
76+
justify-content: space-between;
77+
padding: 0;
78+
79+
img {
80+
width: 100%;
81+
height: 207px;
82+
object-fit: contain;
83+
padding: 20px;
84+
@media screen and (min-width: 1000px) {
85+
padding: 30px;
86+
}
87+
}
88+
}
89+
}
90+
@media screen and (min-width: 1000px) {
91+
grid-template-columns: repeat(3, 1fr);
92+
gap: 36px;
93+
}
94+
}
95+
96+
.contact-us-section {
97+
background-color: $code_background_color;
98+
padding: 50px 0;
99+
.row {
100+
justify-content: center;
101+
.lead {
102+
padding-top: rem(24px);
103+
}
104+
.hbspt-form {
105+
padding: 30px 0;
106+
107+
.hs-button {
108+
background-image: url($baseurl + "/assets/images/chevron-right-orange.svg");
109+
background-size: 6px 13px;
110+
background-position: top 16px right 11px;
111+
background-repeat: no-repeat;
112+
border-radius: 0;
113+
border: none;
114+
background-color: $white;
115+
color: $quick_start_grey;
116+
font-weight: 400;
117+
position: relative;
118+
letter-spacing: 0.25px;
119+
padding: rem(12px) rem(32px) rem(12px) rem(12px);
120+
margin: 10px 0;
121+
122+
@include animated_border_hover_state;
123+
124+
@include desktop {
125+
background-position: top 19px right 11px;
126+
}
127+
128+
}
129+
130+
fieldset.form-columns-2, fieldset.form-columns-1 {
131+
max-width: 100%;
132+
.hs-form-field {
133+
max-width: 100%;
134+
padding: 10px 0;
135+
width: 100%;
136+
input {
137+
border: none;
138+
width: 100%;
139+
}
140+
textarea {
141+
border: none;
142+
width: 100%;
143+
}
144+
}
145+
}
146+
147+
li.hs-form-radio {
148+
input[type=radio] {
149+
width: auto !important;
150+
}
151+
152+
span {
153+
margin-left: 5px;
154+
}
155+
}
156+
157+
ul {
158+
list-style-type: none;
159+
}
160+
}
161+
}
162+
}
163+
164+
.light-background-section {
165+
background-color: $white;
166+
.content {
167+
padding: 40px 0;
168+
}
169+
}
170+
171+
.grey-background-section {
172+
background-color: #f3f4f7;
173+
padding: 60px 0;
174+
img {
175+
height: 100px;
176+
}
177+
p {
178+
font-size: 14px;
179+
line-height: 170%;
180+
}
181+
}
182+
183+
.color-background-section {
184+
background-image: url("/assets/images/pytorch_bg_purple.jpg");
185+
background-size: 100% 100%;
186+
background-repeat: no-repeat;
187+
padding: 60px 0;
188+
h2 {
189+
color: white;
190+
}
191+
}
192+
193+
.body-side-text {
194+
.lead {
195+
margin-bottom: rem(25px);
196+
padding-top: rem(24px);
197+
}
198+
}
199+
200+
img {
201+
width: 100%;
202+
}
203+
204+
h2.upper {
205+
font-size: 25px;
206+
line-height: 130%;
207+
text-align: center;
208+
letter-spacing: 1.75px;
209+
text-transform: uppercase;
210+
margin-bottom: 30px;
211+
}
212+
213+
h3.upper {
214+
font-size: 19px;
215+
text-transform: uppercase;
216+
letter-spacing: 1.75px;
217+
line-height: 130%;
218+
margin: 25px 0;
219+
}
220+
221+
table.benefits {
222+
background-color: white;
223+
font-size: 14px;
224+
text-align: center;
225+
td.benefit {
226+
border-left: none;
227+
min-width: 300px;
228+
text-align: left;
229+
@include desktop {
230+
min-width: 520px;
231+
}
232+
}
233+
tbody {
234+
td {
235+
border-left: 1px solid #812CE5;
236+
vertical-align: middle;
237+
}
238+
td.benefit {
239+
font-weight: 600;
240+
}
241+
}
242+
thead, tfoot {
243+
background-color: #812CE5;
244+
color: white;
245+
font-size: 16px;
246+
font-weight: 700;
247+
@include desktop {
248+
font-size: 20px;
249+
}
250+
td {
251+
border-left: 1px solid #000;
252+
vertical-align: middle;
253+
border-top: none;
254+
}
255+
a {
256+
text-decoration: underline;
257+
color: white;
258+
}
259+
td.price {
260+
font-size: 14px;
261+
line-height: 1.2;
262+
@include desktop {
263+
font-size: 16px;
264+
}
265+
}
266+
}
267+
img {
268+
width: 15px;
269+
}
270+
}
271+
.modal-header {
272+
border-bottom: none;
273+
padding-bottom: 0;
274+
}
275+
276+
.consolidated-employees {
277+
tbody td {
278+
font-weight: 600;
279+
}
280+
td.no-border {
281+
border-left: none;
282+
}
283+
}
284+
285+
.member-boxes {
286+
gap: 20px;
287+
margin: 0;
288+
div.col-sm {
289+
background-color: white;
290+
}
291+
}
292+
}
293+
294+
.board-member {
295+
margin: 35px 0;
296+
img {
297+
margin-bottom: 15px;
298+
}
299+
a svg {
300+
margin-top: 5px;
301+
height: 25px;
302+
max-width: 30px;
303+
fill: #000;
304+
color: #000;
305+
}
306+
a:hover svg {
307+
fill: $orange;
308+
color: $orange;
309+
}
310+
}

‎_sass/base_styles.scss

+5
Original file line numberDiff line numberDiff line change
@@ -183,9 +183,14 @@ a, .btn {
183183
&.mobile-background {
184184
background-image: url($baseurl + "/assets/images/get-started-background.jpg");
185185
}
186+
186187
&.deep-learning-background {
187188
background-image: url($baseurl + "/assets/images/deep-learning-thank-you-background.jpg");
188189
}
190+
191+
&.announcement-background {
192+
background-image: url($baseurl + "/assets/images/pytorch_bg_purple.jpg");
193+
}
189194
}
190195

191196
.bg-light-grey {

0 commit comments

Comments
 (0)