Browse Source

Merge pull request #3986 from Automattic/varia-search-block

Varia styles for search block
Ben Dwyer 4 years ago
parent
commit
6950b5366e
100 changed files with 4843 additions and 1168 deletions
  1. 8 0
      alves/inc/wpcom-colors.php
  2. 13 0
      alves/inc/wpcom-editor-colors.php
  3. 1 1
      alves/package.json
  4. 19 0
      alves/sass/_extra-child-theme.scss
  5. 1 1
      alves/sass/style-child-theme.scss
  6. 91 16
      alves/style-editor.css
  7. 96 16
      alves/style-rtl.css
  8. 96 16
      alves/style.css
  9. 10 1
      balasana/inc/wpcom-colors.php
  10. 13 1
      balasana/inc/wpcom-editor-colors.php
  11. 1 1
      balasana/package.json
  12. 1 1
      balasana/sass/style-child-theme.scss
  13. 83 8
      balasana/style-editor.css
  14. 80 16
      balasana/style-rtl.css
  15. 80 16
      balasana/style.css
  16. 7 0
      barnsbury/inc/wpcom-colors.php
  17. 10 0
      barnsbury/inc/wpcom-editor-colors.php
  18. 1 1
      barnsbury/package.json
  19. 1 1
      barnsbury/sass/style-child-theme.scss
  20. 83 8
      barnsbury/style-editor.css
  21. 80 16
      barnsbury/style-rtl.css
  22. 80 16
      barnsbury/style.css
  23. 6 0
      brompton/inc/wpcom-colors.php
  24. 4 0
      brompton/inc/wpcom-editor-colors.php
  25. 1 1
      brompton/package.json
  26. 1 1
      brompton/sass/style-child-theme.scss
  27. 83 8
      brompton/style-editor.css
  28. 80 16
      brompton/style-rtl.css
  29. 80 16
      brompton/style.css
  30. 2 0
      coutoire/inc/wpcom-colors.php
  31. 2 0
      coutoire/inc/wpcom-editor-colors.php
  32. 1 1
      coutoire/package.json
  33. 26 0
      coutoire/sass/_extra-child-theme.scss
  34. 1 1
      coutoire/sass/style-child-theme.scss
  35. 83 8
      coutoire/style-editor.css
  36. 105 16
      coutoire/style-rtl.css
  37. 105 16
      coutoire/style.css
  38. 8 0
      dalston/inc/wpcom-colors.php
  39. 2 0
      dalston/inc/wpcom-editor-colors.php
  40. 1 1
      dalston/package.json
  41. 1 1
      dalston/sass/style-child-theme.scss
  42. 83 8
      dalston/style-editor.css
  43. 80 16
      dalston/style-rtl.css
  44. 80 16
      dalston/style.css
  45. 5 0
      exford/inc/wpcom-colors.php
  46. 4 0
      exford/inc/wpcom-editor-colors.php
  47. 1 1
      exford/package.json
  48. 1 1
      exford/sass/style-child-theme.scss
  49. 91 16
      exford/style-editor.css
  50. 80 16
      exford/style-rtl.css
  51. 80 16
      exford/style.css
  52. 1 1
      hever/package.json
  53. 1 1
      hever/sass/style-child-theme.scss
  54. 91 16
      hever/style-editor.css
  55. 80 16
      hever/style-rtl.css
  56. 80 16
      hever/style.css
  57. 8 0
      leven/inc/wpcom-colors.php
  58. 5 0
      leven/inc/wpcom-editor-colors.php
  59. 1 1
      leven/package.json
  60. 1 1
      leven/sass/style-child-theme.scss
  61. 83 8
      leven/style-editor.css
  62. 80 16
      leven/style-rtl.css
  63. 80 16
      leven/style.css
  64. 8 0
      mayland/inc/wpcom-colors.php
  65. 8 0
      mayland/inc/wpcom-editor-colors.php
  66. 1 1
      mayland/package.json
  67. 1 1
      mayland/sass/style-child-theme.scss
  68. 83 8
      mayland/style-editor.css
  69. 80 16
      mayland/style-rtl.css
  70. 80 16
      mayland/style.css
  71. 4 0
      maywood/inc/wpcom-colors.php
  72. 4 0
      maywood/inc/wpcom-editor-colors.php
  73. 1 1
      maywood/package.json
  74. 1 1
      maywood/sass/style-child-theme.scss
  75. 91 16
      maywood/style-editor.css
  76. 80 16
      maywood/style-rtl.css
  77. 80 16
      maywood/style.css
  78. 1 1
      morden/package.json
  79. 19 1
      morden/sass/_extra-child-theme.scss
  80. 1 1
      morden/sass/style-child-theme.scss
  81. 91 16
      morden/style-editor.css
  82. 96 16
      morden/style-rtl.css
  83. 96 16
      morden/style.css
  84. 324 173
      redhill/inc/wpcom-colors.php
  85. 241 115
      redhill/inc/wpcom-editor-colors.php
  86. 1 1
      redhill/package.json
  87. 19 0
      redhill/sass/_extra-child-theme.scss
  88. 1 1
      redhill/sass/style-child-theme.scss
  89. 83 8
      redhill/style-editor.css
  90. 96 16
      redhill/style-rtl.css
  91. 96 16
      redhill/style.css
  92. 239 137
      rivington/inc/wpcom-colors.php
  93. 175 110
      rivington/inc/wpcom-editor-colors.php
  94. 1 1
      rivington/package.json
  95. 1 1
      rivington/sass/_extra-child-theme.scss
  96. 1 1
      rivington/sass/style-child-theme.scss
  97. 83 8
      rivington/style-editor.css
  98. 96 16
      rivington/style-rtl.css
  99. 96 16
      rivington/style.css
  100. 1 1
      rockfield/package.json

+ 8 - 0
alves/inc/wpcom-colors.php

