deblan/deblan.io-murph
deblan/deblan.io-murph
1
0
Fork 0
Code Issues Pull requests 1 Projects Releases Wiki Activity

update code render

Browse source
This commit is contained in:
Simon Vieille 2022-02-07 14:14:36 +01:00
parent 82dd8b1010
commit 2a98ae7653
4 changed files with 40 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
assets/css/app.scss
View file

@ -455,6 +455,11 @@ pre[class*="language-"] {
color: $color-code-title-text;
}
.code-window {
height: 30px;
background: $color-code-title-background url('../images/window.svg') no-repeat center right;
}
.body-content {
line-height: 30px;
}

1
assets/images/window.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="66.858" height="19.249" viewBox="0 0 17.689 5.093"><g stroke="#fff"><path fill="none" stroke-linecap="square" stroke-miterlimit="3.7" stroke-width=".529" d="M6.106 1.505h2.072v2.159H6.106z" color="#000" overflow="visible" paint-order="markers fill stroke"/><path fill="#f9f9f9" fill-rule="evenodd" stroke-width=".529" d="M.217 2.584h3.261"/><g fill="#f9f9f9" fill-rule="evenodd" stroke-width=".344"><path d="M29.585 112.1l1.532 1.532M29.585 113.632l1.532-1.531" transform="matrix(1.50595 0 0 1.5692 -33.57 -174.527)"/></g></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 579 B

34
assets/js/app/code.js
View file

@ -27,7 +27,7 @@ const Code = function (w) {
Code.prototype.init = function () {
Prism.highlightAllUnder(document)
const elements = this.window.document.querySelectorAll('code[data-title], div[data-title]')
let elements = this.window.document.querySelectorAll('code[data-title], div[data-title]')
for (let i = 0, len = elements.length; i < len; i++) {
const element = elements[i]
@ -59,6 +59,38 @@ Code.prototype.init = function () {
post.insertBefore(title, pre)
}
elements = this.window.document.querySelectorAll('code.window')
for (let i = 0, len = elements.length; i < len; i++) {
const element = elements[i]
if (element.tagName === 'CODE') {
var code = element
var pre = code.parentNode
var post = pre.parentNode
} else {
var code = element.querySelector('code')
if (!code) {
continue
}
var pre = code.parentNode
var post = pre.parentNode
}
if (!pre || !post) {
continue
}
pre.classList.add('with-title')
const win = this.window.document.createElement('div')
win.classList.add('code-window')
post.insertBefore(win, pre)
}
}
module.exports = Code

2
templates/page/post/_post.html.twig
View file

@ -183,7 +183,7 @@
<div class="field">
<input type="checkbox" id="rgpd" required>
<label for="rgpd">En validant ce formulaire, vous acceptez que les données saisies seront publiées sur cette page à l'exception de votre e-mail. Votre e-mail sera utilisé pour afficher votre avatar via <a href="https://www.libravatar.org/" target="_blank">Libravatar</a> et pour les notifications.</label>
<label for="rgpd">En validant ce formulaire, vous acceptez que les données saisies seront publiées sur cette page à l'exception de votre e-mail. Votre e-mail sera utilisé pour afficher votre avatar (<a href="https://www.libravatar.org/" target="_blank">via Libravatar</a>) et pour les notifications.</label>
</div>
<div class="field">