<commit_before>@charset "UTF-8";
// == a11y.css
//
// @author <NAME>
// @lastmodified 2013-11-27
// @subsection Références :
  // @see https://github.com/redroot/holmes/blob/master/holmes.css
  // @see https://github.com/karlgroves/diagnostic.css
  // @see http://www.w3.org/TR/html5/obsolete.html#obsolete
  // @see https://github.com/nternetinspired/debug-css
  // @see Mémento «Sites web — Les bonnes pratiques» aux éditions Eyrolles
  // @author <NAME>, Temesis, Opquast, Openweb — @ElieSl
  // @see "Intégration Web, les bonnes pratiques", pages 335/336.
  // @author <NAME>, Inseo — @schillinger
// @note On utilise outline plutôt que border afin de ne pas modifier les dimensions des éléments.
// @note Le rouge dénonce une erreur, un code invalide ou un attribut manquant.
// @note Le jaune est une alerte, relevant un balisage erroné ou une mauvaise pratique potentielle.
// @note Le gris signale les éléments obsolètes ou utilisant un attribut obsolète.
// @note Le vert informe d’une amélioration éventuelle.
//


// ----------------------------- //
// Sommaire */
// ----------------------------- //

//
// == Import des sélecteurs
// == Variables, Mixins & Placeholders
//   -- Variables
//   -- Mixins
//   -- Placeholders
// == Détection des conseils
// == Détection des éléments & attributs obsolètes
// == Détection des alertes
// == Détection des erreurs
// == Self-closing
// == Contenu des messages
//


// == @section Import des sélecteurs ====================
@import "selectors/advice";
@import "selectors/obsolete";
@import "selectors/warning";
@import "selectors/error";
@import "selectors/self-closing";


// == @section Variables, Mixins & Placeholders ====================

// -- @subsection Variables --------------------
$error: crimson;
$warning: gold;
$obsolete: gray;
$advice: forestgreen;

$error-ico: \2620\00A0;
$warning-ico: \2622\00A0;
$obsolete-ico: \271D\00A0;
$advice-ico: \2665\00A0;

// -- @subsection Mixins --------------------
@mixin a11y-outline( $level ) {
  outline: 4px solid transparentize( $level, .25 ) !important;
  // @note Astuce suggérée par @7studio pour garantir un affichage homogène des bordures.
  // @see https://github.com/ffoodd/a11y.css/issues/4
  outline-offset: -4px;

  &::after {
    // @note Ceci est basé sur la valeur maximum d’un z-index pour la plupart des navigateurs.
    // @note Si la valeur renseignée est supérieure, les navigateurs la réduise jusqu’à celle-ci.
    // @see http://www.puidokas.com/max-z-index/
    // @note Ça nous permet de garantir que notre message sera toujours visible, et que les plus importants apparaitront en premier.
    @if $level == forestgreen {
      z-index: 2147483644 !important;
    } @else if $level == gray {
      z-index: 2147483645 !important;
    } @else if $level == gold {
      z-index: 2147483646 !important;
    } @else if $level == crimson {
      z-index: 2147483647 !important;
    }
  }
}

