Adjust sidebar styling

- Disable sticky
- Show for small screens and adjust accordingly
This commit is contained in:
Michael Rose 2016-03-11 16:36:41 -05:00
parent 53b6bf549c
commit 2c2d5fb616
4 changed files with 35 additions and 17 deletions

View file

@ -34,7 +34,11 @@
font-family: $serif;
}
.page__content {}
.page__content {
p, li {
font-size: 16px;
}
}
.page__hero {
position: relative;

View file

@ -3,10 +3,10 @@
========================================================================== */
.sidebar {
display: none;
img {
width: 100%;
}
@include grid(12,10);
@include prefix(12,1);
@include suffix(12,1);
margin-bottom: 1em;
@include breakpoint($small) {
display: block;
@include grid(12,2);
@ -17,6 +17,15 @@
@include grid(12,1.5);
@include prefix(12,2);
}
h2, h3, h4, h5, h6 {
font-family: $sans-serif-narrow;
}
p, li {
font-size: 14px;
}
img {
width: 100%;
}
}
/*
@ -26,39 +35,44 @@
.author__name {
margin-bottom: 0;
font-family: $sans-serif-narrow;
font-size: 18px;
@include breakpoint($small) {
margin-top: 10px;
margin-bottom: 10px;
font-size: 24px;
}
}
.author__bio {
font-size: 80%;
font-style: italic;
display: none;
@include breakpoint($small) {
display: block;
margin-bottom: 20px;
font-size: 80%;
font-style: italic;
}
}
.author__avatar {
max-width: 110px;
border-radius: 50%;
display: none;
@include breakpoint($small) {
max-width: 110px;
border-radius: 50%;
}
}
.author__social-url {
display: block;
display: inline-block;
margin-bottom: 5px;
padding-right: 5px;
font-size: 14px;
color: #000;
text-decoration: none;
&:visited {
color: #000;
@include breakpoint($small) {
display: block;
}
&:hover {
text-decoration: underline;
}
.fa {
margin-right: 5px;
}
}
.author__name,

View file

@ -35,7 +35,7 @@ layout: compress
{% endif %}
<div id="main" role="main">
<div class="sidebar sticky">
<div class="sidebar">
{% if page.author_profile %}{% include author-profile.html %}{% endif %}
{% if page.sidebar %}
{% for s in page.sidebar %}

File diff suppressed because one or more lines are too long