nice-metropole: add cell-small-title class for cell (#89452)

static/includes/_cells.scss

@@ -832,3 +832,9 @@ div.gallerycell {
  div.links-list ul > li.latest-page-updates-cell--item a {
 	display: block;
 }
+
+div.notifications-cell li.combo-notification:not(.combo-notification-acked) {
+	&, & > a {
+		font-weight: bolder;
+	}
+}

static/includes/_forms.scss

@@ -232,7 +232,7 @@ div.buttons div {
 	@extend %button;
 	background-color: $button-color;
 	color: $button-background;
-	@if (extract-color($button-border) == transparent) 
+	@if (type-of($button-border) == color and extract-color($button-border) == transparent) 
 		and (lightness($button-color) > 90%) {
 		border: 1px solid $button-background;
 	} @else {

static/includes/_layout.scss

@@ -34,6 +34,12 @@ html, body {
 	min-height: 100vh;
 }
 
+@if variable-exists(primary-color) {
+	html {
+		--primary-color: #{$primary-color};
+	}
+}
+
 div#page {
 	display: flex;
 	min-height: 100vh;
@@ -238,11 +244,6 @@ div#main-content {
 }
 
 body.pk-mini-page {
-	@if variable-exists(primary-color) {
-		--primary-color: #{$primary-color};
-	} @else {
-		--primary-color: #ccc;
-	}
 	margin: 0;
 	padding: 0;
 	background: #F2F2F2;
@@ -260,34 +261,4 @@ body.pk-mini-page {
 	.pk-mini-page--content {
 		padding: 1em
 	}
-	.loader {
-		margin: 2em auto;
-		width: 40px;
-		height: 30px;
-		aspect-ratio: 1;
-		--c: linear-gradient(var(--primary-color) 0 0);
-		--r1: radial-gradient(farthest-side at bottom, var(--primary-color) 93%, var(--primary-color));
-		--r2: radial-gradient(farthest-side at top   , var(--primary-color) 93%, var(--primary-color));
-		background: var(--c), var(--r1), var(--r2), var(--c), var(--r1), var(--r2), var(--c), var(--r1), var(--r2);
-		background-repeat: no-repeat;
-		animation: l2 1s infinite alternate;
-	}
-	@keyframes l2 {
-		0%,25% {
-			background-size: 8px 0, 8px 4px, 8px 4px, 8px 0, 8px 4px, 8px 4px, 8px 0, 8px 4px, 8px 4px;
-			background-position: 0 50%, 0 calc(50% - 2px), 0 calc(50% + 2px), 50% 50%, 50% calc(50% - 2px), 50% calc(50% + 2px), 100% 50%, 100% calc(50% - 2px), 100% calc(50% + 2px);
-		}
-		50% {
-			background-size: 8px 100%, 8px 4px, 8px 4px, 8px 0, 8px 4px, 8px 4px, 8px 0, 8px 4px, 8px 4px;
-			background-position: 0 50%, 0 calc(0% - 2px), 0 calc(100% + 2px), 50% 50%, 50% calc(50% - 2px), 50% calc(50% + 2px), 100% 50%, 100% calc(50% - 2px), 100% calc(50% + 2px);
-		}
-		75% {
-			background-size: 8px 100%, 8px 4px, 8px 4px, 8px 100%, 8px 4px, 8px 4px, 8px 0, 8px 4px, 8px 4px;
-			background-position: 0 50%, 0 calc(0% - 2px), 0 calc(100% + 2px), 50% 50%, 50% calc(0% - 2px), 50% calc(100% + 2px), 100% 50%, 100% calc(50% - 2px), 100% calc(50% + 2px);
-		}
-		95%,100% {
-			background-size: 8px 100%, 8px 4px,  8px 4px, 8px 100%, 8px 4px, 8px 4px, 8px 100%, 8px 4px, 8px 4px;
-			background-position: 0 50%, 0 calc(0% - 2px), 0 calc(100% + 2px), 50% 50%, 50% calc(0% - 2px), 50% calc(100% + 2px), 100% 50%, 100% calc(0% - 2px), 100% calc(100% + 2px);
-		}
-	}
 }

static/includes/_misc.scss

@@ -847,3 +847,35 @@ div.leaflet-bottom, div.leaflet-top {
 .leaflet-attribution-flag {
 	display: none !important;
 }
+
+.loader {
+	--loader-color: var(--primary-color, black);
+	margin: 2em auto;
+	width: 40px;
+	height: 30px;
+	aspect-ratio: 1;
+	--c: linear-gradient(var(--loader-color) 0 0);
+	--r1: radial-gradient(farthest-side at bottom, var(--loader-color) 93%, var(--loader-color));
+	--r2: radial-gradient(farthest-side at top   , var(--loader-color) 93%, var(--loader-color));
+	background: var(--c), var(--r1), var(--r2), var(--c), var(--r1), var(--r2), var(--c), var(--r1), var(--r2);
+	background-repeat: no-repeat;
+	animation: l2 1s infinite alternate;
+}
+@keyframes l2 {
+	0%,25% {
+		background-size: 8px 0, 8px 4px, 8px 4px, 8px 0, 8px 4px, 8px 4px, 8px 0, 8px 4px, 8px 4px;
+		background-position: 0 50%, 0 calc(50% - 2px), 0 calc(50% + 2px), 50% 50%, 50% calc(50% - 2px), 50% calc(50% + 2px), 100% 50%, 100% calc(50% - 2px), 100% calc(50% + 2px);
+	}
+	50% {
+		background-size: 8px 100%, 8px 4px, 8px 4px, 8px 0, 8px 4px, 8px 4px, 8px 0, 8px 4px, 8px 4px;
+		background-position: 0 50%, 0 calc(0% - 2px), 0 calc(100% + 2px), 50% 50%, 50% calc(50% - 2px), 50% calc(50% + 2px), 100% 50%, 100% calc(50% - 2px), 100% calc(50% + 2px);
+	}
+	75% {
+		background-size: 8px 100%, 8px 4px, 8px 4px, 8px 100%, 8px 4px, 8px 4px, 8px 0, 8px 4px, 8px 4px;
+		background-position: 0 50%, 0 calc(0% - 2px), 0 calc(100% + 2px), 50% 50%, 50% calc(0% - 2px), 50% calc(100% + 2px), 100% 50%, 100% calc(50% - 2px), 100% calc(50% + 2px);
+	}
+	95%,100% {
+		background-size: 8px 100%, 8px 4px,  8px 4px, 8px 100%, 8px 4px, 8px 4px, 8px 100%, 8px 4px, 8px 4px;
+		background-position: 0 50%, 0 calc(0% - 2px), 0 calc(100% + 2px), 50% 50%, 50% calc(0% - 2px), 50% calc(100% + 2px), 100% 50%, 100% calc(0% - 2px), 100% calc(100% + 2px);
+	}
+}

static/landes-cd40/config.json

@@ -134,6 +134,12 @@
               "url": "{{ passerelle_url }}proxy/transmlph/request/api_publik.php?sub={{ user_nameid }}",
               "cache_duration": 5,
               "log_errors": false
+            },
+            {
+              "key": "aiden",
+              "url": "{{ passerelle_url }}mgdis/aiden/demands/NameID={{ user|user_id_for_service:\"mgdis\" }}",
+              "cache_duration": 5,
+              "log_errors": false
             }
           ]
         }

static/nice-metropole/_custom.scss

@@ -30,8 +30,8 @@
 		&::after {
 			content: "";
 			display: block;
-			height: 3px;
-			width: 100px;
+			height: 2px;
+			width: 50px;
 			background-color: currentColor;
 			margin-top: 1rem;
 		}
@@ -59,6 +59,23 @@
 	}
 }
 
