Skip to content

Commit fc9a715

Browse files
Tomasz-KluczkowskiTomasz-Kluczkowski
committed
Changed chapter layout to auto generated as much as possible.
Modified event_layout.html to match design from the front page.
1 parent 9cb35fa commit fc9a715

File tree

5 files changed

+112
-90
lines changed

5 files changed

+112
-90
lines changed

‎_chapters/london_python_sprints.md‎

Lines changed: 4 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -8,49 +8,7 @@ lat: 51.512344
88
lng: -0.090985
99
category: "london"
1010
---
11-
<div class="chapter__background-img-container">
12-
<picture>
13-
<source srcset="../static/images/about/date-util-evening-session_480x150px.jpg 480w,
14-
../static/images/about/date-util-evening-session_960x300px.jpg 960w,
15-
../static/images/about/date-util-evening-session_1920x600px.jpg 1920w,
16-
../static/images/about/date-util-evening-session_3840x1200px.jpg 3840w"
17-
media="(orientation: landscape)"
18-
sizes="100vw">
19-
<source srcset="../static/images/about/date-util-evening-session_750x650px.jpg 750w,
20-
../static/images/about/date-util-evening-session_1650X1100px.jpg 1650w"
21-
media="(orientation: portrait)"
22-
sizes="100vw">
23-
<img class="chapter__background-img"
24-
src="../static/images/about/date-util-evening-session_960x300px.jpg"
25-
alt="About Us">
26-
</picture>
27-
<div class="chapter__page-title-container row container-fluid">
28-
<div class="col-sm-12">
29-
<h1 class="chapter__page-title">{{ page.title }}</h1>
30-
</div>
31-
</div>
32-
</div>
33-
<div class="chapter__container container-fluid">
34-
<div class="row">
35-
<div class="col-12 no-padding-x">
36-
<h2 class="chapter__section-title-left">Who We Are</h2>
37-
<div class="row">
38-
<div class="col-md-8 offset-md-2">
39-
<img class="chapter__paragraph-img-main rounded" src="../static/images/about/python_sprints_decoded_673x411px.JPG" alt="Focused on quality">
40-
<h2 class="chapter__paragraph-title-dark">Python Sprints Decoded</h2>
41-
<hr class="chapter__divider-right">
42-
<p class="chapter__paragraph-dark">
43-
Python Sprints is a non for profit group of like minded programmers who care chapter making open source projects better.
44-
We believe in sharing our skills for free to earn our good karma. If you are devoted to a particular open source project, please let us know, we could make a sprint dedicated to it!
45-
Inclusion is in the nature of our group and we want to make sure that no one is underrepresented. All people are welcome.
46-
</p>
47-
<h2 class="chapter__paragraph-title-dark-left">How It Started</h2>
48-
<hr class="chapter__divider-left">
49-
<p class="chapter__paragraph-dark">
50-
Our group was founded in October 2017. As all things in life the beginnings were humble with only a handful of people collaborating but the word quickly spread and now we have nearly 600 members and counting.
51-
</p>
52-
</div>
53-
</div>
54-
</div>
55-
</div>
56-
</div>
11+
We are a London based group of programmers who care about making open source projects better.
12+
We believe in sharing our skills for free to earn our good karma. If you are devoted to a particular open source project, please let us know, we could make a sprint dedicated to it!
13+
Inclusion is in the nature of our group and we want to make sure that no one is underrepresented. All people are welcome.
14+
Our group was founded in October 2017. As all things in life the beginnings were humble with only a handful of people collaborating but the word quickly spread and now we have nearly 600 members and counting.

‎_includes/event_layout.html‎

