public/styles/components/_atom-editor.scss

.atom-editor {
  max-width: 600px;
  padding: 20px;
  margin: 10px auto;
  background: $color150Grey;
  border: 1px solid $color300Grey;

  &__title {
    margin-bottom: 20px;
    border-bottom: 1px solid $color300Grey;
  }

  &__section {
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid $color300Grey;
  }

  &__form {
    margin: 20px 40px;
    padding-top: 20px;
    border-top: 1px solid $color300Grey;
  }

  .is-embedded & {
    background: white;
    border-width: 0;
  }

  &__embed-pick {
    padding: 10px;

    background-color: $color200Grey;
    margin-bottom: 10px;

    .btn {
      display: inline-block;
      padding: 5px 10px;
    }

  }

  &__switchtype {
    width: 100%;
    background-color: $color300Grey;
    padding: 3px 10px;
    display: block;
    text-decoration: inherit;
    color: $color600Grey;

    text-align: center;

    &:hover {
      background-color: $color400Grey;
    }
  }

  &__external {
    display: inline-block;
    background-color: $brandColor;
    color: white;
    padding: 10px 15px;
    font-size: 16px;
    text-decoration: none;

    margin: 10px 0;

    &:hover {
      background-color: $darkBrandColor;
    }

  }
}