+@supports (mask-size: contain) {
+	a.external-link {
+		&::after {
+			content: "";
+			display: inline-block;
+			width: 0.625em;
+			height: 0.625em;
+			transform: translateY(-0.25em);
+			background-color: currentColor;
+			margin-left: 0.25em;
+			mask-image: url(img/icon-lien-externe.svg);
+			mask-size: contain;
+		}
+	}
+}
+
+
 //
 //	BUTTONS
 //
@@ -148,6 +165,52 @@
 	}
 }
 
+//
+// Detail / summary / for FAQ
+//
+
+details {
+	background-color: $gray-xlight;
+	padding: 1em;
+	padding-left: 3em;
+	border: 1px solid transparent;
+}
+summary {
+	display: block;
+	color: $blue;
+	font-weight: 500;
+	font-size: $fz-3;
+	list-style-position: outside;
+	position: relative;
+
+	&:hover {
+		cursor: pointer;
+	}
+
+	&::before {
+		content: "+";
+		font-size: $fz-2;
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		right: calc(100% + .33em);
+		font-weight: 600;
+		margin: auto;
+		line-height: 1;
+		height: 1em;
+	}
+}
+
+details[open] {
+		border-color: $blue;
+		summary::before {
+			content: "-";
+		}
+}
+
+details + details {
+	margin-top: 0.5em;
+}
 
 //
 //	LAYOUT
