4.6.1 getCssReferences

La méthode getCssReferences() retourne une liste de fichiers css à inclure.

string[] getCssReferences(string $transitionId)

Le tableau retourné doit être indexé. L'index identifie le fichier. Le fichier css est ajouté lors de l'affichage de la transition. Il est supprimé lorsque le formulaire est effacé.

L'élément DOM de plus haut niveau est de la classe dcpTransition. Chaque section a sa propre classe comme indiqué dans la méthode \Dcp\Ui\TransitionRender::getTemplates.

De plus, l'élément de haut niveau possède les attributs data-transition et data-state qui contiennent respectivement l'identifiant de la transition et l'identifiant de l'étape suivante. Ces éléments permettent de cibler précisément la transition voulue avec une feuille de style générale.

Le fichier css inséré étant applicable sur l'ensemble du document, il est recommandé de cibler les éléments fils de la classe dcpTransition.

4.6.1.0.1 Exemples

• Mettre un fond orange sur le formulaire.

  ZOO/Layout/customTransition.css

  .dcpTransition {
      background-color: orange;
  }

  namespace My;
  class CustomRender extends \Dcp\Ui\TransitionRender {
       public function getCssReferences($transitionId) {
          return array(
              "customTransition" => "ZOO/Layout/customTransition.css"
          );
      }
  }

Les fichier css ajoutés ne sont pas enlevés lorsque la fenêtre de transition se ferme. Il sont par contre enlevés lorsqu'on charge un autre document ou un autre rendu.