Lines changed: 35 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,39 @@
1717
Returns:
1818
{% endcomment %}
1919
{% assign post = include.event %}
20+
<div class="col-lg-12 no-padding-x">
21+
{% if upcoming_event == true %}
22+
<div>
23+
{% unless post.date == current_date %}
24+
<p class="date"><i class="far fa-calendar-alt"></i> {{ post.date | date: "%e %B %Y" }}</p>
25+
{% endunless %}
26+
{% assign current_date = post.date %}
27+
{% include get_project.html event = post %}
28+
<h3><a href="{{ post.url }}">{{ post.title }}</a></h3>
29+
<!--
30+
<img src="{{ site.baseurl }}/{{ project.logo }}" alt="">
31+
<p class="content">{{ post.content }}</p>
32+
-->
33+
<p class="text-capitalize"><i class="fas fa-map-marker-alt"></i> {{ post.category }}</p>
34+
{% unless forloop.last %}<hr class="chapter__divider-left"/>{% endunless %}
35+
</div>
36+
{% else %}
37+
<p>No upcoming events at the moment</p>
38+
{% endif %}
39+
</div>
40+
41+
42+
43+
44+
45+
46+
47+
48+
49+
50+
51+
52+
{% comment %}
2053
{% include get_host_sponsor.html event = post %}
2154
<div class="upcoming__col col-md-12 no-padding-x">
2255
<div class="row">
@@ -60,4 +93,5 @@ <h2 class="upcoming__event-subtitle">Level: {{ post.level }}</h2>
6093
{% endunless %}
6194
</div>
6295
</div>
63-
</div>
96+
</div>
97+
{% endcomment %}

‎_layouts/chapter.html‎

Lines changed: 58 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,44 @@
55
{% include navigation.html %}
66
<main>
77
<article>
8-
{{ content }}
9-
<div class="chapter-container container-fluid">
8+
<div class="chapter__background-img-container">
9+
<picture>
10+
<source srcset="../static/images/about/date-util-evening-session_480x150px.jpg 480w,
11+
../static/images/about/date-util-evening-session_960x300px.jpg 960w,
12+
../static/images/about/date-util-evening-session_1920x600px.jpg 1920w,
13+
../static/images/about/date-util-evening-session_3840x1200px.jpg 3840w"
14+
media="(orientation: landscape)"
15+
sizes="100vw">
16+
<source srcset="../static/images/about/date-util-evening-session_750x650px.jpg 750w,
17+
../static/images/about/date-util-evening-session_1650X1100px.jpg 1650w"
18+
media="(orientation: portrait)"
19+
sizes="100vw">
20+
<img class="chapter__background-img"
21+
src="../static/images/about/date-util-evening-session_960x300px.jpg"
22+
alt="About Us">
23+
</picture>
24+
<div class="chapter__page-title-container row container-fluid">
25+
<div class="col-sm-12">
26+
<h1 class="chapter__page-title">{{ page.title }}</h1>
27+
</div>
28+
</div>
29+
</div>
30+
<div class="chapter__container container-fluid">
31+
<div class="row">
32+
<div class="col-12 no-padding-x">
33+
<!--<img class="chapter__paragraph-img-main rounded" src="../static/images/about/python_sprints_decoded_673x411px.JPG" alt="Focused on quality">-->
34+
<h2 class="chapter__paragraph-title-dark-left">{{ page.title }}</h2>
35+
<hr class="chapter__divider-left">
36+
<p class="chapter__paragraph-dark">
37+
{{ content }}
38+
</p>
39+
<a class="chapter__paragraph-title-dark" href="{{ page.meetup_link }}">
40+
Join us here!
41+
</a>
42+
</div>
43+
</div>
44+
</div>
45+
<div class="chapter__container container-fluid">
1046
<div class="row">
1147
{% include events_array_generator.html future_events=true category=page.category %}
1248
{% if posts.size > 0 %}
@@ -15,39 +51,35 @@
1551
{% endif %}
1652
{% if upcoming_event == true %}
1753
<div class="col-12 no-padding-x">
18-
<section class="chapter">
19-
<div class="row container-fluid">
20-
<div class="col-md-12 no-padding-x">
21-
<h2 class="upcoming__title">Events</h2>
22-
</div>
23-
</div>
24-
<div class="upcoming__content row">
25-
{% assign current_date = "" %}
26-
{% for post in posts %}
27-
{% include event_layout.html event=post %}
28-
{% endfor %}
54+
<div class="row container no-padding-x">
55+
<div class="col-md-12 no-padding-x">
56+
<h2 class="chapter__title">Upcoming events</h2>
2957
</div>
30-
</section>
58+
</div>
59+
<div class="upcoming__content row">
60+
{% assign current_date = "" %}
61+
{% for post in posts %}
62+
{% include event_layout.html event=post %}
63+
{% endfor %}
64+
</div>
3165
</div>
3266
{% endif %}
3367
</div>
3468
<div class="row">
3569
{% include events_array_generator.html category=page.category %}
3670
{% if posts.size > 0 %}
3771
<div class="col-12 no-padding-x">
38-
<section class="chapter">
39-
<div class="row container-fluid">
40-
<div class="col-md-12 no-padding-x">
41-
<h2 class="upcoming__title">Recent Events</h2>
42-
</div>
43-
</div>
44-
<div class="upcoming__content row">
45-
{% assign current_date = "" %}
46-
{% for post in posts %}
47-
{% include event_layout.html event=post %}
48-
{% endfor %}
72+
<div class="row container-fluid">
73+
<div class="col-md-12 no-padding-x">
74+
<h2 class="chapter__title">Recent Events</h2>
4975
</div>
50-
</section>
76+
</div>
77+
<div class="upcoming__content row">
78+
{% assign current_date = "" %}
79+
{% for post in posts %}
80+
{% include event_layout.html event=post %}
81+
{% endfor %}
82+
</div>
5183
</div>
5284
{% endif %}
5385
</div>

