/* * DO NOT EDIT THIS FILE. * See the following change record for more information, * https://www.drupal.org/node/2815083 * @preserve */ /** * Messages. * * @todo revisit this after https://www.drupal.org/project/drupal/issues/3078400 * has been resolved. */ :root { /* * Color Palette. */ /* Secondary. */ /* Variations. */ /* 5% darker than base. */ /* 10% darker than base. */ /* 10% darker than base. */ /* 20% darker than base. */ /* 5% darker than base. */ /* 10% darker than base. */ /* 5% darker than base. */ /* 10% darker than base. */ /* 5% darker than base. */ /* 10% darker than base. */ /* * Base. */ /* * Typography. */ /* 1rem = 16px if font root is 100% ands browser defaults are used. */ /* ~32px */ /* ~29px */ /* ~26px */ /* ~23px */ /* ~20px */ /* 18px */ /* ~14px */ /* ~13px */ /* ~11px */ /** * Spaces. */ /* 3 * 16px = 48px */ /* 1.5 * 16px = 24px */ /* 1 * 16px = 16px */ /* 0.75 * 16px = 12px */ /* 0.5 * 16px = 8px */ /* * Common. */ /* * Inputs. */ /* Absolute zero with opacity. */ /* Davy's gray with 0.6 opacity. */ /* Light gray with 0.3 opacity on white bg. */ /* Old silver with 0.5 opacity on white bg. */ /* (1/8)em ~ 2px */ /* (1/16)em ~ 1px */ /* Font size is too big to use 1rem for extrasmall line-height */ /* 7px inside the form element label. */ /* 8px with the checkbox width of 19px */ /* * Details. */ /** * Buttons. */ /** * jQuery.UI dropdown. */ /* Light gray with 0.8 opacity. */ /* Text color with 0.1 opacity. */ /** * jQuery.UI dialog. */ /** * Progress bar. */ /** * Tabledrag icon size. */ /* 17px */ /** * Ajax progress. */ /** * Breadcrumb. */ } .messages-list { margin-top: 2.5rem; margin-bottom: 2.5rem; padding: 0; list-style: none; } .field .messages-list, .form-wrapper .messages-list { margin-bottom: 0; } .messages { box-sizing: border-box; margin-top: 1rem; margin-bottom: 1rem; padding: 1.5rem 1.5rem 2rem calc(1.5rem - 5px); /* LTR */ color: #fff; border-width: 0 0 0 5px; /* LTR */ border-style: solid; border-color: #353641; border-radius: 2px; background-color: #353641; } [dir="rtl"] .messages { padding-right: calc(1.5rem - 5px); padding-left: 1.5rem; border-right-width: 5px; border-left-width: 0; } .messages--error { border-color: #e34f4f; } .messages--status { border-color: #42a877; } .messages--warning { border-color: #e0ac00; } .messages__title { margin: 0 0 0 2.5rem; /* LTR */ font-size: 1rem; } [dir="rtl"] .messages__title { margin-right: 2.5rem; margin-left: 0; } .messages--error .messages__header { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 14 14'%3E%3Cpath d='M3 11.1931L11.4501 2.99995' stroke='%23e34f4f' stroke-width='2'/%3E%3Ccircle cx='7' cy='7' r='6' fill='none' stroke='%23e34f4f' stroke-width='2'/%3E%3C/svg%3E%0A") no-repeat center left; /* LTR */ } [dir="rtl"] .messages--error .messages__header { background-position: center right; } .messages--status .messages__header { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 13'%3E%3Cpath d='M2 6.57143L5.6 10L14 2' fill='none' stroke='%2342a877' stroke-width='3'/%3E%3C/svg%3E%0A") no-repeat center left; /* LTR */ } [dir="rtl"] .messages--status .messages__header { background-position: center right; } .messages--warning .messages__header { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 4 14' fill='%23e0ac00'%3E%3Crect x='0.5' width='3' height='9'/%3E%3Ccircle cx='2' cy='12.5' r='1.5'/%3E%3C/svg%3E%0A") no-repeat center left; /* LTR */ } [dir="rtl"] .messages--warning .messages__header { background-position: center right; } .messages__header { display: flex; align-items: center; margin-bottom: 1rem; } @media screen and (min-width: 48rem) { .messages__content { margin-left: 2.5rem; /* LTR */ } [dir="rtl"] .messages__content { margin-right: 2.5rem; margin-left: 0; } } .messages a { text-decoration: underline; color: #ffd23f; } .messages a:hover { color: #fff; } .messages pre { margin: 0; } .messages__list { margin: 0; padding: 0; list-style: none; } .messages__item + .messages__item { margin-top: 0.75rem; } @media screen and (-ms-high-contrast: active) { .messages { border-width: 1px 1px 1px 5px; /* LTR */ } [dir="rtl"] .messages { border-right-width: 5px; border-left-width: 1px; } .messages__header { filter: grayscale(1) brightness(1.5) contrast(10); } }