Skip to content

Commit

Permalink
Updated blockquote styles.
Browse files Browse the repository at this point in the history
  • Loading branch information
@stefanbohacek
stefanbohacek committed Nov 17, 2020
1 parent 6c66de2 commit f27b126
Show file tree
Hide file tree
Showing 3 changed files with 258 additions and 1 deletion.
240 changes: 240 additions & 0 deletions css/styles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7946,6 +7946,246 @@ blockquote {
padding: 0 20px; } }
blockquote p:first-child {
margin-top: -3rem; }
blockquote:nth-of-type(1) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(1) p, blockquote:nth-of-type(1) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(2) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(2) p, blockquote:nth-of-type(2) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(3) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(3) p, blockquote:nth-of-type(3) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(4) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(4) p, blockquote:nth-of-type(4) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(5) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(5) p, blockquote:nth-of-type(5) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(6) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(6) p, blockquote:nth-of-type(6) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(7) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(7) p, blockquote:nth-of-type(7) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(8) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(8) p, blockquote:nth-of-type(8) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(9) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(9) p, blockquote:nth-of-type(9) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(10) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(10) p, blockquote:nth-of-type(10) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(11) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(11) p, blockquote:nth-of-type(11) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(12) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(12) p, blockquote:nth-of-type(12) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(13) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(13) p, blockquote:nth-of-type(13) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(14) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(14) p, blockquote:nth-of-type(14) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(15) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(15) p, blockquote:nth-of-type(15) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(16) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(16) p, blockquote:nth-of-type(16) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(17) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(17) p, blockquote:nth-of-type(17) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(18) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(18) p, blockquote:nth-of-type(18) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(19) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(19) p, blockquote:nth-of-type(19) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(20) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(20) p, blockquote:nth-of-type(20) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(21) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(21) p, blockquote:nth-of-type(21) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(22) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(22) p, blockquote:nth-of-type(22) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(23) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(23) p, blockquote:nth-of-type(23) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(24) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(24) p, blockquote:nth-of-type(24) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(25) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(25) p, blockquote:nth-of-type(25) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(26) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(26) p, blockquote:nth-of-type(26) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(27) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(27) p, blockquote:nth-of-type(27) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(28) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(28) p, blockquote:nth-of-type(28) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(29) {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }
blockquote:nth-of-type(29) p, blockquote:nth-of-type(29) img {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(30) {
-webkit-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg); }
blockquote:nth-of-type(30) p, blockquote:nth-of-type(30) img {
-webkit-transform: rotate(1deg);
-ms-transform: rotate(1deg);
transform: rotate(1deg); }

blockquote.instagram-media,
iframe.instagram-media {
Expand Down
2 changes: 1 addition & 1 deletion css/styles.min.css
View file

Large diffs are not rendered by default.

17 changes: 17 additions & 0 deletions src/styles/typography.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -197,6 +197,23 @@ blockquote{
p:first-child{
margin-top: -3rem;
}


@for $i from 0 to 30 {
&:nth-of-type(#{$i+1}) {
@if $i % 2 == 0 {
transform: rotate(1deg);
p,img{
transform: rotate(-1deg);
}
} @else {
transform: rotate(-1deg);
p,img{
transform: rotate(1deg);
}
}
}
}
}

blockquote.instagram-media,
Expand Down

0 comments on commit f27b126

Please sign in to comment.