JezK

Edit File: editor-blocks.css

/*
Theme Name: Bosa
Description: Used to style Gutenberg Blocks.
*/

/*Images alignment
-----------------------------------------------------------*/
.wp-block {
  max-width: 100%;
}

/* Content Width */
.has-primary-background-color,
.has-secondary-background-color,
.has-dark-gray-background-color,
.has-light-gray-background-color {
  color: #fff;
}
.has-primary-background-color p,
.has-primary-background-color h1,
.has-primary-background-color h2,
.has-primary-background-color h3,
.has-primary-background-color h4,
.has-primary-background-color h5,
.has-primary-background-color h6,
.has-primary-background-color a,
.has-secondary-background-color p,
.has-secondary-background-color h1,
.has-secondary-background-color h2,
.has-secondary-background-color h3,
.has-secondary-background-color h4,
.has-secondary-background-color h5,
.has-secondary-background-color h6,
.has-secondary-background-color a,
.has-dark-gray-background-color p,
.has-dark-gray-background-color h1,
.has-dark-gray-background-color h2,
.has-dark-gray-background-color h3,
.has-dark-gray-background-color h4,
.has-dark-gray-background-color h5,
.has-dark-gray-background-color h6,
.has-dark-gray-background-color a,
.has-light-gray-background-color p,
.has-light-gray-background-color h1,
.has-light-gray-background-color h2,
.has-light-gray-background-color h3,
.has-light-gray-background-color h4,
.has-light-gray-background-color h5,
.has-light-gray-background-color h6,
.has-light-gray-background-color a {
  color: #fff;
}

.has-white-background-color {
  color: #1a1a1a;
}

.has-white-background-color p,
.has-white-background-color h1,
.has-white-background-color h2,
.has-white-background-color h3,
.has-white-background-color h4,
.has-white-background-color h5,
.has-white-background-color h6,
.has-white-background-color a {
  color: #1a1a1a;
}

/* Text Color */
.has-tan-color {
  color: #E6DBAD;
}
.has-yellow-color {
  color: #FDE64B;
}
.has-orange-color {
  color: #ED7014;
}
.has-red-color {
  color: #D0312D;
}
.has-pink-color {
  color: #b565a7;
}
.has-purple-color {
  color: #A32CC4;
}
.has-blue-color {
  color: #3A43BA;
}
.has-green-color {
  color: #3BB143;
}
.has-brown-color {
  color: #231709;
}
.has-grey-color {
  color: #6C626D;
}
.has-black-color {
  color: #000000;
}