@@ -47,6 +47,7 @@ add_color_rule( 'bg', '#ffffff', array(
 			.wp-block-file__button,
 			.wp-block-file__button:focus,
 			.wp-block-file__button:hover,
+			.wp-block-search .wp-block-search__button,
 			.wp-block-gallery .blocks-gallery-image figcaption,
 			.wp-block-gallery .blocks-gallery-item figcaption,
 			.wp-block-pullquote.is-style-solid-color,
@@ -116,6 +117,9 @@ add_color_rule( 'link', '#3E7D98', array(
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept,
 			button,
 			button[data-load-more-btn],
+			.wp-block-search .wp-block-search__button,
+			.wp-block-search .wp-block-search__button:focus,
+			.wp-block-search .wp-block-search__button:hover,
 			input[type="submit"]', 'background-color' ),
 
 	// Text-color
@@ -147,6 +151,7 @@ add_color_rule( 'link', '#3E7D98', array(
 			input[type="time"],
 			input[type="url"],
 			input[type="week"],
+			.wp-block-search .wp-block-search__input:focus,
 			select,
 			textarea', 'border-color' ),
 
@@ -233,6 +238,9 @@ add_color_rule( 'txt', '#394d55', array(
 			.wp-block-video figcaption,
 			figcaption', 'color' ),
 
+	// Border-color with less opacity (dim)
+	array( '.wp-block-search .wp-block-search__input', 'border-color', 0.8 ),
+
 	// Background-color
 	array( '.wp-block-cover.has-background-dim,
 			.wp-block-cover-image.has-background-dim,

+ 13 - 0
alves/inc/wpcom-editor-colors.php

@@ -37,6 +37,7 @@ add_editor_color_rule( 'bg', '#ffffff', array(
 			#editor .editor-styles-wrapper .wp-block-cover:not([class*="background-color"]) .wp-block-cover-image-text,
 			#editor .editor-styles-wrapper .wp-block-cover:not([class*="background-color"]) .wp-block-cover-text,
 			#editor .editor-styles-wrapper .wp-block-cover:not([class*="background-color"]) .wp-block-cover__inner-container,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
 			#editor .editor-styles-wrapper .wp-block-cover.has-background-dim,
 			#editor .editor-styles-wrapper .wp-block-cover.has-background-dim a,
 			#editor .editor-styles-wrapper .wp-block-cover-image.has-background-dim,
@@ -94,6 +95,9 @@ add_editor_color_rule( 'link', '#3E7D98', array(
 			#editor .editor-styles-wrapper .fse-template-part .main-navigation .button,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background),
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:focus,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:hover,
 			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color', 'background-color' ),
 
 	// Text-color
@@ -104,6 +108,11 @@ add_editor_color_rule( 'link', '#3E7D98', array(
 			#editor .editor-styles-wrapper a,
 			#editor .editor-styles-wrapper hr.is-style-dots:before', 'color' ),
 
+	
+	// Border-color (forms)
+	array( '#editor .editor-styles-wrapper .wp-block-search .wp-block-search__input:focus,
+			textarea:focus', 'border-color' ),
+
 	// Border color top
 	array( '#editor .editor-styles-wrapper .wp-block-pullquote', 'border-top-color' ),
 
@@ -155,6 +164,10 @@ add_editor_color_rule( 'txt', '#394d55', array(
 			#editor .editor-styles-wrapper .is-style-outline .wp-block-button__link:focus,
 			#editor .editor-styles-wrapper .is-style-outline .wp-block-button__link.has-focus', 'color' ),
 
+	// Border-color with less opacity (dim)
+	array( '#editor .editor-styles-wrapper .wp-block-code,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__input', 'border-color', 0.8 ),
+
 	// Background-color
 	array( '#editor .editor-styles-wrapper .wp-block-cover.has-background-dim,
 			#editor .editor-styles-wrapper .wp-block-cover-image.has-background-dim,

+ 1 - 1
alves/package.json

@@ -1,6 +1,6 @@
 {
   "name": "alves",
-  "version": "1.5.7",
+  "version": "1.5.8",
   "description": "Alves",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 19 - 0
alves/sass/_extra-child-theme.scss

@@ -575,3 +575,22 @@ body:not(.fse-enabled) {
 
 // Updates the Mobile Navigation to be next to the site title.
 @import "../../varia/sass/components/header/_site-mobile-nav-side";
+
+/**
+ * Search block
+ */
+
+.wp-block-search {
+	&.wp-block-search__button-inside {
+		.wp-block-search__inside-wrapper{
+			border-radius: #{map-deep-get($config-button, "border-radius")};
+		}
+		.wp-block-search__input {
+			background: transparent;
+		}
+	}
+	.wp-block-search__input {
+		margin-right: calc( .1 * #{map-deep-get($config-button, "padding", "horizontal")} );
+		border-radius: #{map-deep-get($config-button, "border-radius")};
+	}
+} 

+ 1 - 1
alves/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Convincing design for your charity or organization’s online presence. Highlight your actions, causes and projects, Alves is versatile enough to be your personal site too.
 Requires at least: WordPress 4.9.6
-Version: 1.5.7
+Version: 1.5.8
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

+ 91 - 16
alves/style-editor.css

@@ -202,6 +202,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 /**
  * Elements
  * - Styles for basic HTML elemants
@@ -469,7 +480,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button, .fse-template-part .main-navigation .button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button, .fse-template-part .main-navigation .button {
 	line-height: 1;
 	color: #ffffff;
 	cursor: pointer;
@@ -485,8 +496,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .fse-template-part .main-navigation .button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .fse-template-part .main-navigation .button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -494,19 +505,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .fse-template-part .main-navigation .button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .fse-template-part .main-navigation .button:before {
 	margin-bottom: -0.12em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	margin-top: -0.11em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .fse-template-part .main-navigation .button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .fse-template-part .main-navigation .has-focus.button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .fse-template-part .main-navigation .button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button, .fse-template-part .main-navigation .has-focus.button {
 	color: #ffffff;
 	background-color: #2f5f74;
 }
@@ -921,6 +932,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #3E7D98;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 48px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #3E7D98;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1.25rem;
+	line-height: 1.25rem;
+	font-family: "Karla", Arial, sans-serif;
+	font-family: var(--font-base, "Karla", Arial, sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 48px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #3E7D98;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1.25rem + 4px);
+	min-height: calc(2* 16px + 1.25rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid #3E7D98;
@@ -1696,7 +1771,7 @@ p:not(.site-title) a:hover {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link,
-.fse-template-part .main-navigation .wp-block-file__button, .fse-template-part .main-navigation .button {
+.fse-template-part .main-navigation .wp-block-file__button, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button, .fse-template-part .main-navigation .button {
 	line-height: 1;
 	color: #ffffff;
 	cursor: pointer;
@@ -1712,8 +1787,8 @@ p:not(.site-title) a:hover {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:before,
-.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .button:before, .fse-template-part .main-navigation .wp-block-button__link:after,
-.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:before, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:before, .fse-template-part .main-navigation .button:before, .fse-template-part .main-navigation .wp-block-button__link:after,
+.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:after, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1721,19 +1796,19 @@ p:not(.site-title) a:hover {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:before,
-.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .button:before {
+.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:before, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:before, .fse-template-part .main-navigation .button:before {
 	margin-bottom: -0.12em;
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:after,
-.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:after, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	margin-top: -0.11em;
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:not(.has-background):hover,
-.fse-template-part .main-navigation .wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-button__link:focus,
-.fse-template-part .main-navigation .wp-block-file__button:focus, .fse-template-part .main-navigation .button:focus, .fse-template-part .main-navigation .has-focus.wp-block-button__link,
-.fse-template-part .main-navigation .has-focus.wp-block-file__button, .fse-template-part .main-navigation .has-focus.button {
+.fse-template-part .main-navigation .wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-button__link:focus,
+.fse-template-part .main-navigation .wp-block-file__button:focus, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:focus, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:focus, .fse-template-part .main-navigation .button:focus, .fse-template-part .main-navigation .has-focus.wp-block-button__link,
+.fse-template-part .main-navigation .has-focus.wp-block-file__button, .fse-template-part .main-navigation .wp-block-search .has-focus.wp-block-search__button, .wp-block-search .fse-template-part .main-navigation .has-focus.wp-block-search__button, .fse-template-part .main-navigation .has-focus.button {
 	color: #ffffff;
 	background-color: #2f5f74;
 }

+ 96 - 16
alves/style-rtl.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #ffffff;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #ffffff;
 	background-color: #2f5f74;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #ffffff;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #ffffff;
 	background-color: #2f5f74;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #3E7D98;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 48px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #3E7D98;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1.25rem;
+	line-height: 1.25rem;
+	font-family: "Karla", Arial, sans-serif;
+	font-family: var(--font-base, "Karla", Arial, sans-serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 48px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #3E7D98;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1.25rem + 4px);
+	min-height: calc(2* 16px + 1.25rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #3E7D98;
 	clear: both;
@@ -4601,6 +4665,22 @@ body:not(.fse-enabled) #masthead {
 	}
 }
 
+/**
+ * Search block
+ */
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	border-radius: 160px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__input {
+	background: transparent;
+}
+
+.wp-block-search .wp-block-search__input {
+	margin-left: calc( .1 * 48px);
+	border-radius: 160px;
+}
+
 /**
  * Full Site Editing
  * - Full Site Editing overrides

+ 96 - 16
alves/style.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #ffffff;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #ffffff;
 	background-color: #2f5f74;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #ffffff;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #ffffff;
 	background-color: #2f5f74;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #3E7D98;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 48px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #3E7D98;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1.25rem;
+	line-height: 1.25rem;
+	font-family: "Karla", Arial, sans-serif;
+	font-family: var(--font-base, "Karla", Arial, sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 48px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #3E7D98;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1.25rem + 4px);
+	min-height: calc(2* 16px + 1.25rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #3E7D98;
 	clear: both;
@@ -4630,6 +4694,22 @@ body:not(.fse-enabled) #masthead {
 	}
 }
 
+/**
+ * Search block
+ */
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	border-radius: 160px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__input {
+	background: transparent;
+}
+
+.wp-block-search .wp-block-search__input {
+	margin-right: calc( .1 * 48px);
+	border-radius: 160px;
+}
+
 /**
  * Full Site Editing
  * - Full Site Editing overrides

+ 10 - 1
balasana/inc/wpcom-colors.php

@@ -60,6 +60,7 @@ add_color_rule( 'bg', '#FFFFFF', array(
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:hover,
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept,
 			body .widget_eu_cookie_law_widget #eu-cookie-law.negative,
+			.wp-block-search .wp-block-search__button,
 			button,
 			button.has-focus,
 			button:focus,
@@ -177,6 +178,9 @@ add_color_rule( 'link', '#19744C', array(
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus,
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:hover,
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept,
+			.wp-block-search .wp-block-search__button,
+			.wp-block-search .wp-block-search__button:focus,
+			.wp-block-search .wp-block-search__button:hover,
 			button.has-focus,
 			button:focus,
 			button:hover,
@@ -259,6 +263,7 @@ add_color_rule( 'link', '#19744C', array(
 			input[type="time"]:focus,
 			input[type="url"]:focus,
 			input[type="week"]:focus,
+			.wp-block-search .wp-block-search__input:focus,
 			textarea:focus', 'border-color' ),
 
 	/**
@@ -328,7 +333,9 @@ add_color_rule( 'txt', '#303030', array(
 			input[type="week"],
 			input[type="week"]:focus,
 			textarea,
-			textarea:focus', 'color' ),
+			textarea:focus
+			.wp-block-search .wp-block-search__input,
+			.wp-block-search .wp-block-search__input:focus', 'color' ),
 
 	// Background-color
 	array( '.wp-block-cover-image.has-background-dim:not([class*="background-color"]),
@@ -390,6 +397,8 @@ add_color_rule( 'txt', '#303030', array(
 			.wp-block-video figcaption,
 			figcaption', 'color' ),
 
+	array( '.wp-block-search .wp-block-search__input', 'border-color'),
+
 ), __( 'Text Color' ) );
 
 // Accent Color (Red)

+ 13 - 1
balasana/inc/wpcom-editor-colors.php

@@ -29,6 +29,7 @@ add_editor_color_rule( 'bg', '#FFFFFF', array(
 			#editor .editor-styles-wrapper .wp-block-cover-image.has-background-dim .block-editor-block-list__block,
 			#editor .editor-styles-wrapper .wp-block-cover-image.has-background-dim .wp-block-cover-image-text,
 			#editor .editor-styles-wrapper .wp-block-cover-image.has-background-dim .wp-block-cover-text,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
 			#editor .editor-styles-wrapper .wp-block-cover-image.has-background-dim .wp-block-cover__inner-container,
 			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color', 'color' ),
 
@@ -88,6 +89,7 @@ add_editor_color_rule( 'link', '#19744C', array(
 	array( '#editor .editor-styles-wrapper .button,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
 			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color', 'background-color' ),
 
 	// Border-left-color
@@ -98,8 +100,13 @@ add_editor_color_rule( 'link', '#19744C', array(
 	 */
 
 	// Background-color
-	array( '#editor .editor-styles-wrapper .has-primary-background-color,
+	array( '#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:focus,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:hover,
+			#editor .editor-styles-wrapper .has-primary-background-color,
 			#editor .editor-styles-wrapper .wp-block .has-primary-background-color', 'background-color' ),
+	
+
+	array( '#editor .editor-styles-wrapper .wp-block-search .wp-block-search__input:focus', 'border-color' ),
 
 	// Text-color
 	array( '#editor .editor-styles-wrapper .has-primary-color', 'color' ),
@@ -113,6 +120,8 @@ add_editor_color_rule( 'txt', '#303030', array(
 	// Text-color
 	array( '#editor .editor-styles-wrapper .editor-post-title__block .editor-post-title__input,
 			#editor .editor-styles-wrapper .wp-block-pullquote,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__input,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__input:focus,
 			#editor .editor-styles-wrapper ', 'color' ),
 
 	// Background-color
@@ -153,6 +162,9 @@ add_editor_color_rule( 'txt', '#303030', array(
 	array( '#editor .editor-styles-wrapper .has-foreground-light-background-color,
 			#editor .editor-styles-wrapper .wp-block .has-foreground-light-background-color', 'background-color', '+2' ),
 
+	// Border-color with less opacity (dim)
+	array( '#editor .editor-styles-wrapper .wp-block-search .wp-block-search__input', 'border-color', 0.8 ),
+
 ), __( 'Text Color' ) );
 
 // Accent Color (Red)

+ 1 - 1
balasana/package.json

@@ -1,6 +1,6 @@
 {
   "name": "balasana",
-  "version": "1.3.7",
+  "version": "1.3.8",
   "description": "Balasana",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 1 - 1
balasana/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Balasana is a clean and minimalist business theme designed with health and wellness-focused sites in mind.
 Requires at least: WordPress 4.9.6
-Version: 1.3.7
+Version: 1.3.8
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

+ 83 - 8
balasana/style-editor.css

@@ -202,6 +202,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 /**
  * Elements
  * - Styles for basic HTML elemants
@@ -469,7 +480,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -485,8 +496,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -494,19 +505,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before {
 	margin-bottom: -0.12em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	margin-top: -0.11em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button {
 	color: #FFFFFF;
 	background-color: #145f3e;
 }
@@ -921,6 +932,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #D0D0D0;
+	border-radius: 4px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #D0D0D0;
+	border-radius: 4px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #D0D0D0;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid #D0D0D0;

+ 80 - 16
balasana/style-rtl.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #145f3e;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #145f3e;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #D0D0D0;
+	border-radius: 4px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #D0D0D0;
+	border-radius: 4px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #D0D0D0;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #D0D0D0;
 	clear: both;

+ 80 - 16
balasana/style.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #145f3e;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #145f3e;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #D0D0D0;
+	border-radius: 4px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #D0D0D0;
+	border-radius: 4px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, Roboto, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #D0D0D0;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #D0D0D0;
 	clear: both;

+ 7 - 0
barnsbury/inc/wpcom-colors.php

@@ -61,6 +61,7 @@ add_color_rule( 'bg', '#FFFDF6', array(
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:hover,
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept,
 			body .widget_eu_cookie_law_widget #eu-cookie-law.negative,
+			.wp-block-search .wp-block-search__button,
 			button,
 			button.has-focus,
 			button:focus,
@@ -115,6 +116,7 @@ add_color_rule( 'link', '#20603C', array(
 			.wp-block-file__button,
 			.wp-block-pullquote.is-style-solid-color,
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept,
+			.wp-block-search .wp-block-search__button,
 			button,
 			button[data-load-more-btn],
 			input[type="submit"]', 'background-color' ),
@@ -194,6 +196,8 @@ add_color_rule( 'link', '#20603C', array(
 			.wp-block-newspack-blocks-homepage-articles article .entry-meta a:active,
 			.wp-block-newspack-blocks-homepage-articles article .entry-meta a:hover,
 			.wp-block-newspack-blocks-homepage-articles article .entry-title a:hover,
+			.wp-block-search .wp-block-search__button:focus,
+			.wp-block-search .wp-block-search__button:hover,
 			a:hover', 'color', 0.8 ),
 
 	// Border color left
@@ -268,6 +272,9 @@ add_color_rule( 'txt', '#3C2323', array(
 			hr,
 			hr.wp-block-separator', 'border-bottom-color' ),
 
+	// Border-color with less opacity (dim)
+	array( '.wp-block-search .wp-block-search__input', 'border-color', 0.8 ),
+
 	/**
 	 * Utility Classes
 	 */

+ 10 - 0
barnsbury/inc/wpcom-editor-colors.php

@@ -16,6 +16,7 @@ add_editor_color_rule( 'bg', '#FFFDF6', array(
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button:focus,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button:hover,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .has-focus.button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
 			#editor .editor-styles-wrapper .wp-block-button__link:not(.has-text-color),
 			#editor .editor-styles-wrapper .wp-block-button__link.has-focus:not(.has-text-color),
 			#editor .editor-styles-wrapper .wp-block-button__link:not(.has-text-color):focus,
@@ -82,11 +83,20 @@ add_editor_color_rule( 'link', '#20603C', array(
 
 	// Background-color
 	array( '#editor .editor-styles-wrapper .button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:focus,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:hover,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background),
 			#editor .editor-styles-wrapper .wp-block-button__link.is-style-outline,
 			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color', 'background-color' ),
 
+	
+	// Border-color (forms)
+	// Needs contrast against `bg` with less contrast
+	array( '#editor .editor-styles-wrapper .wp-block-search .wp-block-search__input:focus,
+			textarea:focus', 'border-color' ),
+
 	// Border-left-color
 	array( '#editor .editor-styles-wrapper .wp-block-quote', 'border-left-color' ),
 

+ 1 - 1
barnsbury/package.json

@@ -1,6 +1,6 @@
 {
   "name": "barnsbury",
-  "version": "1.3.7",
+  "version": "1.3.8",
   "description": "Barnsbury",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 1 - 1
barnsbury/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Barnsbury is an earthy and friendly theme design with farming and agriculture businesses in mind.
 Requires at least: WordPress 4.9.6
-Version: 1.3.7
+Version: 1.3.8
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

+ 83 - 8
barnsbury/style-editor.css

@@ -202,6 +202,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 /**
  * Elements
  * - Styles for basic HTML elemants
@@ -469,7 +480,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button {
 	line-height: 1;
 	color: #FFFDF6;
 	cursor: pointer;
@@ -485,8 +496,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -494,19 +505,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before {
 	margin-bottom: -0.12em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	margin-top: -0.11em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button {
 	color: ("default": #FFFDF6, "light": #FDF9EC, "dark": #DDDDDD);
 	background-color: #133a24;
 }
@@ -921,6 +932,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #AAAAAA;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 18px 18px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #AAAAAA;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
+	font-family: var(--font-headings, "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 18px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #AAAAAA;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 18px + 1rem + 4px);
+	min-height: calc(2* 18px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2.64px solid #3C2323;

+ 80 - 16
barnsbury/style-rtl.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFDF6;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: ("default": #FFFDF6, "light": #FDF9EC, "dark": #DDDDDD);
 	background-color: #133a24;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFDF6;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: ("default": #FFFDF6, "light": #FDF9EC, "dark": #DDDDDD);
 	background-color: #133a24;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #AAAAAA;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 18px 18px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #AAAAAA;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
+	font-family: var(--font-headings, "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 18px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #AAAAAA;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 18px + 1rem + 4px);
+	min-height: calc(2* 18px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2.64px solid #3C2323;
 	clear: both;

+ 80 - 16
barnsbury/style.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFDF6;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: ("default": #FFFDF6, "light": #FDF9EC, "dark": #DDDDDD);
 	background-color: #133a24;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFDF6;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: ("default": #FFFDF6, "light": #FDF9EC, "dark": #DDDDDD);
 	background-color: #133a24;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #AAAAAA;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 18px 18px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #AAAAAA;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
+	font-family: var(--font-headings, "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 18px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #AAAAAA;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 18px + 1rem + 4px);
+	min-height: calc(2* 18px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2.64px solid #3C2323;
 	clear: both;

+ 6 - 0
brompton/inc/wpcom-colors.php

@@ -58,6 +58,9 @@ add_color_rule(
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:hover,
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept,
 			body .widget_eu_cookie_law_widget #eu-cookie-law.negative,
+			.wp-block-search .wp-block-search__button,
+			.wp-block-search .wp-block-search__button:focus,
+			.wp-block-search .wp-block-search__button:hover,
 			button,
 			button.has-focus,
 			button:focus,
@@ -222,6 +225,8 @@ add_color_rule(
 			.has-focus.wp-block-button__link,
 			.has-focus.wp-block-file__button,
 			.sticky-post,
+			.wp-block-search .wp-block-search__button:focus,
+			.wp-block-search .wp-block-search__button:hover,
 			.wp-block-button__link:focus,
 			.wp-block-button__link:hover,
 			.wp-block-file__button:focus,
@@ -377,6 +382,7 @@ add_color_rule(
 			#masthead:after,
 			.a8c-posts-list__view-all,
 			.button,
+			.wp-block-search .wp-block-search__button,
 			.wp-block-button__link,
 			.wp-block-cover,
 			.wp-block-cover-image,

+ 4 - 0
brompton/inc/wpcom-editor-colors.php

@@ -32,6 +32,7 @@ add_editor_color_rule( 'bg', '#E8E4DD', array(
 			#editor .editor-styles-wrapper .wp-block-cover-image:not([class*="background-color"]) .wp-block-cover-image-text,
 			#editor .editor-styles-wrapper .wp-block-cover-image:not([class*="background-color"]) .wp-block-cover-text,
 			#editor .editor-styles-wrapper .wp-block-cover-image:not([class*="background-color"]) .wp-block-cover__inner-container,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
 			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color', 'color' ),
 
 	// Color
@@ -98,6 +99,8 @@ add_editor_color_rule( 'link', '#C04239', array(
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button:focus,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button:hover,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .has-focus.button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:focus,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:hover,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-focus,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
@@ -164,6 +167,7 @@ add_editor_color_rule( 'txt', '#252E36', array(
 	array( '#editor .editor-styles-wrapper .button,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
 			#editor .editor-styles-wrapper .wp-block-cover-image,
 			#editor .editor-styles-wrapper .wp-block-cover-image.has-background-dim,
 			#editor .editor-styles-wrapper .wp-block-cover,

+ 1 - 1
brompton/package.json

@@ -1,6 +1,6 @@
 {
   "name": "brompton",
-  "version": "1.4.7",
+  "version": "1.4.8",
   "description": "Brompton",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 1 - 1
brompton/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Running a business is no small task. But with the right tools and support, creating a website doesn’t have to be another chore on your to-do list: enter Brompton, a simple yet powerful theme for small-business owners and entrepreneurs.
 Requires at least: WordPress 4.9.6
-Version: 1.4.7
+Version: 1.4.8
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Status: inactive

+ 83 - 8
brompton/style-editor.css

@@ -202,6 +202,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 /**
  * Elements
  * - Styles for basic HTML elemants
@@ -469,7 +480,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button {
 	line-height: 1;
 	color: #E8E4DD;
 	cursor: pointer;
@@ -485,8 +496,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -494,19 +505,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before {
 	margin-bottom: -0.12em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	margin-top: -0.11em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button {
 	color: #E8E4DD;
 	background-color: #C04239;
 }
@@ -921,6 +932,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #B9B6B2;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #B9B6B2;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #B9B6B2;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid #B9B6B2;

+ 80 - 16
brompton/style-rtl.css

@@ -199,7 +199,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #E8E4DD;
 	cursor: pointer;
@@ -217,10 +217,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -230,27 +230,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #E8E4DD;
 	background-color: #C04239;
 }
@@ -1343,7 +1343,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #E8E4DD;
 	cursor: pointer;
@@ -1361,10 +1361,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1374,27 +1374,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #E8E4DD;
 	background-color: #C04239;
 }
@@ -2230,6 +2230,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #B9B6B2;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #B9B6B2;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #B9B6B2;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #B9B6B2;
 	clear: both;

+ 80 - 16
brompton/style.css

@@ -199,7 +199,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #E8E4DD;
 	cursor: pointer;
@@ -217,10 +217,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -230,27 +230,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #E8E4DD;
 	background-color: #C04239;
 }
@@ -1343,7 +1343,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #E8E4DD;
 	cursor: pointer;
@@ -1361,10 +1361,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1374,27 +1374,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #E8E4DD;
 	background-color: #C04239;
 }
@@ -2230,6 +2230,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #B9B6B2;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #B9B6B2;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "Nunito Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #B9B6B2;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #B9B6B2;
 	clear: both;

+ 2 - 0
coutoire/inc/wpcom-colors.php

@@ -43,6 +43,7 @@ add_color_rule( 'bg', '#FFFFFF', array(
 			.wp-block-file a.wp-block-file__button:focus,
 			.wp-block-file a.wp-block-file__button:hover,
 			.wp-block-file a.wp-block-file__button:visited,
+			.wp-block-search .wp-block-search__button,
 			.wp-block-file__button,
 			.wp-block-file__button:focus,
 			.wp-block-file__button:hover,
@@ -142,6 +143,7 @@ add_color_rule( 'link', '#000000', array(
 			.wp-block-file__button,
 			.wp-block-pullquote.is-style-solid-color,
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept,
+			.wp-block-search .wp-block-search__button,
 			button,
 			button[data-load-more-btn],
 			input[type="submit"]', 'background-color' ),

+ 2 - 0
coutoire/inc/wpcom-editor-colors.php

@@ -25,6 +25,7 @@ add_editor_color_rule( 'bg', '#FFFFFF', array(
 			#editor .editor-styles-wrapper .wp-block-button__link:hover,
 			#editor .editor-styles-wrapper table.is-style-stripes tbody tr:nth-child(odd),
 			#editor .editor-styles-wrapper .wp-block-table.is-style-stripes tbody tr:nth-child(odd),
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
 			#editor .editor-styles-wrapper .wp-block-cover,
 			#editor .editor-styles-wrapper .wp-block-cover-image,
 			#editor .editor-styles-wrapper .wp-block-cover-image:not([class="has-background-background-color"]) .wp-block-cover-image-text,
@@ -102,6 +103,7 @@ add_editor_color_rule( 'link', '#000000', array(
 
 	// Background-color
 	array( '#editor .editor-styles-wrapper .button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background),
 			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color', 'background-color' ),

+ 1 - 1
coutoire/package.json

@@ -1,6 +1,6 @@
 {
   "name": "coutoire",
-  "version": "1.4.7",
+  "version": "1.4.8",
   "description": "Coutoire",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 26 - 0
coutoire/sass/_extra-child-theme.scss

@@ -360,3 +360,29 @@ a.wp-block-file__button {
 		}
 	}
 }
+
+/**
+ * Search block
+ */
+
+ .wp-block-search {
+	&.wp-block-search__button-inside {
+		.wp-block-search__inside-wrapper{
+			border-radius: 9999px;
+		}
+		.wp-block-search__input {
+			background: transparent;
+		}
+	}
+	.wp-block-search__button{
+		border-radius: 9999px;
+		&.has-icon {
+			min-width: calc(2* #{map-deep-get($config-elements, "form", "padding")} + #{map-deep-get($config-global, "font", "size", "base")} + 4px);
+			min-height: calc(2* #{map-deep-get($config-elements, "form", "padding")} + #{map-deep-get($config-global, "font", "size", "base")} + 4px);
+		}
+	}
+	.wp-block-search__input {
+		margin-right: calc( .1 * #{map-deep-get($config-button, "padding", "horizontal")} );
+		border-radius: 9999px;
+	}
+} 

+ 1 - 1
coutoire/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: A design system for WordPress sites built with Gutenberg.
 Requires at least: WordPress 4.9.6
-Version: 1.4.7
+Version: 1.4.8
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

+ 83 - 8
coutoire/style-editor.css

@@ -202,6 +202,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 /**
  * Elements
  * - Styles for basic HTML elemants
@@ -469,7 +480,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -484,8 +495,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -493,19 +504,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before {
 	margin-bottom: -0.12em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	margin-top: -0.11em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button {
 	color: #FFFFFF;
 	background-color: #FF7A5C;
 }
@@ -918,6 +929,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: #FFFFFF;
+	color: #000000;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 11.6px 11.6px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: #000000;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 11.6px);
+	background: #FFFFFF;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: #000000;
+	border-color: #DDDDDD;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 11.6px + 1rem + 4px);
+	min-height: calc(2* 11.6px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid #DDDDDD;

+ 105 - 16
coutoire/style-rtl.css

@@ -197,7 +197,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -214,10 +214,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -227,27 +227,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #FF7A5C;
 }
@@ -1340,7 +1340,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -1357,10 +1357,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1370,27 +1370,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #FF7A5C;
 }
@@ -2226,6 +2226,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: #FFFFFF;
+	color: #000000;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 11.6px 11.6px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: #000000;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 11.6px);
+	background: #FFFFFF;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: #000000;
+	border-color: #DDDDDD;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 11.6px + 1rem + 4px);
+	min-height: calc(2* 11.6px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #DDDDDD;
 	clear: both;
@@ -4352,3 +4416,28 @@ a.wp-block-file__button {
 		top: 46px;
 	}
 }
+
+/**
+ * Search block
+ */
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	border-radius: 9999px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__input {
+	background: transparent;
+}
+
+.wp-block-search .wp-block-search__button {
+	border-radius: 9999px;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__input {
+	margin-left: calc( .1 * 11.6px);
+	border-radius: 9999px;
+}

+ 105 - 16
coutoire/style.css

@@ -197,7 +197,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -214,10 +214,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -227,27 +227,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #FF7A5C;
 }
@@ -1340,7 +1340,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -1357,10 +1357,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1370,27 +1370,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #FF7A5C;
 }
@@ -2226,6 +2226,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: #FFFFFF;
+	color: #000000;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 11.6px 11.6px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: #000000;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 11.6px);
+	background: #FFFFFF;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: #000000;
+	border-color: #DDDDDD;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 11.6px + 1rem + 4px);
+	min-height: calc(2* 11.6px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #DDDDDD;
 	clear: both;
@@ -4381,3 +4445,28 @@ a.wp-block-file__button {
 		top: 46px;
 	}
 }
+
+/**
+ * Search block
+ */
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	border-radius: 9999px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__input {
+	background: transparent;
+}
+
+.wp-block-search .wp-block-search__button {
+	border-radius: 9999px;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__input {
+	margin-right: calc( .1 * 11.6px);
+	border-radius: 9999px;
+}

+ 8 - 0
dalston/inc/wpcom-colors.php

@@ -32,6 +32,10 @@ add_color_rule( 'bg', '#FFFFFF', array(
 			.a8c-posts-list__view-all:hover,
 			.a8c-posts-list__view-all.has-focus,
 			.entry .entry-content .wp-block-media-text,
+			.wp-block-search .wp-block-search__button,
+			.wp-block-search .wp-block-search__button:hover,
+			.wp-block-search .wp-block-search__button:not(.has-background):hover,
+			.wp-block-search .wp-block-search__button:focus,
 			.button,
 			.button:focus,
 			.button:hover,
@@ -140,6 +144,10 @@ add_color_rule( 'link', '#0073AA', array(
 	array( '.a8c-posts-list-item__featured span,
 			.a8c-posts-list__view-all,
 			.button,
+			.wp-block-search .wp-block-search__button,
+			.wp-block-search .wp-block-search__button:hover,
+			.wp-block-search .wp-block-search__button:not(.has-background):hover,
+			.wp-block-search .wp-block-search__button:focus,
 			.wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background),
 			.wp-block-file .wp-block-file__button,
 			.wp-block-file__button,

+ 2 - 0
dalston/inc/wpcom-editor-colors.php

@@ -20,6 +20,7 @@ add_editor_color_rule( 'bg', '#FFFFFF', array(
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button:hover,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .has-focus.button,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-focus,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
@@ -72,6 +73,7 @@ add_editor_color_rule( 'link', '#0073AA', array(
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background-color),
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background),
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
 			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color', 'background-color' ),
 
 	// Text-color

+ 1 - 1
dalston/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dalston",
-  "version": "1.3.7",
+  "version": "1.3.8",
   "description": "Dalston",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 1 - 1
dalston/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Make your online portfolio impressively awesome with Dalston. With the ability to beautifully highlight your illustration and other projects, Dalston is also versatile enough to be your personal site too.
 Requires at least: WordPress 4.9.6
-Version: 1.3.8
+Version: 1.3.9
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

+ 83 - 8
dalston/style-editor.css

@@ -202,6 +202,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 /**
  * Elements
  * - Styles for basic HTML elemants
@@ -469,7 +480,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -485,8 +496,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -494,19 +505,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before {
 	margin-bottom: -0.12em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	margin-top: -0.11em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button {
 	color: #FFFFFF;
 	background-color: #005177;
 }
@@ -921,6 +932,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Crimson Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
+	font-family: var(--font-headings, "Crimson Text", "Baskerville Old Face", Garamond, "Times New Roman", serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #CCCCCC;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid #CCCCCC;

+ 80 - 16
dalston/style-rtl.css

@@ -197,7 +197,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -215,10 +215,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -228,27 +228,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #005177;
 }
@@ -1341,7 +1341,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -1359,10 +1359,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1372,27 +1372,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #005177;
 }
@@ -2228,6 +2228,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Crimson Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
+	font-family: var(--font-headings, "Crimson Text", "Baskerville Old Face", Garamond, "Times New Roman", serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #CCCCCC;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #CCCCCC;
 	clear: both;

+ 80 - 16
dalston/style.css

@@ -197,7 +197,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -215,10 +215,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -228,27 +228,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #005177;
 }
@@ -1341,7 +1341,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -1359,10 +1359,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1372,27 +1372,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #005177;
 }
@@ -2228,6 +2228,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Crimson Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
+	font-family: var(--font-headings, "Crimson Text", "Baskerville Old Face", Garamond, "Times New Roman", serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #CCCCCC;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #CCCCCC;
 	clear: both;

+ 5 - 0
exford/inc/wpcom-colors.php

@@ -117,6 +117,10 @@ add_color_rule( 'link', '#23883D', array(
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept,
 			button,
 			button[data-load-more-btn],
+			.wp-block-search .wp-block-search__button,
+			.wp-block-search .wp-block-search__button:not(.has-background):hover,
+			.wp-block-search .wp-block-search__button:hover,
+			.wp-block-search .wp-block-search__button:focus,
 			input[type="submit"]', 'background-color' ),
 			
 	// Text-color
@@ -175,6 +179,7 @@ add_color_rule( 'txt', '#111111', array(
 			.wp-block-code,
 			.wp-block-code pre,
 			.wp-block-pullquote,
+			.wp-block-search .wp-block-search__button,
 			body,
 			body .widget_eu_cookie_law_widget #eu-cookie-law,
 			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept,

+ 4 - 0
exford/inc/wpcom-editor-colors.php

@@ -82,6 +82,9 @@ add_editor_color_rule( 'link', '#23883D', array(
 
 	// Background-color
 	array( '#editor .editor-styles-wrapper .button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:hover,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:focus,
 			#editor .editor-styles-wrapper .fse-template-part .main-navigation .button,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link,
@@ -123,6 +126,7 @@ add_editor_color_rule( 'txt', '#111111', array(
 
 	// Text-color
 	array( '#editor .editor-styles-wrapper .editor-post-title__block .editor-post-title__input,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
 			#editor .editor-styles-wrapper .fse-template-part .main-navigation,
 			#editor .editor-styles-wrapper .wp-block-pullquote,
 			#editor .editor-styles-wrapper .wp-block-code,

+ 1 - 1
exford/package.json

@@ -1,6 +1,6 @@
 {
   "name": "exford",
-  "version": "1.5.7",
+  "version": "1.5.8",
   "description": "Exford",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 1 - 1
exford/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Make your online presence as striking and stylish as your business with Exford.
 Requires at least: WordPress 4.9.6
-Version: 1.5.7
+Version: 1.5.8
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

+ 91 - 16
exford/style-editor.css

@@ -202,6 +202,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 /**
  * Elements
  * - Styles for basic HTML elemants
@@ -469,7 +480,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button, .fse-template-part .main-navigation .button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button, .fse-template-part .main-navigation .button {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -485,8 +496,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .fse-template-part .main-navigation .button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .fse-template-part .main-navigation .button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -494,19 +505,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .fse-template-part .main-navigation .button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .fse-template-part .main-navigation .button:before {
 	margin-bottom: -0.12em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	margin-top: -0.11em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .fse-template-part .main-navigation .button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .fse-template-part .main-navigation .has-focus.button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .fse-template-part .main-navigation .button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button, .fse-template-part .main-navigation .has-focus.button {
 	color: white;
 	background-color: #195f2b;
 }
@@ -921,6 +932,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #CCCCCC;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid #CCCCCC;
@@ -1697,7 +1772,7 @@ pre.wp-block-verse {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link,
-.fse-template-part .main-navigation .wp-block-file__button, .fse-template-part .main-navigation .button {
+.fse-template-part .main-navigation .wp-block-file__button, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button, .fse-template-part .main-navigation .button {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -1713,8 +1788,8 @@ pre.wp-block-verse {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:before,
-.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .button:before, .fse-template-part .main-navigation .wp-block-button__link:after,
-.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:before, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:before, .fse-template-part .main-navigation .button:before, .fse-template-part .main-navigation .wp-block-button__link:after,
+.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:after, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1722,19 +1797,19 @@ pre.wp-block-verse {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:before,
-.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .button:before {
+.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:before, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:before, .fse-template-part .main-navigation .button:before {
 	margin-bottom: -0.12em;
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:after,
-.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:after, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	margin-top: -0.11em;
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:not(.has-background):hover,
-.fse-template-part .main-navigation .wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-button__link:focus,
-.fse-template-part .main-navigation .wp-block-file__button:focus, .fse-template-part .main-navigation .button:focus, .fse-template-part .main-navigation .has-focus.wp-block-button__link,
-.fse-template-part .main-navigation .has-focus.wp-block-file__button, .fse-template-part .main-navigation .has-focus.button {
+.fse-template-part .main-navigation .wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-button__link:focus,
+.fse-template-part .main-navigation .wp-block-file__button:focus, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:focus, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:focus, .fse-template-part .main-navigation .button:focus, .fse-template-part .main-navigation .has-focus.wp-block-button__link,
+.fse-template-part .main-navigation .has-focus.wp-block-file__button, .fse-template-part .main-navigation .wp-block-search .has-focus.wp-block-search__button, .wp-block-search .fse-template-part .main-navigation .has-focus.wp-block-search__button, .fse-template-part .main-navigation .has-focus.button {
 	color: white;
 	background-color: #195f2b;
 }

+ 80 - 16
exford/style-rtl.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #195f2b;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #195f2b;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #CCCCCC;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #CCCCCC;
 	clear: both;

+ 80 - 16
exford/style.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #195f2b;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #195f2b;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #CCCCCC;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #CCCCCC;
 	clear: both;

+ 1 - 1
hever/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hever",
-  "version": "1.5.7",
+  "version": "1.5.8",
   "description": "Hever",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 1 - 1
hever/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: A fully responsive theme, ideal for creating a strong — yet beautiful — online presence for your business.
 Requires at least: WordPress 4.9.6
-Version: 1.5.7
+Version: 1.5.8
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

+ 91 - 16
hever/style-editor.css

@@ -229,6 +229,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 /**
  * Elements
  * - Styles for basic HTML elemants
@@ -496,7 +507,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button, .fse-template-part .main-navigation .button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button, .fse-template-part .main-navigation .button {
 	line-height: 1;
 	color: var(--wp--preset--color--background);
 	cursor: pointer;
@@ -512,8 +523,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .fse-template-part .main-navigation .button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .fse-template-part .main-navigation .button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -521,19 +532,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .fse-template-part .main-navigation .button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .fse-template-part .main-navigation .button:before {
 	margin-bottom: -0.12em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	margin-top: -0.11em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .fse-template-part .main-navigation .button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .fse-template-part .main-navigation .has-focus.button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .fse-template-part .main-navigation .button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button, .fse-template-part .main-navigation .has-focus.button {
 	color: var(--wp--preset--color--background);
 	background-color: var(--wp--preset--color--primary-hover);
 }
@@ -948,6 +959,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: var(--wp--preset--color--white);
+	color: var(--wp--preset--color--black);
+	border: 1px solid var(--wp--preset--color--border);
+	border-radius: 5px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 24px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: var(--wp--preset--color--black);
+	border: 1px solid var(--wp--preset--color--border);
+	border-radius: 5px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 24px);
+	background: var(--wp--preset--color--white);
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: var(--wp--preset--color--black);
+	border-color: var(--wp--preset--color--border);
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid var(--wp--preset--color--border);
@@ -1684,7 +1759,7 @@ pre.wp-block-verse {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link,
-.fse-template-part .main-navigation .wp-block-file__button, .fse-template-part .main-navigation .button {
+.fse-template-part .main-navigation .wp-block-file__button, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button, .fse-template-part .main-navigation .button {
 	line-height: 1;
 	color: var(--wp--preset--color--background);
 	cursor: pointer;
@@ -1700,8 +1775,8 @@ pre.wp-block-verse {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:before,
-.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .button:before, .fse-template-part .main-navigation .wp-block-button__link:after,
-.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:before, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:before, .fse-template-part .main-navigation .button:before, .fse-template-part .main-navigation .wp-block-button__link:after,
+.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:after, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1709,19 +1784,19 @@ pre.wp-block-verse {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:before,
-.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .button:before {
+.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:before, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:before, .fse-template-part .main-navigation .button:before {
 	margin-bottom: -0.12em;
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:after,
-.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:after, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	margin-top: -0.11em;
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:not(.has-background):hover,
-.fse-template-part .main-navigation .wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-button__link:focus,
-.fse-template-part .main-navigation .wp-block-file__button:focus, .fse-template-part .main-navigation .button:focus, .fse-template-part .main-navigation .has-focus.wp-block-button__link,
-.fse-template-part .main-navigation .has-focus.wp-block-file__button, .fse-template-part .main-navigation .has-focus.button {
+.fse-template-part .main-navigation .wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-button__link:focus,
+.fse-template-part .main-navigation .wp-block-file__button:focus, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:focus, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:focus, .fse-template-part .main-navigation .button:focus, .fse-template-part .main-navigation .has-focus.wp-block-button__link,
+.fse-template-part .main-navigation .has-focus.wp-block-file__button, .fse-template-part .main-navigation .wp-block-search .has-focus.wp-block-search__button, .wp-block-search .fse-template-part .main-navigation .has-focus.wp-block-search__button, .fse-template-part .main-navigation .has-focus.button {
 	color: var(--wp--preset--color--background);
 	background-color: var(--wp--preset--color--primary-hover);
 }

+ 80 - 16
hever/style-rtl.css

@@ -225,7 +225,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: var(--wp--preset--color--background);
 	cursor: pointer;
@@ -243,10 +243,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -256,27 +256,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: var(--wp--preset--color--background);
 	background-color: var(--wp--preset--color--primary-hover);
 }
@@ -1369,7 +1369,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: var(--wp--preset--color--background);
 	cursor: pointer;
@@ -1387,10 +1387,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1400,27 +1400,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: var(--wp--preset--color--background);
 	background-color: var(--wp--preset--color--primary-hover);
 }
@@ -2256,6 +2256,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: var(--wp--preset--color--white);
+	color: var(--wp--preset--color--black);
+	border: 1px solid var(--wp--preset--color--border);
+	border-radius: 5px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 24px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: var(--wp--preset--color--black);
+	border: 1px solid var(--wp--preset--color--border);
+	border-radius: 5px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 24px);
+	background: var(--wp--preset--color--white);
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: var(--wp--preset--color--black);
+	border-color: var(--wp--preset--color--border);
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid var(--wp--preset--color--border);
 	clear: both;

+ 80 - 16
hever/style.css

@@ -225,7 +225,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: var(--wp--preset--color--background);
 	cursor: pointer;
@@ -243,10 +243,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -256,27 +256,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: var(--wp--preset--color--background);
 	background-color: var(--wp--preset--color--primary-hover);
 }
@@ -1369,7 +1369,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: var(--wp--preset--color--background);
 	cursor: pointer;
@@ -1387,10 +1387,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1400,27 +1400,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: var(--wp--preset--color--background);
 	background-color: var(--wp--preset--color--primary-hover);
 }
@@ -2256,6 +2256,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: var(--wp--preset--color--white);
+	color: var(--wp--preset--color--black);
+	border: 1px solid var(--wp--preset--color--border);
+	border-radius: 5px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 24px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: var(--wp--preset--color--black);
+	border: 1px solid var(--wp--preset--color--border);
+	border-radius: 5px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "PT Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 24px);
+	background: var(--wp--preset--color--white);
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: var(--wp--preset--color--black);
+	border-color: var(--wp--preset--color--border);
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid var(--wp--preset--color--border);
 	clear: both;

+ 8 - 0
leven/inc/wpcom-colors.php

@@ -15,6 +15,10 @@ add_color_rule( 'bg', '#f7f7f6', array(
 	// Text-color
 	array( '.a8c-posts-list-item__featured span,
 			.sticky-post,
+			.wp-block-search .wp-block-search__button,
+			.wp-block-search .wp-block-search__button:hover,
+			.wp-block-search .wp-block-search__button:not(.has-background):hover,
+			.wp-block-search .wp-block-search__button:focus,
 			.button,
 			button,
 			button[data-load-more-btn],
@@ -121,6 +125,10 @@ add_color_rule( 'link', '#ff302c', array(
 			.wp-block-file__button,
 			.wp-block-pullquote.is-style-solid-color,
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept,
+			.wp-block-search .wp-block-search__button,
+			.wp-block-search .wp-block-search__button:hover,
+			.wp-block-search .wp-block-search__button:not(.has-background):hover,
+			.wp-block-search .wp-block-search__button:focus,
 			button,
 			button[data-load-more-btn],
 			input[type="submit"]', 'background-color' ),

+ 5 - 0
leven/inc/wpcom-editor-colors.php

@@ -13,6 +13,7 @@ add_editor_color_rule( 'bg', '#f7f7f6', array(
 	// Text-color
 	array( '#editor .editor-styles-wrapper .wp-block-button__link:not(.has-text-color),
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-text-color),
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
 			#editor .editor-styles-wrapper .wp-block-cover,
 			#editor .editor-styles-wrapper .wp-block-cover-image,
 			#editor .editor-styles-wrapper .wp-block-cover-image:not([class*="background-color"]) .block-editor-block-list__block,
@@ -96,6 +97,10 @@ add_editor_color_rule( 'link', '#ff302c', array(
 
 	// Background-color
 	array( '#editor .editor-styles-wrapper .button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:hover,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:not(.has-background):hover,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:focus,
 			#editor .editor-styles-wrapper .fse-template-part .main-navigation .button,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link,

+ 1 - 1
leven/package.json

@@ -1,6 +1,6 @@
 {
   "name": "leven",
-  "version": "1.4.7",
+  "version": "1.4.8",
   "description": "Leven",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 1 - 1
leven/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: the WordPress team
 Author URI: https://wordpress.org/
 Description: A colorful, typography driven, Gutenberg-ready theme meant to grab the attention of potential customers and market or sell products to them.
 Requires at least: WordPress 4.9.6
-Version: 1.4.7
+Version: 1.4.8
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

+ 83 - 8
leven/style-editor.css

@@ -202,6 +202,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 /**
  * Elements
  * - Styles for basic HTML elemants
@@ -469,7 +480,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -485,8 +496,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -494,19 +505,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before {
 	margin-bottom: -0.12em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	margin-top: -0.11em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button {
 	color: white;
 	background-color: #1285ce;
 }
@@ -921,6 +932,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: calc( 0.33 * 16px);
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+	padding: calc( 0.33 * 16px);
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #DDDDDD;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid #DDDDDD;

+ 80 - 16
leven/style-rtl.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #1285ce;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #1285ce;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: calc( 0.33 * 16px);
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+	padding: calc( 0.33 * 16px);
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #DDDDDD;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #DDDDDD;
 	clear: both;

+ 80 - 16
leven/style.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #1285ce;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #1285ce;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: calc( 0.33 * 16px);
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+	padding: calc( 0.33 * 16px);
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #DDDDDD;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #DDDDDD;
 	clear: both;

+ 8 - 0
mayland/inc/wpcom-colors.php

@@ -19,6 +19,10 @@ add_color_rule( 'bg', '#ffffff', array(
 	// Text-color
 	array( '.a8c-posts-list-item__featured span,
 			.sticky-post,
+			.wp-block-search .wp-block-search__button,
+			.wp-block-search .wp-block-search__button:hover,
+			.wp-block-search .wp-block-search__button:not(.has-background):hover,
+			.wp-block-search .wp-block-search__button:focus,
 			.wp-block-pullquote.is-style-solid-color,
 			body .widget_eu_cookie_law_widget #eu-cookie-law.negative,
 			.main-navigation .button,
@@ -112,6 +116,10 @@ add_color_rule( 'link', '#000000', array(
 	// Background-color
 	array( '.a8c-posts-list-item__featured span,
 			.a8c-posts-list__view-all,
+			.wp-block-search .wp-block-search__button,
+			.wp-block-search .wp-block-search__button:hover,
+			.wp-block-search .wp-block-search__button:not(.has-background):hover,
+			.wp-block-search .wp-block-search__button:focus,
 			.button,
 			.sticky-post,
 			.wp-block-button__link,

+ 8 - 0
mayland/inc/wpcom-editor-colors.php

@@ -13,6 +13,10 @@ add_editor_color_rule( 'bg', '#ffffff', array(
 	// Text-color
 	array( '#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link.has-focus,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:hover,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:not(.has-background):hover,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:focus,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover', 'color' ),
 
@@ -72,6 +76,10 @@ add_editor_color_rule( 'link', '#000000', array(
 
 	// Background-color
 	array( '#editor .editor-styles-wrapper .button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:hover,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:not(.has-background):hover,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:focus,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background-color),

+ 1 - 1
mayland/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mayland",
-  "version": "1.3.7",
+  "version": "1.3.8",
   "description": "mayland",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 1 - 1
mayland/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Make your online portfolio wonderfully uncluttered with Mayland. Gracefully highlight your photography and other projects. Mayland is versatile enough to be your personal site too.
 Requires at least: WordPress 4.9.6
-Version: 1.3.7
+Version: 1.3.8
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

+ 83 - 8
mayland/style-editor.css

@@ -202,6 +202,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 /**
  * Elements
  * - Styles for basic HTML elemants
@@ -469,7 +480,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -485,8 +496,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -494,19 +505,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before {
 	margin-bottom: -0.12em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	margin-top: -0.11em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button {
 	color: white;
 	background-color: #666666;
 }
@@ -920,6 +931,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #e6e6e6;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #e6e6e6;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #e6e6e6;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid #e6e6e6;

+ 80 - 16
mayland/style-rtl.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #666666;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #666666;
 }
@@ -2228,6 +2228,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #e6e6e6;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #e6e6e6;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #e6e6e6;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #e6e6e6;
 	clear: both;

+ 80 - 16
mayland/style.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #666666;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #666666;
 }
@@ -2228,6 +2228,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #e6e6e6;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #e6e6e6;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #e6e6e6;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #e6e6e6;
 	clear: both;

+ 4 - 0
maywood/inc/wpcom-colors.php

@@ -139,6 +139,10 @@ add_color_rule( 'link', '#897248', array(
 			.wp-block-pullquote.is-style-solid-color,
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept,
 			button,
+			.wp-block-search .wp-block-search__button,
+			.wp-block-search .wp-block-search__button:hover,
+			.wp-block-search .wp-block-search__button:not(.has-background):hover,
+			.wp-block-search .wp-block-search__button:focus,
 			button[data-load-more-btn],
 			input[type="submit"]', 'background-color' ),
 

+ 4 - 0
maywood/inc/wpcom-editor-colors.php

@@ -127,6 +127,10 @@ add_editor_color_rule(
 		// Background-color
 		array(
 			'#editor .editor-styles-wrapper .button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:hover,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:not(.has-background):hover,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:focus,
 			#editor .editor-styles-wrapper .fse-template-part .main-navigation #toggle:focus + #toggle-menu,
 			#editor .editor-styles-wrapper .fse-template-part .main-navigation .button,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button,

+ 1 - 1
maywood/package.json

@@ -1,6 +1,6 @@
 {
   "name": "maywood",
-  "version": "1.5.7",
+  "version": "1.5.8",
   "description": "Maywood",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 1 - 1
maywood/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Maywood is a refined theme designed for restaurants and food-related businesses seeking a modern look.
 Requires at least: WordPress 4.9.6
-Version: 1.5.7
+Version: 1.5.8
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

+ 91 - 16
maywood/style-editor.css

@@ -202,6 +202,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 /**
  * Elements
  * - Styles for basic HTML elemants
@@ -484,7 +495,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button, .fse-template-part .main-navigation .button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button, .fse-template-part .main-navigation .button {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -500,8 +511,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .fse-template-part .main-navigation .button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .fse-template-part .main-navigation .button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -509,19 +520,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .fse-template-part .main-navigation .button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .fse-template-part .main-navigation .button:before {
 	margin-bottom: -0.12em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	margin-top: -0.11em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .fse-template-part .main-navigation .button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .fse-template-part .main-navigation .has-focus.button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .fse-template-part .main-navigation .button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button, .fse-template-part .main-navigation .has-focus.button {
 	color: white;
 	background-color: #685636;
 }
@@ -936,6 +947,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #CCCCCC;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid #CCCCCC;
@@ -1747,7 +1822,7 @@ b, strong {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link,
-.fse-template-part .main-navigation .wp-block-file__button, .fse-template-part .main-navigation .button {
+.fse-template-part .main-navigation .wp-block-file__button, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button, .fse-template-part .main-navigation .button {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -1763,8 +1838,8 @@ b, strong {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:before,
-.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .button:before, .fse-template-part .main-navigation .wp-block-button__link:after,
-.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:before, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:before, .fse-template-part .main-navigation .button:before, .fse-template-part .main-navigation .wp-block-button__link:after,
+.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:after, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1772,19 +1847,19 @@ b, strong {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:before,
-.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .button:before {
+.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:before, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:before, .fse-template-part .main-navigation .button:before {
 	margin-bottom: -0.12em;
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:after,
-.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:after, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	margin-top: -0.11em;
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:not(.has-background):hover,
-.fse-template-part .main-navigation .wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-button__link:focus,
-.fse-template-part .main-navigation .wp-block-file__button:focus, .fse-template-part .main-navigation .button:focus, .fse-template-part .main-navigation .has-focus.wp-block-button__link,
-.fse-template-part .main-navigation .has-focus.wp-block-file__button, .fse-template-part .main-navigation .has-focus.button {
+.fse-template-part .main-navigation .wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-button__link:focus,
+.fse-template-part .main-navigation .wp-block-file__button:focus, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:focus, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:focus, .fse-template-part .main-navigation .button:focus, .fse-template-part .main-navigation .has-focus.wp-block-button__link,
+.fse-template-part .main-navigation .has-focus.wp-block-file__button, .fse-template-part .main-navigation .wp-block-search .has-focus.wp-block-search__button, .wp-block-search .fse-template-part .main-navigation .has-focus.wp-block-search__button, .fse-template-part .main-navigation .has-focus.button {
 	color: white;
 	background-color: #685636;
 }

+ 80 - 16
maywood/style-rtl.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #685636;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #685636;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #CCCCCC;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #CCCCCC;
 	clear: both;

+ 80 - 16
maywood/style.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #685636;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: white;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: white;
 	background-color: #685636;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #CCCCCC;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #CCCCCC;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #CCCCCC;
 	clear: both;

+ 1 - 1
morden/package.json

@@ -1,6 +1,6 @@
 {
   "name": "morden",
-  "version": "1.6.7",
+  "version": "1.6.8",
   "description": "Morden",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 19 - 1
morden/sass/_extra-child-theme.scss

@@ -638,4 +638,22 @@ article .entry-header .entry-title,
 			}
 		}
 	}
-}
+}
+
+/**
+ * Search block
+ */
+ .wp-block-search {
+	&.wp-block-search__button-inside {
+		.wp-block-search__inside-wrapper{
+			border-radius: #{map-deep-get($config-button, "border-radius")};
+		}
+		.wp-block-search__input {
+			background: transparent;
+		}
+	}
+	.wp-block-search__input {
+		margin-right: calc( .1 * #{map-deep-get($config-button, "padding", "horizontal")} );
+		border-radius: #{map-deep-get($config-button, "border-radius")};
+	}
+}

+ 1 - 1
morden/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Morden is a functional and responsive multi-purpose theme that is the perfect solution for your business's online presence.
 Requires at least: WordPress 4.9.6
-Version: 1.6.8
+Version: 1.6.9
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

+ 91 - 16
morden/style-editor.css

@@ -229,6 +229,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 /**
  * Elements
  * - Styles for basic HTML elemants
@@ -496,7 +507,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button, .fse-template-part .main-navigation .button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button, .fse-template-part .main-navigation .button {
 	line-height: 1;
 	color: var(--wp--preset--color--background);
 	cursor: pointer;
@@ -512,8 +523,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .fse-template-part .main-navigation .button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .fse-template-part .main-navigation .button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -521,19 +532,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .fse-template-part .main-navigation .button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .fse-template-part .main-navigation .button:before {
 	margin-bottom: -0.12em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	margin-top: -0.11em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .fse-template-part .main-navigation .button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .fse-template-part .main-navigation .has-focus.button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .fse-template-part .main-navigation .button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button, .fse-template-part .main-navigation .has-focus.button {
 	color: var(--wp--preset--color--background);
 	background-color: var(--wp--preset--color--primary-hover);
 }
@@ -948,6 +959,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: var(--wp--preset--color--white);
+	color: var(--wp--preset--color--black);
+	border: 1px solid var(--wp--preset--color--border);
+	border-radius: 5px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 24px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: var(--wp--preset--color--black);
+	border: 1px solid var(--wp--preset--color--border);
+	border-radius: 5px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 24px);
+	background: var(--wp--preset--color--white);
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: var(--wp--preset--color--black);
+	border-color: var(--wp--preset--color--border);
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid var(--wp--preset--color--border);
@@ -1687,7 +1762,7 @@ pre.wp-block-verse {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link,
-.fse-template-part .main-navigation .wp-block-file__button, .fse-template-part .main-navigation .button {
+.fse-template-part .main-navigation .wp-block-file__button, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button, .fse-template-part .main-navigation .button {
 	line-height: 1;
 	color: var(--wp--preset--color--background);
 	cursor: pointer;
@@ -1703,8 +1778,8 @@ pre.wp-block-verse {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:before,
-.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .button:before, .fse-template-part .main-navigation .wp-block-button__link:after,
-.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:before, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:before, .fse-template-part .main-navigation .button:before, .fse-template-part .main-navigation .wp-block-button__link:after,
+.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:after, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1712,19 +1787,19 @@ pre.wp-block-verse {
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:before,
-.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .button:before {
+.fse-template-part .main-navigation .wp-block-file__button:before, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:before, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:before, .fse-template-part .main-navigation .button:before {
 	margin-bottom: -0.12em;
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:after,
-.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .button:after {
+.fse-template-part .main-navigation .wp-block-file__button:after, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:after, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:after, .fse-template-part .main-navigation .button:after {
 	margin-top: -0.11em;
 }
 
 .fse-template-part .main-navigation .wp-block-button__link:not(.has-background):hover,
-.fse-template-part .main-navigation .wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-button__link:focus,
-.fse-template-part .main-navigation .wp-block-file__button:focus, .fse-template-part .main-navigation .button:focus, .fse-template-part .main-navigation .has-focus.wp-block-button__link,
-.fse-template-part .main-navigation .has-focus.wp-block-file__button, .fse-template-part .main-navigation .has-focus.button {
+.fse-template-part .main-navigation .wp-block-file__button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:not(.has-background):hover, .fse-template-part .main-navigation .button:not(.has-background):hover, .fse-template-part .main-navigation .wp-block-button__link:focus,
+.fse-template-part .main-navigation .wp-block-file__button:focus, .fse-template-part .main-navigation .wp-block-search .wp-block-search__button:focus, .wp-block-search .fse-template-part .main-navigation .wp-block-search__button:focus, .fse-template-part .main-navigation .button:focus, .fse-template-part .main-navigation .has-focus.wp-block-button__link,
+.fse-template-part .main-navigation .has-focus.wp-block-file__button, .fse-template-part .main-navigation .wp-block-search .has-focus.wp-block-search__button, .wp-block-search .fse-template-part .main-navigation .has-focus.wp-block-search__button, .fse-template-part .main-navigation .has-focus.button {
 	color: var(--wp--preset--color--background);
 	background-color: var(--wp--preset--color--primary-hover);
 }

+ 96 - 16
morden/style-rtl.css

@@ -225,7 +225,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: var(--wp--preset--color--background);
 	cursor: pointer;
@@ -243,10 +243,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -256,27 +256,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: var(--wp--preset--color--background);
 	background-color: var(--wp--preset--color--primary-hover);
 }
@@ -1369,7 +1369,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: var(--wp--preset--color--background);
 	cursor: pointer;
@@ -1387,10 +1387,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1400,27 +1400,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: var(--wp--preset--color--background);
 	background-color: var(--wp--preset--color--primary-hover);
 }
@@ -2256,6 +2256,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: var(--wp--preset--color--white);
+	color: var(--wp--preset--color--black);
+	border: 1px solid var(--wp--preset--color--border);
+	border-radius: 5px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 24px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: var(--wp--preset--color--black);
+	border: 1px solid var(--wp--preset--color--border);
+	border-radius: 5px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 24px);
+	background: var(--wp--preset--color--white);
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: var(--wp--preset--color--black);
+	border-color: var(--wp--preset--color--border);
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid var(--wp--preset--color--border);
 	clear: both;
@@ -4762,6 +4826,22 @@ article .entry-header .entry-title a:active, article .entry-header .entry-title
 	}
 }
 
+/**
+ * Search block
+ */
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	border-radius: 5px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__input {
+	background: transparent;
+}
+
+.wp-block-search .wp-block-search__input {
+	margin-left: calc( .1 * 24px);
+	border-radius: 5px;
+}
+
 /**
  * Full Site Editing
  * - Full Site Editing overrides

+ 96 - 16
morden/style.css

@@ -225,7 +225,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: var(--wp--preset--color--background);
 	cursor: pointer;
@@ -243,10 +243,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -256,27 +256,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: var(--wp--preset--color--background);
 	background-color: var(--wp--preset--color--primary-hover);
 }
@@ -1369,7 +1369,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: var(--wp--preset--color--background);
 	cursor: pointer;
@@ -1387,10 +1387,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1400,27 +1400,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: var(--wp--preset--color--background);
 	background-color: var(--wp--preset--color--primary-hover);
 }
@@ -2256,6 +2256,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: var(--wp--preset--color--white);
+	color: var(--wp--preset--color--black);
+	border: 1px solid var(--wp--preset--color--border);
+	border-radius: 5px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 24px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: var(--wp--preset--color--black);
+	border: 1px solid var(--wp--preset--color--border);
+	border-radius: 5px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 24px);
+	background: var(--wp--preset--color--white);
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: var(--wp--preset--color--black);
+	border-color: var(--wp--preset--color--border);
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid var(--wp--preset--color--border);
 	clear: both;
@@ -4791,6 +4855,22 @@ article .entry-header .entry-title a:active, article .entry-header .entry-title
 	}
 }
 
+/**
+ * Search block
+ */
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	border-radius: 5px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__input {
+	background: transparent;
+}
+
+.wp-block-search .wp-block-search__input {
+	margin-right: calc( .1 * 24px);
+	border-radius: 5px;
+}
+
 /**
  * Full Site Editing
  * - Full Site Editing overrides

+ 324 - 173
redhill/inc/wpcom-colors.php

@@ -3,20 +3,27 @@
 
 // Background Color
 // $config-global--color-background-default
-add_color_rule( 'bg', '#FFFFFF', array(
+add_color_rule(
+	'bg',
+	'#FFFFFF',
+	array(
 
-	// Background-color
-	array( '.screen-reader-text:focus,
+		// Background-color
+		array(
+			'.screen-reader-text:focus,
 			body,
 			.wp-block-table.is-style-stripes tbody tr:nth-child(odd),
 			table.is-style-stripes tbody tr:nth-child(odd),
 			body .widget_eu_cookie_law_widget #eu-cookie-law,
 			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept,
 			.main-navigation > div,
-			.main-navigation > div > ul > li > .sub-menu', 'background-color' ),
+			.main-navigation > div > ul > li > .sub-menu',
+			'background-color',
+		),
 
-	// Text-color
-	array( '.a8c-posts-list-item__featured span,
+		// Text-color
+		array(
+			'.a8c-posts-list-item__featured span,
 			.a8c-posts-list__view-all,
 			.a8c-posts-list__view-all:focus,
 			.a8c-posts-list__view-all:hover,
@@ -41,6 +48,7 @@ add_color_rule( 'bg', '#FFFFFF', array(
 			.wp-block-file__button,
 			.wp-block-file__button:focus,
 			.wp-block-file__button:hover,
+			.wp-block-search .wp-block-search__button,
 			.wp-block-gallery .blocks-gallery-image figcaption,
 			.wp-block-gallery .blocks-gallery-item figcaption,
 			.wp-block-pullquote.is-style-solid-color,
@@ -63,14 +71,21 @@ add_color_rule( 'bg', '#FFFFFF', array(
 			.main-navigation > div > ul > li.focus > a,
 			.main-navigation > div > ul > li.focus li > a,
 			.main-navigation > div > ul > li:hover > a,
-			.main-navigation > div > ul > li:hover li > a', 'color' ),
-
-	// Background-color lightened
-	array( '.wp-block-table.is-style-stripes tbody tr:nth-child(odd),
-			table.is-style-stripes tbody tr:nth-child(odd)', 'background-color', '+1' ),
-
-	// Border-bottom-color lightened
-	array( '.comments-area .comment-list,
+			.main-navigation > div > ul > li:hover li > a',
+			'color',
+		),
+
+		// Background-color lightened
+		array(
+			'.wp-block-table.is-style-stripes tbody tr:nth-child(odd),
+			table.is-style-stripes tbody tr:nth-child(odd)',
+			'background-color',
+			'+1',
+		),
+
+		// Border-bottom-color lightened
+		array(
+			'.comments-area .comment-list,
 			.widget_archive ul,
 			.widget_authors ul,
 			.widget_categories ul,
@@ -85,10 +100,14 @@ add_color_rule( 'bg', '#FFFFFF', array(
 			.widget_rss_links ul,
 			.widget_top-click ul,
 			.widget_top-posts ul,
-			.widget_upcoming_events_widget ul', 'border-bottom-color', '+1' ),
-
-	// Border-bottom-color lightened
-	array( '.comments-area .children > li,
+			.widget_upcoming_events_widget ul',
+			'border-bottom-color',
+			'+1',
+		),
+
+		// Border-bottom-color lightened
+		array(
+			'.comments-area .children > li,
 			.comments-area .comment-list > li,
 			.widget_archive li,
 			.widget_authors li,
@@ -104,13 +123,17 @@ add_color_rule( 'bg', '#FFFFFF', array(
 			.widget_rss_links li,
 			.widget_top-click li,
 			.widget_top-posts li,
-			.widget_upcoming_events_widget li', 'border-top-color', '+1' ),
-
-	/**
-	 * Utility Classes
-	 */
-	// Text-color
-	array( '.has-primary-background-color[class],
+			.widget_upcoming_events_widget li',
+			'border-top-color',
+			'+1',
+		),
+
+		/**
+		 * Utility Classes
+		 */
+		// Text-color
+		array(
+			'.has-primary-background-color[class],
 			.has-primary-background-color.has-background-dim[class],
 			.has-secondary-background-color[class],
 			.has-secondary-background-color.has-background-dim[class],
@@ -122,31 +145,53 @@ add_color_rule( 'bg', '#FFFFFF', array(
 			.has-foreground-light-background-color.has-background-dim[class],
 			.has-background-color[class],
 			.has-background-dark-color[class],
-			.has-background-light-color[class]', 'color' ),
-	// Background-color
-	array( '.has-background-background-color[class],
-			.has-background-background-color.has-background-dim[class]', 'background-color' ),
-
-	// Text-color darkened
-	array( '.has-background-dark-color[class],
-			.has-background-dark-color.has-background-dim[class]', 'color', '-1' ),
-	// Background-color darkened
-	array( '.has-background-dark-background-color[class],
-			.has-background-dark-background-color.has-background-dim[class]', 'background-color', '-1' ),
-
-	// Text-color lightened
-	array( '.has-background-light-color[class],
-			.has-background-light-color.has-background-dim[class]', 'color', '+1' ),
-	// Background-color lightened
-	array( '.has-background-light-background-color[class],
-			.has-background-light-background-color.has-background-dim[class]', 'background-color', '+1' ),
-
-	/**
-	 * Grays
-	 * Uses a slightly darker color
-	 */
-	// Border-color
-	array( '.wp-block-code,
+			.has-background-light-color[class]',
+			'color',
+		),
+		// Background-color
+		array(
+			'.has-background-background-color[class],
+			.has-background-background-color.has-background-dim[class]',
+			'background-color',
+		),
+
+		// Text-color darkened
+		array(
+			'.has-background-dark-color[class],
+			.has-background-dark-color.has-background-dim[class]',
+			'color',
+			'-1',
+		),
+		// Background-color darkened
+		array(
+			'.has-background-dark-background-color[class],
+			.has-background-dark-background-color.has-background-dim[class]',
+			'background-color',
+			'-1',
+		),
+
+		// Text-color lightened
+		array(
+			'.has-background-light-color[class],
+			.has-background-light-color.has-background-dim[class]',
+			'color',
+			'+1',
+		),
+		// Background-color lightened
+		array(
+			'.has-background-light-background-color[class],
+			.has-background-light-background-color.has-background-dim[class]',
+			'background-color',
+			'+1',
+		),
+
+		/**
+		 * Grays
+		 * Uses a slightly darker color
+		 */
+		// Border-color
+		array(
+			'.wp-block-code,
 			.wp-block-table td,
 			.wp-block-table th,
 			body .widget_eu_cookie_law_widget #eu-cookie-law,
@@ -165,41 +210,63 @@ add_color_rule( 'bg', '#FFFFFF', array(
 			input[type="time"],
 			input[type="url"],
 			input[type="week"],
+			.wp-block-search .wp-block-search__input:focus,
 			select,
 			table td,
 			table th,
 			textarea,
-			', 'border-color', '-1' ),
-	// Border-top-color
-	array( '.comment-list .children > li,
+			',
+			'border-color',
+			'-1',
+		),
+		// Border-top-color
+		array(
+			'.comment-list .children > li,
 			.comment-list > li,
 			.entry-footer,
 			.wp-block-pullquote,
-			#jp-relatedposts h3.jp-relatedposts-headline em:before', 'border-top-color', '-1' ),
-	// Border-bottom-color
-	array( '.comment-list,
+			#jp-relatedposts h3.jp-relatedposts-headline em:before',
+			'border-top-color',
+			'-1',
+		),
+		// Border-bottom-color
+		array(
+			'.comment-list,
 			.wp-block-pullquote,
 			hr,
-			hr.wp-block-separator', 'border-bottom-color', '-1' ),
-	// Color
-	array( 'hr.wp-block-separator.is-style-dots:before', 'color', '-1' ),
-	// Background-color
-	array( '.comments-area:before,
+			hr.wp-block-separator',
+			'border-bottom-color',
+			'-1',
+		),
+		// Color
+		array( 'hr.wp-block-separator.is-style-dots:before', 'color', '-1' ),
+		// Background-color
+		array(
+			'.comments-area:before,
 			.post-navigation:before,
 			.pagination:before,
 			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept.has-focus,
 			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept:focus,
-			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept:hover', 'background-color', '-1' ),
+			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept:hover',
+			'background-color',
+			'-1',
+		),
 
 
-), __( 'Background Color' ) );
+	),
+	__( 'Background Color' )
+);
 
 // Link Color
 // $config-global--color-primary-default
-add_color_rule( 'link', '#CA2017', array(
-
-	// Background-color
-	array( '.a8c-posts-list-item__featured span,
+add_color_rule(
+	'link',
+	'#CA2017',
+	array(
+
+		// Background-color
+		array(
+			'.a8c-posts-list-item__featured span,
 			.a8c-posts-list__view-all,
 			.button,
 			.main-navigation #toggle:focus + #toggle-menu,
@@ -211,6 +278,10 @@ add_color_rule( 'link', '#CA2017', array(
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept,
 			button,
 			button[data-load-more-btn],
+			.wp-block-search .wp-block-search__button,
+			.wp-block-search .wp-block-search__button:focus,
+			.wp-block-search .wp-block-search__button:hover,
+			.wp-block-search .wp-block-search__button:not(.has-background-color):hover,
 			input[type="submit"],
 			.main-navigation > div > ul > li.current-menu-item > a,
 			.main-navigation > div > ul > li.current-menu-item li.current-menu-item > a,
@@ -223,10 +294,13 @@ add_color_rule( 'link', '#CA2017', array(
 			.main-navigation > div > ul > li:hover > a,
 			.main-navigation > div > ul > li:hover li.current-menu-item > a,
 			.main-navigation > div > ul > li:hover li.focus > a,
-			.main-navigation > div > ul > li:hover li:hover > a', 'background-color' ),
+			.main-navigation > div > ul > li:hover li:hover > a',
+			'background-color',
+		),
 
-	// Text-color
-	array( '.a8c-posts-list-item__title a:active,
+		// Text-color
+		array(
+			'.a8c-posts-list-item__title a:active,
 			.a8c-posts-list-item__title a:focus,
 			.a8c-posts-list-item__title a:hover,
 			.comment-meta .comment-metadata a:active,
@@ -250,9 +324,9 @@ add_color_rule( 'link', '#CA2017', array(
 			.site-info a:hover,
 			.site-title a:hover,
 			.social-navigation a,
-			.wp-block-button.is-style-outline.wp-block-button__link, 
+			.wp-block-button.is-style-outline.wp-block-button__link,
 			.wp-block-button.is-style-outline .wp-block-button__link,
-			.wp-block-button.is-style-outline:not(.has-text-color), 
+			.wp-block-button.is-style-outline:not(.has-text-color),
 			.wp-block-button.is-style-outline:not(.has-text-color):active,
 			.wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color),
 			.wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color):active,
@@ -263,33 +337,50 @@ add_color_rule( 'link', '#CA2017', array(
 			a,
 			article .entry-header .entry-title a:active,
 			article .entry-header .entry-title a:focus,
-			article .entry-header .entry-title a:hover', 'color' ),
-
-	// Border color left
-	array( '.wp-block-quote', 'border-left-color' ),
-
-	// Border color right
-	array( '.wp-block-quote[style*="text-align: right"],
-			.wp-block-quote[style*="text-align:right"]', 'border-right-color' ),
-
-	/**
-	 * Utility Classes
-	 */
-	// Text-color
-	array( '.has-primary-color[class],
-			.has-primary-color.has-background-dim[class]', 'color' ),
-	// Background-color
-	array( '.has-primary-background-color[class],
-			.has-primary-background-color.has-background-dim[class]', 'background-color' ),
-
-), __( 'Link Color' ) );
+			article .entry-header .entry-title a:hover',
+			'color',
+		),
+
+		// Border color left
+		array( '.wp-block-quote', 'border-left-color' ),
+
+		// Border color right
+		array(
+			'.wp-block-quote[style*="text-align: right"],
+			.wp-block-quote[style*="text-align:right"]',
+			'border-right-color',
+		),
+
+		/**
+		 * Utility Classes
+		 */
+		// Text-color
+		array(
+			'.has-primary-color[class],
+			.has-primary-color.has-background-dim[class]',
+			'color',
+		),
+		// Background-color
+		array(
+			'.has-primary-background-color[class],
+			.has-primary-background-color.has-background-dim[class]',
+			'background-color',
+		),
+
+	),
+	__( 'Link Color' )
+);
 
 // Text Color (Gray)
 // $config-global--color-foreground-default
-add_color_rule( 'txt', '#222222', array(
-
-	// Text-color
-	array( '.a8c-posts-list__item .a8c-posts-list-item__meta a:active,
+add_color_rule(
+	'txt',
+	'#222222',
+	array(
+
+		// Text-color
+		array(
+			'.a8c-posts-list__item .a8c-posts-list-item__meta a:active,
 			.a8c-posts-list__item .a8c-posts-list-item__meta a:hover,
 			.comment-meta .comment-metadata,
 			.comment-meta .comment-metadata a:active,
@@ -324,10 +415,13 @@ add_color_rule( 'txt', '#222222', array(
 			a:hover,
 			body,
 			body .widget_eu_cookie_law_widget #eu-cookie-law,
-			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept', 'color' ),
+			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept',
+			'color',
+		),
 
-	// Background-color
-	array( '.a8c-posts-list__view-all:focus,
+		// Background-color
+		array(
+			'.a8c-posts-list__view-all:focus,
 			.a8c-posts-list__view-all:hover,
 			.button:focus,
 			.button:hover,
@@ -355,10 +449,13 @@ add_color_rule( 'txt', '#222222', array(
 			input:hover[type="submit"],
 			.main-navigation > div > ul > li.current-menu-item li > a,
 			.main-navigation > div > ul > li.focus li > a,
-			.main-navigation > div > ul > li:hover li > a', 'background-color' ),
+			.main-navigation > div > ul > li:hover li > a',
+			'background-color',
+		),
 
-	// Border-color
-	array( 'input[type="color"]:focus,
+		// Border-color
+		array(
+			'input[type="color"]:focus,
 			input[type="date"]:focus,
 			input[type="datetime"]:focus,
 			input[type="datetime-local"]:focus,
@@ -373,13 +470,16 @@ add_color_rule( 'txt', '#222222', array(
 			input[type="time"]:focus,
 			input[type="url"]:focus,
 			input[type="week"]:focus,
-			textarea:focus', 'border-color' ),
+			textarea:focus',
+			'border-color',
+		),
 
-	// Border-top-color
-	array( '.site', 'border-top-color' ),
+		// Border-top-color
+		array( '.site', 'border-top-color' ),
 
-	// Text-color brightened
-	array( '.a8c-posts-list__item .a8c-posts-list-item__meta,
+		// Text-color brightened
+		array(
+			'.a8c-posts-list__item .a8c-posts-list-item__meta,
 			.comment-meta .comment-metadata,
 			.comment-navigation a,
 			.entry-footer,
@@ -407,62 +507,103 @@ add_color_rule( 'txt', '#222222', array(
 			.wp-block-quote.is-style-large cite,
 			.wp-block-quote.is-style-large footer,
 			.wp-block-video figcaption,
-			figcaption', 'color', '+2' ),
-
-	// Text-color darkened
-	array( '.site-title', 'color', '-1' ),
-	
-	// Border-color darkened
-	array( 'body .widget_eu_cookie_law_widget #eu-cookie-law.negative', 'border-color', '-1' ),
-
-	/**
-	 * Utility Classes
-	 */
-	// Foreground
-	array( '.has-background-background-color[class],
+			figcaption',
+			'color',
+			'+2',
+		),
+
+		// Text-color darkened
+		array( '.site-title', 'color', '-1' ),
+
+		// Border-color darkened
+		array( 'body .widget_eu_cookie_law_widget #eu-cookie-law.negative', 'border-color', '-1' ),
+
+		// Border-color with less opacity (dim)
+		array( '.wp-block-search .wp-block-search__input', 'border-color', 0.8 ),
+
+		/**
+		 * Utility Classes
+		 */
+		// Foreground
+		array(
+			'.has-background-background-color[class],
 			.has-background-background-color.has-background-dim[class],
 			.has-background-dark-background-color[class],
 			.has-background-dark-background-color.has-background-dim[class],
 			.has-background-light-background-color[class],
 			.has-background-light-background-color.has-background-dim[class],
-			.has-foreground-color[class]', 'color' ),
-	// Background-color
-	array( '.has-background-dim[class],
+			.has-foreground-color[class]',
+			'color',
+		),
+		// Background-color
+		array(
+			'.has-background-dim[class],
 			.has-foreground-background-color[class],
-			.has-foreground-background-color.has-background-dim[class]', 'background-color' ),
-
-	// Text-color darkened
-	array( '.has-foreground-dark-color[class],
-			.has-foreground-dark-color.has-background-dim[class]', 'color', '-1' ),
-	// Background-color darkened
-	array( '.has-foreground-dark-background-color[class],
-			.has-foreground-dark-background-color.has-background-dim[class]', 'background-color', '-1' ),
-
-	// Text-color brightened
-	array( '.has-foreground-light-color[class],
-			.has-foreground-light-color.has-background-dim[class]', 'color', '+2' ),
-	// Background-color brightened
-	array( '.has-foreground-light-background-color[class],
-			.has-foreground-light-background-color.has-background-dim[class]', 'background-color', '+2' ),
-
-), __( 'Text Color' ) );
+			.has-foreground-background-color.has-background-dim[class]',
+			'background-color',
+		),
+
+		// Text-color darkened
+		array(
+			'.has-foreground-dark-color[class],
+			.has-foreground-dark-color.has-background-dim[class]',
+			'color',
+			'-1',
+		),
+		// Background-color darkened
+		array(
+			'.has-foreground-dark-background-color[class],
+			.has-foreground-dark-background-color.has-background-dim[class]',
+			'background-color',
+			'-1',
+		),
+
+		// Text-color brightened
+		array(
+			'.has-foreground-light-color[class],
+			.has-foreground-light-color.has-background-dim[class]',
+			'color',
+			'+2',
+		),
+		// Background-color brightened
+		array(
+			'.has-foreground-light-background-color[class],
+			.has-foreground-light-background-color.has-background-dim[class]',
+			'background-color',
+			'+2',
+		),
+
+	),
+	__( 'Text Color' )
+);
 
 // Accent Color
 // $config-global--color-secondary-default
-add_color_rule( 'fg1', '#007FDB', array(
-
-	/**
-	 * Utility Classes
-	 */
-	// Text-color
-	array( '.has-secondary-color[class],
-			.has-secondary-color.has-background-dim[class]', 'color' ),
-
-	// Background-color
-	array( '.has-secondary-background-color[class],
-			.has-secondary-background-color.has-background-dim[class]', 'background-color' ),
-
-), __( 'Secondary Color' ) );
+add_color_rule(
+	'fg1',
+	'#007FDB',
+	array(
+
+		/**
+		* Utility Classes
+		*/
+	   // Text-color
+	   array(
+		   '.has-secondary-color[class],
+			.has-secondary-color.has-background-dim[class]',
+		   'color',
+	   ),
+
+		// Background-color
+		array(
+			'.has-secondary-background-color[class],
+			.has-secondary-background-color.has-background-dim[class]',
+			'background-color',
+		),
+
+	),
+	__( 'Secondary Color' )
+);
 
 /**
  * Custom CSS
@@ -500,30 +641,40 @@ function redhill_custom_colors_extra_css() { ?>
 			text-decoration: underline;
 		}
 	}
-<?php }
+	<?php
+}
 add_theme_support( 'custom_colors_extra_css', 'redhill_custom_colors_extra_css' );
 
 /**
  * Featured Varia Palettes
  */
 // Light
-add_color_palette( array(
-	'#FFFFFF',
-	'#1D1E1E',
-	'#C8133E',
-	'#4E2F4B',
-), 'Light' );
+add_color_palette(
+	array(
+		'#FFFFFF',
+		'#1D1E1E',
+		'#C8133E',
+		'#4E2F4B',
+	),
+	'Light'
+);
 // Medium
-add_color_palette( array(
-	'#EEF4F7',
-	'#242527',
-	'#35845D',
-	'#233252',
-), 'Medium' );
+add_color_palette(
+	array(
+		'#EEF4F7',
+		'#242527',
+		'#35845D',
+		'#233252',
+	),
+	'Medium'
+);
 // Dark
-add_color_palette( array(
-	'#1F2527',
-	'#FFFFFF',
-	'#9FD3E8',
-	'#FBE6AA',
-), 'Dark' );
+add_color_palette(
+	array(
+		'#1F2527',
+		'#FFFFFF',
+		'#9FD3E8',
+		'#FBE6AA',
+	),
+	'Dark'
+);

+ 241 - 115
redhill/inc/wpcom-editor-colors.php

@@ -5,13 +5,17 @@
 
 // Background Color
 // $config-global--color-background-default
-add_editor_color_rule( 'bg', '#FFFFFF', array(
+add_editor_color_rule(
+	'bg',
+	'#FFFFFF',
+	array(
 
-	// Background-color
-	array( '#editor .editor-styles-wrapper', 'background-color' ),
+		// Background-color
+		array( '#editor .editor-styles-wrapper', 'background-color' ),
 
-	// Text-color
-	array( '#editor .editor-styles-wrapper .button,
+		// Text-color
+		array(
+			'#editor .editor-styles-wrapper .button,
 			#editor .editor-styles-wrapper .button.has-focus,
 			#editor .editor-styles-wrapper .button:focus,
 			#editor .editor-styles-wrapper .button:hover,
@@ -35,93 +39,162 @@ add_editor_color_rule( 'bg', '#FFFFFF', array(
 			#editor .editor-styles-wrapper .wp-block-cover:not([class*="background-color"]) .wp-block-cover-text,
 			#editor .editor-styles-wrapper .wp-block-cover:not([class*="background-color"]) .wp-block-cover__inner-container,
 			#editor .editor-styles-wrapper .wp-block-cover:not([class*="background-color"]) .block-editor-block-list__block,
-			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color', 'color' ),
-
-	// Text-color darkened
-	array( '#editor .editor-styles-wrapper .wp-block-separator.is-style-dots', 'color', '-1' ),
-	// Background color darkened
-	array( '#editor .editor-styles-wrapper .wp-block-table.is-style-stripes tbody tr:nth-child(odd),
-			#editor .editor-styles-wrapper table.is-style-stripes tbody tr:nth-child(odd)', 'background-color', '-1' ),
-	// Border-color darkened
-	array( '#editor .editor-styles-wrapper .wp-block-code', 'border-color', '-1' ),
-	// Border-top-color darkened
-	array( '#editor .editor-styles-wrapper .wp-block-pullquote', 'border-top-color', '-1' ),
-	// Border-bottom-color darkened
-	array( '#editor .editor-styles-wrapper .wp-block-pullquote,
-			#editor .editor-styles-wrapper .wp-block-separator', 'border-bottom-color', '-1' ),
-
-	/**
-	 * Utility Classes
-	 */
-	// Text-color
-	array( '#editor .editor-styles-wrapper .has-primary-background-color[class],
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
+			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color',
+			'color',
+		),
+
+		// Text-color darkened
+		array( '#editor .editor-styles-wrapper .wp-block-separator.is-style-dots', 'color', '-1' ),
+		// Background color darkened
+		array(
+			'#editor .editor-styles-wrapper .wp-block-table.is-style-stripes tbody tr:nth-child(odd),
+			#editor .editor-styles-wrapper table.is-style-stripes tbody tr:nth-child(odd)',
+			'background-color',
+			'-1',
+		),
+		// Border-color darkened
+		array( '#editor .editor-styles-wrapper .wp-block-code', 'border-color', '-1' ),
+		// Border-top-color darkened
+		array( '#editor .editor-styles-wrapper .wp-block-pullquote', 'border-top-color', '-1' ),
+		// Border-bottom-color darkened
+		array(
+			'#editor .editor-styles-wrapper .wp-block-pullquote,
+			#editor .editor-styles-wrapper .wp-block-separator',
+			'border-bottom-color',
+			'-1',
+		),
+
+		/**
+		 * Utility Classes
+		 */
+		// Text-color
+		array(
+			'#editor .editor-styles-wrapper .has-primary-background-color[class],
 			#editor .editor-styles-wrapper .has-secondary-background-color[class],
 			#editor .editor-styles-wrapper .has-foreground-background-color[class],
 			#editor .editor-styles-wrapper .has-foreground-dark-background-color[class],
 			#editor .editor-styles-wrapper .has-foreground-light-background-color[class],
-			#editor .editor-styles-wrapper .has-background-color[class]', 'color' ),
-	// Background-color
-	array( '#editor .editor-styles-wrapper .has-background-background-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-background-background-color[class]', 'background-color' ),
-	// Text-color darkened
-	array( '#editor .editor-styles-wrapper .has-background-dark-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-background-dark-color[class]', 'color', '-1'  ),
-	// Background-color darkened
-	array( '#editor .editor-styles-wrapper .has-background-dark-background-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-background-dark-background-color[class]', 'background-color', '-1' ),
-	// Text-color lightened
-	array( '#editor .editor-styles-wrapper .has-background-light-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-background-light-color[class]', 'color', '+1'  ),
-	// Background-color lightened
-	array( '#editor .editor-styles-wrapper .has-background-light-background-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-background-light-background-color[class]', 'background-color', '+1' ),
-
-), __( 'Background Color' ) );
+			#editor .editor-styles-wrapper .has-background-color[class]',
+			'color',
+		),
+		// Background-color
+		array(
+			'#editor .editor-styles-wrapper .has-background-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-background-background-color[class]',
+			'background-color',
+		),
+		// Text-color darkened
+		array(
+			'#editor .editor-styles-wrapper .has-background-dark-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-background-dark-color[class]',
+			'color',
+			'-1',
+		),
+		// Background-color darkened
+		array(
+			'#editor .editor-styles-wrapper .has-background-dark-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-background-dark-background-color[class]',
+			'background-color',
+			'-1',
+		),
+		// Text-color lightened
+		array(
+			'#editor .editor-styles-wrapper .has-background-light-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-background-light-color[class]',
+			'color',
+			'+1',
+		),
+		// Background-color lightened
+		array(
+			'#editor .editor-styles-wrapper .has-background-light-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-background-light-background-color[class]',
+			'background-color',
+			'+1',
+		),
+
+	),
+	__( 'Background Color' )
+);
 
 // Link Color
 // $config-global--color-primary-default
-add_editor_color_rule( 'link', '#CA2017', array(
+add_editor_color_rule(
+	'link',
+	'#CA2017',
+	array(
 
-	// Text-color
-	array( '#editor .editor-styles-wrapper .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color),
+		// Text-color
+		array(
+			'#editor .editor-styles-wrapper .wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color),
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts .entry-title a,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts .entry-title a:active,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts .entry-title a:focus,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts .entry-title a:hover,
 			#editor .editor-styles-wrapper .wp-block-button__link.is-style-outline,
-			#editor .editor-styles-wrapper a', 'color' ),
+			#editor .editor-styles-wrapper a',
+			'color',
+		),
 
-	// Background-color
-	array( '#editor .editor-styles-wrapper .button,
+		// Background-color
+		array(
+			'#editor .editor-styles-wrapper .button,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background),
-			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color', 'background-color' ),
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:focus,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:hover,
+			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color',
+			'background-color',
+		),
+
+		// Border color left
+		array( '#editor .editor-styles-wrapper .wp-block-quote', 'border-left-color' ),
 
-	// Border color left
-	array( '#editor .editor-styles-wrapper .wp-block-quote', 'border-left-color' ),
+		// Border color right
+		array(
+			'#editor .editor-styles-wrapper .wp-block-quote[style*="text-align: right"],
+			#editor .editor-styles-wrapper .wp-block-quote[style*="text-align:right"]',
+			'border-right-color',
+		),
 
-	// Border color right
-	array( '#editor .editor-styles-wrapper .wp-block-quote[style*="text-align: right"],
-			#editor .editor-styles-wrapper .wp-block-quote[style*="text-align:right"]', 'border-right-color' ),
+		// Border-color (forms)
+		array(
+			'#editor .editor-styles-wrapper .wp-block-search .wp-block-search__input:focus,
+			textarea:focus',
+			'border-color',
+		),
 
-	/**
-	 * Utility Classes
-	 */
-	// Text-color
-	array( '#editor .editor-styles-wrapper .has-primary-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-primary-color[class]', 'color' ),
-	// Background-color
-	array( '#editor .editor-styles-wrapper .has-primary-background-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-primary-background-color[class]', 'background-color' ),
+		/**
+		 * Utility Classes
+		 */
+		// Text-color
+		array(
+			'#editor .editor-styles-wrapper .has-primary-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-primary-color[class]',
+			'color',
+		),
+		// Background-color
+		array(
+			'#editor .editor-styles-wrapper .has-primary-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-primary-background-color[class]',
+			'background-color',
+		),
 
-), __( 'Link Color' ) );
+	),
+	__( 'Link Color' )
+);
 
 // Text Color
 // $config-global--color-foreground-default
-add_editor_color_rule( 'txt', '#222222', array(
+add_editor_color_rule(
+	'txt',
+	'#222222',
+	array(
 
-	// Text-color
-	array( '#editor .editor-styles-wrapper .editor-post-title__block .editor-post-title__input,
+		// Text-color
+		array(
+			'#editor .editor-styles-wrapper .editor-post-title__block .editor-post-title__input,
 			#editor .editor-styles-wrapper .wp-block-button.is-style-outline .wp-block-button__link.has-focus,
 			#editor .editor-styles-wrapper .wp-block-button.is-style-outline .wp-block-button__link:focus,
 			#editor .editor-styles-wrapper .wp-block-button.is-style-outline .wp-block-button__link:hover,
@@ -139,10 +212,13 @@ add_editor_color_rule( 'txt', '#222222', array(
 			#editor .editor-styles-wrapper .wp-block-table.is-style-stripes tbody tr:nth-child(odd),
 			#editor .editor-styles-wrapper table.is-style-stripes tbody tr:nth-child(odd),
 			#editor .editor-styles-wrapper a:hover,
-			#editor .editor-styles-wrapper', 'color' ),
+			#editor .editor-styles-wrapper',
+			'color',
+		),
 
-	// Background-color
-	array( '#editor .editor-styles-wrapper .button.has-focus,
+		// Background-color
+		array(
+			'#editor .editor-styles-wrapper .button.has-focus,
 			#editor .editor-styles-wrapper .button:focus,
 			#editor .editor-styles-wrapper .button:hover,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button:focus,
@@ -154,10 +230,13 @@ add_editor_color_rule( 'txt', '#222222', array(
 			#editor .editor-styles-wrapper .wp-block-cover,
 			#editor .editor-styles-wrapper .wp-block-cover.has-background-dim,
 			#editor .editor-styles-wrapper .wp-block-cover-image,
-			#editor .editor-styles-wrapper .wp-block-cover-image.has-background-dim', 'background-color' ),
+			#editor .editor-styles-wrapper .wp-block-cover-image.has-background-dim',
+			'background-color',
+		),
 
-	// Text-color brightened
-	array( '#editor .editor-styles-wrapper .a8c-posts-list__item .a8c-posts-list-item__meta,
+		// Text-color brightened
+		array(
+			'#editor .editor-styles-wrapper .a8c-posts-list__item .a8c-posts-list-item__meta,
 			#editor .editor-styles-wrapper .wp-block-image figcaption,
 			#editor .editor-styles-wrapper .wp-block-latest-comments .wp-block-latest-comments__comment-date,
 			#editor .editor-styles-wrapper .wp-block-latest-posts .wp-block-latest-posts__post-date,
@@ -178,68 +257,115 @@ add_editor_color_rule( 'txt', '#222222', array(
 			#editor .editor-styles-wrapper .wp-block-video figcaption,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts .cat-links,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts .entry-meta,
-			#editor .editor-styles-wrapper figcaption', 'color', '+2' ),
+			#editor .editor-styles-wrapper figcaption',
+			'color',
+			'+2',
+		),
 
-	/**
-	 * Utility Classes
-	 */
-	// Text-color
-	array( '#editor .editor-styles-wrapper .has-background-background-color[class],
+		/**
+		 * Utility Classes
+		 */
+		// Text-color
+		array(
+			'#editor .editor-styles-wrapper .has-background-background-color[class],
 			#editor .editor-styles-wrapper .wp-block .has-background-background-color[class],
 			#editor .editor-styles-wrapper .has-background-dark-background-color[class],
 			#editor .editor-styles-wrapper .wp-block .has-background-dark-background-color[class],
 			#editor .editor-styles-wrapper .has-background-light-background-color[class],
 			#editor .editor-styles-wrapper .wp-block .has-background-light-background-color[class],
 			#editor .editor-styles-wrapper .has-foreground-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-foreground-color[class]', 'color' ),
-	// Background-color
-	array( '#editor .editor-styles-wrapper .has-foreground-background-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-foreground-background-color[class]', 'background-color' ),
-
-	// Text-color darkened
-	array( '#editor .editor-styles-wrapper .has-foreground-dark-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-foreground-dark-color[class]', 'color', '-1' ),
-	// Background-color darkened
-	array( '#editor .editor-styles-wrapper .has-foreground-dark-background-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-foreground-dark-background-color[class]', 'background-color', '-1' ),
-
-	// Text-color brightened
-	array( '#editor .editor-styles-wrapper .has-foreground-light-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-foreground-light-color[class]', 'color', '+2' ),
-	// Background-color brightened
-	array( '#editor .editor-styles-wrapper .has-foreground-light-background-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-foreground-light-background-color[class]', 'background-color', '+2' ),
-
-), __( 'Text Color' ) );
+			#editor .editor-styles-wrapper .wp-block .has-foreground-color[class]',
+			'color',
+		),
+		// Background-color
+		array(
+			'#editor .editor-styles-wrapper .has-foreground-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-foreground-background-color[class]',
+			'background-color',
+		),
+
+		// Text-color darkened
+		array(
+			'#editor .editor-styles-wrapper .has-foreground-dark-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-foreground-dark-color[class]',
+			'color',
+			'-1',
+		),
+		// Background-color darkened
+		array(
+			'#editor .editor-styles-wrapper .has-foreground-dark-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-foreground-dark-background-color[class]',
+			'background-color',
+			'-1',
+		),
+
+		// Text-color brightened
+		array(
+			'#editor .editor-styles-wrapper .has-foreground-light-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-foreground-light-color[class]',
+			'color',
+			'+2',
+		),
+		// Background-color brightened
+		array(
+			'#editor .editor-styles-wrapper .has-foreground-light-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-foreground-light-background-color[class]',
+			'background-color',
+			'+2',
+		),
+
+		// Border-color with less opacity (dim)
+		array(
+			'#editor .editor-styles-wrapper .wp-block-code,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__input',
+			'border-color',
+			0.8,
+		),
+
+	),
+	__( 'Text Color' )
+);
 
 // Accent Color (Red)
 // $config-global--color-secondary-default
-add_editor_color_rule( 'fg1', '#007FDB', array(
+add_editor_color_rule(
+	'fg1',
+	'#007FDB',
+	array(
 
-	/**
-	 * Utility Classes
-	 */
+		/**
+		* Utility Classes
+		*/
 
-	// Text-color
-	array( '#editor .editor-styles-wrapper .has-secondary-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-secondary-color[class]', 'color' ),
-	// Background-color
-	array( '#editor .editor-styles-wrapper .has-secondary-background-color[class],
-			#editor .editor-styles-wrapper .wp-block .has-secondary-background-color[class]', 'background-color' ),
+	   // Text-color
+	   array(
+		   '#editor .editor-styles-wrapper .has-secondary-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-secondary-color[class]',
+		   'color',
+	   ),
+		// Background-color
+		array(
+			'#editor .editor-styles-wrapper .has-secondary-background-color[class],
+			#editor .editor-styles-wrapper .wp-block .has-secondary-background-color[class]',
+			'background-color',
+		),
 
-), __( 'Secondary Color' ) );
+	),
+	__( 'Secondary Color' )
+);
 
 /**
  * Custom CSS
  */
-function redhill_editor_custom_colors_extra_css() { 
+function redhill_editor_custom_colors_extra_css() {
 	$colors_array = get_theme_mod( 'colors_manager' );
 	$bg           = $colors_array['colors']['bg'];
 	$txt          = $colors_array['colors']['txt'];
-?>
+	?>
 	#editor .editor-styles-wrapper .has-background:not(.has-background-background-color) a:not(.wp-block-button__link),
 	#editor .editor-styles-wrapper p.has-text-color a {
 		color: currentColor;
 	}
-<?php }
-add_theme_support( 'custom_colors_extra_css', 'redhill_editor_custom_colors_extra_css' ); 
+	<?php
+}
+add_theme_support( 'custom_colors_extra_css', 'redhill_editor_custom_colors_extra_css' );

+ 1 - 1
redhill/package.json

@@ -1,6 +1,6 @@
 {
   "name": "redhill",
-  "version": "1.5.7",
+  "version": "1.5.8",
   "description": "redhill",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 19 - 0
redhill/sass/_extra-child-theme.scss

@@ -622,3 +622,22 @@ article .entry-header .entry-title,
 		width: 100%;
 	}
 }
+
+
+/**
+ * Search block
+ */
+ .wp-block-search {
+	&.wp-block-search__button-inside {
+		.wp-block-search__inside-wrapper{
+			border-radius: #{map-deep-get($config-button, "border-radius")};
+		}
+		.wp-block-search__input {
+			background: transparent;
+		}
+	}
+	.wp-block-search__input {
+		margin-right: calc( .1 * #{map-deep-get($config-button, "padding", "horizontal")} );
+		border-radius: #{map-deep-get($config-button, "border-radius")};
+	}
+}

+ 1 - 1
redhill/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: A simple theme with clean typography, created with entrepreneurs and small business owners in mind.
 Requires at least: WordPress 4.9.6
-Version: 1.5.7
+Version: 1.5.8
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Status: inactive

+ 83 - 8
redhill/style-editor.css

@@ -202,6 +202,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 html {
 	font-family: Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Times, "Times New Roman", serif;
 	font-family: var(--font-headings, Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Times, "Times New Roman", serif);
@@ -481,7 +492,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -497,8 +508,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -506,19 +517,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before {
 	margin-bottom: -0.12em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	margin-top: -0.11em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button {
 	color: #FFFFFF;
 	background-color: #222222;
 }
@@ -933,6 +944,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: calc( 0.33 * 16px);
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 24px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+	padding: calc( 0.33 * 16px);
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 24px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #DDDDDD;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid #DDDDDD;

+ 96 - 16
redhill/style-rtl.css

@@ -199,7 +199,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -217,10 +217,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -230,27 +230,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #222222;
 }
@@ -1343,7 +1343,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -1361,10 +1361,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1374,27 +1374,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #222222;
 }
@@ -2230,6 +2230,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: calc( 0.33 * 16px);
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 24px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+	padding: calc( 0.33 * 16px);
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 24px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #DDDDDD;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #DDDDDD;
 	clear: both;
@@ -4624,3 +4688,19 @@ article .entry-header .entry-title a:active, article .entry-header .entry-title
 	margin-bottom: 8px;
 	width: 100%;
 }
+
+/**
+ * Search block
+ */
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	border-radius: 4px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__input {
+	background: transparent;
+}
+
+.wp-block-search .wp-block-search__input {
+	margin-left: calc( .1 * 24px);
+	border-radius: 4px;
+}

+ 96 - 16
redhill/style.css

@@ -199,7 +199,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -217,10 +217,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -230,27 +230,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #222222;
 }
@@ -1343,7 +1343,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1;
 	color: #FFFFFF;
 	cursor: pointer;
@@ -1361,10 +1361,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1374,27 +1374,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.12em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.11em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #FFFFFF;
 	background-color: #222222;
 }
@@ -2230,6 +2230,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: calc( 0.33 * 16px);
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 24px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 1px solid #DDDDDD;
+	border-radius: 3px;
+	padding: calc( 0.33 * 16px);
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 24px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #DDDDDD;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #DDDDDD;
 	clear: both;
@@ -4653,3 +4717,19 @@ article .entry-header .entry-title a:active, article .entry-header .entry-title
 	margin-bottom: 8px;
 	width: 100%;
 }
+
+/**
+ * Search block
+ */
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	border-radius: 4px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__input {
+	background: transparent;
+}
+
+.wp-block-search .wp-block-search__input {
+	margin-right: calc( .1 * 24px);
+	border-radius: 4px;
+}

+ 239 - 137
rivington/inc/wpcom-colors.php

@@ -3,10 +3,14 @@
 
 // Background Color
 // $config-global--color-background-default
-add_color_rule( 'bg', '#060f29', array(
+add_color_rule(
+	'bg',
+	'#060f29',
+	array(
 
-	// Background-color
-	array( '.screen-reader-text:focus,
+		// Background-color
+		array(
+			'.screen-reader-text:focus,
 			body,
 			body .widget_eu_cookie_law_widget #eu-cookie-law,
 			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept,
@@ -25,11 +29,14 @@ add_color_rule( 'bg', '#060f29', array(
 			.site-header .main-navigation > div > ul > li:hover li:hover > a,
 			.site-header .main-navigation > div > ul > li .sub-menu a,
 			.main-navigation > div > ul > li.current-menu-item li.current-menu-item > a,
-			.mobile-nav-side .site-header #site-navigation.main-navigation .woocommerce-menu-container, 
-			.mobile-nav-side .site-header #site-navigation.main-navigation > div', 'background-color' ),
+			.mobile-nav-side .site-header #site-navigation.main-navigation .woocommerce-menu-container,
+			.mobile-nav-side .site-header #site-navigation.main-navigation > div',
+			'background-color',
+		),
 
-	// Text-color
-	array( '.a8c-posts-list-item__featured span,
+		// Text-color
+		array(
+			'.a8c-posts-list-item__featured span,
 			.a8c-posts-list__view-all,
 			.a8c-posts-list__view-all:focus,
 			.a8c-posts-list__view-all:hover,
@@ -54,6 +61,7 @@ add_color_rule( 'bg', '#060f29', array(
 			.wp-block-file__button,
 			.wp-block-file__button:focus,
 			.wp-block-file__button:hover,
+			.wp-block-search .wp-block-search__button,
 			.wp-block-pullquote.is-style-solid-color,
 			table.is-style-stripes tbody tr:nth-child(odd),
 			.wp-block-table.is-style-stripes tbody tr:nth-child(odd),
@@ -77,34 +85,40 @@ add_color_rule( 'bg', '#060f29', array(
 			button[data-load-more-btn],
 			input.has-focus[type="submit"],
 			input:focus[type="submit"],
-			input:hover[type="submit"]', 'color' ),
-
-	/**
-	 * Utility Classes
-	 */
-	// Text-color
-	// Needs contrast against `link` (primary)
-	array( '.has-primary-background-color[class],
+			input:hover[type="submit"]',
+			'color',
+		),
+
+		/**
+		 * Utility Classes
+		 */
+		// Text-color
+		// Needs contrast against `link` (primary)
+		array(
+			'.has-primary-background-color[class],
 			.has-secondary-background-color[class],
 			.has-foreground-background-color[class],
 			.has-foreground-dark-background-color[class],
 			.has-foreground-light-background-color[class],
 			.has-background-color[class],
 			.has-background-dark-color[class],
-			.has-background-light-color[class]', 'color' ),
-	// Background-color
-	array( '.has-background-background-color[class]', 'background-color' ),
-	// Background-color darkened
-	array( '.has-background-dark-background-color[class]', 'background-color', '-1' ),
-	// Background-color lightened
-	array( '.has-background-light-background-color[class]', 'background-color', '+1' ),
-
-	/**
-	 * Grays
-	 * Uses a slightly darker color
-	 */
-	// Border-color
-	array( '.wp-block-code,
+			.has-background-light-color[class]',
+			'color',
+		),
+		// Background-color
+		array( '.has-background-background-color[class]', 'background-color' ),
+		// Background-color darkened
+		array( '.has-background-dark-background-color[class]', 'background-color', '-1' ),
+		// Background-color lightened
+		array( '.has-background-light-background-color[class]', 'background-color', '+1' ),
+
+		/**
+		 * Grays
+		 * Uses a slightly darker color
+		 */
+		// Border-color
+		array(
+			'.wp-block-code,
 			body .widget_eu_cookie_law_widget #eu-cookie-law,
 			input[type="color"],
 			input[type="date"],
@@ -125,27 +139,44 @@ add_color_rule( 'bg', '#060f29', array(
 			textarea,
 			.main-navigation > div > ul > li > .sub-menu > li > a,
 			.main-navigation > div > ul > li > .sub-menu > li:first-child > a,
-			.main-navigation > div > ul > li > .sub-menu > li:last-child > a', 'border-color', '-1' ),
-	// Border-top-color
-	array( '.comment-list .children > li,
+			.main-navigation > div > ul > li > .sub-menu > li:last-child > a',
+			'border-color',
+			'-1',
+		),
+		// Border-top-color
+		array(
+			'.comment-list .children > li,
 			.comment-list > li,
-			.wp-block-pullquote', 'border-top-color', '-1' ),
-	// Border-bottom-color
-	array( '.comment-list,
+			.wp-block-pullquote',
+			'border-top-color',
+			'-1',
+		),
+		// Border-bottom-color
+		array(
+			'.comment-list,
 			.wp-block-pullquote,
 			hr,
-			hr.wp-block-separator', 'border-bottom-color', '-1' ),
-	// Color
-	array( 'hr.wp-block-separator.is-style-dots:before', 'color', '-1' ),
+			hr.wp-block-separator',
+			'border-bottom-color',
+			'-1',
+		),
+		// Color
+		array( 'hr.wp-block-separator.is-style-dots:before', 'color', '-1' ),
 
-), __( 'Background Color' ) );
+	),
+	__( 'Background Color' )
+);
 
 // Link Color
 // $config-global--color-primary-default
-add_color_rule( 'link', '#CAAB57', array(
+add_color_rule(
+	'link',
+	'#CAAB57',
+	array(
 
-	// Background-color
-	array( '.a8c-posts-list-item__featured span,
+		// Background-color
+		array(
+			'.a8c-posts-list-item__featured span,
 			.a8c-posts-list__view-all,
 			.button,
 			.main-navigation #toggle:focus + #toggle-menu,
@@ -157,10 +188,17 @@ add_color_rule( 'link', '#CAAB57', array(
 			body .widget_eu_cookie_law_widget #eu-cookie-law input.accept,
 			button,
 			button[data-load-more-btn],
-			input[type="submit"]', 'background-color' ),
+			.wp-block-search .wp-block-search__button,
+			.wp-block-search .wp-block-search__button:focus,
+			.wp-block-search .wp-block-search__button:hover,
+			.wp-block-search .wp-block-search__button:not(.has-background):hover,
+			input[type="submit"]',
+			'background-color',
+		),
 
-	// Text-color
-	array( '.a8c-posts-list .a8c-posts-list-item__title a:active,
+		// Text-color
+		array(
+			'.a8c-posts-list .a8c-posts-list-item__title a:active,
 			.a8c-posts-list .a8c-posts-list-item__title a:focus,
 			.a8c-posts-list .a8c-posts-list-item__title a:hover,
 			.entry-title a:active,
@@ -186,36 +224,54 @@ add_color_rule( 'link', '#CAAB57', array(
 			.site-header .main-navigation > div > ul > li:hover > a,
 			.site-header .main-navigation > div > ul > li.focus > a,
 			.site-header .main-navigation > div > ul > li.current-menu-item > a,
-			.site-header .main-navigation > div > ul > li > .sub-menu > li:hover > a', 'color' ),
+			.site-header .main-navigation > div > ul > li > .sub-menu > li:hover > a',
+			'color',
+		),
+
+
+		// Border color
+		array( '.wp-block-search .wp-block-search__input:focus,', 'border-color' ),
 
-	// Border color left
-	array( '.wp-block-quote', 'border-left-color' ),
+		// Border color left
+		array( '.wp-block-quote', 'border-left-color' ),
 
-	// Border color right
-	array( '.wp-block-quote[style*="text-align: right"],
-			.wp-block-quote[style*="text-align:right"]', 'border-right-color' ),
+		// Border color right
+		array(
+			'.wp-block-quote[style*="text-align: right"],
+			.wp-block-quote[style*="text-align:right"]',
+			'border-right-color',
+		),
 
-	// Border color bottom
-	array( '.site-header .main-navigation > div > ul > li.current-menu-item > ul:before,
+		// Border color bottom
+		array(
+			'.site-header .main-navigation > div > ul > li.current-menu-item > ul:before,
 			.site-header .main-navigation > div > ul > li.focus > ul:before,
-			.site-header .main-navigation > div > ul > li:hover > ul:before', 'border-bottom-color' ),
+			.site-header .main-navigation > div > ul > li:hover > ul:before',
+			'border-bottom-color',
+		),
 
-	/**
-	 * Utility Classes
-	 */
-	// Background-color
-	array( '.has-primary-background-color[class]', 'background-color' ),
-	// Text-color
-	array( '.has-primary-color[class]', 'color' ),
+		/**
+		 * Utility Classes
+		 */
+		// Background-color
+		array( '.has-primary-background-color[class]', 'background-color' ),
+		// Text-color
+		array( '.has-primary-color[class]', 'color' ),
 
-), __( 'Link Color' ) );
+	),
+	__( 'Link Color' )
+);
 
 // Text Color
 // $config-global--color-foreground-default
-add_color_rule( 'txt', '#f2f2f2', array(
+add_color_rule(
+	'txt',
+	'#f2f2f2',
+	array(
 
-	// Text-color
-	array( '.comment-meta .comment-metadata,
+		// Text-color
+		array(
+			'.comment-meta .comment-metadata,
 			.main-navigation,
 			.main-navigation a,
 			.main-navigation a:link,
@@ -232,43 +288,55 @@ add_color_rule( 'txt', '#f2f2f2', array(
 			body .widget_eu_cookie_law_widget #eu-cookie-law.negative input.accept,
 			.site-header .main-navigation > div > ul > li.current-menu-item li > a,
 			.site-header .main-navigation > div > ul > li.focus li > a,
-			.site-header .main-navigation > div > ul > li:hover li > a', 'color' ),
+			.site-header .main-navigation > div > ul > li:hover li > a',
+			'color',
+		),
 
-	// Background-color
-	array( '.wp-block-cover.has-background-dim:not([class*="background-color"]),
+		// Background-color
+		array(
+			'.wp-block-cover.has-background-dim:not([class*="background-color"]),
 			.wp-block-cover-image.has-background-dim:not([class*="background-color"]),
 			.has-foreground-background-color[class],
 			table.is-style-stripes tbody tr:nth-child(odd),
 			.wp-block-table.is-style-stripes tbody tr:nth-child(odd),
-			body .widget_eu_cookie_law_widget #eu-cookie-law.negative', 'background-color' ),
+			body .widget_eu_cookie_law_widget #eu-cookie-law.negative',
+			'background-color',
+		),
 
-	/**
-	 * Utility Classes
-	 */
-	// Foreground
-	array( '.has-foreground-color[class]', 'color' ),
-	array( '.has-foreground-background-color[class]', 'background-color' ),
+		// Border-color with less opacity (dim)
+		array( '.wp-block-search .wp-block-search__input', 'border-color', 0.8 ),
 
-	// Text color
-	array( '.has-background-background-color[class],
+		/**
+		 * Utility Classes
+		 */
+		// Foreground
+		array( '.has-foreground-color[class]', 'color' ),
+		array( '.has-foreground-background-color[class]', 'background-color' ),
+
+		// Text color
+		array(
+			'.has-background-background-color[class],
 			.has-background-light-background-color[class],
-			.has-background-dark-background-color[class]', 'color' ),
-
-	// Text-color darkened
-	array( '.has-foreground-dark-color[class]', 'color', '-1' ),
-	// Background-color darkened
-	array( '.has-foreground-dark-background-color[class]', 'background-color', '-1' ),
-
-	// Text-color brightened
-	array( '.has-foreground-light-color[class]', 'color', '+2' ),
-	// Background-color brightened
-	array( '.has-foreground-light-background-color[class]', 'background-color', '+2' ),
-
-	/**
-	 * Gray (Same as text color)
-	 */
-	// Text-color
-	array( '.a8c-posts-list__item .a8c-posts-list-item__meta,
+			.has-background-dark-background-color[class]',
+			'color',
+		),
+
+		// Text-color darkened
+		array( '.has-foreground-dark-color[class]', 'color', '-1' ),
+		// Background-color darkened
+		array( '.has-foreground-dark-background-color[class]', 'background-color', '-1' ),
+
+		// Text-color brightened
+		array( '.has-foreground-light-color[class]', 'color', '+2' ),
+		// Background-color brightened
+		array( '.has-foreground-light-background-color[class]', 'background-color', '+2' ),
+
+		/**
+		 * Gray (Same as text color)
+		 */
+		// Text-color
+		array(
+			'.a8c-posts-list__item .a8c-posts-list-item__meta,
 			.comment-notes,
 			.entry-footer,
 			.entry-meta,
@@ -302,13 +370,16 @@ add_color_rule( 'txt', '#f2f2f2', array(
 			.wp-block-quote.is-style-large cite,
 			.wp-block-quote.is-style-large footer,
 			.wp-block-video figcaption,
-			figcaption', 'color' ),
+			figcaption',
+			'color',
+		),
 
-	/**
-	 * Hover States
-	 */
-	// Background-color
-	array( '.a8c-posts-list__view-all:focus,
+		/**
+		 * Hover States
+		 */
+		// Background-color
+		array(
+			'.a8c-posts-list__view-all:focus,
 			.a8c-posts-list__view-all:hover,
 			.button:focus,
 			.button:hover,
@@ -328,9 +399,13 @@ add_color_rule( 'txt', '#f2f2f2', array(
 			button:hover,
 			input.has-focus[type="submit"],
 			input:focus[type="submit"],
-			input:hover[type="submit"]', 'background-color', 0.7 ),
-	// Text-color
-	array( '.a8c-posts-list__item .a8c-posts-list-item__meta a:active,
+			input:hover[type="submit"]',
+			'background-color',
+			0.7,
+		),
+		// Text-color
+		array(
+			'.a8c-posts-list__item .a8c-posts-list-item__meta a:active,
 			.a8c-posts-list__item .a8c-posts-list-item__meta a:hover,
 			.comment-meta .comment-metadata a:active,
 			.comment-meta .comment-metadata a:hover,
@@ -357,9 +432,13 @@ add_color_rule( 'txt', '#f2f2f2', array(
 			.wp-block-newspack-blocks-homepage-articles article .more-link:active,
 			.wp-block-newspack-blocks-homepage-articles article .more-link:focus,
 			.wp-block-newspack-blocks-homepage-articles article .more-link:hover,
-			a:hover', 'color', 0.7 ),
-	// Border-color
-	array( 'input[type="color"]:focus,
+			a:hover',
+			'color',
+			0.7,
+		),
+		// Border-color
+		array(
+			'input[type="color"]:focus,
 			input[type="date"]:focus,
 			input[type="datetime"]:focus,
 			input[type="datetime-local"]:focus,
@@ -374,29 +453,42 @@ add_color_rule( 'txt', '#f2f2f2', array(
 			input[type="time"]:focus,
 			input[type="url"]:focus,
 			input[type="week"]:focus,
-			textarea:focus', 'border-color', 0.7 ),
+			textarea:focus',
+			'border-color',
+			0.7,
+		),
 
-), __( 'Text Color' ) );
+	),
+	__( 'Text Color' )
+);
 
 // Accent Color
 // $config-global--color-secondary-default
-add_color_rule( 'fg1', '#EE4266', array(
+add_color_rule(
+	'fg1',
+	'#EE4266',
+	array(
 
-	/**
-	 * Utility Classes
-	 */
-	// Text-color
-	array( '.has-secondary-color[class]', 'color' ),
+		/**
+		 * Utility Classes
+		 */
+		// Text-color
+		array( '.has-secondary-color[class]', 'color' ),
 
-	// Background-color
-	array( '.has-secondary-background-color[class],
+		// Background-color
+		array(
+			'.has-secondary-background-color[class],
 			input:hover[type="submit"],
 			.main-navigation .button:focus,
 			.main-navigation .button:hover,
 			.main-navigation #toggle:focus + #toggle-menu,
-			.has-secondary-background-color', 'background-color' ),
+			.has-secondary-background-color',
+			'background-color',
+		),
 
-), __( 'Secondary Color' ) );
+	),
+	__( 'Secondary Color' )
+);
 
 /**
  * Custom CSS
@@ -438,30 +530,40 @@ function rivington_custom_colors_extra_css() { ?>
 			opacity: 0;
 		}
 	}
-<?php }
+	<?php
+}
 add_theme_support( 'custom_colors_extra_css', 'rivington_custom_colors_extra_css' );
 
 /**
  * Featured Varia Palettes
  */
 // Light
-add_color_palette( array(
-	'#FFFFFF',
-	'#1D1E1E',
-	'#C8133E',
-	'#4E2F4B',
-), 'Light' );
+add_color_palette(
+	array(
+		'#FFFFFF',
+		'#1D1E1E',
+		'#C8133E',
+		'#4E2F4B',
+	),
+	'Light'
+);
 // Medium
-add_color_palette( array(
-	'#EEF4F7',
-	'#242527',
-	'#35845D',
-	'#233252',
-), 'Medium' );
+add_color_palette(
+	array(
+		'#EEF4F7',
+		'#242527',
+		'#35845D',
+		'#233252',
+	),
+	'Medium'
+);
 // Dark
-add_color_palette( array(
-	'#1F2527',
-	'#FFFFFF',
-	'#9FD3E8',
-	'#FBE6AA',
-), 'Dark' );
+add_color_palette(
+	array(
+		'#1F2527',
+		'#FFFFFF',
+		'#9FD3E8',
+		'#FBE6AA',
+	),
+	'Dark'
+);

+ 175 - 110
rivington/inc/wpcom-editor-colors.php

@@ -5,13 +5,17 @@
 
 // Background Color
 // $config-global--color-background-default
-add_editor_color_rule( 'bg', '#060f29', array(
+add_editor_color_rule(
+	'bg',
+	'#060f29',
+	array(
 
-	// Background-color
-	array( '#editor .editor-styles-wrapper', 'background-color' ),
+		// Background-color
+		array( '#editor .editor-styles-wrapper', 'background-color' ),
 
-	// Text-color
-	array( '#editor .editor-styles-wrapper .button,
+		// Text-color
+		array(
+			'#editor .editor-styles-wrapper .button,
 			#editor .editor-styles-wrapper .button.has-focus,
 			#editor .editor-styles-wrapper .button:focus,
 			#editor .editor-styles-wrapper .button:hover,
@@ -26,6 +30,7 @@ add_editor_color_rule( 'bg', '#060f29', array(
 			#editor .editor-styles-wrapper .wp-block-button__link:focus,
 			#editor .editor-styles-wrapper .wp-block-button__link:hover,
 			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
 			#editor .editor-styles-wrapper .wp-block-cover-image:not([class*="background-color"]) .wp-block-cover-image-text,
 			#editor .editor-styles-wrapper .wp-block-cover-image:not([class*="background-color"]) .wp-block-cover-text,
 			#editor .editor-styles-wrapper .wp-block-cover-image:not([class*="background-color"]) .wp-block-cover__inner-container,
@@ -33,57 +38,78 @@ add_editor_color_rule( 'bg', '#060f29', array(
 			#editor .editor-styles-wrapper .wp-block-cover:not([class*="background-color"]) .wp-block-cover-text,
 			#editor .editor-styles-wrapper .wp-block-cover:not([class*="background-color"]) .wp-block-cover__inner-container
 			#editor .editor-styles-wrapper .wp-block-cover.has-background-dim,
-			#editor .editor-styles-wrapper .wp-block-cover-image.has-background-dim', 'color' ),
-
-	/**
-	 * Utility Classes
-	 */
-	// Text-color
-	array( '#editor .editor-styles-wrapper .has-primary-background-color[class],
+			#editor .editor-styles-wrapper .wp-block-cover-image.has-background-dim',
+			'color',
+		),
+
+		/**
+		 * Utility Classes
+		 */
+		// Text-color
+		array(
+			'#editor .editor-styles-wrapper .has-primary-background-color[class],
 			#editor .editor-styles-wrapper .has-secondary-background-color[class],
 			#editor .editor-styles-wrapper .has-foreground-background-color[class],
 			#editor .editor-styles-wrapper .has-foreground-dark-background-color[class],
 			#editor .editor-styles-wrapper .has-foreground-light-background-color[class],
-			#editor .editor-styles-wrapper .has-background-color[class]', 'color' ),
-	// Background-color
-	array( '#editor .editor-styles-wrapper .has-background-background-color[class]', 'background-color' ),
-	// Text-color darkened
-	array( '#editor .editor-styles-wrapper .has-background-dark-color[class]', 'color', '-1'  ),
-	// Background-color darkened
-	array( '#editor .editor-styles-wrapper .has-background-dark-background-color[class]', 'background-color', '-1' ),
-	// Text-color lightened
-	array( '#editor .editor-styles-wrapper .has-background-light-color[class]', 'color', '+1'  ),
-	// Background-color lightened
-	array( '#editor .editor-styles-wrapper .has-background-light-background-color[class]', 'background-color', '+1' ),
-
-	/**
-	 * Grays
-	 * Uses a slightly darker color
-	 */
-	// Color
-	array( '#editor .editor-styles-wrapper .wp-block-separator.is-style-dots', 'color', '-1' ),
-	// Border-color
-	array( '#editor .editor-styles-wrapper .wp-block-code', 'border-color', '-1' ),
-	// Border-top-color
-	array( '#editor .editor-styles-wrapper .wp-block-pullquote', 'border-top-color', '-1' ),
-	// Border-bottom-color
-	array( '#editor .editor-styles-wrapper .wp-block-pullquote,
-			#editor .editor-styles-wrapper .wp-block-separator', 'border-bottom-color', '-1' ),
-
-), __( 'Background Color' ) );
+			#editor .editor-styles-wrapper .has-background-color[class]',
+			'color',
+		),
+		// Background-color
+		array( '#editor .editor-styles-wrapper .has-background-background-color[class]', 'background-color' ),
+		// Text-color darkened
+		array( '#editor .editor-styles-wrapper .has-background-dark-color[class]', 'color', '-1' ),
+		// Background-color darkened
+		array( '#editor .editor-styles-wrapper .has-background-dark-background-color[class]', 'background-color', '-1' ),
+		// Text-color lightened
+		array( '#editor .editor-styles-wrapper .has-background-light-color[class]', 'color', '+1' ),
+		// Background-color lightened
+		array( '#editor .editor-styles-wrapper .has-background-light-background-color[class]', 'background-color', '+1' ),
+
+		/**
+		 * Grays
+		 * Uses a slightly darker color
+		 */
+		// Color
+		array( '#editor .editor-styles-wrapper .wp-block-separator.is-style-dots', 'color', '-1' ),
+		// Border-color
+		array( '#editor .editor-styles-wrapper .wp-block-code', 'border-color', '-1' ),
+		// Border-top-color
+		array( '#editor .editor-styles-wrapper .wp-block-pullquote', 'border-top-color', '-1' ),
+		// Border-bottom-color
+		array(
+			'#editor .editor-styles-wrapper .wp-block-pullquote,
+			#editor .editor-styles-wrapper .wp-block-separator',
+			'border-bottom-color',
+			'-1',
+		),
+
+	),
+	__( 'Background Color' )
+);
 
 // Link Color
 // $config-global--color-primary-default
-add_editor_color_rule( 'link', '#CAAB57', array(
-
-	// Background-color
-	array( '#editor .editor-styles-wrapper .button,
+add_editor_color_rule(
+	'link',
+	'#CAAB57',
+	array(
+
+		// Background-color
+		array(
+			'#editor .editor-styles-wrapper .button,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts + .button,
 			#editor .editor-styles-wrapper .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(.has-background),
-			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color', 'background-color' ),
-
-	// Text-color
-	array( '#editor .editor-styles-wrapper .is-style-outline .wp-block-button__link:not(.has-text-color),
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:focus,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__button:hover,
+			#editor .editor-styles-wrapper .wp-block-pullquote.is-style-solid-color',
+			'background-color',
+		),
+
+		// Text-color
+		array(
+			'#editor .editor-styles-wrapper .is-style-outline .wp-block-button__link:not(.has-text-color),
 			#editor .editor-styles-wrapper .wp-block-button__link.is-style-outline:not(.has-text-color),
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts .entry-title a,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts .entry-title a,
@@ -91,65 +117,95 @@ add_editor_color_rule( 'link', '#CAAB57', array(
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts .entry-title a:focus,
 			#editor .editor-styles-wrapper .wp-block-a8c-blog-posts .entry-title a:hover,
 			#editor .editor-styles-wrapper .wp-block-button__link.is-style-outline,
-			#editor .editor-styles-wrapper a', 'color' ),
-
-	// Border color left
-	array( '#editor .editor-styles-wrapper .wp-block-quote', 'border-left-color' ),
-
-	// Border color right
-	array( '#editor .editor-styles-wrapper .wp-block-quote[style*="text-align: right"],
-			#editor .editor-styles-wrapper .wp-block-quote[style*="text-align:right"]', 'border-right-color' ),
-
-	/**
-	 * Utility Classes
-	 */
-	// Background-color
-	array( '#editor .editor-styles-wrapper .has-primary-background-color[class]', 'background-color' ),
-	// Text-color
-	array( '#editor .editor-styles-wrapper .has-primary-color[class]', 'color' ),
-
-), __( 'Link Color' ) );
+			#editor .editor-styles-wrapper a',
+			'color',
+		),
+
+		// Border-color (forms)
+		array( '#editor .editor-styles-wrapper .wp-block-search .wp-block-search__input:focus, textarea:focus', 'border-color' ),
+
+		// Border color left
+		array( '#editor .editor-styles-wrapper .wp-block-quote', 'border-left-color' ),
+
+		// Border color right
+		array(
+			'#editor .editor-styles-wrapper .wp-block-quote[style*="text-align: right"],
+			#editor .editor-styles-wrapper .wp-block-quote[style*="text-align:right"]',
+			'border-right-color',
+		),
+
+		/**
+		 * Utility Classes
+		 */
+		// Background-color
+		array( '#editor .editor-styles-wrapper .has-primary-background-color[class]', 'background-color' ),
+		// Text-color
+		array( '#editor .editor-styles-wrapper .has-primary-color[class]', 'color' ),
+
+	),
+	__( 'Link Color' )
+);
 
 // Text Color
 // $config-global--color-foreground-default
-add_editor_color_rule( 'txt', '#f2f2f2', array(
-
-	// Text-color
-	array( '#editor .editor-styles-wrapper .editor-post-title__block .editor-post-title__input,
+add_editor_color_rule(
+	'txt',
+	'#f2f2f2',
+	array(
+
+		// Text-color
+		array(
+			'#editor .editor-styles-wrapper .editor-post-title__block .editor-post-title__input,
 			#editor .editor-styles-wrapper .wp-block-pullquote,
-			#editor .editor-styles-wrapper', 'color' ),
+			#editor .editor-styles-wrapper',
+			'color',
+		),
 
-	// Background-color
-	array( '#editor .editor-styles-wrapper .wp-block-cover.has-background-dim,
+		// Background-color
+		array(
+			'#editor .editor-styles-wrapper .wp-block-cover.has-background-dim,
 			#editor .editor-styles-wrapper .wp-block-cover-image.has-background-dim,
 			#editor .editor-styles-wrapper table.is-style-stripes tbody tr:nth-child(odd),
-			#editor .editor-styles-wrapper .wp-block-table.is-style-stripes tbody tr:nth-child(odd)', 'background-color' ),
-
-	/**
-	 * Utility Classes
-	 */
-	// Text-color
-	array( '#editor .editor-styles-wrapper .has-foreground-color[class],
+			#editor .editor-styles-wrapper .wp-block-table.is-style-stripes tbody tr:nth-child(odd)',
+			'background-color',
+		),
+
+		/**
+		 * Utility Classes
+		 */
+		// Text-color
+		array(
+			'#editor .editor-styles-wrapper .has-foreground-color[class],
 			#editor .editor-styles-wrapper .has-background-background-color[class],
 			#editor .editor-styles-wrapper .has-background-dark-background-color[class],
-			#editor .editor-styles-wrapper .has-background-light-background-color[class]', 'color' ),
-	// Background-color
-	array( '#editor .editor-styles-wrapper .has-foreground-background-color[class]', 'background-color' ),
-	// Text-color darkened
-	array( '#editor .editor-styles-wrapper .has-foreground-dark-color[class]', 'color', '-1' ),
-	// Background-color darkened
-	array( '#editor .editor-styles-wrapper .has-foreground-dark-background-color[class]', 'background-color', '-1' ),
-	// Text-color brightened
-	array( '#editor .editor-styles-wrapper .has-foreground-light-color[class]', 'color', '+2' ),
-	// Background-color brightened
-	array( '#editor .editor-styles-wrapper .has-foreground-light-background-color[class]', 'background-color', '+2' ),
-
-	/**
-	 * Grays
-	 * Same as text color
-	 */
-	// Text-color
-	array( '#editor .editor-styles-wrapper .a8c-posts-list__item .a8c-posts-list-item__meta,
+			#editor .editor-styles-wrapper .has-background-light-background-color[class]',
+			'color',
+		),
+		// Background-color
+		array( '#editor .editor-styles-wrapper .has-foreground-background-color[class]', 'background-color' ),
+		// Text-color darkened
+		array( '#editor .editor-styles-wrapper .has-foreground-dark-color[class]', 'color', '-1' ),
+		// Background-color darkened
+		array( '#editor .editor-styles-wrapper .has-foreground-dark-background-color[class]', 'background-color', '-1' ),
+		// Text-color brightened
+		array( '#editor .editor-styles-wrapper .has-foreground-light-color[class]', 'color', '+2' ),
+		// Background-color brightened
+		array( '#editor .editor-styles-wrapper .has-foreground-light-background-color[class]', 'background-color', '+2' ),
+
+		// Border-color with less opacity (dim)
+		array(
+			'#editor .editor-styles-wrapper .wp-block-code,
+			#editor .editor-styles-wrapper .wp-block-search .wp-block-search__input',
+			'border-color',
+			0.8,
+		),
+		/**
+		 * Grays
+		 * Same as text color
+		 */
+		// Text-color
+		array(
+			'#editor .editor-styles-wrapper .a8c-posts-list__item .a8c-posts-list-item__meta,
 			#editor .editor-styles-wrapper .wp-block-image figcaption,
 			#editor .editor-styles-wrapper .wp-block-latest-comments .wp-block-latest-comments__comment-date,
 			#editor .editor-styles-wrapper .wp-block-latest-posts .wp-block-latest-posts__post-date,
@@ -168,20 +224,29 @@ add_editor_color_rule( 'txt', '#f2f2f2', array(
 			#editor .editor-styles-wrapper .wp-block-quote.is-style-large cite,
 			#editor .editor-styles-wrapper .wp-block-quote.is-style-large footer,
 			#editor .editor-styles-wrapper .wp-block-video figcaption,
-			#editor .editor-styles-wrapper figcaption', 'color' ),
+			#editor .editor-styles-wrapper figcaption',
+			'color',
+		),
 
-), __( 'Text Color' ) );
+	),
+	__( 'Text Color' )
+);
 
 // Accent Color (Red)
 // $config-global--color-secondary-default
-add_editor_color_rule( 'fg1', '#EE4266', array(
-
-	/**
-	 * Utility Classes
-	 */
-	// Text-color
-	array( '#editor .editor-styles-wrapper .has-secondary-color[class]', 'color' ),
-	// Background-color
-	array( '#editor .editor-styles-wrapper .has-secondary-background-color[class]', 'background-color' ),
-
-), __( 'Secondary Color' ) );
+add_editor_color_rule(
+	'fg1',
+	'#EE4266',
+	array(
+
+		/**
+		 * Utility Classes
+		 */
+		// Text-color
+		array( '#editor .editor-styles-wrapper .has-secondary-color[class]', 'color' ),
+		// Background-color
+		array( '#editor .editor-styles-wrapper .has-secondary-background-color[class]', 'background-color' ),
+
+	),
+	__( 'Secondary Color' )
+);

+ 1 - 1
rivington/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rivington",
-  "version": "1.3.7",
+  "version": "1.3.8",
   "description": "Rivington",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

+ 1 - 1
rivington/sass/_extra-child-theme.scss

@@ -469,4 +469,4 @@ a {
 			}
 		}
 	}
-}
+}

+ 1 - 1
rivington/sass/style-child-theme.scss

@@ -5,7 +5,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Rivington is a robust theme designed for single property real estate.
 Requires at least: WordPress 4.9.6
-Version: 1.3.7
+Version: 1.3.8
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia

+ 83 - 8
rivington/style-editor.css

@@ -202,6 +202,17 @@ a {
 	cursor: pointer;
 }
 
+button,
+input,
+optgroup,
+select,
+textarea {
+	font-family: inherit;
+	font-size: 100%;
+	line-height: 1.15;
+	margin: 0;
+}
+
 /**
  * Elements
  * - Styles for basic HTML elemants
@@ -469,7 +480,7 @@ object {
  *   in-sync
  */
 .wp-block-a8c-blog-posts + .button, .wp-block-button__link,
-.wp-block-file__button {
+.wp-block-file__button, .wp-block-search .wp-block-search__button {
 	line-height: 1.15;
 	color: #060f29;
 	cursor: pointer;
@@ -485,8 +496,8 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before, .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -494,19 +505,19 @@ object {
 }
 
 .wp-block-a8c-blog-posts + .button:before, .wp-block-button__link:before,
-.wp-block-file__button:before {
+.wp-block-file__button:before, .wp-block-search .wp-block-search__button:before {
 	margin-bottom: -0.195em;
 }
 
 .wp-block-a8c-blog-posts + .button:after, .wp-block-button__link:after,
-.wp-block-file__button:after {
+.wp-block-file__button:after, .wp-block-search .wp-block-search__button:after {
 	margin-top: -0.185em;
 }
 
 .wp-block-a8c-blog-posts + .button:not(.has-background):hover, .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
-.wp-block-file__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button {
+.wp-block-file__button:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, .wp-block-a8c-blog-posts + .button:focus, .wp-block-button__link:focus,
+.wp-block-file__button:focus, .wp-block-search .wp-block-search__button:focus, .wp-block-a8c-blog-posts + .has-focus.button, .has-focus.wp-block-button__link,
+.has-focus.wp-block-file__button, .wp-block-search .has-focus.wp-block-search__button {
 	color: #060f29;
 	background-color: #b59439;
 }
@@ -921,6 +932,70 @@ p.has-background:not(.has-background-background-color) a {
 	color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 0 solid #353a46;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 0 solid #353a46;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #353a46;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid #353a46;

+ 96 - 16
rivington/style-rtl.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1.15;
 	color: #060f29;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.195em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.185em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #060f29;
 	background-color: #b59439;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1.15;
 	color: #060f29;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.195em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.185em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #060f29;
 	background-color: #b59439;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 0 solid #353a46;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 0 solid #353a46;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-left: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #353a46;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #353a46;
 	clear: both;
@@ -4584,3 +4648,19 @@ p:not(.site-title) a:hover {
 		display: contents;
 	}
 }
+
+/**
+ * Search block
+ */
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__input {
+	background: transparent;
+}
+
+.wp-block-search .wp-block-search__input {
+	margin-left: calc( .1 * 16px);
+	border-radius: 3px;
+}

+ 96 - 16
rivington/style.css

@@ -198,7 +198,7 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1.15;
 	color: #060f29;
 	cursor: pointer;
@@ -216,10 +216,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -229,27 +229,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.195em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.185em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #060f29;
 	background-color: #b59439;
 }
@@ -1342,7 +1342,7 @@ object {
 button[data-load-more-btn], .button, button,
 input[type="submit"],
 .wp-block-button__link,
-.wp-block-file__button, .a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
+.wp-block-file__button, .a8c-posts-list__view-all, .wp-block-search .wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept {
 	line-height: 1.15;
 	color: #060f29;
 	cursor: pointer;
@@ -1360,10 +1360,10 @@ input[type="submit"],
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before, button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	content: '';
 	display: block;
 	height: 0;
@@ -1373,27 +1373,27 @@ input[type="submit"]:after,
 button[data-load-more-btn]:before, .button:before, button:before,
 input[type="submit"]:before,
 .wp-block-button__link:before,
-.wp-block-file__button:before, .a8c-posts-list__view-all:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
+.wp-block-file__button:before, .a8c-posts-list__view-all:before, .wp-block-search .wp-block-search__button:before, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:before {
 	margin-bottom: -0.195em;
 }
 
 button[data-load-more-btn]:after, .button:after, button:after,
 input[type="submit"]:after,
 .wp-block-button__link:after,
-.wp-block-file__button:after, .a8c-posts-list__view-all:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
+.wp-block-file__button:after, .a8c-posts-list__view-all:after, .wp-block-search .wp-block-search__button:after, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:after {
 	margin-top: -0.185em;
 }
 
 .button:not(.has-background):hover, button:not(.has-background):hover,
 input:not(.has-background):hover[type="submit"],
 .wp-block-button__link:not(.has-background):hover,
-.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
+.wp-block-file__button:not(.has-background):hover, .a8c-posts-list__view-all:not(.has-background):hover, .wp-block-search .wp-block-search__button:not(.has-background):hover, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:not(.has-background):hover, .button:focus, button:focus,
 input:focus[type="submit"],
 .wp-block-button__link:focus,
-.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
+.wp-block-file__button:focus, .a8c-posts-list__view-all:focus, .wp-block-search .wp-block-search__button:focus, body .widget_eu_cookie_law_widget #eu-cookie-law input.accept:focus, .has-focus.button, button.has-focus,
 input.has-focus[type="submit"],
 .has-focus.wp-block-button__link,
-.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
+.has-focus.wp-block-file__button, .has-focus.a8c-posts-list__view-all, .wp-block-search .has-focus.wp-block-search__button, body .widget_eu_cookie_law_widget #eu-cookie-law input.has-focus.accept {
 	color: #060f29;
 	background-color: #b59439;
 }
@@ -2229,6 +2229,70 @@ p.has-background {
 	border-color: currentColor;
 }
 
+.wp-block-search {
+	flex-wrap: wrap;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	background: white;
+	color: black;
+	border: 0 solid #353a46;
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__input {
+	padding: 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button {
+	padding: 16px 16px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon {
+	padding: 0;
+}
+
+.wp-block-search .wp-block-search__label {
+	font-weight: normal;
+}
+
+.wp-block-search .wp-block-search__input {
+	color: black;
+	border: 0 solid #353a46;
+	border-radius: 3px;
+	padding: 16px;
+	font-size: 1rem;
+	line-height: 1rem;
+	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+	font-family: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);
+	max-width: inherit;
+	margin-right: calc( .66 * 16px);
+	background: white;
+}
+
+.wp-block-search .wp-block-search__input:focus {
+	color: black;
+	border-color: #353a46;
+}
+
+.wp-block-search .wp-block-search__button {
+	border: none;
+	box-shadow: none;
+}
+
+.wp-block-search .wp-block-search__button.has-icon {
+	transform: scaleX(-1);
+	padding: 0;
+	min-width: calc(2* 16px + 1rem + 4px);
+	min-height: calc(2* 16px + 1rem + 4px);
+}
+
+.wp-block-search .wp-block-search__button.has-icon svg {
+	fill: currentColor;
+	width: 29px;
+	height: 29px;
+}
+
 hr {
 	border-bottom: 2px solid #353a46;
 	clear: both;
@@ -4613,3 +4677,19 @@ p:not(.site-title) a:hover {
 		display: contents;
 	}
 }
+
+/**
+ * Search block
+ */
+.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
+	border-radius: 3px;
+}
+
+.wp-block-search.wp-block-search__button-inside .wp-block-search__input {
+	background: transparent;
+}
+
+.wp-block-search .wp-block-search__input {
+	margin-right: calc( .1 * 16px);
+	border-radius: 3px;
+}

+ 1 - 1
rockfield/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rockfield",
-  "version": "1.4.8",
+  "version": "1.4.9",
   "description": "Rockfield",
   "bugs": {
     "url": "https://github.com/Automattic/themes/issues"

Some files were not shown because too many files changed in this diff