TinyMCE per block: Adjust the citation style (#240)

WordPress · Mar 10, 2017 · cf11103 · cf11103
1 parent 1150e51
commit cf11103
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 1 deletion.
diff --git a/tinymce-per-block/src/assets/stylesheets/theme.scss b/tinymce-per-block/src/assets/stylesheets/theme.scss
@@ -14,10 +14,21 @@
 		font-style: italic;
 
 		footer {
+			position: relative;
 			font-weight: 300;
 			font-size: 14px;
 			color: $gray-dark-300;
 			font-style: italic;
+			padding-left: 20px;
+
+			&:before {
+				display: block;
+				position: absolute;
+				left: 0;
+				top: 0;
+				color: $gray-dark-300;
+				content: '— ';
+			}
 		}
 
 		&.quote-style2 {

diff --git a/tinymce-per-block/src/blocks/quote-block/_style.scss b/tinymce-per-block/src/blocks/quote-block/_style.scss
@@ -12,8 +12,8 @@
 	}
 }
 
-.quote-block__cite,
 .quote-block__cite {
+	position: relative;
 	width: 100%;
 	border: none;
 	font: inherit;
@@ -23,6 +23,16 @@
 	color: $gray-dark-300;
 	resize: none;
 	font-style: italic;
+	padding-left: 20px;
+
+	&:before {
+		display: block;
+		position: absolute;
+		left: 0;
+		top: 0;
+		color: $gray-dark-300;
+		content: '— ';
+	}
 }
 
 .quote-block__form.quote-style1 {