From 0c546047ff2b15d9ebc93f9f4767f6b25fec4383 Mon Sep 17 00:00:00 2001
From: Emmanuel Cazenave <ecazenave@entrouvert.com>
Date: Tue, 10 Jul 2018 10:55:40 +0200
Subject: [PATCH] rouen: customize user-info zone (#25153)

---
 static/rouen/_custom.scss                     | 50 ++++++++++++++++++-
 static/rouen/_vars.scss                       |  4 +-
 static/rouen/img/picto_btn_connexion.svg      | 14 ++++++
 .../variants/rouen/authentic2/accounts.html   | 16 ++++++
 .../variants/rouen/combo/page_template.html   | 19 +++++++
 5 files changed, 100 insertions(+), 3 deletions(-)
 create mode 100644 static/rouen/img/picto_btn_connexion.svg
 create mode 100644 templates/variants/rouen/authentic2/accounts.html
 create mode 100644 templates/variants/rouen/combo/page_template.html

diff --git a/static/rouen/_custom.scss b/static/rouen/_custom.scss
index 318973a..65e9306 100644
--- a/static/rouen/_custom.scss
+++ b/static/rouen/_custom.scss
@@ -38,8 +38,8 @@ div#footer > div > div > div {
 }
 
 div#footer div#footer-logos {
-	background: $primary-color;
 	@include flex(1);
+	background: $primary-color;
 	margin: 0 0.4em 0 0;
 	padding: 2em 0 2em 0;
 	@media screen and (max-width: $custom-very-small-screen) {
@@ -101,10 +101,10 @@ div#footer div#footer-logos {
 }
 
 div#footer div#footer-content {
+	@include flex(3);
 	background: $primary-color;
 	padding: 2em 2em 2em 2em;
 	border: 0;
-	@include flex(3);
 	font-size: 100%;
 	font: inherit;
 	vertical-align: baseline;
@@ -239,3 +239,49 @@ div#nav #nav-button.toggled + ul li {
 		}
 	}
 }
+
+div#toplinks {
+	border: none;
+	border-radius: 0;
+	box-shadow: none;
+	margin-top: 0.5em;
+	padding: 0;
+	right: 0.2em;
+	a.login,a.logout {
+		@include flexbox();
+		@include vendor-prefix(justify-content, flex-end);
+		div.logtext {
+			background: $primary-color;
+			color: $black;
+			font-size: 122%;
+			font-weight: 700;
+			height: 2em;
+			padding: 0 0.5em;
+			text-align: center;
+			line-height: 2em;
+		}
+		div.logicon {
+			background-color: $black;
+			background-image: url(img/picto_btn_connexion.svg);
+			background-position: center;
+			background-repeat: no-repeat;
+			background-size: 70%;
+			content: "";
+			width: 2em;
+		}
+	}
+	a.registration {
+		@include flexbox();
+		@include vendor-prefix(justify-content, flex-end);
+		color: $red;
+		font-weight: 500;
+		margin-top: 0.4em;
+		span.pre-register {
+			color: $light-black;
+			margin-right: 0.2em;
+		}
+		span.register {
+			text-decoration: underline;
+		}
+	}
+}
diff --git a/static/rouen/_vars.scss b/static/rouen/_vars.scss
index f7fd4d6..588cdf3 100644
--- a/static/rouen/_vars.scss
+++ b/static/rouen/_vars.scss
@@ -1,6 +1,8 @@
 $black: #000;
+$light-black: #333;
 $pale-primary-color: #F4A7AA;
 $primary-color: #EE787C;
+$red: #C64A59;
 $white: #FFF;
 
 $button-background: $primary-color;
@@ -25,4 +27,4 @@ $nav-mobile-menu-background: $pale-primary-color;
 $sidebar-width: 240px;
 $title-weight: bold;
 $width: 1243.97px;
