scss Gutenberg插件前端阻止风格

Posted 2021-05-17

/*-----------------------------------------*/
/* Gutenberg Plugin Styles
/*-----------------------------------------*/


body {
  // alignment
  @media (min-width: 768px) {
    .alignfull {
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      width: auto;
      max-width: 1000%;
    }

    .alignwide {
      margin-left: calc(25% - 25vw);
      margin-right: calc(25% - 25vw);
      width: auto;
      max-width: 1000%;
    }

  }

  .alignwide,
  .alignfull {
    margin-bottom: 2.2rem;
    img {
      display: block;
      margin: 0 auto;
      width: 100%;
    }

    iframe {
      width: 100%;
      min-height: 380px;
      height: auto;
    }
  }

  .wp-block-image {
    figcaption {
      margin: 0 0 1rem;
      padding:0.5rem;
      border: 1px solid $border-color;
    }
  }

  .wp-block-gallery {
    margin-left: 0;
    margin-right: 0;
  }

  &.single-post,
  &.page-template-default {
    .alignwide,
    .alignfull{
      margin-left: 0;
      margin-right: 0;
    }
  }

  // blockquote
  blockquote {
    &.wp-block-pullquote {
      border-left: 0;
    }
  }

  // horizontal rule
  hr.wp-block-separator {
    border-color: $link-hover-color;
  }

  // buttons
  .wp-block-button {
    .wp-block-button__link {
      border-radius: 0;
    }
  }
}