Projet

Général

Profil

0001-scss-introduce-header-logo-size-show-site-title.patch

Thomas Jund, 05 mai 2022 16:25

Télécharger (3,09 ko)

Voir les différences: 

Subject: [PATCH] scss: introduce $header-logo-size & $show-site-title


 help/fr/misc-scss.page       | 10 ++++++++
 static/includes/_header.scss | 50 ++++++++++++++++++++++++++++++++----
 2 files changed, 55 insertions(+), 5 deletions(-)
help/fr/misc-scss.page
63 63 
  (plutôt que la largeur du contenu)</p></td>
64 64 
  <td><p><var>true</var></p></td>
65 65 
 </tr>
66 
 <tr>
67 
   <td><p><code>$header-logo-size</code></p></td>
68 
   <td><p>Taille du logo de l'entête. 2 valeurs sont attendues : largeur et hauteur (ex: <code>150px 75px</code>).</p></td>
69 
   <td><p><var>null</var></p></td>
70 
 </tr>
71 
 <tr>
72 
   <td><p><code>$show-site-title</code></p></td>
73 
   <td><p>Afficher le titre du site. Le titre est masqué par défaut lorsqu'un logo est défini. <code>true</code> ou <code>false</code></p></td>
74 
   <td><p><var>null</var></p></td>
75 
 </tr>
66 76 
 <tr>
67 77 
  <td><p><code>$footer-background</code></p></td>
68 78 
  <td><p>Couleur de fond du pied de page</p></td>
static/includes/_header.scss
1 1 
$header-full-width-background: true !default;
2 2 
$header-background-color: null !default;
3 
$header-logo-size: null !default;
4 
$show-site-title: null !default;
3 5 

  		




  4
  6
  
    
@mixin header-background {

  		




  5
  7
  
    
	body.has-header-background & {

  		




  ......




  19
  21
  
    
	}

  		




  20
  22
  
    
}

  		




  21
  23
  
    

  		




  22
  
  
    
h1#logo.has-logo {

  		




  23
  
  
    
	a {

  		




  24
  
  
    
		background: transparent url(/assets/header:logo) center left no-repeat;

  		




  25
  
  
    
		background-size: contain;

  		




  
  24
  
    
@mixin display-site-title($display) {

  		




  
  25
  
    
	@if $display == false {

  		




  26
  26
  
    
		text-indent: -10000px;

  		




  27
  
  
    
		min-width: 160px;

  		




  
  27
  
    
	}

  		




  
  28
  
    
}

  		




  
  29
  
    

  		




  
  30
  
    
h1#logo {

  		




  
  31
  
    
	& a {

  		




  
  32
  
    
		$no-logo-site-title: if($show-site-title == false, false, true);

  		




  
  33
  
    
		@include display-site-title($no-logo-site-title);

  		




  28
  34
  
    
		display: inline-block;

  		




  29
  35
  
    
	}

  		




  
  36
  
    

  		




  
  37
  
    
	&.has-logo a {

  		




  
  38
  
    
		background: transparent url(/assets/header:logo) center left no-repeat;

  		




  
  39
  
    
		background-size: contain;

  		




  
  40
  
    
		@if $header-logo-size {

  		




  
  41
  
    
			$logo-width: nth($header-logo-size, 1);

  		




  
  42
  
    
			$logo-height: null !default;

  		




  
  43
  
    
			@if length($header-logo-size) > 1 {

  		




  
  44
  
    
				$logo-height: nth($header-logo-size, 2);

  		




  
  45
  
    
			}

  		




  
  46
  
    
			display: inline-flex;

  		




  
  47
  
    
			background-image: none;

  		




  
  48
  
    
			background-position: bottom left;

  		




  
  49
  
    
			&::before {

  		




  
  50
  
    
				content: "";

  		




  
  51
  
    
				display: block;

  		




  
  52
  
    
				background: transparent url(/assets/header:logo) no-repeat;

  		




  
  53
  
    
				background-size: inherit;

  		




  
  54
  
    
				background-position: inherit;

  		




  
  55
  
    
				flex: 0 0 auto;

  		




  
  56
  
    
				width: $logo-width;

  		




  
  57
  
    
				height: $logo-height;

  		




  
  58
  
    
				margin-right: 1em;

  		




  
  59
  
    
			}

  		




  
  60
  
    
		} @else {

  		




  
  61
  
    
			min-width: 160px;

  		




  
  62
  
    
		}

  		




  
  63
  
    

  		




  
  64
  
    
		$has-logo-site-title: if($show-site-title, true, false);

  		




  
  65
  
    
		@include display-site-title($has-logo-site-title);

  		




  
  66
  
    
		@if $has-logo-site-title {

  		




  
  67
  
    
			align-items: last baseline;

  		




  
  68
  
    
		}

  		




  
  69
  
    
	}

  		




  30
  70
  
    
}

  		




  31
  
  
    
-