-$custom-very-small-screen: 480px;
\ No newline at end of file
+$custom-very-small-screen: 480px;
diff --git a/static/rouen/img/picto_btn_connexion.svg b/static/rouen/img/picto_btn_connexion.svg
new file mode 100644
index 0000000..f34ed2d
--- /dev/null
+++ b/static/rouen/img/picto_btn_connexion.svg
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="516.4px" height="516.4px" viewBox="-39 162.5 516.4 516.4" style="enable-background:new -39 162.5 516.4 516.4;"
+	 xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#EE787C;}
+</style>
+<g>
+	<path class="st0" d="M137.9,225.8c-44.9,44.9-44.9,117.6,0,162.5c9.6,9.6,21,17.2,33.5,23.9l0,200.8l47.8,47.8L267,613l-28.7-28.7
+		l28.7-28.7L238.3,527l28.7-28.7v-86c11.5-5.7,22.9-13.4,33.5-23.9c44.9-44.9,44.9-117.6,0-162.5S182.9,180.9,137.9,225.8z
+		 M247.9,288c-16.3,16.3-41.1,16.3-57.4,0c-16.3-16.3-16.3-41.1,0-57.4s41.1-16.3,57.4,0S264.1,271.7,247.9,288z"/>
+</g>
+</svg>
diff --git a/templates/variants/rouen/authentic2/accounts.html b/templates/variants/rouen/authentic2/accounts.html
new file mode 100644
index 0000000..a41aeb4
--- /dev/null
+++ b/templates/variants/rouen/authentic2/accounts.html
@@ -0,0 +1,16 @@
+{% extends "../../authentic2/accounts.html" %}
+
+{% block user-info %}
+          {% if user.is_authenticated %}
+          <a accesskey="o" class="logout" href="{% url 'auth_logout' %}"><div class="logtext">D&eacute;connexion</div><div class="logicon"></div></a>
+            {% if idp_account_url %}<a class="registration" href="{{idp_account_url}}">{% endif %}
+            <span>{{user.first_name}} {{user.last_name}}</span>{% if idp_account_url %}</a>{% endif %}
+          {% else %}
+            {% if idp_registration_url %}
+             <a accesskey="2" class="login" href="{% url 'auth_login' %}"><div class="logtext">Connexion</div><div class="logicon"></div></a>
+             <a class="registration" href="{{idp_registration_url}}"><span class="pre-register">Pas de compte ?</span><span class="register">Enregistrez vous !</span></a>
+            {% else %}
+            <a accesskey="2" class="registration" href="{% url 'auth_login' %}">Connexion <span class="sep">/</span> Inscription</a>
+            {% endif %}
+          {% endif %}
+{% endblock %}
diff --git a/templates/variants/rouen/combo/page_template.html b/templates/variants/rouen/combo/page_template.html
new file mode 100644
index 0000000..1cac0cf
--- /dev/null
+++ b/templates/variants/rouen/combo/page_template.html
@@ -0,0 +1,19 @@
+{% extends "../../combo/page_template.html" %}
+{% load combo %}
+
+{% block user-info %}
+{% skeleton_extra_placeholder user-info %}
+          {% if user.is_authenticated %}
+          <a accesskey="o" class="logout" href="{% url 'auth_logout' %}"><div class="logtext">D&eacute;connexion</div><div class="logicon"></div></a>
+            {% if idp_account_url %}<a class="registration" href="{{idp_account_url}}">{% endif %}
+            <span>{{user.first_name}} {{user.last_name}}</span>{% if idp_account_url %}</a>{% endif %}
+          {% else %}
+            {% if idp_registration_url %}
+             <a accesskey="2" class="login" href="{% url 'auth_login' %}"><div class="logtext">Connexion</div><div class="logicon"></div></a>
+             <a class="registration" href="{{idp_registration_url}}"><span class="pre-register">Pas de compte ?</span><span class="register">Enregistrez vous !</span></a>
+            {% else %}
+            <a accesskey="2" class="registration" href="{% url 'auth_login' %}">Connexion <span class="sep">/</span> Inscription</a>
+            {% endif %}
+          {% endif %}
+{% end_skeleton_extra_placeholder %}
+{% endblock %}
-- 
2.18.0