/* Post Title */
.editor-post-title__block .editor-post-title__input {
  font-size: 32px;
  margin: 0 0 35px;
  padding: 0;
  text-align: center;
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

/* Default Appender */
.editor-default-block-appender .editor-default-block-appender__content {
  font-size: 22px;
}

/* Heading */
.wp-block-heading strong {
  font-weight: bolder;
}

/* Paragraph */
.wp-block-paragraph.has-drop-cap:not(:focus)::first-letter {
  font-size: 3.375em;
  line-height: 1;
  font-weight: bold;
  margin: 0 0.25em 0 0;
}

.editor-styles-wrapper p.wp-block,
.editor-styles-wrapper .wp-block p {
  color: #353535;
}

/* HTML */
.wp-block-html .editor-plain-text {
  display: block;
}

/* Cover */
.wp-block-cover h2,
.wp-block-cover .wp-block-cover-text {
  font-size: 1.6875em;
  font-weight: 400;
  line-height: 1.4;
  padding-left: 1rem;
  padding-right: 1rem;
}

.wp-block-cover h2 strong,
.wp-block-cover .wp-block-cover-text strong {
  font-weight: bolder;
}

@media only screen and (min-width: 768px) {
  .wp-block-cover h2,
  .wp-block-cover .wp-block-cover-text {
    margin-left: auto;
    margin-right: auto;
    padding: 0;
  }
}

@media only screen and (min-width: 768px) {
  .wp-block-cover {
    padding-left: 10%;
    padding-right: 10%;
  }
  .wp-block-cover h2,
  .wp-block-cover .wp-block-cover-text {
    font-size: 2.25em;
  }
}

/* Gallery */
.wp-block-gallery .blocks-gallery-image figcaption,
.wp-block-gallery .blocks-gallery-item figcaption,
.wp-block-gallery .gallery-item .gallery-caption {
  font-size: 0.71111em;
  line-height: 1.6;
}

/* Button */
.wp-block-button .wp-block-button__link {
  background-color: #01e0af;
  color: #03065d;
  border: none;
  -webkit-border-radius: 28px;
  border-radius: 28px;
  -webkit-box-shadow: none;
  box-shadow: none;
  display: inline-block;
  font-size: 15px;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.0666666666666667em;
  padding: 14px 35px;
  text-decoration: none;
  text-transform: uppercase;
  -webkit-transition: background-color 0.2s ease-in-out;
  -moz-transition: background-color 0.2s ease-in-out;
  -o-transition: background-color 0.2s ease-in-out;
  transition: background-color 0.2s ease-in-out;
  white-space: nowrap;
}

.wp-block-button .wp-block-button__link:hover,
.wp-block-button .wp-block-button__link:focus,
.wp-block-button .wp-block-button__link:active {
  background-color: #333;
  color: #fff;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.wp-block-button:not(.is-style-outline) .wp-block-button__link {
  background: #0073aa;
}

.wp-block-button.is-style-outline,
.wp-block-button.is-style-outline:hover,
.wp-block-button.is-style-outline:focus,
.wp-block-button.is-style-outline:active {
  background: transparent;
  color: #0073aa;
}

.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-outline:hover .wp-block-button__link,
.wp-block-button.is-style-outline:focus .wp-block-button__link,
.wp-block-button.is-style-outline:active .wp-block-button__link {
  background: transparent;
}

.wp-block-button.is-style-outline .wp-block-button__link:not(.has-text-color),
.wp-block-button.is-style-outline:hover .wp-block-button__link:not(.has-text-color),
.wp-block-button.is-style-outline:focus .wp-block-button__link:not(.has-text-color),
.wp-block-button.is-style-outline:active .wp-block-button__link:not(.has-text-color) {
  color: #0073aa;
}

/* Blockquote */
.wp-block-quote:not(.is-large):not(.is-style-large),
.wp-block-quote.has-text-align-right,
.wp-block-quote.has-text-align-left {
  border: none;
}
.wp-block-quote.has-text-align-right
.wp-block-quote.is-large p,
.wp-block-quote.is-style-large p {
  font-size: 1.6875em;
  line-height: 1.3;
  margin-bottom: 0.5em;
  margin-top: 0.5em;
}

.wp-block-quote cite,
.wp-block-quote footer,
.wp-block-quote .wp-block-quote__citation {
  font-size: 0.71111em;
  line-height: 1.6;
  color: #767676;
}

/* Pullquote */
.wp-block-pullquote {
  border-color: transparent;
  border-width: 2px;
  color: #000;
}

.wp-block-pullquote blockquote {
  margin-top: calc(3 * 1rem);
  margin-bottom: calc(3.33 * 1rem);
  hyphens: auto;
  word-break: break-word;
}

.editor-styles-wrapper .editor-block-list__block-edit .wp-block-pullquote p,
.wp-block-pullquote:not(.is-style-solid-color) .wp-block-pullquote__citation {
  color: inherit;
}

.wp-block-pullquote.is-style-solid-color blockquote {
  width: calc(100% - (2 * 1rem));
  max-width: calc( 100% - (2 * 1rem));
}

.wp-block-pullquote.is-style-solid-color blockquote a,
.wp-block-pullquote.is-style-solid-color blockquote.has-text-color p,
.wp-block-pullquote.is-style-solid-color blockquote.has-text-color a {
  color: inherit;
}

.wp-block-pullquote.is-style-solid-color blockquote:not(.has-text-color) {
  color: #fff;
}

@media only screen and (min-width: 768px) {
  .wp-block-pullquote.is-style-solid-color blockquote {
    max-width: 80%;
  }
}

.wp-block-pullquote.is-style-solid-color:not(.has-background-color) {
  background-color: #0073aa;
}

.wp-block[data-type="core/pullquote"] blockquote > .block-library-pullquote__content .editor-rich-text__tinymce[data-is-empty="true"]::before,
.wp-block[data-type="core/pullquote"] blockquote > .editor-rich-text p,
.wp-block[data-type="core/pullquote"] p,
.wp-block[data-type="core/pullquote"][data-align="left"] blockquote > .block-library-pullquote__content .editor-rich-text__tinymce[data-is-empty="true"]::before,
.wp-block[data-type="core/pullquote"][data-align="left"] blockquote > .editor-rich-text p,
.wp-block[data-type="core/pullquote"][data-align="left"] p,
.wp-block[data-type="core/pullquote"][data-align="right"] blockquote > .block-library-pullquote__content .editor-rich-text__tinymce[data-is-empty="true"]::before,
.wp-block[data-type="core/pullquote"][data-align="right"] blockquote > .editor-rich-text p,
.wp-block[data-type="core/pullquote"][data-align="right"] p {
  font-size: 1.6875em;
  font-style: italic;
  line-height: 1.3;
  margin-bottom: 0.5em;
  margin-top: 0.5em;
}

@media only screen and (min-width: 768px) {
  .wp-block[data-type="core/pullquote"] blockquote > .block-library-pullquote__content .editor-rich-text__tinymce[data-is-empty="true"]::before,
  .wp-block[data-type="core/pullquote"] blockquote > .editor-rich-text p,
  .wp-block[data-type="core/pullquote"] p,
  .wp-block[data-type="core/pullquote"][data-align="left"] blockquote > .block-library-pullquote__content .editor-rich-text__tinymce[data-is-empty="true"]::before,
  .wp-block[data-type="core/pullquote"][data-align="left"] blockquote > .editor-rich-text p,
  .wp-block[data-type="core/pullquote"][data-align="left"] p,
  .wp-block[data-type="core/pullquote"][data-align="right"] blockquote > .block-library-pullquote__content .editor-rich-text__tinymce[data-is-empty="true"]::before,
  .wp-block[data-type="core/pullquote"][data-align="right"] blockquote > .editor-rich-text p,
  .wp-block[data-type="core/pullquote"][data-align="right"] p {
    font-size: 2.25em;
  }
}

.wp-block[data-type="core/pullquote"] .wp-block-pullquote__citation,
.wp-block[data-type="core/pullquote"][data-align="left"] .wp-block-pullquote__citation,
.wp-block[data-type="core/pullquote"][data-align="right"] .wp-block-pullquote__citation {
  font-size: 0.71111em;
  line-height: 1.6;
  text-transform: none;
}

.wp-block[data-type="core/pullquote"] em,
.wp-block[data-type="core/pullquote"][data-align="left"] em,
.wp-block[data-type="core/pullquote"][data-align="right"] em {
  font-style: normal;
}

.wp-block[data-type="core/pullquote"][data-align="left"] .editor-block-list__block-edit,
.wp-block[data-type="core/pullquote"][data-align="right"] .editor-block-list__block-edit {
  width: calc(4 * (100vw / 12));
  max-width: 50%;
}

.wp-block[data-type="core/pullquote"][data-align="left"] .editor-block-list__block-edit .wp-block-pullquote:not(.is-style-solid-color),
.wp-block[data-type="core/pullquote"][data-align="right"] .editor-block-list__block-edit .wp-block-pullquote:not(.is-style-solid-color) {
  padding: 0;
}

.wp-block[data-type="core/pullquote"][data-align="left"] .editor-block-list__block-edit .wp-block-pullquote.is-style-solid-color,
.wp-block[data-type="core/pullquote"][data-align="right"] .editor-block-list__block-edit .wp-block-pullquote.is-style-solid-color {
  padding: 1em;
}

.wp-block[data-type="core/pullquote"][data-align="left"] blockquote > .block-library-pullquote__content .editor-rich-text__tinymce[data-is-empty="true"]::before,
.wp-block[data-type="core/pullquote"][data-align="left"] blockquote > .editor-rich-text p,
.wp-block[data-type="core/pullquote"][data-align="left"] p,
.wp-block[data-type="core/pullquote"][data-align="left"] .wp-block-pullquote__citation,
.wp-block[data-type="core/pullquote"][data-align="right"] blockquote > .block-library-pullquote__content .editor-rich-text__tinymce[data-is-empty="true"]::before,
.wp-block[data-type="core/pullquote"][data-align="right"] blockquote > .editor-rich-text p,
.wp-block[data-type="core/pullquote"][data-align="right"] p,
.wp-block[data-type="core/pullquote"][data-align="right"] .wp-block-pullquote__citation {
  text-align: left;
}

@media only screen and (min-width: 768px) {
  .wp-block[data-type="core/pullquote"][data-align="full"] .wp-block-pullquote blockquote {
    max-width: calc(80% - 128px);
  }
}

/* File */
.wp-block-file .wp-block-file__textlink {
  text-decoration: underline;
  color: #0073aa;
}

.wp-block-file .wp-block-file__textlink:hover {
  color: #005177;
  text-decoration: none;
}

.wp-block-file .wp-block-file__button {
  display: table;
  line-height: 1.8;
  font-size: 0.88889em;
  font-weight: bold;
  background-color: #0073aa;
  border-radius: 5px;
}

.wp-block-file .wp-block-file__button-richtext-wrapper {
  display: block;
  margin-top: calc(0.75 * 1rem);
  margin-left: 0;
}

/* Verse */
.wp-block-verse,
.wp-block-verse pre {
  padding: 0;
}

/* Code */
.wp-block-code {
  border-radius: 0;
}

/* Table */
.wp-block-table td, .wp-block-table th {
  border-color: #767676;
}

/* Separator */
.wp-block-separator:not(.is-style-dots) {
  border-bottom: 2px solid #767676;
}

.wp-block-separator:not(.is-style-wide):not(.is-style-dots) {
  width: 2.25em;
  margin-left: 0;
}

.wp-block-separator.is-style-dots:before {
  color: #767676;
  font-size: 1.6875em;
  letter-spacing: calc(2 * 1rem);
  padding-left: calc(2 * 1rem);
}

/* Remove duplicate rule-line when a separator is followed by an H1, or H2 */
.wp-block[data-type="core/separator"] + .wp-block[data-type="core/heading"] h1:before,
.wp-block[data-type="core/separator"] + .wp-block[data-type="core/heading"] h2:before {
  display: none;
}

/* Latest Posts, Archives, Categories */
ul.wp-block-archives,
.wp-block-categories,
.wp-block-latest-posts {
  padding: 0;
  list-style-type: none;
}

ul.wp-block-archives ul,
.wp-block-categories ul,
.wp-block-latest-posts ul {
  padding: 0;
  list-style-type: none;
}

ul.wp-block-archives li,
.wp-block-categories li,
.wp-block-latest-posts li {
  color: #767676;
  font-size: calc(22px * 1.125);
  font-weight: bold;
  line-height: 1.2;
  padding-bottom: 0.75rem;
}

ul.wp-block-archives li.menu-item-has-children, ul.wp-block-archives li:last-child,
.wp-block-categories li.menu-item-has-children,
.wp-block-categories li:last-child,
.wp-block-latest-posts li.menu-item-has-children,
.wp-block-latest-posts li:last-child {
  padding-bottom: 0;
}

ul.wp-block-archives li a,
.wp-block-categories li a,
.wp-block-latest-posts li a {
  text-decoration: none;
}

ul.wp-block-archives li ul,
.wp-block-categories li ul,
.wp-block-latest-posts li ul {
  padding-left: 1rem;
}

.wp-block-categories ul {
  padding-top: 0.75rem;
}

.wp-block-categories ul ul {
  counter-reset: submenu;
}

.wp-block-categories ul ul > li > a::before {
  font-weight: normal;
  content: "– " counters(submenu, "– ", none);
  counter-increment: submenu;
}

.wp-block-categories li ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: -0.75rem;
}

