Jelajahi Sumber

Updating Vintage editor styles.

Laurel Fulford 7 tahun lalu
induk
melakukan
eb3221135d

+ 1 - 1
radcliffe-2/assets/css/blocks-vintage.css

@@ -7,7 +7,7 @@
 	background: -webkit-linear-gradient(top, rgba(255,255,255,0.6) 0%,rgba(255,255,255,1) 15%,rgba(255,255,255,1) 85%,rgba(255,255,255,0.6) 100%); /* Chrome10-25,Safari5.1-6 */
 	background: linear-gradient(to bottom, rgba(255,255,255,0.6) 0%,rgba(255,255,255,1) 15%,rgba(255,255,255,1) 85%,rgba(255,255,255,0.6) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 	border: 4px double #c7c4b4;
-	padding: 10px;
+	padding: 15px;
 }
 
 .wp-block-cover-image.alignleft,

+ 58 - 3
radcliffe-2/assets/css/editor-style-vintage.css

@@ -2,7 +2,29 @@
 Editor Styles for Radcliffe 2: Vintage Style Pack
 --------------------------------------------------------------*/
 
+/* Temporary method to include Google Fonts */
+@import url( "https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700" );
+
 /* Widths */
+.wp-block-cover-image.alignleft,
+.wp-block-cover-image.alignright {
+	left: auto;
+	margin-left: 0;
+	margin-right: 0;
+}
+
+.edit-post-visual-editor figure {
+	margin: auto;
+}
+
+@media screen and (min-width: 600px) {
+	.editor-block-list__layout .editor-block-list__block[data-align="full"] > .editor-block-list__block-edit,
+	.edit-post-visual-editor .editor-block-list__block[data-align="full"] .editor-block-list__block-edit {
+		margin-left: 0;
+		margin-right: 0;
+	}
+}
+
 @media screen and (min-width: 768px) {
 	.editor-writing-flow {
 		margin-left: auto;
@@ -11,11 +33,23 @@ Editor Styles for Radcliffe 2: Vintage Style Pack
 	}
 
 	.edit-post-visual-editor textarea.editor-post-title__input {
-		margin-left: auto;
-		margin-right: auto;
-		padding: 0 0 72px;
+		margin: 50px auto 10px;
 		width: 740px;
 	}
+
+	.editor-block-list__layout .editor-block-list__block[data-align="full"] {
+		margin-left: calc(30% - 30vw);
+		margin-right: calc(30% - 30vw);
+		width: auto;
+		max-width: 1000%;
+	}
+
+	.editor-block-list__layout .editor-block-list__block[data-align="wide"] {
+		margin-left: calc(20% - 20vw);
+		margin-right: calc(20% - 20vw);
+		width: auto;
+		max-width: 1000%;
+	}
 }
 
 /* Editor Layout */
@@ -28,6 +62,27 @@ Editor Styles for Radcliffe 2: Vintage Style Pack
 	background-color: rgba(255,255,255,0.3);
 }
 
+.editor-block-list__layout .editor-block-list__block[data-align="full"],
+.editor-block-list__layout .editor-block-list__block[data-align="wide"],
+.wp-block-cover-image {
+	background-color: rgba(255,255,255,0.7);
+	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0.8+0,1+20,1+80,0.8+100 */
+	background: -moz-linear-gradient(top, rgba(255,255,255,0.6) 0%, rgba(255,255,255,1) 15%, rgba(255,255,255,1) 85%, rgba(255,255,255,0.6) 100%); /* FF3.6-15 */
+	background: -webkit-linear-gradient(top, rgba(255,255,255,0.6) 0%,rgba(255,255,255,1) 15%,rgba(255,255,255,1) 85%,rgba(255,255,255,0.6) 100%); /* Chrome10-25,Safari5.1-6 */
+	background: linear-gradient(to bottom, rgba(255,255,255,0.6) 0%,rgba(255,255,255,1) 15%,rgba(255,255,255,1) 85%,rgba(255,255,255,0.6) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
+	border: 4px double #c7c4b4;
+	padding-left: 15px;
+	padding-right: 15px;
+}
+
+.editor-block-list__layout .editor-block-list__block[data-align="full"] .is-focused,
+.editor-block-list__layout .editor-block-list__block[data-align="wide"] .is-focused,
+.wp-block-cover-image .is-focused {
+	outline: none;
+}
+
+
+
 /*--------------------------------------------------------------
 # Typography
 --------------------------------------------------------------*/