Content Delivery Network Content Delivery Network
Vous accéderez à la toute nouvelle version de notre charte graphique basée sur le travail réalisé sur KSup et le site institutionnel de l'UCA au cours de l'année 2022.
Le framework intègre Bootstrap 5.3, et nous avons surchargé les classes que lorsque cela était nécessaire.
Le lien vous redirige vers une documentation ainsi que des exemples d'utilisation avec des options pour générer automatiquement des portions de code.
<link rel="stylesheet" type="text/css" href="css/bootstrap_uca.min.css">
Cette version est la dernière à jour !! Elle peut être utilisée pour les applications intégrant Bootstrap.
Créée à partir du site Boostrap Build et basée sur la version 4.3.0 du framework, nous avons apporté des retouches sur les couleurs principales et sur les formes.
Toute modification est possible en intégrant le fichier suivant import_variables.scss, il faut pour cela nous contacter.
Ne pas oublier pour utiliser les composants javascript d'inclure/télécharger les fichiers suivants:
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/uca.min.last.css">
Cette version est la dernière à jour !!
Elle est utilisée pour l'ENT et les sites qui intègrent pleinement la charte (peu ou pas de Bootstrap et autres frameworks css).
Elle comprend toutes les dernières modifications et correctifs apportés jusqu'à la dernière version datée ci-dessous.
<link rel="stylesheet" type="text/css" href="css/uca.min.20210204.css">
<link rel="stylesheet" type="text/css" href="css/uca.min.20201208.css">
<link rel="stylesheet" type="text/css" href="css/uca.min.20200708.css">
<link rel="stylesheet" type="text/css" href="css/uca.min.20181030.css">
<link rel="stylesheet" type="text/css" href="css/uca.min.20180418.css">
<link rel="stylesheet" type="text/css" href="css/uca.min.20180306.css">
<link rel="stylesheet" type="text/css" href="css/uca.min.20171103.css">
<link rel="stylesheet" type="text/css" href="css/uca.min.20171017.css">
<link rel="stylesheet" type="text/css" href="css/uca.min.20171013.css">
<link rel="stylesheet" type="text/css" href="css/uca.min.20170901.css">
Première mouture appliqué sur l'ENT et quelques portlets esup:
Pour intégrer le menu ENT UCA dans votre application, il suffit d'ajouter cet import de script:
<script async type="text/javascript" src="https://ent.uca.fr/core/menu.js"></script>
Les marges suivantes sont automatiquement appliquées afin de réserver l'espace nécessaire au menu:
body {
padding-top: 45px;
padding-left: 0px;
}
@media screen and (min-width: 768px) {
body {
/* to integrate left menu */
padding-left: 50px;
}
}
/* Vous pouvez surcharger ces valeurs dans votre feuille de style comme ceci */
body {
padding-top: 60px !important;
padding-left: 20px !important;
}
Le nouveau menu est en cours de développement, il est implémenté dans le site insitutionnel dans une forme dégradée. Pour pouvoir l'utiliser il faut intégrer les librairies suivantes:
<link href="https://cdn.uca.fr/menu/css/app.css" rel="preload" as="style">
<link href="https://cdn.uca.fr/menu/js/js/app.js" rel="preload" as="script">
<link href="https://cdn.uca.fr/menu/js/js/chunk-vendors.js" rel="preload" as="script">
Avec le composant <uca-menu>
<button id="myButton">Menu</button>
<!-- Votre bouton où vous souhaitez avoir le menu -->
<uca-menu
data-opener="myButton"
<!-- L'identifiation du bouton qui déclenchera le menu -->
data-top="40"
<!-- Sa position haute -->
data-toggle-class="active"
<!-- La classe à activer sur votre bouton si le menu est ouvert -->
data-client="CLIENT"
<!-- Le code client à demander à l'admnistrateur -->
data-connected="ENCRYPTED_USERNAME"
<!-- Le username encrypté, se renseigner auprès de l'administrateur -->
data-path-login="path_login"
<!-- Votre URL d'authentification -->
data-path-logout="path_logout">
<!-- Votre URL de déconnexion -->