Compare commits
3 Commits
f3728dd939
...
b509f655f9
Author | SHA1 | Date |
---|---|---|
poka | b509f655f9 | |
poka | 449201652d | |
poka | 5b3332b798 |
|
@ -1,7 +1,8 @@
|
|||
config/config.php
|
||||
scripts/.loc_hash
|
||||
.idea
|
||||
/public/uploads
|
||||
public/uploads/*
|
||||
!public/uploads/default.png
|
||||
/tmp
|
||||
vendor
|
||||
composer.json
|
||||
|
|
|
@ -1,8 +1,19 @@
|
|||
.mapael .map {
|
||||
background-color: #cddee0;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
padding: 15px;
|
||||
margin-bottom: 10px;
|
||||
position: relative;
|
||||
width: 60%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
border-radius: 10%;
|
||||
}
|
||||
|
||||
.home_map {
|
||||
font-size:1.2rem;
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
/* For all zoom buttons */
|
||||
.mapael .zoomButton {
|
||||
background-color: #fff;
|
||||
|
@ -38,7 +49,7 @@
|
|||
}
|
||||
.mapael .mapTooltip {
|
||||
position: absolute;
|
||||
background-color: #474c4b;
|
||||
background-color: #1D1D1D;
|
||||
moz-opacity: 0.70;
|
||||
opacity: 0.70;
|
||||
filter: alpha(opacity=70);
|
||||
|
@ -48,4 +59,4 @@
|
|||
max-width: 200px;
|
||||
display: none;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1,82 @@
|
|||
.container_main {
|
||||
background-color: #2E2E2E;
|
||||
}
|
||||
.tableau {
|
||||
width:100%;
|
||||
background-color: white;
|
||||
table-layout: fixed;
|
||||
border-collapse: collapse;
|
||||
/* border-spacing: 1px; // pour contrer les style de base */
|
||||
}
|
||||
/* Entête */
|
||||
.tableau th {
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
padding: 0rem;
|
||||
text-align: center;
|
||||
border-left: lightgray 1px solid;
|
||||
background-color:#999690;
|
||||
color:#fff;
|
||||
}
|
||||
.tableau .colonne_image {
|
||||
padding: 0; !important;
|
||||
}
|
||||
.tableau td {
|
||||
border-bottom: solid 1px black;
|
||||
border-left: lightgray 1px solid;
|
||||
padding-left: 0.7rem;
|
||||
}
|
||||
.align_droite {
|
||||
|
||||
text-align: right;
|
||||
padding-right: 2rem;
|
||||
}
|
||||
.breadcrumb {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.toggle_radio {
|
||||
position: relative;
|
||||
background: rgba(0,0,0,.1);
|
||||
margin: -3px auto 4px 10px;
|
||||
overflow: hidden;
|
||||
padding: 0 !important;
|
||||
border-radius: 50px;
|
||||
height: 28px;
|
||||
width: 215px;
|
||||
}
|
||||
.toggle_radio > * {
|
||||
float: left;
|
||||
}
|
||||
.toggle_radio input[type=radio]{
|
||||
display: none;
|
||||
}
|
||||
.toggle_radio label{
|
||||
color: rgba(0,0,0,.9);
|
||||
z-index: 0;
|
||||
display: block;
|
||||
width: 100px;
|
||||
height: 20px;
|
||||
margin: 3px 3px;
|
||||
border-radius: 50px;
|
||||
cursor: pointer;
|
||||
z-index: 1;
|
||||
text-align: center;
|
||||
}
|
||||
.toggle_option_slider{
|
||||
width: 100px;
|
||||
height: 20px;
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
border-radius: 50px;
|
||||
transition: all .4s ease;
|
||||
}
|
||||
|
||||
#first_toggle:checked ~ .toggle_option_slider{
|
||||
background: rgba(0,0,0,.3);
|
||||
left: 3px;
|
||||
}
|
||||
#second_toggle:checked ~ .toggle_option_slider{
|
||||
background: rgba(0,0,0,.3);
|
||||
left: 109px;
|
||||
}
|
|
@ -19,10 +19,19 @@ btn-custom {
|
|||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
#logo_home {
|
||||
width:30rem;
|
||||
margin: 0 auto;
|
||||
margin-top: -15px;
|
||||
margin-bottom: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
#la_page {
|
||||
text-align: center;
|
||||
width: 1174px;
|
||||
|
@ -30,6 +39,7 @@ img {
|
|||
height:auto;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
opacity:0.9;
|
||||
}
|
||||
|
||||
#la_page a {
|
||||
|
@ -58,7 +68,9 @@ li {
|
|||
background-size: 100% auto;
|
||||
font-family: Bree Serif, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
opacity:0.97;
|
||||
}
|
||||
|
||||
header.header {
|
||||
width: 389px;
|
||||
height: 259px;
|
||||
|
@ -86,19 +98,24 @@ header.header img {
|
|||
font-size: 26px;
|
||||
}
|
||||
|
||||
.article {
|
||||
width:auto;
|
||||
height:auto;
|
||||
font-size: 24px;
|
||||
}
|
||||
.article2 {
|
||||
.article .article2 {
|
||||
width:auto;
|
||||
height:auto;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.container {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
|
||||
.container.home {
|
||||
font-family: Arial, sans-serif;
|
||||
height:auto;
|
||||
width:60rem;
|
||||
text-align:center;
|
||||
border: 0px;
|
||||
}
|
||||
|
||||
.profil_user {
|
||||
height: 400px;
|
||||
width: 900px;
|
||||
|
@ -169,7 +186,7 @@ header.header img {
|
|||
}
|
||||
|
||||
body.loading .loadingPubkey {
|
||||
overflow: hidden;
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
@ -268,3 +285,89 @@ body.loading .loadingPubkey {
|
|||
}
|
||||
|
||||
}
|
||||
|
||||
/* Fix products.css */
|
||||
|
||||
|
||||
.container_main {
|
||||
background-color: #2E2E2E;
|
||||
}
|
||||
.tableau {
|
||||
width:100%;
|
||||
background-color: white;
|
||||
table-layout: fixed;
|
||||
border-collapse: collapse;
|
||||
/* border-spacing: 1px; // pour contrer les style de base */
|
||||
}
|
||||
/* Entête */
|
||||
.tableau th {
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
padding: 0rem;
|
||||
text-align: center;
|
||||
border-left: lightgray 1px solid;
|
||||
background-color:#999690;
|
||||
color:#fff;
|
||||
}
|
||||
.tableau .colonne_image {
|
||||
padding: 0; !important;
|
||||
}
|
||||
.tableau td {
|
||||
border-bottom: solid 1px black;
|
||||
border-left: lightgray 1px solid;
|
||||
padding-left: 0.7rem;
|
||||
}
|
||||
.align_droite {
|
||||
|
||||
text-align: right;
|
||||
padding-right: 2rem;
|
||||
}
|
||||
.breadcrumb {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.toggle_radio {
|
||||
position: relative;
|
||||
background: rgba(0,0,0,.1);
|
||||
margin: -3px auto 4px 10px;
|
||||
overflow: hidden;
|
||||
padding: 0 !important;
|
||||
border-radius: 50px;
|
||||
height: 28px;
|
||||
width: 215px;
|
||||
}
|
||||
.toggle_radio > * {
|
||||
float: left;
|
||||
}
|
||||
.toggle_radio input[type=radio]{
|
||||
display: none;
|
||||
}
|
||||
.toggle_radio label{
|
||||
color: rgba(0,0,0,.9);
|
||||
z-index: 0;
|
||||
display: block;
|
||||
width: 100px;
|
||||
height: 20px;
|
||||
margin: 3px 3px;
|
||||
border-radius: 50px;
|
||||
cursor: pointer;
|
||||
z-index: 1;
|
||||
text-align: center;
|
||||
}
|
||||
.toggle_option_slider{
|
||||
width: 100px;
|
||||
height: 20px;
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
border-radius: 50px;
|
||||
transition: all .4s ease;
|
||||
}
|
||||
|
||||
#first_toggle:checked ~ .toggle_option_slider{
|
||||
background: rgba(0,0,0,.3);
|
||||
left: 3px;
|
||||
}
|
||||
#second_toggle:checked ~ .toggle_option_slider{
|
||||
background: rgba(0,0,0,.3);
|
||||
left: 109px;
|
||||
}
|
||||
|
|
|
@ -63,7 +63,12 @@
|
|||
$vendeur_format = "<a target=\"_blank\" href=\"https://g1.duniter.fr/#/app/wot/$pubkey/\">$vendeur</a>";
|
||||
$cle_pub_format = "<a target=\"_blank\" href=\"https://g1.duniter.fr/api/#/v1/payment/$pubkey?amount=$prix&name=$vendeur&comment=[Achat GMarche] : $produit&preferred_node=https://g1.librelois.fr&redirect_url=https://gmarche.monnaie-libre.fr\" title=$pubkey> $pubkeyShort... </a>";
|
||||
$data .= '<td>'.$produit.'</td>';
|
||||
$data .= '<td><img src="/uploads/products/'.$antenne_slug.'/'.$row['image'].'" width="100" height="100" /></td>';
|
||||
$imagep = '../uploads/products/'.$antenne_slug.'/'.$row['image'].'';
|
||||
if (file_exists($imagep) && $row['image']) {
|
||||
$data .= '<td><img src="/uploads/products/'.$antenne_slug.'/'.$row['image'].'" width="100" height="100" /></td>';
|
||||
} else {
|
||||
$data .= '<td><img src="/uploads/default.png" width="30" height="30" /></td>';
|
||||
}
|
||||
$data .= '<td>'.$vendeur_format.'</td>';
|
||||
$data .= '<td>'.$cle_pub_format.'</td>';
|
||||
$data .= '<td>'.$quantite.'</td>';
|
||||
|
|
|
@ -19,11 +19,11 @@
|
|||
|
||||
$params["antenne_slug"] = $antenne_slug;
|
||||
$requete = "SELECT souhaits.*, users.username, users.pubkey
|
||||
FROM souhaits
|
||||
LEFT JOIN antennes
|
||||
ON antennes.id = souhaits.antenne_id
|
||||
LEFT JOIN users
|
||||
ON users.id = souhaits.user_id
|
||||
FROM souhaits
|
||||
LEFT JOIN antennes
|
||||
ON antennes.id = souhaits.antenne_id
|
||||
LEFT JOIN users
|
||||
ON users.id = souhaits.user_id
|
||||
WHERE antennes.slug = :antenne_slug";
|
||||
$stmt = $bdd->prepare($requete);
|
||||
$stmt2 = $bdd->prepare($requete);
|
||||
|
@ -55,7 +55,12 @@
|
|||
$vendeur_format = "<a target=\"_blank\" href=\"https://g1.duniter.fr/#/app/wot/$pubkey/\">$vendeur</a>";
|
||||
$pubkeyShort = substr($pubkey, 0, 8);
|
||||
$data .= '<td>'.$produit.'</td>';
|
||||
$data .= '<td><img src="/uploads/recherches/'.$antenne_slug.'/'.$row['image'].'" width="100" height="100" /></td>';
|
||||
$imagep = '../uploads/recherches/'.$antenne_slug.'/'.$row['image'].'';
|
||||
if (file_exists($imagep) && $row['image']) {
|
||||
$data .= '<td><img src="/uploads/recherches/'.$antenne_slug.'/'.$row['image'].'" width="100" height="100" /></td>';
|
||||
} else {
|
||||
$data .= '<td><img src="/uploads/default.png" width="30" height="30" /></td>';
|
||||
}
|
||||
$data .= '<td>'.$vendeur_format.'</td>';
|
||||
$data .= '<td>'.$pubkeyShort.'...</td>';
|
||||
$data .= '<td>'.$row['quantite'].'</td>';
|
||||
|
|
Binary file not shown.
After Width: | Height: | Size: 10 KiB |
|
@ -4,9 +4,9 @@
|
|||
Ğ1-Marché : Régions {% if page > 1 %}, page {{ page }} {% endif %}
|
||||
{% endblock %}
|
||||
{% block body %}
|
||||
<div class="container" style="height:auto; width:28rem; text-align:center;border: 0px">
|
||||
<img src="\images\logo_home.jpg" style="width:22rem;"/>
|
||||
<div class="row card" style="width:28rem;margin-left: -5.1rem;">
|
||||
<div class="container home">
|
||||
<img id="logo_home" src="\images\logo_home.jpg"/>
|
||||
|
||||
<ul class="list-group list-group-flush">
|
||||
<div class="mapcontainer">
|
||||
<div class="map">
|
||||
|
@ -17,7 +17,7 @@
|
|||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
$(".container").mapael({
|
||||
map: {
|
||||
|
@ -27,14 +27,15 @@
|
|||
},
|
||||
defaultArea: {
|
||||
attrs: {
|
||||
'fill': 'green',
|
||||
'stroke': '#99c7ff',
|
||||
'fill': '#517C2D',
|
||||
'stroke': '#F5D6C6',
|
||||
'stroke-width': 0.6,
|
||||
'cursor': 'pointer'
|
||||
},
|
||||
attrsHover: {
|
||||
'stroke-width': 2.5,
|
||||
'fill': 'blue'
|
||||
'fill': '#3b7dd8',
|
||||
'animDuration' : 100
|
||||
}
|
||||
}
|
||||
},
|
||||
|
@ -42,69 +43,69 @@
|
|||
'region-84': {
|
||||
value: "Auvergne-Rhône-Alpes",
|
||||
href: "france/auvergne-rhone-alpes",
|
||||
tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Auvergne-Rhône-Alpes</span>"}
|
||||
tooltip: {content: "<span class='home_map'> Auvergne-Rhône-Alpes</span>"}
|
||||
},
|
||||
'region-53': {
|
||||
value: "Bretagne",
|
||||
href: "france/bretagne",
|
||||
tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Bretagne</span>"}
|
||||
tooltip: {content: "<span class='home_map'>Bretagne</span>"}
|
||||
},
|
||||
'region-27': {
|
||||
value: "Bourgogne-Franche-Comté",
|
||||
href: "france/bourgogne-franche-comte",
|
||||
tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Bourgogne-Franche-Comté</span>"}
|
||||
tooltip: {content: "<span class='home_map'>Bourgogne-Franche-Comté</span>"}
|
||||
},
|
||||
'region-24': {
|
||||
value: "Centre-Val de Loire",
|
||||
href: "france/centre-val-de-loire",
|
||||
tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Centre-Val de Loire</span>"}
|
||||
tooltip: {content: "<span class='home_map'>Centre-Val de Loire</span>"}
|
||||
},
|
||||
'region-94': {
|
||||
value: "Corse",
|
||||
href: "france/corse",
|
||||
tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Corse</span>"}
|
||||
tooltip: {content: "<span class='home_map'>Corse</span>"}
|
||||
},
|
||||
'region-44': {
|
||||
value: "Grand-Est",
|
||||
href: "france/grand-est",
|
||||
tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Grand-Est</span>"}
|
||||
tooltip: {content: "<span class='home_map'>Grand-Est</span>"}
|
||||
},
|
||||
'region-32': {
|
||||
value: "Hauts-de-France",
|
||||
href: "france/hauts-de-france",
|
||||
tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Hauts-de-France</span>"}
|
||||
tooltip: {content: "<span class='home_map'>Hauts-de-France</span>"}
|
||||
},
|
||||
'region-11': {
|
||||
value: "Ile-de-France",
|
||||
href: "france/ile-de-france",
|
||||
tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Ile-de-France</span>"}
|
||||
tooltip: {content: "<span class='home_map'>Ile-de-France</span>"}
|
||||
},
|
||||
'region-28': {
|
||||
value: "Normandie",
|
||||
href: "france/normandie",
|
||||
tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Normandie</span>"}
|
||||
tooltip: {content: "<span class='home_map'>Normandie</span>"}
|
||||
},
|
||||
'region-75': {
|
||||
value: "Nouvelle-Aquitaine",
|
||||
href: "france/nouvelle-aquitaine",
|
||||
tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Nouvelle-Aquitaine</span>"}
|
||||
tooltip: {content: "<span class='home_map'>Nouvelle-Aquitaine</span>"}
|
||||
},
|
||||
'region-76': {
|
||||
value: "Occitanie",
|
||||
href: "france/occitanie",
|
||||
tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Occitanie</span>"}
|
||||
tooltip: {content: "<span class='home_map'>Occitanie</span>"}
|
||||
},
|
||||
'region-52': {
|
||||
value: "Pays de la Loire",
|
||||
href: "france/pays-de-la-loire",
|
||||
tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Pays de la Loire</span>"}
|
||||
tooltip: {content: "<span class='home_map'>Pays de la Loire</span>"}
|
||||
},
|
||||
'region-93': {
|
||||
value: "Provence-Alpes-Côte d'Azur",
|
||||
href: "france/provence-alpes-cote-d-azur",
|
||||
tooltip: {content: "<span style=\"font-size:1.2rem;font-weight:bold;\">Provence-Alpes-Côte d'Azur</span>"}
|
||||
tooltip: {content: "<span class='home_map'>Provence-Alpes-Côte d'Azur</span>"}
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
{% endblock %}
|
||||
{% endblock %}
|
||||
|
|
|
@ -2,91 +2,11 @@
|
|||
{% extends 'layout.twig' %}
|
||||
{% block title "Ğ1-Marché - Produits" %}
|
||||
|
||||
|
||||
{% block body %}
|
||||
<style>
|
||||
.tableau {
|
||||
width:100%;
|
||||
background-color: white;
|
||||
table-layout: fixed;
|
||||
border-collapse: collapse;
|
||||
/* border-spacing: 1px; // pour contrer les style de base */
|
||||
}
|
||||
/* Entête */
|
||||
.tableau th {
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
padding: 0rem;
|
||||
text-align: center;
|
||||
border-left: lightgray 1px solid;
|
||||
background-color:#999690;
|
||||
color:#fff;
|
||||
}
|
||||
.tableau .colonne_image {
|
||||
padding: 0; !important;
|
||||
}
|
||||
.tableau td {
|
||||
border-bottom: solid 1px black;
|
||||
border-left: lightgray 1px solid;
|
||||
padding-left: 0.7rem;
|
||||
}
|
||||
.align_droite {
|
||||
|
||||
text-align: right;
|
||||
padding-right: 2rem;
|
||||
}
|
||||
.breadcrumb {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.toggle_radio {
|
||||
position: relative;
|
||||
background: rgba(0,0,0,.1);
|
||||
margin: -3px auto 4px 10px;
|
||||
overflow: hidden;
|
||||
padding: 0 !important;
|
||||
border-radius: 50px;
|
||||
height: 28px;
|
||||
width: 215px;
|
||||
}
|
||||
.toggle_radio > * {
|
||||
float: left;
|
||||
}
|
||||
.toggle_radio input[type=radio]{
|
||||
display: none;
|
||||
}
|
||||
.toggle_radio label{
|
||||
color: rgba(0,0,0,.9);
|
||||
z-index: 0;
|
||||
display: block;
|
||||
width: 100px;
|
||||
height: 20px;
|
||||
margin: 3px 3px;
|
||||
border-radius: 50px;
|
||||
cursor: pointer;
|
||||
z-index: 1;
|
||||
text-align: center;
|
||||
}
|
||||
.toggle_option_slider{
|
||||
width: 100px;
|
||||
height: 20px;
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
border-radius: 50px;
|
||||
transition: all .4s ease;
|
||||
}
|
||||
|
||||
#first_toggle:checked ~ .toggle_option_slider{
|
||||
background: rgba(0,0,0,.3);
|
||||
left: 3px;
|
||||
}
|
||||
#second_toggle:checked ~ .toggle_option_slider{
|
||||
background: rgba(0,0,0,.3);
|
||||
left: 109px;
|
||||
}
|
||||
|
||||
</style>
|
||||
<link href="css/style.css" rel="stylesheet">
|
||||
<script type="text/javascript" src="/js/script.js"></script>
|
||||
<div class="container_main" style="background-color: black;">
|
||||
<div class="container_main">
|
||||
<!-- Fil d'Ariane -->
|
||||
<div class="breadcrumbs" >
|
||||
<nav aria-label="breadcrumb">
|
||||
|
|
|
@ -3,91 +3,9 @@
|
|||
{% block title "Ğ1-Marché - Recherches" %}
|
||||
|
||||
{% block body %}
|
||||
<style>
|
||||
.tableau {
|
||||
width:100%;
|
||||
background-color: white;
|
||||
table-layout: fixed;
|
||||
border-collapse: collapse;
|
||||
/* border-spacing: 1px; // pour contrer les style de base */
|
||||
}
|
||||
/* Entête */
|
||||
.tableau th {
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
padding: 0rem;
|
||||
text-align: center;
|
||||
border-left: lightgray 1px solid;
|
||||
background-color:#999690;
|
||||
color:#fff;
|
||||
}
|
||||
.tableau .colonne_image {
|
||||
padding: 0; !important;
|
||||
}
|
||||
.tableau td {
|
||||
border-bottom: solid 1px black;
|
||||
border-left: lightgray 1px solid;
|
||||
padding-left: 0.7rem;
|
||||
}
|
||||
.align_droite {
|
||||
|
||||
text-align: right;
|
||||
padding-right: 2rem;
|
||||
}
|
||||
.breadcrumb {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.toggle_radio {
|
||||
position: relative;
|
||||
background: rgba(0,0,0,.1);
|
||||
margin: -3px auto 4px 10px;
|
||||
overflow: hidden;
|
||||
padding: 0 !important;
|
||||
border-radius: 50px;
|
||||
height: 28px;
|
||||
width: 215px;
|
||||
}
|
||||
.toggle_radio > * {
|
||||
float: left;
|
||||
}
|
||||
.toggle_radio input[type=radio]{
|
||||
display: none;
|
||||
}
|
||||
.toggle_radio label{
|
||||
/* font: 90%/1.618 "Source Sans Pro";*/
|
||||
color: rgba(0,0,0,.9);
|
||||
z-index: 0;
|
||||
display: block;
|
||||
width: 100px;
|
||||
height: 20px;
|
||||
margin: 3px 3px;
|
||||
border-radius: 50px;
|
||||
cursor: pointer;
|
||||
z-index: 1;
|
||||
text-align: center;
|
||||
}
|
||||
.toggle_option_slider{
|
||||
width: 100px;
|
||||
height: 20px;
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
border-radius: 50px;
|
||||
transition: all .4s ease;
|
||||
}
|
||||
|
||||
#first_toggle:checked ~ .toggle_option_slider{
|
||||
background: rgba(0,0,0,.3);
|
||||
left: 3px;
|
||||
}
|
||||
#second_toggle:checked ~ .toggle_option_slider{
|
||||
background: rgba(0,0,0,.3);
|
||||
left: 109px;
|
||||
}
|
||||
|
||||
</style>
|
||||
<link href="css/style.css" rel="stylesheet">
|
||||
<script type="text/javascript" src="/js/script.js"></script>
|
||||
<div class="container_main" style="background-color: black;">
|
||||
<div class="container_main">
|
||||
<!-- Fil d'Ariane -->
|
||||
<div class="breadcrumbs" >
|
||||
<nav aria-label="breadcrumb">
|
||||
|
|
Loading…
Reference in New Issue