geindre/css-le-botlan
2
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Merge branch 'master' of https://git.etud.insa-toulouse.fr/geindre/css-le-botlan

Browse source
This commit is contained in:
Mythrann 2021-02-04 20:11:42 +01:00
commit 489c125783
2 changed files with 14 additions and 86 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
Y/ystyle.css
View file

@ -71,6 +71,7 @@ body:before {
main { main {
min-height: calc(100vh - 420px); min-height: calc(100vh - 420px);
margin-bottom: 100px; margin-bottom: 100px;
display: block;
} }
.yfold:not(.card) { .yfold:not(.card) {
@ -210,24 +211,32 @@ footer .pcom a {
/* PAGE DE CODE */ /* PAGE DE CODE */
code { code {
background: #1b1b1b; z-index: 2;
max-width: 900px; background: #000;
width: auto; width: min(94vw, 900px);
border-radius: 12px; border-radius: 12px;
margin-left: 3vw; margin-left: 3vw;
margin-top: 20px;
font-family: monospace; font-family: monospace;
display: block; display: block;
color: #ffffcc; color: #ffffcc;
tab-size: 2px; tab-size: 2;
white-space: pre; white-space: pre;
overflow-x: scroll; overflow-x: scroll;
font-size: 120%; font-size: 120%;
padding: 15px 20px 12px 22px; padding: 20px 50px 22px 15px;
border-bottom: 10px solid #222;
line-height: 1.55; line-height: 1.55;
} }
code * {
white-space: pre;
tab-size: 2px;
display: inline;
}
span.comment { span.comment {
font-style: italic; font-style: italic;
color: rgb(128, 139, 150); color: rgb(128, 139, 150);

81
script.js
View file

@ -1,81 +0,0 @@
//
// Show/hide some sections by clicking on the title.
//
// Can be replaced by <details>, <summary> once it is supported by most browsers.
//
function saveStatus(id, shown) {
if (typeof(Storage) !== "undefined") {
localStorage.setItem("yfold-shown-" + id, shown) ;
}
}
// record : (when clicked), record the status in local storage
function setStatus(id, shown, content, record) {
// console.log ("setStatus (" + id + ", " + shown + ")") ;
var span = document.getElementById("arrow-" + id) ;
if (shown) {
content.classList.remove("anim-hide") ;
content.classList.remove("hidden") ;
span.innerHTML = "&#x25be;" ;
if (record) { content.classList.add("anim-show") ; }
else { content.classList.add("shown") ; }
}
else {
content.classList.remove("anim-show") ;
content.classList.remove("shown") ;
span.innerHTML = "&#x25b8;" ;
if (record) { content.classList.add("anim-hide") ; }
else { content.classList.add("hidden") ; }
}
if (record) { saveStatus(id, shown) ; }
}
// Invoked at load-time once for every yfold section.
function initYfold(id) {
// console.log ("initYfold (" + id + ")") ;
// console.log ("unknown " + id)
var shown = true ;
var content = document.getElementById("content-" + id) ;
// Sets the state according to local storage or default value.
if (typeof(Storage) !== "undefined") {
var local = localStorage.getItem("yfold-shown-" + id) ;
// console.log ("using storage value = " + local)
if (local === 'true') {
shown = true ;
}
else if (local === 'false') {
shown = false ;
}
else {
// Get default value
var defv = content.getAttribute("data-yfold-default") ;
if (defv === 'hide') {
shown = false ;
}
// console.log ("using default value = " + shown)
}
}
setStatus(id, shown, content, false) ;
}
// Function invoked when the title is clicked.
function toggleYfold(id) {
// console.log ("toggleYfold (" + id + ")") ;
var content = document.getElementById("content-" + id) ;
var expand = content.classList.contains("anim-hide") || content.classList.contains("hidden") ;
setStatus(id, expand, content, true) ;
}