My personal blog
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

71 lines
1.4 KiB

.pullquote-right:before,
.pullquote-left:before {
/* Reset metrics. */
padding: 0;
border: none;
/* Content */
content: attr(data-pullquote);
/* Pull out to the right, modular scale based margins. */
float: right;
width: 45%;
margin: .5em 0 1em 1.5em;
/* Baseline correction */
position: relative;
top: 7px;
font-size: 1.4em;
line-height: 1.45em;
color: $quote-color;
font-family: "Quicksand";
}
.pullquote-left:before {
/* Make left pullquotes align properly. */
float: left;
margin: .5em 1.5em 1em 0;
}
/* @extend this to force long lines of continuous text to wrap */
.force-wrap {
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
white-space: pre-wrap;
word-wrap: break-word;
}
article blockquote {
font-style: italic;
position: relative;
font-size: 1.2em;
line-height: 1.5em;
padding-left: 1em;
color: $quote-color;
font-family: "Quicksand";
border-left: 4px solid rgba($secondary-color, .5);
cite {
font-size: 1.1em;
font-style: italic;
&:before { content: '\2014'; padding:{right: .3em; left: .3em;}; }
}
@media only screen and (min-width: 992px) {
padding-left: 1.5em;
border-left-width: 4px;
}
p:before {
font-size: 30px;
padding-right: 0.15em;
color: #bdc1c5;
content: "";
}
p:after {
font-size: 30px;
padding-left: 0.15em;
color: #bdc1c5;
content: "";
}
}