Content Delivery Network
La présente charte est soumise à une autorisation.
Veuillez contacter la Direction des Systèmes d'Information support@uca.fr
CSS // Nouvelle charte graphique beta

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.2.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.


CSS // Bootstrap custom UCA
<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>

CSS // Description de la charte grahique UCA
<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">

  • Button to scroll to the top (or anywhere)

<link rel="stylesheet" type="text/css" href="css/uca.min.20201208.css">

  • Local Google fonts

<link rel="stylesheet" type="text/css" href="css/uca.min.20200708.css">

  • Checkbox disabled (colors)
  • Fix check effect for animated buttons

<link rel="stylesheet" type="text/css" href="css/uca.min.20181030.css">

  • Ajout de nouvelles tailles de cartes ('05','10','15','20','25','30','35','40','45','50','60','70','75','80','90','100')
  • Correction d'un problème d'affichage après le fade out d'un "toast"
  • Ajout d'un placement right beta

<link rel="stylesheet" type="text/css" href="css/uca.min.20180418.css">

  • .columns légèrement modifié
  • Correction du button download sur certains navigateurs
  • Correction sur la poup-info beta
  • Input avec l'attribut disabled modifié

<link rel="stylesheet" type="text/css" href="css/uca.min.20180306.css">

  • .columns a changé pour s'adapter à tout l'espace alloué
  • Nouvelles options pour les cards avec l'example des petites annonces sur l'ENT
  • Ajout du grey, grey-light et uca-blue dans les .color-*

<link rel="stylesheet" type="text/css" href="css/uca.min.20171103.css">

  • Champs textes et boutons
  • Divers bugs

<link rel="stylesheet" type="text/css" href="css/uca.min.20171017.css">

  • Boutons de couleurs supplémentaires, renommage de certaines classes
  • Tables
  • Divers bugs

<link rel="stylesheet" type="text/css" href="css/uca.min.20171013.css">

  • Ajout de couleurs supplémentaires
  • Card block
  • Divers bugs

<link rel="stylesheet" type="text/css" href="css/uca.min.20170901.css">

Première mouture appliqué sur l'ENT et quelques portlets esup:

  • Codes couleurs
  • Fonts officiels UCA
  • Définition des balises H*
  • Boutons UCA
  • Listes et paragraphes
  • Cards, widgets
  • Alerts
  • Tabs
  • Popups
  • Checkbox

ENT // NEW MENU beta

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:

<!-- OPTIONNEL -->
<!-- Dans la balise <head> si vous avez beaucoup de ressources à charger dans votre application-->
<link rel="preload" as="style" href="https://cdn.uca.fr/menu/css/app.css">
<link rel="preload" as="script" href="https://cdn.uca.fr/menu/js/app.js">
<link rel="preload" as="script" href="https://cdn.uca.fr/menu/js/chunk-vendors.js">

<!-- OBLIGATOIRE -->
<!-- Dans la balise <head> -->
<link href="https://cdn.uca.fr/menu/css/app.css" rel="stylesheet">
<!-- A la fin du <body> -->
<script defer src="https://cdn.uca.fr/menu/js/app.js"></script>
<script defer src="https://cdn.uca.fr/menu/js/chunk-vendors.js"></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-opener-class="active"          <!-- La classe à activer sur votre bouton si le menu est ouvert -->
  data-top="50"                       <!-- Sa position haute -->
  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 -->

ENT // MENU

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;
}