Commit 6ce004ea authored by Laura Kalbag's avatar Laura Kalbag
Browse files

Start laying out latest page til I decided to do it differently

parent 10d92221
......@@ -5,26 +5,30 @@
</div>
</article>
<h2 id="latest-photos">Photos</h2>
<p><a href="/photos">See all photos</a>. <a href="/photos/index.xml">Subscribe to the Photos RSS feed</a>.</p>
<ul class="posts-list latest-photos">
{{ range first 4 (where .Site.Pages "Section" "=" "photos") }}
{{ partial "summary-photo.html" . }}
{{ end }}
</ul>
<section class="latest">
<h2 id="latest-photos">Photos</h2>
<p><a href="/photos">See all photos</a>. <a href="/photos/index.xml">Subscribe to the Photos RSS feed</a>.</p>
<ul class="posts-list latest-photos">
{{ range first 4 (where .Site.Pages "Section" "=" "photos") }}
{{ partial "summary-photo.html" . }}
{{ end }}
</ul>
</section>
<h2 id="latest-notes">Notes</h2>
<p><a href="/notes">See all notes</a>. <a href="/photos/index.xml">Subscribe to the Notes RSS feed</a>.</p>
<ul class="notes-list">
{{ range first 3 (where .Site.Pages "Section" "=" "notes") }}
<li class="post note-post">
<h3>
<a href="{{ .URL }}">
{{- .Title -}}
</a>
</h3>
{{ partial "summary.html" . }}
</li>
{{ end }}
</ul>
<section class="latest">
<h2 id="latest-notes">Notes</h2>
<p><a href="/notes">See all notes</a>. <a href="/photos/index.xml">Subscribe to the Notes RSS feed</a>.</p>
<ul class="notes-list">
{{ range first 3 (where .Site.Pages "Section" "=" "notes") }}
<li class="post note-post">
<h3>
<a href="{{ .URL }}">
{{- .Title -}}
</a>
</h3>
{{ partial "summary.html" . }}
</li>
{{ end }}
</ul>
</section>
{{ end }}
\ No newline at end of file
......@@ -818,6 +818,45 @@ main article .entry-meta {
background: none;
}
/* - - - - - - - - LATEST
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
@media screen and (min-width: 37em) {
section.latest {
display: grid;
grid-template-columns: repeat(7, minmax(14.285714286%, 7.4em));
}
section.latest h2,
section.latest p {
grid-column: 2 / 6;
margin-left: 0;
}
section.latest .latest-photos {
grid-column: 2 / 7;
}
}
.latest-photos {
margin-top: 1em;
}
.latest-photos .photo-post img {
display: block;
margin: 0;
}
@media screen and (min-width: 15em) {
.latest-photos {
display: grid;
grid-template-columns: repeat(5, minmax(20%, 5.285714285em));
grid-gap: 0.25em;
justify-content: space-between;
}
}
/* - - - - - - - - MEDIA
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
......@@ -895,26 +934,6 @@ figcaption {
margin-top: 0.5em;
}
.latest-photos {
margin-top: 1em;
}
.latest-photos .photo-post img {
display: block;
margin: 0;
}
@media screen and (min-width: 15em) {
.latest-photos {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(12em, 1fr));
grid-auto-rows: minmax(12em, auto);
grid-gap: 0.25em;
justify-content: space-between;
}
}
body.about-me figure.selfie {
grid-column: 6 / 9;
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment