Skip to content
This repository has been archived by the owner on May 17, 2023. It is now read-only.

Commit

Permalink
tweaking talks list, responsive edits
Browse files Browse the repository at this point in the history
  • Loading branch information
Melissa Keizer committed Oct 1, 2015
1 parent 834314e commit 8266677
Show file tree
Hide file tree
Showing 7 changed files with 139 additions and 90 deletions.
8 changes: 4 additions & 4 deletions blog/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@
<main id="blog-index">
<section class="blog-post-section">
<div class="container">
<a href="#" class="read-more">Show Categories <i class="fa fa-angle-down"></i></a>
<hr />
<!-- <a href="#" class="read-more">Show Categories <i class="fa fa-angle-down"></i></a>
<hr /> -->
<ul>
{% for post in paginator.posts %}
<li class="blog-post">
Expand All @@ -25,11 +25,11 @@ <h3><a href="{{ post.url }}">{{ post.title }}</a></h3>
</ul>
<div class="see-more-div">
{% if paginator.previous_page %}
<a href="{{ paginator.previous_page_path }}" class="previous">Previous</a> |
<a href="{{ paginator.previous_page_path }}" class="previous button">Previous</a>
{% endif %}

{% if paginator.next_page %}
<a href="{{ paginator.next_page_path }}" class="next">Next</a>
<a href="{{ paginator.next_page_path }}" class="next button">Next</a>
{% endif %}
</div>
</div>
Expand Down
42 changes: 0 additions & 42 deletions blog/index.html.orig

This file was deleted.

48 changes: 42 additions & 6 deletions sass/base/_responsify.scss
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,18 @@
width: 50%;
}

section.recent-talks-section ul li{
width: 100%;
padding-right: 0;
margin-bottom: 25px;
display: block;
}

.recent-talks-section ul li .inner{
min-height: 200px;

}

}


Expand Down Expand Up @@ -81,7 +93,16 @@
width: 100%;
}

section.recent-talks-section ul li .inner{
margin-bottom: 5%;
width: 100%;
min-height: 150px;

}

section.recent-talks-section ul li .read-more{
position: static;
}



Expand Down Expand Up @@ -127,14 +148,29 @@
width: 100%;
}

section.recent-talks-section ul li{
min-height: none;
margin-bottom: 5%;
width: 100%;
header{
height: 360px;
}

section.recent-talks-section ul li .read-more{
position: relative;
.tagline h2, .tagline h1{
font-size: 33px;
padding-bottom: 0;
}

.general-section {
padding: 10% 0;
}

#homepage h2, .recent-talks-section h2{
padding: 50px 0 30px 0;
}

section.blog-post-section, section.work-example-section{
padding-top: 40px;
}

section.recent-talks-section .block-colour{
height: 230px;
}

}
6 changes: 5 additions & 1 deletion sass/base/_typography.scss
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ p, .post-content{
}


p a{
p a, .post-content a{
color: $grey;
padding-bottom: 1px;
border-bottom: 1px solid $burnt-orange;
Expand Down Expand Up @@ -109,4 +109,8 @@ a.read-more{
@include twitter-button;
}

a.previous{
margin-right: 5px;
}


1 change: 1 addition & 0 deletions sass/pages/_blog.scss
Original file line number Diff line number Diff line change
Expand Up @@ -114,5 +114,6 @@
display: block;
padding: 10px 0 20px 0;
margin: 0 auto;
width: 100%;
}

108 changes: 79 additions & 29 deletions stylesheets/screen.css
Original file line number Diff line number Diff line change
Expand Up @@ -561,14 +561,14 @@ p, .post-content {
}

/* line 63, ../sass/base/_typography.scss */
p a {
p a, .post-content a {
color: #48505A;
padding-bottom: 1px;
border-bottom: 1px solid #EE6C2E;
text-decoration: none;
}
/* line 68, ../sass/base/_typography.scss */
p a:hover {
p a:hover, .post-content a:hover {
color: #EE6C2E;
}

Expand Down Expand Up @@ -651,6 +651,11 @@ a.read-more:hover {
transform: translate(0, 1px);
}

/* line 112, ../sass/base/_typography.scss */
a.previous {
margin-right: 5px;
}

/**
* Main
*/
Expand Down Expand Up @@ -993,6 +998,7 @@ hr {
display: block;
padding: 10px 0 20px 0;
margin: 0 auto;
width: 100%;
}

/**
Expand Down Expand Up @@ -1348,115 +1354,159 @@ pre {
.more-projects ul li {
width: 50%;
}

/* line 30, ../sass/base/_responsify.scss */
section.recent-talks-section ul li {
width: 100%;
padding-right: 0;
margin-bottom: 25px;
display: block;
}

/* line 37, ../sass/base/_responsify.scss */
.recent-talks-section ul li .inner {
min-height: 200px;
}
}
@media only screen and (max-width: 960px) {
/* line 37, ../sass/base/_responsify.scss */
/* line 49, ../sass/base/_responsify.scss */
.tagline {
width: 90%;
}

/* line 41, ../sass/base/_responsify.scss */
/* line 53, ../sass/base/_responsify.scss */
#homepage .about-me p {
width: 90%;
}

/* line 45, ../sass/base/_responsify.scss */
/* line 57, ../sass/base/_responsify.scss */
header {
height: 550px;
}

/* line 49, ../sass/base/_responsify.scss */
/* line 61, ../sass/base/_responsify.scss */
.work-example .featured-image, .blog-post .featured-image {
height: 200px;
}

/* line 53, ../sass/base/_responsify.scss */
/* line 65, ../sass/base/_responsify.scss */
.block-colour {
height: 400px;
}
}
@media only screen and (max-width: 850px) {
/* line 64, ../sass/base/_responsify.scss */
/* line 76, ../sass/base/_responsify.scss */
header {
height: 500px;
}

/* line 68, ../sass/base/_responsify.scss */
/* line 80, ../sass/base/_responsify.scss */
h1 {
font-size: 42px;
}

/* line 72, ../sass/base/_responsify.scss */
/* line 84, ../sass/base/_responsify.scss */
.post-content, .post-meta, .recent-posts-section ul {
width: 100%;
}

/* line 76, ../sass/base/_responsify.scss */
/* line 88, ../sass/base/_responsify.scss */
#homepage .about-me p {
width: 100%;
}

/* line 80, ../sass/base/_responsify.scss */
/* line 92, ../sass/base/_responsify.scss */
.work-example, .blog-post {
width: 100%;
}

/* line 96, ../sass/base/_responsify.scss */
section.recent-talks-section ul li .inner {
margin-bottom: 5%;
width: 100%;
min-height: 150px;
}

/* line 103, ../sass/base/_responsify.scss */
section.recent-talks-section ul li .read-more {
position: static;
}
}
@media only screen and (max-width: 520px) {
/* line 93, ../sass/base/_responsify.scss */
/* line 114, ../sass/base/_responsify.scss */
header {
height: 350px;
}

/* line 97, ../sass/base/_responsify.scss */
/* line 118, ../sass/base/_responsify.scss */
.tagline {
bottom: 30px;
}

/* line 101, ../sass/base/_responsify.scss */
/* line 122, ../sass/base/_responsify.scss */
h1 {
font-size: 38px;
}

/* line 105, ../sass/base/_responsify.scss */
/* line 126, ../sass/base/_responsify.scss */
.post-content, .post-meta, .recent-posts-section ul {
width: 100%;
}

/* line 109, ../sass/base/_responsify.scss */
/* line 130, ../sass/base/_responsify.scss */
.post-content {
padding: 40px 0 40px 0;
}

/* line 113, ../sass/base/_responsify.scss */
/* line 134, ../sass/base/_responsify.scss */
.recent-posts-section {
padding: 50px 0;
}

/* line 117, ../sass/base/_responsify.scss */
/* line 138, ../sass/base/_responsify.scss */
h2 {
font-size: 32px;
padding: 0 0 30px 0;
}

/* line 122, ../sass/base/_responsify.scss */
/* line 143, ../sass/base/_responsify.scss */
h3, h3 a {
font-size: 22px;
}

/* line 126, ../sass/base/_responsify.scss */
/* line 147, ../sass/base/_responsify.scss */
.more-projects ul li {
width: 100%;
}

/* line 130, ../sass/base/_responsify.scss */
section.recent-talks-section ul li {
min-height: none;
margin-bottom: 5%;
width: 100%;
/* line 151, ../sass/base/_responsify.scss */
header {
height: 360px;
}

/* line 136, ../sass/base/_responsify.scss */
section.recent-talks-section ul li .read-more {
position: relative;
/* line 155, ../sass/base/_responsify.scss */
.tagline h2, .tagline h1 {
font-size: 33px;
padding-bottom: 0;
}

/* line 160, ../sass/base/_responsify.scss */
.general-section {
padding: 10% 0;
}

/* line 164, ../sass/base/_responsify.scss */
#homepage h2, .recent-talks-section h2 {
padding: 50px 0 30px 0;
}

/* line 168, ../sass/base/_responsify.scss */
section.blog-post-section, section.work-example-section {
padding-top: 40px;
}

/* line 172, ../sass/base/_responsify.scss */
section.recent-talks-section .block-colour {
height: 230px;
}
}
Loading

0 comments on commit 8266677

Please sign in to comment.