Skip to content

Commit cd2ad48

Browse files
bigtigerbigtiger
committed
normalize css
1 parent 8c31b93 commit cd2ad48

File tree

3 files changed

+118
-132
lines changed

3 files changed

+118
-132
lines changed

‎custom-modern-open-source.hbs‎

Lines changed: 78 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -1,94 +1,97 @@
11
{{!< default}}
2-
<div id="modern">
3-
{{#post}}
2+
{{#post}}
3+
<div id="modern">
44
<div class="{{post_class}}">
5-
<h1 class="title">{{title}}</h1>
5+
<h1>{{title}}</h1>
66
<div class="two-up">{{content}}</div>
77
</div>
8-
{{/post}}
98

10-
<div class="{{post_class}} program-news">
11-
{{#get "pages" filter="slug:program-news"}}
12-
{{#foreach pages}}
13-
<h1 class="call-to-action header">Program News</h1>
14-
<ul>
15-
{{#get "posts" order="desc, title asc" filter="tag:[news]"}}
16-
{{#foreach posts limit="3"}}
17-
<li>{{#link href=(url)}}{{title}}{{/link}}</li>
18-
{{/foreach}}
19-
{{/get}}
20-
</ul>
21-
</div>
22-
{{/foreach}}
23-
{{/get}}
24-
25-
<div class="{{post_class}} mission-and-vision">
26-
{{#get "pages" filter="tag:[hash-oss-our-vision, hash-oss-our-mission]"}}
27-
{{#foreach pages}}
28-
<div class="column">
29-
<h1>{{title}}</h1>
30-
{{{html}}}
9+
<div class="{{post_class}} program-news">
10+
{{#get "pages" filter="slug:program-news"}}
11+
{{#foreach pages}}
12+
<h2>Program News</h2>
13+
<ul>
14+
{{#get "posts" order="desc, title asc" filter="tag:[news]"}}
15+
{{#foreach posts limit="3"}}
16+
<li>{{#link href=(url)}}{{title}}{{/link}}</li>
17+
{{/foreach}}
18+
{{/get}}
19+
</ul>
3120
</div>
3221
{{/foreach}}
3322
{{/get}}
34-
</div>
3523

36-
<div class="{{post_class}} projects">
37-
<h1 class="title">Projects</h1>
38-
<h2>Learn more about our current and past efforts</h2>
39-
<div class="projects-list">
40-
{{#get "pages" order="featured desc, title asc" filter="tag:[hash-oss-project]"}}
24+
<div class="{{post_class}} mission-and-vision">
25+
{{#get "pages" filter="tag:[hash-oss-our-vision, hash-oss-our-mission]"}}
4126
{{#foreach pages}}
42-
<div class="{{post_class}} project">
43-
<h1>{{title}}</h1>
27+
<div class="column">
28+
<h3>{{title}}</h3>
4429
{{{html}}}
45-
</div>
30+
</div>
4631
{{/foreach}}
4732
{{/get}}
4833
</div>
49-
<div class="contribute">
50-
{{#get "pages" filter="tag:[hash-oss-contribute]"}}
51-
{{#foreach pages}}
52-
{{#if feature_image}}
53-
<img src="{{feature_image}}" alt="{{title}}" class="feature-image">
54-
{{/if}}
55-
<h1 class="call-to-action header">{{title}}</h1>
56-
<div>{{content}}</div>
57-
{{/foreach}}
58-
{{/get}}
59-
</div>
60-
</div>
6134

62-
<div class="post" aria-labelledby="team-heading">
63-
<h1 id="team-heading" class="title">Team</h1>
64-
<h2>Meet the people behind our program</h2>
65-
<div class="grid">
66-
{{#get "pages" order="featured desc, title asc" filter="tags:hash-oss-team" limit="all" include="feature_image"}}
35+
<div class="{{post_class}} projects">
36+
<h2>Projects</h2>
37+
<h3>Learn more about our current and past efforts</h3>
38+
<div class="projects-list">
39+
{{#get "pages" order="featured desc, title asc" filter="tag:[hash-oss-project]"}}
40+
{{#foreach pages}}
41+
<div class="{{post_class}} project">
42+
<h3>{{title}}</h1>
43+
{{{html}}}
44+
</div>
45+
{{/foreach}}
46+
{{/get}}
47+
</div>
48+
<div class="contribute">
49+
{{#get "pages" filter="tag:[hash-oss-contribute]"}}
6750
{{#foreach pages}}
68-
<figure>
69-
{{#if feature_image}}
70-
<img src="{{feature_image}}" alt="{{title}}" class="feature-image team-photo">
71-
{{/if}}
72-
<figcaption class="team-info">
73-
<p class="team-name">{{title}}</p>
74-
{{content}}
75-
</figcaption>
76-
</figure>
51+
{{#if feature_image}}
52+
<img src="{{feature_image}}" alt="{{title}}" class="feature-image">
53+
{{/if}}
54+
<h3>{{title}}</h1>
55+
<div>{{content}}</div>
7756
{{/foreach}}
78-
{{/get}}
79-
</div>
80-
</div>
81-
<div class="{{post_class}} program-support">
82-
{{#get "pages" filter="tag:[hash-oss-program-support]"}}
83-
{{#foreach pages}}
84-
<h1 class="title">{{title}}</h1>
85-
{{{content}}}
86-
<span>Program-Specific Funding</span>
87-
<span>Donated Services</span>
88-
<span>Memberships</span>
89-
<span>Corporate Sponsorships</span>
57+
{{/get}}
58+
</div>
9059
</div>
91-
{{/foreach}}
92-
{{/get}}
60+
61+
<div class="post" aria-labelledby="team-heading">
62+
<h2 id="team-heading">Team</h2>
63+
<h3>Meet the people behind our program</h3>
64+
<div class="grid">
65+
{{#get "pages" order="featured desc, title asc" filter="tags:hash-oss-team" limit="all" include="feature_image"}}
66+
{{#foreach pages}}
67+
<figure>
68+
{{#if feature_image}}
69+
<img src="{{feature_image}}" alt="{{title}}" class="feature-image team-photo">
70+
{{/if}}
71+
<figcaption class="team-info">
72+
<p class="team-name">{{title}}</p>
73+
{{content}}
74+
</figcaption>
75+
</figure>
76+
{{/foreach}}
77+
{{/get}}
78+
</div>
9379
</div>
94-
</div>
80+
<div class="{{post_class}} program-support">
81+
{{#get "pages" filter="tag:[hash-oss-program-support]"}}
82+
{{#foreach pages}}
83+
<h2>{{title}}</h2>
84+
{{{content}}}
85+
<span>Program-Specific Funding</span>
86+
<span>Donated Services</span>
87+
<span>Memberships</span>
88+
<span>Corporate Sponsorships</span>
89+
</div>
90+
{{/foreach}}
91+
{{/get}}
92+
</div>
93+
</div>
94+
{{/post}}
95+
{{#contentFor 'scripts'}}
96+
<script src="{{asset 'dist/post.js'}}" defer></script>
97+
{{/contentFor}}

‎custom-modern.hbs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
{{#post}}
33
<div id="modern">
44
<div class="{{post_class}}">
5-
<h1 class="title">{{title}}</h1>
5+
<h1>{{title}}</h1>
66
<aside class="gh-sidebar">
77
<div class="gh-toc"></div>
88
</aside>

‎src/css/modern.css‎

Lines changed: 39 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -4,23 +4,40 @@
44
padding-top: 0;
55
}
66

7-
p,
8-
ul {
9-
line-height: 1.4rem;
10-
font-size: 16px;
7+
h1 {
8+
text-transform: uppercase;
119
}
1210
h1,
1311
h2,
1412
h3 {
1513
font-family: Rubik;
1614
margin-bottom: 1rem;
1715
column-span: all !important;
16+
> a {
17+
text-decoration: none;
18+
}
1819
}
19-
h1 {
20-
font-size: 26px;
21-
text-transform: capitalize;
22-
}
20+
h1,
2321
h2 {
22+
font-weight: bold;
23+
position: relative;
24+
padding-bottom: 0.75rem;
25+
26+
&::after {
27+
content: '';
28+
position: absolute;
29+
left: 0;
30+
right: 0;
31+
bottom: 0;
32+
height: 3px;
33+
background-color: var(--yellow);
34+
width: 70px;
35+
}
36+
}
37+
h3 {
38+
font-size: 18px !important;
39+
}
40+
h6 {
2441
font-size: 18px;
2542
font-family: 'Inter var', sans-serif;
2643
font-weight: 300;
@@ -30,60 +47,29 @@
3047
h1 {
3148
font-size: 42px;
3249
}
33-
h1.title {
34-
font-size: 50px;
35-
}
3650
h2 {
37-
font-size: 26px;
51+
font-size: 32px;
52+
}
53+
h3 {
54+
font-size: 26px !important;
3855
}
3956
}
4057
@media (min-width: 1350px) {
41-
h1.title {
58+
h1 {
4259
font-size: 72px;
4360
}
4461
h2 {
45-
font-size: 32px;
62+
font-size: 60px;
4663
}
4764
p {
4865
font-size: 18px;
4966
}
5067
}
5168

52-
.title {
53-
text-transform: uppercase;
54-
font-weight: bold;
55-
position: relative;
56-
padding-bottom: 0.75rem;
57-
58-
&::after {
59-
content: '';
60-
position: absolute;
61-
left: 0;
62-
right: 0;
63-
bottom: 0;
64-
height: 3px;
65-
background-color: var(--yellow);
66-
width: 70px;
67-
}
68-
}
69-
.call-to-action.header {
70-
text-transform: uppercase;
71-
font-weight: bold;
72-
position: relative;
73-
padding-bottom: 0.75rem;
74-
font-size: 26px;
75-
margin-bottom: 1rem;
76-
77-
&::after {
78-
content: '';
79-
position: absolute;
80-
left: 0;
81-
right: 0;
82-
bottom: 0;
83-
height: 3px;
84-
background-color: var(--yellow);
85-
width: 70px;
86-
}
69+
p,
70+
ul {
71+
line-height: 1.4rem;
72+
font-size: 16px;
8773
}
8874

8975
.mission-and-vision {
@@ -92,10 +78,11 @@
9278
gap: 2.5rem;
9379
margin-bottom: 2.5rem;
9480
margin-top: 2.5rem;
95-
}
81+
padding: 0 0 2.5rem 0;
9682

97-
.post.mission-and-vision h1::after {
98-
display: none;
83+
h3 {
84+
font-size: 42px;
85+
}
9986
}
10087

10188
.post .column img {
@@ -150,10 +137,6 @@
150137
border-radius: 0.5rem;
151138
padding-top: 1rem;
152139
}
153-
.projects > h1.title {
154-
margin-top: 1rem;
155-
}
156-
157140
.project {
158141
width: 100%;
159142
background-color: var(--navy);

0 commit comments

Comments
 (0)