Browse Source

Skatepark: Adjust testimonial spacing

Sarah Norris 4 years ago
parent
commit
853fd9c96f
2 changed files with 16 additions and 8 deletions
  1. 9 4
      skatepark/assets/theme.css
  2. 7 4
      skatepark/sass/block-patterns/_testimonial.scss

+ 9 - 4
skatepark/assets/theme.css

@@ -192,25 +192,30 @@
 	}
 }
 
-.testimonial .wp-block-quote > * {
-	margin-right: 0.65em;
-}
-
 .testimonial .wp-block-quote cite {
 	box-shadow: inset 0px 3px 0px 0px #000000;
+	display: inline-block;
 	flex: 1 0 0;
 	font-size: var(--wp--preset--font-size--normal);
 	font-style: normal;
 	font-weight: 500;
+	margin-right: 0.65em;
 	padding-top: calc( var(--wp--custom--margin--baseline) * 1.35);
 	text-align: right;
 }
 
+@media (max-width: 599px) {
+	.testimonial .wp-block-quote cite {
+		margin-top: var(--wp--custom--margin--baseline);
+	}
+}
+
 .testimonial .wp-block-quote p, .testimonial .wp-block-quote div.block-editor-rich-text__editable {
 	flex: 0 0 66.66%;
 	font-size: calc( var(--wp--preset--font-size--huge) * 1.34);
 	font-weight: bold;
 	line-height: 115%;
+	margin-bottom: 0;
 }
 
 a {

+ 7 - 4
skatepark/sass/block-patterns/_testimonial.scss

@@ -11,18 +11,20 @@
 			display: block;
 		}
 
-		& > * {
-			margin-right: 0.65em;
-		}
-
 		cite {
 			box-shadow: inset 0px 3px 0px 0px #000000;
+			display: inline-block;
 			flex: 1 0 0;
 			font-size: var(--wp--preset--font-size--normal);
 			font-style: normal;
 			font-weight: 500;
+			margin-right: 0.65em;
 			padding-top: calc( var(--wp--custom--margin--baseline) * 1.35);
 			text-align: right;
+
+			@include break-small-only() {
+				margin-top: var(--wp--custom--margin--baseline);
+			}
 		}
 
 		p, div.block-editor-rich-text__editable {
@@ -30,6 +32,7 @@
 			font-size: calc( var(--wp--preset--font-size--huge) * 1.34);
 			font-weight: bold;
 			line-height: 115%;
+			margin-bottom: 0;
 		}
 	}
 }