Add checkbox
This commit is contained in:
parent
34c192fb79
commit
6d7c9400cd
|
|
@ -3,8 +3,21 @@
|
|||
@section('body')
|
||||
|
||||
<div class="choice">
|
||||
<div class="row center">
|
||||
<div class="col s12" style="margin-top: 20px;">
|
||||
<p>Changer l'affichage : </p>
|
||||
<div class="switch">
|
||||
<label>
|
||||
Boutons
|
||||
<input type="checkbox" id="display-type">
|
||||
<span class="lever"></span>
|
||||
Logo cliquable
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row center v-center">
|
||||
<div class="col m6 l6 s12">
|
||||
<div class="col m6 l6 s12" id="buttons">
|
||||
|
||||
@foreach ($categories as $category)
|
||||
<a class="waves-effect waves-light btn-large"
|
||||
|
|
@ -12,7 +25,7 @@
|
|||
|
||||
@endforeach
|
||||
</div>
|
||||
<div class="col m6 l6 s12">
|
||||
<div class="col m6 l6 s12 hide" id="clickable_logo">
|
||||
<h4 id="status"></h4>
|
||||
<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg"
|
||||
|
|
@ -27,8 +40,7 @@
|
|||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<a transform="matrix(2.7389625,0,0,2.7389625,-133.95126,-374.13504)" id="a5"
|
||||
href="/category/finance">
|
||||
<a transform="matrix(2.7389625,0,0,2.7389625,-133.95126,-374.13504)" id="a5" href="/category/finance">
|
||||
<path id="path973"
|
||||
d="m 105.85263,175.81979 c -0.48507,-0.27729 -1.68889,-0.50979 -2.67516,-0.51667 l -1.79322,-0.0125 -1.502637,-6.74996 c -1.220857,-5.48424 -1.413817,-6.80626 -1.028997,-7.05016 1.161154,-0.73594 9.411234,0.23324 12.115294,1.42324 0.38805,0.17078 1.31282,0.57793 2.05502,0.90479 0.91771,0.40415 1.2861,0.75944 1.1514,1.11047 -0.18512,0.48241 -7.27976,11.43473 -7.38947,11.40746 -0.0277,-0.007 -0.44716,-0.23938 -0.93223,-0.51667 z"
|
||||
style="fill:#c0392b;stroke-width:0.352778" />
|
||||
|
|
@ -39,14 +51,12 @@
|
|||
d="m 111.11673,179.46417 c -1.06715,-1.11391 -2.68814,-2.38959 -3.60219,-2.83484 l -1.66191,-0.80954 2.69069,-4.12727 c 1.47988,-2.27 3.16428,-4.88134 3.74312,-5.80297 0.57883,-0.92163 1.243,-1.67569 1.47592,-1.67569 0.23293,0 1.08095,0.47625 1.8845,1.05833 0.80354,0.58208 1.60186,1.05833 1.77405,1.05833 0.94841,0 7.80693,7.70859 7.80693,8.77454 0,0.17705 -1.38906,1.03335 -3.08681,1.9029 -4.63875,2.37587 -7.28174,3.81644 -7.65527,4.17252 -0.68942,0.65721 -1.48195,0.25347 -3.36903,-1.71631 z"
|
||||
style="fill:#2ecc71;stroke-width:0.352778" />
|
||||
</a>
|
||||
<a transform="matrix(2.7389625,0,0,2.7389625,-133.95126,-374.13504)" id="a11"
|
||||
href="/category/tools">
|
||||
<a transform="matrix(2.7389625,0,0,2.7389625,-133.95126,-374.13504)" id="a11" href="/category/tools">
|
||||
<path sodipodi:nodetypes="sccscccccs" id="path977"
|
||||
d="m 93.133516,170.20986 c -2.07399,-3.04635 -3.82024,-5.6952 -3.88056,-5.88635 -0.0943,-0.29866 1.99777,-1.07748 6.26538,-2.33248 0.59586,-0.17523 1.64252,-0.3186 2.32591,-0.3186 h 1.24254 l 1.334664,6.04155 c 0.73407,3.32285 1.71989,6.58731 1.81174,6.93856 0.17359,0.66379 -0.32606,0.46726 -3.917684,0.91875 l -1.41111,0.17738 z"
|
||||
style="fill:#3498db;stroke-width:0.352778" />
|
||||
</a>
|
||||
<a transform="matrix(2.7389625,0,0,2.7389625,-133.95126,-374.13504)" id="a14"
|
||||
href="/category/change">
|
||||
<a transform="matrix(2.7389625,0,0,2.7389625,-133.95126,-374.13504)" id="a14" href="/category/change">
|
||||
<path id="path981"
|
||||
d="m 85.550026,175.46227 c -3.04164,-1.97583 -5.62249,-3.6862 -5.73523,-3.80081 -0.26748,-0.27194 3.80439,-4.24215 5.62105,-5.48072 0.77611,-0.52913 1.95536,-1.23181 2.62056,-1.5615 l 1.20945,-0.59943 3.81927,5.86443 3.81927,5.86443 -1.36261,0.70642 c -0.74944,0.38853 -2.01702,1.14298 -2.81685,1.67656 -0.79983,0.53357 -1.49707,0.95954 -1.54944,0.9466 -0.0524,-0.0129 -2.58382,-1.64014 -5.62547,-3.61598 z"
|
||||
style="fill:#7f8c8d;stroke-width:0.352778" />
|
||||
|
|
@ -72,8 +82,7 @@
|
|||
d="m 78.481556,205.88552 c -1.43983,-2.13343 -2.61692,-4.49057 -3.50679,-7.02239 -1.26566,-3.60105 -1.54888,-3.32263 5.3563,-5.26571 3.34698,-0.94182 6.569129,-1.87634 6.781369,-1.9504 0.21223,-0.0741 0.427211,1.03908 0.856681,2.34734 0.42947,1.30826 1.24597,3.0111 1.81444,3.7841 0.56847,0.773 0.99593,1.43367 0.94992,1.46816 -0.046,0.0345 -2.57736,1.90412 -5.62522,4.15474 l -5.54156,4.09203 z"
|
||||
style="fill:#2980b9;stroke-width:0.352778" />
|
||||
</a>
|
||||
<a transform="matrix(2.7389625,0,0,2.7389625,-133.95126,-374.13504)" id="a29"
|
||||
href="/category/forums">
|
||||
<a transform="matrix(2.7389625,0,0,2.7389625,-133.95126,-374.13504)" id="a29" href="/category/forums">
|
||||
<path sodipodi:nodetypes="sscccs" id="path997"
|
||||
d="m 93.290316,217.39277 c -2.18295,-0.71838 -5.6118,-2.37273 -5.6118,-2.70758 0,-0.36994 7.12153,-11.4155 7.359,-11.41388 0.6618,0.005 5.428264,1.26141 5.526424,1.5559 0.0634,0.19033 -0.889167,3.65201 -1.801124,7.06102 -1.89101,7.06887 -1.60208,6.77824 -5.4725,5.50454 z"
|
||||
style="fill:#8e44ad;stroke-width:0.352778" />
|
||||
|
|
@ -100,8 +109,7 @@
|
|||
id="path3777-2"
|
||||
d="m 100.66404,223.70827 c -0.10618,0.0664 -0.51762,0.21236 -0.91579,0.33181 -0.86269,0.27871 -1.40686,0.65034 -2.33592,1.59267 -0.7167,0.74325 -0.82288,0.92906 -1.24759,2.42883 -0.30527,1.04851 -0.29199,1.87139 0.0531,2.95972 0.38489,1.26086 1.40686,2.76063 2.11029,3.11898 0.22563,0.11945 0.59725,0.35835 0.79634,0.53089 0.2389,0.19909 0.54416,0.31854 0.83615,0.31854 0.2389,0 0.69016,0.0929 0.98215,0.21235 0.57071,0.22563 0.78306,0.21236 2.25628,-0.18581 1.28742,-0.34508 3.31808,-1.79176 3.31808,-2.36246 0,-0.0531 0.10617,-0.22564 0.2389,-0.37163 0.35835,-0.39817 0.83615,-1.93775 0.84942,-2.76063 0,-0.41144 -0.10618,-1.04851 -0.27872,-1.52631 -0.14599,-0.45126 -0.27871,-0.91579 -0.27871,-1.0087 0,-0.15927 -0.7698,-1.27414 -1.12815,-1.61921 -1.04851,-1.02197 -2.38901,-1.60595 -3.92859,-1.69886 -0.6238,-0.0265 -1.22105,-0.0133 -1.32723,0.0398 z" />
|
||||
</a>
|
||||
<a transform="matrix(2.7389625,0,0,2.7389625,-133.95126,-374.13504)" id="a44"
|
||||
href="/category/websites">
|
||||
<a transform="matrix(2.7389625,0,0,2.7389625,-133.95126,-374.13504)" id="a44" href="/category/websites">
|
||||
<path
|
||||
style="fill:#f1c40f;fill-opacity:1;stroke:#000000;stroke-width:0.0132723;stroke-opacity:1;image-rendering:auto"
|
||||
id="path3773-5"
|
||||
|
|
@ -130,6 +138,21 @@
|
|||
</div>
|
||||
</div>
|
||||
<script>
|
||||
var checkbox = document.getElementById("display-type");
|
||||
var buttons = document.getElementById("buttons");
|
||||
var clickable_logo = document.getElementById("clickable_logo");
|
||||
|
||||
checkbox.addEventListener('change', function() {
|
||||
if (this.checked) {
|
||||
console.log("Mode logo cliquable");
|
||||
buttons.classList.add("hide");
|
||||
clickable_logo.classList.remove("hide");
|
||||
} else {
|
||||
console.log("Mode boutons");
|
||||
clickable_logo.classList.add("hide");
|
||||
buttons.classList.remove("hide");
|
||||
}
|
||||
});
|
||||
// TO UPDATE STATUS LABEL
|
||||
function updateStatus(value) {
|
||||
document.getElementById("status").innerHTML = value;
|
||||
|
|
@ -151,7 +174,8 @@
|
|||
let licence = document.getElementById("path1678");
|
||||
let com = document.getElementById("path3777-2");
|
||||
let website = document.getElementById("path3771-3");
|
||||
|
||||
var hover = "Passez votre curseur sur une partie du logo Ğ1";
|
||||
console.log(hover);
|
||||
//HOVER
|
||||
finance.addEventListener("mouseover", function(event) {
|
||||
|
||||
|
|
@ -209,21 +233,6 @@
|
|||
|
||||
//LEAVE
|
||||
|
||||
/*
|
||||
let finance = document.getElementById("path973");
|
||||
let servicesInstances = document.getElementById("path971");
|
||||
let tools = document.getElementById("path977");
|
||||
let change = document.getElementById("path981");
|
||||
let blockchain = document.getElementById("path985");
|
||||
let trm = document.getElementById("path993");
|
||||
let asso = document.getElementById("path989");
|
||||
let forums = document.getElementById("path997");
|
||||
let agpl = document.getElementById("path1001");
|
||||
let tdc = document.getElementById("path1003");
|
||||
let licence = document.getElementById("path1678");
|
||||
let com = document.getElementById("path3777-2");
|
||||
let website = document.getElementById("path3771-3");
|
||||
*/
|
||||
finance.addEventListener("mouseleave", function(event) {
|
||||
|
||||
updateStatus(hover);
|
||||
|
|
|
|||
Loading…
Reference in New Issue