Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentes Révision précédente
trucs [2018/08/05 11:44]
mathieu supprimée
trucs [2018/08/05 11:44] (Version actuelle)
mathieu créée
Ligne 1: Ligne 1:
 ====== Trucs utiles ====== ====== Trucs utiles ======
 +
 ===== Renouveler un certificat Let'​sEncrypt ​ ===== ===== Renouveler un certificat Let'​sEncrypt ​ =====
  
Ligne 24: Ligne 25:
   * Supprimer jusqu'​a > <​code>​sed -n '​s/​[^>​]*\>//​p'​ 1</​code>​   * Supprimer jusqu'​a > <​code>​sed -n '​s/​[^>​]*\>//​p'​ 1</​code>​
   * exporter en html <​code>​pdftohtml -i -s -stdout -noframes all-likes.pdf all-likes.html</​code>​   * exporter en html <​code>​pdftohtml -i -s -stdout -noframes all-likes.pdf all-likes.html</​code>​
 +
 +
 +===== Astuces de mise en page =====
 +
 +==== Vignette masquée ====
 +
 +=== Dans le CSS ===
 +
 +<​code>​
 +.vignette {
 +   ​position:​ absolute;
 +   top: -9999px;
 +   left: -9999px;
 +}
 +</​code>​
 +
 +=== Dans le billet ===
 +
 +<​code>​
 +``<div class="​vignette">​``
 +((/​public/​jeff/​cqextrmdrt/​kek-flag.jpg||C))
 +``</​div>​``
 +</​code>​
 +
 +
 +==== Vidéo responsive ====
 +
 +=== Dans le CSS ===
 +
 +<​code>​
 +.video-container {
 +position: relative;
 +padding-bottom:​ 56.25%;
 +padding-top:​ 30px; height: 0; overflow: hidden;
 +}
 + 
 +.video-container iframe,
 +.video-container object,
 +.video-container embed {
 +position: absolute;
 +top: 0;
 +left: 0;
 +width: 100%;
 +height: 100%;
 +}
 +</​code>​
 +
 +=== Dans le billet ===
 +
 +
 +<​code>​
 +///html
 +<div class="​video-container">​
 +<iframe width="​560"​ height="​315"​ src="​https://​www.youtube.com/​embed/​9Xln-IUkjxo?​rel=0"​ frameborder="​0"​ allow="​autoplay;​ encrypted-media"​ allowfullscreen></​iframe>​
 +</​div>​
 +///
 +</​code>​
 +
 +==== Encadré ====
 +
 +=== Dans le code ===
 +
 +<​code>​
 +.encadre {
 +  background-color:​ #f2f2f0;
 +  width: 80%;
 +  margin: auto;
 +  padding: 1.4em;
 +  padding-top : 0em;
 +  font-size: 0.85em;
 +  text-align:​left;​
 +  box-shadow: 3px 3px 3px #ccc;
 +}
 +
 +.encadre h5 {
 +  padding-top:​ 1em;
 +}
 +</​code>​
 +
 +=== Dans le billet ===
 +
 +<​code>​
 +``<div class="​encadre">​``
 +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut pellentesque,​ libero quis suscipit viverra, diam quam accumsan enim, eget egestas elit ipsum quis libero. Donec mollis mattis ultricies. Nam volutpat porta erat eget volutpat. Etiam tincidunt varius augue, non hendrerit enim feugiat ac. Sed non lectus ac enim varius varius a vel justo. Integer faucibus scelerisque risus, at hendrerit ex vehicula in. Donec nec venenatis felis, id congue nisi. Nam convallis enim vulputate, sollicitudin mauris vel, venenatis mauris. ​
 +``</​div>​``
 +</​code>​
 +
 +==== Galerie ====
 +
 +Une galerie simple avec //ductile focus//
 +
 +<​code>​
 +///​html ​
 + <​div class="​expo expo_t">​
 + ///
 +
 +[((/​public/​jeff/​maikanrivard/​.Screenshot-2018-4-9_Johane_Cayer_3__t.png||C))|/​public/​jeff/​maikanrivard/​Screenshot-2018-4-9_Johane_Cayer_3_.png]
 +
 +[((/​public/​jeff/​maikanrivard/​.Screenshot-2018-4-9_Johane_Cayer_4__t.png||C))|/​public/​jeff/​maikanrivard/​Screenshot-2018-4-9_Johane_Cayer_4_.png]
 +
 +///​html ​
 + </​div>​
 + ///
 +</​code>​
 +
 +