// -- @subsection Placeholders --------------------
%a11y-after {
  background: rgba( 255, 255, 255, .98 ) !important;
  border: 1px solid rgba( 0, 0, 0, .3 ) !important;
  color: dimgray !important;
  display: block !important;
  font: normal normal 1rem/1.5 monospace !important;
  height: auto !important;
  left: 0 !important;
  opacity: 0;
  padding: 1em 0;
  // On s’assure que le message ne capte pas le survol.
  pointer-events: none !important;
  position: fixed !important;
  // On fait en sorte de ne pas hériter des mises en formes spéciales: les messages doivent être homogènes.
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: none !important;
  text-transform: none !important;<commit_msg>Z-index dans une variable<commit_after>@charset "UTF-8";
// == a11y.css
//
// @author <NAME>
// @lastmodified 2013-11-27
// @subsection Références :
  // @see https://github.com/redroot/holmes/blob/master/holmes.css
  // @see https://github.com/karlgroves/diagnostic.css
  // @see http://www.w3.org/TR/html5/obsolete.html#obsolete
  // @see https://github.com/nternetinspired/debug-css
  // @see Mémento «Sites web — Les bonnes pratiques» aux éditions Eyrolles
  // @author <NAME>, Temesis, Opquast, Openweb — @ElieSl
  // @see "Intégration Web, les bonnes pratiques", pages 335/336.
  // @author <NAME>, Inseo — @schillinger
// @note On utilise outline plutôt que border afin de ne pas modifier les dimensions des éléments.
// @note Le rouge dénonce une erreur, un code invalide ou un attribut manquant.
// @note Le jaune est une alerte, relevant un balisage erroné ou une mauvaise pratique potentielle.
// @note Le gris signale les éléments obsolètes ou utilisant un attribut obsolète.
// @note Le vert informe d’une amélioration éventuelle.
//


// ----------------------------- //
// Sommaire */
// ----------------------------- //

//
// == Import des sélecteurs
// == Variables, Mixins & Placeholders
//   -- Variables
//   -- Mixins
//   -- Placeholders
// == Détection des conseils
// == Détection des éléments & attributs obsolètes
// == Détection des alertes
// == Détection des erreurs
// == Self-closing
// == Contenu des messages
//


// == @section Import des sélecteurs ====================
@import "selectors/advice";
@import "selectors/obsolete";
@import "selectors/warning";
@import "selectors/error";
@import "selectors/self-closing";


// == @section Variables, Mixins & Placeholders ====================

// -- @subsection Variables --------------------
$error: crimson;
$warning: gold;
$obsolete: gray;
$advice: forestgreen;

$error-ico: \2620\00A0;
$warning-ico: \2622\00A0;
$obsolete-ico: \271D\00A0;
$advice-ico: \2665\00A0;

$max-z-index: 2147483647;

// -- @subsection Mixins --------------------
@mixin a11y-outline( $level ) {
  outline: 4px solid transparentize( $level, .25 ) !important;
  // @note Astuce suggérée par @7studio pour garantir un affichage homogène des bordures.
  // @see https://github.com/ffoodd/a11y.css/issues/4
  outline-offset: -4px;

  &::after {
    // @note Ceci est basé sur la valeur maximum d’un z-index pour la plupart des navigateurs.
    // @note Si la valeur renseignée est supérieure, les navigateurs la réduise jusqu’à celle-ci.
    // @see http://www.puidokas.com/max-z-index/
    // @note Ça nous permet de garantir que notre message sera toujours visible, et que les plus importants apparaitront en premier.
    @if $level == forestgreen {
      z-index: $max-z-index - 3 !important;
    } @else if $level == gray {
      z-index: $max-z-index - 2 !important;
    } @else if $level == gold {
      z-index: $max-z-index - 1 !important;
    } @else if $level == crimson {
      z-index: $max-z-index     !important;
    }
  }
}

// -- @subsection Placeholders --------------------
%a11y-after {
  background: rgba( 255, 255, 255, .98 ) !important;
  border: 1px solid rgba( 0, 0, 0, .3 ) !important;
  color: dimgray !important;
  display: block !important;
  font: normal normal 1rem/1.5 monospace !important;
  height: auto !important;
  left: 0 !important;
  opacity: 0;
  padding: 1em 0;
  // On s’assure que le message ne capte pas le survol.
  pointer-events: none !important;
  position: fixed !important;
  // On fait en sorte de ne pas hériter des mises en formes spéciales: les messages doivent être homogènes.
  text-align: center !important;
  text-decoration: none !important;
  text-shadow: none !important;
  text-transform: none !important;
{'fraction_non_alphanumeric': 0.17296491940945416, 'fraction_numerical': 0.029120953541920628, 'mean_word_length': 2.8639455782312924, 'pattern_counts': {'":': 0, '<': 9, '<?xml version=': 0, '>': 9, 'https://': 8, 'lorem ipsum': 0, 'www.': 4, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2419901', 'n_tokens_mistral': 2635, 'n_tokens_neox': 2488, 'n_words': 749}