site/_sass/_admonition.scss

/**
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 *   http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */
@mixin admon($main-color) {
  background-color: lighten($main-color, 25%);
  color: darken($main-color, 30%);
  padding: 1rem;

  span.admonition-title {
    p {
      font-size: 24px;
    }

    color: darken($main-color, 30%);

    & + p {
      margin-top: 15px;
    }
  }

  a {
    color: darken($main-color, 20%);
  }
}

.admonition {
  margin: 1rem 0;

  p {
    margin: 0;

    & + p {
      margin-top: 15px;
    }
  }

  ul {
    margin-left: 20px;

    li {
      font-size: 20px;
    }
  }

  .info {
    @include admon($brand-info);
  }

  .warning {
    @include admon($brand-warning);
  }

  .danger {
    @include admon($brand-danger);
  }

  .success {
    @include admon($brand-success);
  }
}