Jelajahi Sumber

Styles for aligned pullquotes to match theme's current styles for aligned blockquotes.

Caroline Moore 6 tahun lalu
induk
melakukan
c043ca6146
2 mengubah file dengan 98 tambahan dan 0 penghapusan
  1. 49 0
      libretto/css/blocks.css
  2. 49 0
      libretto/css/editor-blocks.css

+ 49 - 0
libretto/css/blocks.css

@@ -212,6 +212,55 @@ p.has-drop-cap:not(:focus)::first-letter {
 	font-style: normal;
 }
 
+.wp-block-pullquote.alignleft,
+.wp-block-pullquote.alignright {
+	background: #fff;
+	border-bottom: 1px solid #ebe7e1;
+	border-top: 2px solid #a09a92;
+	box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.025);
+	font-size: 27px;
+	max-width: 75%;
+	padding: 0.5em;
+}
+
+.wp-block-pullquote.alignleft cite,
+.wp-block-pullquote.alignright cite {
+	display: block;
+	width: 100%;
+	text-align: right;
+}
+
+.wp-block-pullquote.alignleft blockquote,
+.wp-block-pullquote.alignright blockquote {
+	border: 0;
+	padding: 0;
+	margin: 0;
+}
+
+@media only screen and (min-width: 641px) {
+	.rtl .wp-block-pullquote.alignleft,
+	.wp-block-pullquote.alignleft {
+		margin-left: -1.5em;
+	}
+
+	.rtl .wp-block-pullquote.alignright,
+	.wp-block-pullquote.alignright {
+		margin-right: -1.5em;
+	}
+}
+
+@media only screen and (min-width: 860px) {
+	.rtl .wp-block-pullquote.alignleft,
+	.wp-block-pullquote.alignleft {
+		margin-left: -6em;
+	}
+
+	.rtl .wp-block-pullquote.alignright,
+	.wp-block-pullquote.alignright {
+		margin-right: -6em;
+	}
+}
+
 .wp-block-pullquote.alignleft p,
 .wp-block-pullquote.alignright p {
 	font-size: 24px;

+ 49 - 0
libretto/css/editor-blocks.css

@@ -783,6 +783,31 @@ See: https://stackoverflow.com/questions/16348489/is-there-a-css-hack-for-safari
 	padding-right: 1.5em;
 }
 
+.wp-block-pullquote.alignleft,
+.wp-block-pullquote.alignright {
+	background: #fff;
+	border-bottom: 1px solid #ebe7e1;
+	border-top: 2px solid #a09a92;
+	box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.025);
+	font-size: 27px;
+	max-width: 75%;
+	padding: 0.5em;
+}
+
+.wp-block-pullquote.alignleft cite,
+.wp-block-pullquote.alignright cite {
+	display: block;
+	width: 100%;
+	text-align: right;
+}
+
+.wp-block-pullquote.alignleft blockquote,
+.wp-block-pullquote.alignright blockquote {
+	border: 0;
+	padding: 0;
+	margin: 0;
+}
+
 .wp-block-pullquote.alignleft {
 	margin-right: 1.5em;
 }
@@ -791,6 +816,30 @@ See: https://stackoverflow.com/questions/16348489/is-there-a-css-hack-for-safari
 	margin-left: 1.5em;
 }
 
+@media only screen and (min-width: 641px) {
+	.rtl .wp-block-pullquote.alignleft,
+	.wp-block-pullquote.alignleft {
+		margin-left: -1.5em;
+	}
+
+	.rtl .wp-block-pullquote.alignright,
+	.wp-block-pullquote.alignright {
+		margin-right: -1.5em;
+	}
+}
+
+@media only screen and (min-width: 860px) {
+	.rtl .wp-block-pullquote.alignleft,
+	.wp-block-pullquote.alignleft {
+		margin-left: -6em;
+	}
+
+	.rtl .wp-block-pullquote.alignright,
+	.wp-block-pullquote.alignright {
+		margin-right: -6em;
+	}
+}
+
 .wp-block-pullquote blockquote > .editor-rich-text p {
 	font-size: 24px;
 	margin-bottom: .75em;