‎_sass/chapter.scss‎

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,3 @@
1-
.chapter-container {
2-
max-width: 80%;
3-
}
4-
51
.chapter__background-img-container {
62
@extend .page__background-img-container;
73
&::after {
@@ -31,10 +27,14 @@
3127

3228
@media (min-width: 1200px) {
3329
.chapter__container {
34-
max-width: 70%;
30+
max-width: 50%;
3531
}
3632
}
3733

34+
.chapter__title {
35+
margin-top: 1em;
36+
}
37+
3838
.chapter__section-title-left {
3939
@extend .section-title;
4040
margin-top: 10%;
@@ -48,7 +48,6 @@
4848
margin-top: 5%;
4949
}
5050

51-
5251
.chapter__title-container {
5352
}
5453

@@ -62,6 +61,7 @@
6261
@extend .title-dark;
6362
font-size: 1.65em;
6463
text-align: left;
64+
margin-top: 2em;
6565
}
6666

6767
.chapter__paragraph-title-light {
@@ -70,7 +70,8 @@
7070
}
7171

7272
.chapter__divider {
73-
@extend .services__divider;
73+
width: 50%;
74+
margin-top: 0;
7475
}
7576

7677
.chapter__divider-right {
@@ -81,6 +82,7 @@
8182
.chapter__divider-left {
8283
@extend .chapter__divider;
8384
margin-left: 0;
85+
margin-bottom: 0.25em;
8486
}
8587

8688
.chapter__paragraph-dark {
@@ -89,6 +91,7 @@
8991
text-justify: inter-word;
9092
padding-left: 0;
9193
padding-right: 0;
94+
font-size: 1em;
9295
}
9396

9497
.chapter__paragraph-light {

‎_sass/style.scss‎

Lines changed: 5 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,5 @@
11
.body {
2-
//background-color: $main-background;
32
overflow-x: hidden;
4-
/*Here I need to move the background image to slide under the navigation*/
5-
/*Any smarter solutions are welcome!*/
6-
//margin-top: -66px;
7-
83
}
94

105
h2, h2 a {
@@ -149,11 +144,11 @@ section {
149144
}
150145
}
151146

152-
@media (min-width: 1200px) {
153-
#home {
154-
margin-top: -72px;
155-
}
156-
}
147+
//@media (min-width: 1200px) {
148+
// #home {
149+
// margin-top: -72px;
150+
// }
151+
//}
157152

158153
.navigation {
159154
background: rgba(0, 0, 0, 0.9);

0 commit comments

Comments
 (0)