0001-gers-cd32-simplify-as-a-native-theme-47562.patch

Nicolas Roche, 14 octobre 2020 00:15

Voir les différences: en ligne côte à côte

Subject: [PATCH] gers-cd32: simplify as a native theme (#47562)

 static/gers-cd32/_custom.scss                 | 259 ++++++------------
 static/gers-cd32/_vars.scss                   |  15 +-
 static/gers-cd32/config.json                  |  10 +-
 static/gers-cd32/img/csm_defaultImage.png     | Bin 17828 -> 0 bytes
 static/gers-cd32/img/logo.png                 | Bin 4382 -> 2668 bytes
 .../gers-cd32/combo/page_template.html        |  31 ---
 templates/variants/gers-cd32/theme.html       |  35 ---
 7 files changed, 95 insertions(+), 255 deletions(-)
 delete mode 100644 static/gers-cd32/img/csm_defaultImage.png
 delete mode 100644 templates/variants/gers-cd32/combo/page_template.html
 delete mode 100644 templates/variants/gers-cd32/theme.html

     @import '../includes/fonts/montserrat';
     @mixin form-icon($content) {
     	content: $content;
     	font-family: FontAwesome;
+    }
     $header-height: 400px;
     $mobile-header-height: 230px;
     div#header-pre {
     	display: flex;
     	flex-direction: row-reverse;
     	@media screen and (max-width: $my-tablet-limit) {
     		flex-direction: column;
     $header-border-height: 80px;
     $mobile-header-border-height: $nav-menu-side;
     body.has-header-background {
     	.site-header {
     		background: none;
+    	}
+    }
     div#bandeau {
     	width: calc(100% - 610px);
     	@media screen and (max-width: $my-tablet-limit) {
     		width: 100%;
     #header-wrapper {
     	background: url(/assets/header:background) center no-repeat;
     	@media screen and ($min-desktop-viewport) {
     		height: $header-height;
     		border-top: $header-border-height solid $primary-color;
+    	}
     	> img {
     		display: block;
     		height: auto;
     		max-width: 100%;
     		width: 100%;
     	@media screen and ($max-mobile-viewport) {
     		height: $mobile-header-height;
     		border-top: $mobile-header-border-height solid $primary-color;
     		background-size: cover;
+    	}
+    }
     div#contenu {
     	box-sizing: content-box;
     	display: flex;
     	flex-direction: column;
     	justify-content: space-between;
     	width: 550px;
     	max-width: 550px;
     	padding: 60px 0 0 60px;
     	div#logo-ville img {
     		width: 294;
     		height: 83;
+    	}
     	@media screen and (max-width: $my-tablet-limit) {
     		width: unset;
     		max-width: unset;
     		padding: 14px 0 0 20px;
     		div#logo-ville {
     			flex-grow: 1;
     			img {
     				width: 200px;
     				height: 56.45px;
+    			}
+    		}
     #header #top #logo {
     	position: absolute;
     	line-height: 1em;
     	margin-top: 10px;
     	padding-left: 0;
     	@media screen and ($min-desktop-viewport) {
     		top: -$header-border-height;
+    	}
     	@media screen and (max-width: $my-mobile-limit) {
     		padding-top: 17px;
     		div#logo-ville img {
     			width: 130px;
     			height: 36.7px;
+    		}
     	@media screen and ($max-mobile-viewport) {
     		top: -$mobile-header-border-height;
+    	}
     	div#contenu-top {
     		display: flex;
     		flex-direction: column;
     		justify-content: space-between;
     		height: 195px;
     		@media screen and (max-width: $my-tablet-limit) {
     			flex-direction: row;
     			flex-grow: 1;
     			height: 60px;
+    		}
     		@media screen and (max-width: $my-mobile-limit) {
     			flex-grow: 0;
+    		}
     		div#demarches {
     			display: flex;
     			flex-direction: row;
     			justify-content: space-between;
     			color: white;
     			width: auto;
     			padding: 23px 35px 23px 35px;
     			background-color: $primary-color;
     			span.gru-icon::after {
     				@include form-icon("\f046");
     				font-size: 1rem;
     				font-weight: 400;
+    			}
     			@media screen and (max-width: $my-tablet-limit) {
     				flex-grow: 2;
     				padding-top: 0.8em;
     				margin-bottom: 10px;
+    			}
     			@media screen and (max-width: $my-mobile-limit) {
     				flex-grow: 0;
     				width: 0px;
     				padding-left: 20px;
     				margin-right: $nav-place-holder-width;
     				span:first-child {
     					display: none;
+    				}
+    			}
     	a {
     		color: $secondary-color;
     		@media screen and ($min-desktop-viewport) {
     			text-indent: 150px;
+    		}
     		div#nav-place-holder {
     			display: none;
     			width: $nav-place-holder-width;
     			@media screen and (max-width: $my-tablet-limit) {
     				flex-grow: 1;
     				display: inherit;
+    			}
     			@media screen and (max-width: $my-mobile-limit) {
     				flex-grow: 0;
     				display: none;
+    			}
+    		}
+    	}
     	.logged-in, .login {
     		display: flex;
     		flex-direction: row;
     		justify-content: flex-end;
     		font-size: 0.8rem;
     		font-weight: 300;
     		padding-top: 2em;
     		padding-bottom: 74px;
     		padding-right: 50px;
     		@media screen and (max-width: $my-tablet-limit) {
     			padding: 0.8em 8px 0.8em;
     		@media screen and ($max-mobile-viewport) {
     			text-indent: -10000px;
+    		}
+    	}
+    }
     span.connected-user {
     	text-transform: uppercase;
     	font-weight: bold;
     	padding: 0 12px 0 4px;
     	font-weight: 600;
+    }
     a.account::after {
     	@include form-icon("\f013");
     	font-size: 0.95rem;
     	color: black;
     	border-style: solid;
     	border-width: 0 0 0 1px;
     	padding: 0 7px 0 7px;
     	border-color: black
+    }
     a.logout::after {
     	@include form-icon("\f011");
     	font-size: 0.95rem;
     	border-style: solid;
     	border-width: 0 0 0 1px;
     	padding: 0 7px 0 7px;
     	border-color: black
     #toplinks {
     	top: -$header-border-height;
     	background: transparent;
     	@media screen and ($max-mobile-viewport) {
     		top: -$header-border-height;
     		display: none;
+    	}
     	a {
     		color: white;
+    	}
+    }
     h1#logo {
     	display: none;
+    }
     body.has-picture nav::after {
     	display: none;
+    }
     div#nav-wrapper {
     	position: absolute;
     	top: 135px;
     	right: 15px;
     #nav-wrapper {
     	@media screen and ($max-mobile-viewport) {
     		margin: 0;
     		position: absolute;
     		right: 0;
     		top: $header-border-height;
     		z-index: 1;
+    	}
     	button {
     		position: absolute;
     		right: 4rem;
     		font-size: 0.7rem;
     		font-weight: 400;
     		padding-left: 50px;
     		color: $tertiary-color;
     		background: white;
     		@media screen and (max-width: $my-tablet-limit) {
     			top: -70px;
     			right: 40px;
+    		}
     		@media screen and (max-width: $my-mobile-limit) {
     			right: 0;
+    		}
     		span.icon-bar {
     			border: 2px solid $nav-button-color;
+    		}
     		top: -$header-border-height;
     		right: 0;
+    	}
     	button::after {
     		content: "Menu";
     		display: block;
     		@media screen and (max-width: $my-mobile-limit) {
     			display: none;
+    		}
+    }
     div#nav {
     	margin-top: -15px;
     	ul {
     		margin-top: 0;
+    	}
     	#nav > ul {
     		border-top: none;
     		position: relative;
     		top: $nav-menu-side;
     		a {
     			color: white;
+    		}
     	ul ul > li a:not(:hover) {
     		color: $tertiary-color;
+    	}
+    }
     #nav-wrapper ul {
     	border: none;
     	li:last-child {
     		border: none
+    	}
+    }
     div#header-post {
     	font-weight: 900;
     	font-size: 2.25rem;
     	line-height: 1;
     	text-align: center;
     	background-color: $secondary-color;
     	padding: 64px 0 70px 0;
     	margin-bottom: 45px;
     div.cell.foldable.folded > div > h2:first-child + picture {
     	display: block;
+    }
     #sidebar {
     	box-shadow: 3px 3px 20px 0px #dedede;
     	margin-right: 2.5em;
