@codegouvfr/react-dsfr/dsfr/component/alert/alert.min.css

French State Design System React integration library

/*!
 * DSFR v1.10.2 | SPDX-License-Identifier: MIT | License-Filename: LICENSE.md | restricted use (see terms and conditions)
 */.fr-alert{--title-spacing:0 0 0.25rem;--text-spacing:0 0 0.25rem;box-shadow:inset 0 0 0 1px var(--border-plain-grey),inset 2.5rem 0 0 0 var(--background-flat-grey);padding:1rem 2.25rem .75rem 3.5rem;position:relative}.fr-alert:before{--icon-size:1.5rem;background-color:currentColor;color:var(--text-inverted-grey);display:inline-block;flex:0 0 auto;height:var(--icon-size);left:0;margin:1rem .5rem;-webkit-mask-size:100% 100%;mask-size:100% 100%;position:absolute;top:0;vertical-align:calc((.75em - var(--icon-size))*.5);width:var(--icon-size)}.fr-alert__title{font-size:1.125rem;font-weight:700;line-height:1.5rem}.fr-alert .fr-btn--close{font-size:.875rem;line-height:1.5rem;max-height:2rem;max-width:2rem;min-height:2rem;overflow:hidden;padding:.25rem .5rem;position:absolute;right:1.25rem;top:.25rem;white-space:nowrap}.fr-alert .fr-btn--close:before{--icon-size:1rem;background-color:currentColor;content:"";display:inline-block;flex:0 0 auto;height:var(--icon-size);margin-left:0;margin-right:.5rem;-webkit-mask-image:url(../../icons/system/close-line.svg);mask-image:url(../../icons/system/close-line.svg);-webkit-mask-size:100% 100%;mask-size:100% 100%;vertical-align:calc((.75em - var(--icon-size))*.5);width:var(--icon-size)}.fr-alert+.fr-alert{margin-top:1rem}.fr-alert--info:before{-webkit-mask-image:url(../../icons/system/fr--info-fill.svg);mask-image:url(../../icons/system/fr--info-fill.svg)}.fr-alert--success:before{-webkit-mask-image:url(../../icons/system/fr--success-fill.svg);mask-image:url(../../icons/system/fr--success-fill.svg)}.fr-alert--error:before{-webkit-mask-image:url(../../icons/system/fr--error-fill.svg);mask-image:url(../../icons/system/fr--error-fill.svg)}.fr-alert--warning:before{-webkit-mask-image:url(../../icons/system/fr--warning-fill.svg);mask-image:url(../../icons/system/fr--warning-fill.svg)}.fr-alert--error:before,.fr-alert--info:before,.fr-alert--success:before,.fr-alert--warning:before{content:""}.fr-alert--sm{padding:.5rem 2.25rem .25rem 3rem}.fr-alert--sm:before{margin:.5rem}.fr-alert .fr-link--close{align-items:center;font-size:.875rem;line-height:1.5rem;max-height:2rem;max-width:2rem;min-height:2rem;overflow:hidden;padding:.25rem .5rem;position:absolute;right:1.25rem;top:.25rem;white-space:nowrap}.fr-alert .fr-link--close:before{--icon-size:1rem;background-color:currentColor;content:"";display:inline-block;flex:0 0 auto;height:var(--icon-size);margin-left:0;margin-right:.5rem;-webkit-mask-image:url(../../icons/system/close-line.svg);mask-image:url(../../icons/system/close-line.svg);-webkit-mask-size:100% 100%;mask-size:100% 100%;vertical-align:calc((.75em - var(--icon-size))*.5);width:var(--icon-size)}.fr-alert--info{box-shadow:inset 0 0 0 1px var(--border-plain-info),inset 2.5rem 0 0 0 var(--background-flat-info)}.fr-alert--error{box-shadow:inset 0 0 0 1px var(--border-plain-error),inset 2.5rem 0 0 0 var(--background-flat-error)}.fr-alert--success{box-shadow:inset 0 0 0 1px var(--border-plain-success),inset 2.5rem 0 0 0 var(--background-flat-success)}.fr-alert--warning{box-shadow:inset 0 0 0 1px var(--border-plain-warning),inset 2.5rem 0 0 0 var(--background-flat-warning)}@media (min-width:36em){
  /*! media sm */
  /*! media sm */}@media (min-width:48em){
  /*! media md */.fr-alert__title{font-size:1.25rem;line-height:1.75rem}
  /*! media md */}@media (min-width:62em){
  /*! media lg */
  /*! media lg */}@media (min-width:78em){
  /*! media xl */
  /*! media xl */}@media (-ms-high-contrast:active),(-ms-high-contrast:none){.fr-alert:after,.fr-alert:before{background-color:transparent;background-repeat:no-repeat;background-size:100%;height:1.5rem;width:1.5rem}.fr-alert p,.fr-alert__title{margin:0 0 .25rem}.fr-alert--info:before{background-image:url(../../icons/system/fr--info-fill.svg)}.fr-alert--success:before{background-image:url(../../icons/system/fr--success-fill.svg)}.fr-alert--error:before{background-image:url(../../icons/system/fr--error-fill.svg)}.fr-alert--warning:before{background-image:url(../../icons/system/fr--warning-fill.svg)}.fr-alert .fr-btn--close:after,.fr-alert .fr-btn--close:before,.fr-alert .fr-link--close:after,.fr-alert .fr-link--close:before{background-color:transparent;background-image:url(../../icons/system/close-line.svg);background-repeat:no-repeat;background-size:100%;height:1rem;width:1rem}.fr-alert{box-shadow:inset 0 0 0 1px #3a3a3a,inset 2.5rem 0 0 0 #3a3a3a}.fr-alert:before{color:#fff}.fr-alert--info{box-shadow:inset 0 0 0 1px #0063cb,inset 2.5rem 0 0 0 #0063cb}.fr-alert--error{box-shadow:inset 0 0 0 1px #ce0500,inset 2.5rem 0 0 0 #ce0500}.fr-alert--success{box-shadow:inset 0 0 0 1px #18753c,inset 2.5rem 0 0 0 #18753c}.fr-alert--warning{box-shadow:inset 0 0 0 1px #b34000,inset 2.5rem 0 0 0 #b34000}}