/* Latest Posts grid view */
.wp-block-latest-posts.is-grid li {
  border-top: 2px solid #ccc;
  padding-top: 1rem;
  margin-bottom: 2rem;
}

.wp-block-latest-posts.is-grid li a:after {
  content: '';
}

.wp-block-latest-posts.is-grid li:last-child {
  margin-bottom: auto;
}

.wp-block-latest-posts.is-grid li:last-child a:after {
  content: '';
}

/* Latest Comments */
.wp-block-latest-comments .wp-block-latest-comments__comment-meta .wp-block-latest-comments__comment-date {
  font-weight: normal;
}

.wp-block-latest-comments .wp-block-latest-comments__comment,
.wp-block-latest-comments .wp-block-latest-comments__comment-date,
.wp-block-latest-comments .wp-block-latest-comments__comment-excerpt p {
  font-size: inherit;
}

.wp-block-latest-comments .wp-block-latest-comments__comment-date {
  font-size: 0.71111em;
}

/* Classic Editor */
/* Properly center-align captions in the classic-editor block */
.wp-caption dd {
  color: #767676;
  font-size: 0.71111em;
  line-height: 1.6;
  margin: 0;
  padding: 0.5rem;
  text-align: left;
  text-align: center;
  -webkit-margin-start: 0px;
  margin-inline-start: 0px;
}