+    }
     @mixin form-icon($content) {
     	content: $content;
     	font-family: FontAwesome;
+    }
     div#footer-wrapper {
     	padding: 66px 0 73px;
+    }
     div#footer {
     	border-color: #fff;
     	max-width: 1320px;

     $secondary-color: #f4f4f4;
     $tertiary-color: #0f183b;
     $border-radius: 3px;
     $font-size: 1.25em;
     $font-family: Montserrat, sans-serif;
     $link-color: $primary-color;
     $my-tablet-limit: 1279px;
     $my-mobile-limit: 796px;
     $nav-place-holder-width: 80px;
     $nav-mobile-limit: 50000px;
     $nav-button-color: $tertiary-color;
     $nav-button-background: $tertiary-color;
     $nav-mobile-menu-background: $tertiary-color;
     $nav-background: $secondary-color;
     $nav-color: $tertiary-color;
     $nav-full-width-background: true;
     $nav-button-background: $primary-color;
     $nav-item-selected-background: $primary-color;
     //$nav-mobile-menu-color: white;
     $nav-item-hover-background: $primary-color;
     $nav-border-color: transparent;
     $nav-menu-side: 36px;
     $nav-menu-side: 60px;
     $cell-border: none;
     $cell-entry-hover-background: transparent;
     $title-transform: uppercase;
     $title-font-size: 1.4rem;
     $title-weight: bold;
     $title-padding: 0.7rem 0rem;

