oca/paheko-module-velos-a-vendre
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Correction de mise en forme flex

Browse Source
This commit is contained in:
oca 2024-12-23 11:56:32 +01:00
parent 46de36182b
commit 0ffea56aaa
3 changed files with 112 additions and 91 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
modules/velos_a_vendre/index.html
View File

@ -27,13 +27,13 @@
<fieldset>
<legend>Filtrer les vélos</legend>
<dl>
{{:input name="type" type="select" label="Type de vélo" options=$types}}
{{:input name="type" type="select" label="Type de vélo" options=$types default_empty="Tous les types de vélo"}}
</dl>
<dl>
{{:input name="genre" type="select" label="Genre de cadre" options=$genres}}
{{:input name="genre" type="select" label="Genre de cadre" options=$genres default_empty="Tous les genres de cadre"}}
</dl>
<dl>
{{:input name="roues" type="select" label="Taille de roue" options=$roues}}
{{:input name="roues" type="select" label="Taille de roue" options=$roues default_empty="Toutes les tailles de roue"}}
</dl>
</fieldset>
</div>
@ -61,13 +61,15 @@
<span class="label">{{$etiquette}}</span>
<div class="properties">
<ul>
<li class="date-entree">entré en stock {{$date_entree|relative_date}} </li>
<li class="numero-unique">numéro unique : {{$id|intval}} </li>
<li>Type : {{$type}}</li>
<li>Taille : {{$roues}}</li>
<li>Cadre : {{$genre}}</li>
<li>Modèle : {{$modele}}</li>
<li>Prix : {{$prix}} €</li>
<li class="date-entree">entré en stock {{$date_entree|relative_date}} </li>
</ul>
</div>
</div>

2
modules/velos_a_vendre/module.ini
View File

@ -4,4 +4,4 @@ author = "Charlie, de Mines de Rayons"
author_url = "https://git.minesderayons.fr"
restrict_section = null
restrict_level = "none"
web = false
restrict_details = "Ce module affiche une page pour tous les utilisateurs même non loggués, disponible à l'adresse `site/m/velos_a_vendre/`"

43
modules/velos_a_vendre/style.css
View File

@ -1,19 +1,18 @@
.filters {
fieldset {
.filters fieldset {
display:flex;
dl {
flex-wrap: wrap;
gap: 10px;
}
.filters fieldset dl {
flex: 1 150px;
min-width: 200px;
}
}
}
.container {
position: relative;
flex: 1;
min-width: 200px;
border: solid 1px black;
border: solid 1px rgb(var(--gTextColor));
background-color: transparent;
border-radius: 10px;
overflow: hidden;
@ -40,7 +39,7 @@
display: block;
object-fit: cover;
width: 100%;
height: 100px;
height: 125px;
}
.placeholder {
@ -58,8 +57,6 @@
.label {
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
color: black;
text-align: center;
border-color: black;
@ -67,14 +64,24 @@
border-bottom: solid 1px;
background-color: yellow;
min-width: 5em;
width: 100%;
min-height: 2ex;
text-align: center;
vertical-align: middle;
z-index: 1;
position: absolute;
top: 0.75em;
left: -1.25em;
transform: rotate(-45deg);
font-weight: bold;
}
li.date-entree {
.properties li{
padding-left:0.5em;
}
.properties li:last-child{
padding-bottom:1em;
}
.properties li.date-entree {
display: block;
position: absolute;
bottom: 1.5em;
@ -83,3 +90,15 @@ li.date-entree {
font-size: x-small;
color: gray;
}
li.numero-unique {
display: block;
position: absolute;
padding-left:0px;
margin-bottom: -10px;
left: 10px;
font-size: x-small;
color: gray;
transform: rotate(90deg);
top: 125px;
transform-origin: left;
}