.wp-block-freeform blockquote {
  border-left: 2px solid #0073aa;
}

.wp-block-freeform blockquote cite {
  font-size: 0.71111em;
  font-style: normal;
  line-height: 1.6;
  color: #767676;
}

/* meta box panel css */
.edit-post-sidebar__panel-tab:focus,
.components-panel__body-toggle.components-button:focus:not(:disabled):not([aria-disabled=true]) {
  outline: none;
}

.editor-block-toolbar .components-toolbar {
  overflow: hidden;
}

.wp-block-cover, .wp-block-cover-image {
  margin-bottom: 0;
}

.editor-media-placeholder__url-input-container {
  width: auto;
  display: inline-block;
  margin-left: 5px;
}

.editor-block-list__insertion-point-inserter .editor-inserter__toggle {
  margin-top: 10px;
}

.editor-styles-wrapper .editor-post-title__block .editor-post-title__input,
.editor-styles-wrapper .wp-block h1, .editor-styles-wrapper .wp-block h2, .editor-styles-wrapper .wp-block h3,
.editor-styles-wrapper .wp-block h4, .editor-styles-wrapper .wp-block h5, .editor-styles-wrapper .wp-block h6,
.editor-styles-wrapper .wp-block.editor-post-title__block .editor-post-title__input {
  font-weight: 600;
}

.editor-styles-wrapper .editor-block-list__block-edit p {
  color: #1a1a1a;
}

.editor-styles-wrapper .wp-block-cover .wp-block-cover-image-text, 
.editor-styles-wrapper .wp-block-cover .wp-block-cover-text, .wp-block-cover h2, 
.editor-styles-wrapper .wp-block-cover-image .wp-block-cover-image-text, 
.editor-styles-wrapper .wp-block-cover-image .wp-block-cover-text, 
.editor-styles-wrapper .wp-block-cover-image h2 {
  color: #FFFFFF;
}