/* * DO NOT EDIT THIS FILE. * See the following change record for more information, * https://www.drupal.org/node/3084859 * @preserve */ /** * @file * Visual styles for progress bar. * * @see progress.js */ .progress::after { display: table; clear: both; content: ""; } .progress--small .progress__track { height: calc(0.5rem - 2px); } .progress--small .progress__bar { width: calc(0.5rem - 2px); min-width: calc(0.5rem - 2px); height: calc(0.5rem - 2px); } .progress--small .progress__label { font-size: 0.889rem; } .progress__track { height: calc(1rem - 2px); margin-top: 0; border: 1px #919297 solid; border-radius: 1rem; background-color: #d3d4d9; } .progress__bar { width: calc(1rem - 2px); min-width: calc(1rem - 2px); height: calc(1rem - 2px); margin-top: -1px; margin-left: -1px; /* LTR */ transition: width 0.5s ease-out; border: 1px #003cc5 solid; border-radius: 1rem; background-color: #003cc5; } [dir="rtl"] .progress__bar { margin-right: -1px; margin-left: 0; } @media screen and (-ms-high-contrast: active) { .progress__bar { background-color: windowText; } } .progress__label { margin-bottom: 0.5rem; font-size: 1rem; font-weight: bold; } .progress__description, .progress__percentage { overflow: hidden; margin-top: 0.5rem; color: #55565b; font-size: 0.79rem; } @media screen and (prefers-reduced-motion: reduce) { .progress__bar { transition: none; } }