/** * Copyright 2025 Google LLC * * Licensed 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. */ .ribbon { @include transform(rotate(45deg)); background-color: $pebble-green; box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); color: #fff; font-size: 19px; font-weight: bold; left: -5px; line-height: 15px; padding: 10px 0 8px; position: relative; text-align: center; top: 15px; width: 120px; } .ribbon__wrapper { height: 88px; overflow: hidden; position: absolute; right: 0; top: 0; width: 85px; } .ribbon__container { position: relative; } .ribbon--bg-white { background-color: $white; } .ribbon--fg-dark-grey { color: $dark-grey; } .ribbon--bg-dark-red { background-color: $dark-red; } .ribbon--fg-dark-red { color: $dark-red; } .ribbon--fg-white { color: $white; }