@@ -208,10 +271,10 @@ $top-mobile-height : calc( #{nth($header-logo-size, 2)} + 2rem);
 		border: 2px solid transparent;
 		@media ($min-desktop-viewport) {
 			&:not(.account-link) {
-				color: hsla(0, 0%, 100%, 0.85);
+				color: white;
 				background-color: $red;
 				&:hover, &:focus	 {
-					color: white;
+					color: hsla(0, 0%, 100%, 0.85);
 					text-decoration: none;
 				}
 				&:focus-visible {
@@ -272,11 +335,11 @@ $top-mobile-height : calc( #{nth($header-logo-size, 2)} + 2rem);
 			&::after {
 				content: "";
 				display: block;
-				height: 3px;
+				height: 2px;
 				width: 25px;
 				background-color: currentColor;
 				margin-top: 1rem;
-				transition: width 400ms;
+				transition: width 200ms;
 			}
 		}
 		&--item {
@@ -447,6 +510,13 @@ main {
 		}
 	}
 }
+.cell-small-title {
+	&%cell {
+		h2:first-child {
+			@extend .h3;
+		}
+	}	
+}
 .cell-blue-border {
 	&%cell {
 		border: 1px solid $blue;
@@ -455,7 +525,6 @@ main {
 .cell-gray {
 	&%cell {
 		background-color: $gray-xlight;
-		@extend .cell-blue-title;
 	}
 }
 .cell-list {

static/nice-metropole/img/icon-lien-externe.svg

@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="10.917" height="10.875" version="1.1" xmlns="http://www.w3.org/2000/svg">
+ <path d="m7.3965-0.0039062c-0.75743 0.083867-0.78129 1.2741-0.024829 1.3844 0.37655 0.014477 0.75641 0.0020737 1.1342 0.0062072l-3.3262 3.3262c-0.45043 0.46838 0.090657 1.3578 0.71057 1.1372 0.38072-0.16491 0.61551-0.53756 0.92252-0.80544l2.6677-2.6677c0.015956 0.41626-0.035051 0.83948 0.031728 1.2506 0.14547 0.5373 0.94137 0.66346 1.2428 0.19339 0.22367-0.35422 0.09588-0.79193 0.12974-1.1876-0.0088-0.69221 0.01814-1.3867-0.01443-2.0774-0.0766-0.43242-0.53662-0.61441-0.93101-0.55988-0.84755-2.734e-5 -1.6955 5.468e-5 -2.5428-4.1e-5zm-6.1152 1.291c-0.74639-0.02059-1.3694 0.70202-1.2812 1.4351 0.0043341 2.3338-0.0086791 4.6682 0.0065255 7.0016 0.055558 0.71023 0.76417 1.2388 1.4593 1.1511 2.2067-0.0056 4.4141 0.01133 6.6203-0.0086 0.90249-0.07114 1.5993-0.95881 1.5017-1.8499-0.0014857-1.3228 0.0029742-2.6457-0.0022346-3.9684-0.010837-0.61323-0.88952-0.84211-1.241-0.37322-0.189 0.26505-0.14125 0.49316-0.14736 0.79603v3.7323c-0.034341 0.38614-0.47654 0.25665-0.74097 0.2793h-6.0656v-6.8047h4.3789c0.50912 0.053954 0.92301-0.71072 0.5293-1.1484-0.33597-0.36911-0.86724-0.20559-1.3066-0.24219-1.237 5.3e-6 -2.4741-1.07e-5 -3.7111 8e-6z"/>
+</svg>

templates/variants/landes-cd40/combo/json/department-demands.html

@@ -2,12 +2,12 @@
   <h2 class="cell--title">{{ title }}</h2>
 {% endif %}
 
-{% if json.err and extranet.err and transmlph.err %}
+{% if json.err and extranet.err and transmlph.err and aiden.err %}
   <div class="cell--body">
     <p class="empty-message">Informations indisponibles.</p>
   </div>
 {% else %}
-  {% with json.data|add:extranet.data|add:transmlph.data as data %}
+  {% with json.data|add:extranet.data|add:transmlph.data|add:aiden.data as data %}
     {% if data %}
       <div class="links-list current-forms list-of-forms">
         <ul>