+    {
       "label": "Gers (CD32)",
       "variables": {
         "include_top_links": false,
         "logo_link_url": "/",
         "theme_color": "#ae2217"
       },
       "settings": {
         "combo": {
           "COMBO_ASSET_SLOTS.update": {
             "header:background": { "label": "Têtière : fond" },
             "header:logo": { "label": "Têtière : logo" }
+          }
+        }
+      }
+    }

     {% extends "combo/page_template.html" %}
     {% load combo %}
     {% block user-info %}
     {% skeleton_extra_placeholder user-info %}
     {% if user.is_authenticated %}
     <span class="logged-in">
       Bonjour
       <span class="connected-user">{{user.first_name}} {{user.last_name}}</span>
       {% if idp_account_url %}
       <a class="account" href="{{idp_account_url}}" title="Accéder à mon compte"></a>
       {% endif %}
       <a class="logout" href="{% url 'auth_logout' %}" title="Se déconnecter"></a>
     </span>
     {% else %}
     {% if idp_registration_url %}
     <span class="login">
       <a accesskey="2" href="{% url 'auth_login' %}">Connexion</a>
       <span class="sep">/</span>
       <a class="registration" href="{{idp_registration_url}}">Inscription</a>
     </span>
     {% else %}
     <span class="login"><a accesskey="2" href="{% url 'auth_login' %}">Connexion <span class="sep">/</span> Inscription</a></span>
     {% endif %}
     {% endif %}
     {% end_skeleton_extra_placeholder %}
     {% endblock %}

     {% extends "theme.html" %}
     {% load static %}
     {% block header-pre %}
     <div id="header-pre">
       <div id="contenu">
         <div id="contenu-top">
           <div id="logo-ville">
             <a href="{{website_url}}">
               <img src="{{ site_base }}{% static 'gers-cd32/img/logo.png' %}"/>
             </a>
           </div>
           <div id="demarches"><span>Mes Démarches</span><span class="gru-icon"/></div>
           <div id="nav-place-holder"></div>
         </div>
         {% block user-info %}
         {% endblock %}
       </div> <!-- contenu -->
       <div id="bandeau">
         {% if page.picture %}
         <img src="{{site_base}}{{page.picture.url}}"/>
         {% else %}
         <img src="{{site_base}}{% static 'gers-cd32/img/csm_defaultImage.png' %}"/>
         {% endif %}
       </div>
     </div>
     {% endblock %}
     {% block header-post %}
     {% if  page.title %}
     <div id="header-post">
       {{page.title}}
     </div>
     {% endif %}
     {% endblock %}
+    -

Projet

Général

Profil

Produits Entr'ouvert » Intégrations graphiques Publik

0001-gers-cd32-simplify-as-a-native-theme-47562.patch