source: spip-zone/_plugins_/noizetier_layout/trunk/saisies/grid_column.html @ 113922

Last change on this file since 113922 was 113922, checked in by rastapopoulos@…, 16 months ago

Sous-plugin du Noizetier qui permet de déclarer une grille CSS au noizetier. Ce plugin ne fait rien en soit, il faut ensuite implémenter un framework de grille en déclarant des choses. Cela ajoute alors des nouvelles configurations automatiquement à toutes les noisettes, permettant de configurer des options d'agencement (le colonnage, etc).

File size: 3.3 KB
Line 
1[(#REM)
2
3        Grille : largeur de colonne
4
5]
6[(#SET{medias,#ARRAY{
7        '',#ARRAY{
8                label,<:noizetier:grid_media_mobile:>,
9                img,prive/themes/spip/images/grid-media-mobile.svg,
10        },
11        tablet,#ARRAY{
12                label,<:noizetier:grid_media_tablet:>,
13                img,prive/themes/spip/images/grid-media-tablet.svg,
14        },
15        desktop,#ARRAY{
16                label,<:noizetier:grid_media_desktop:>,
17                img,prive/themes/spip/images/grid-media-desktop.svg,
18        }
19}})]
20[(#SET{columns,#ARRAY{
21        gr-adapt, #ARRAY{
22                label,<:noizetier:grid_column_adapt:>,
23                explication,<:noizetier:grid_column_adapt_explication:>,
24        },
25        gr-grow,#ARRAY{
26                label,<:noizetier:grid_column_grow:>,
27                explication,<:noizetier:grid_column_grow_explication:>,
28        },
29        gr-1, #ARRAY{
30                label,1,
31                explication,<:noizetier:grid_column_1_explication:>,
32        },
33        gr-2, #ARRAY{
34                label,2,
35                explication,<:noizetier:grid_column_2_explication:>,
36        },
37        gr-3, #ARRAY{
38                label,3,
39                explication,<:noizetier:grid_column_3_explication:>,
40        },
41        gr-4, #ARRAY{
42                label,4,
43                explication,<:noizetier:grid_column_4_explication:>,
44        },
45        gr-5, #ARRAY{
46                label,5,
47                explication,<:noizetier:grid_column_5_explication:>,
48        },
49        gr-6, #ARRAY{
50                label,6,
51                explication,<:noizetier:grid_column_6_explication:>,
52        },
53        gr-7, #ARRAY{
54                label,7,
55                explication,<:noizetier:grid_column_7_explication:>,
56        },
57        gr-8, #ARRAY{
58                label,8,
59                explication,<:noizetier:grid_column_8_explication:>,
60        },
61        gr-9, #ARRAY{
62                label,9,
63                explication,<:noizetier:grid_column_9_explication:>,
64        },
65        gr-10, #ARRAY{
66                label,10,
67                explication,<:noizetier:grid_column_10_explication:>,
68        },
69        gr-11, #ARRAY{
70                label,11,
71                explication,<:noizetier:grid_column_11_explication:>,
72        },
73        gr-12, #ARRAY{
74                label,12,
75                explication,<:noizetier:grid_column_12_explication:>,
76        }
77}})]
78#SET{valeur,#ENV{valeur_forcee,#ENV{valeur,#ENV{defaut}}}}
79<BOUCLE_medias(DATA){source table, #GET{medias}}>
80#SET{media,#CLE}
81#SET{name,#ENV{nom}|concat{\[,#GET{media},\]}}
82<div class="grid-media">
83
84        <div class="grid-media__media">
85                [<img src="(#CHEMIN{#VALEUR{img}})" class="icone_layout" width="32" heigh="32" alt="">]
86                [<span>(#VALEUR{label})</span>]
87        </div>
88
89        <div class="grid-media__values radios_slider">
90
91                #SET{value,''}
92                #SET{checked,#GET{valeur/#GET{media}}|non}
93                #SET{id,#VAL{champ_}|concat{#ENV{id,#ENV{nom}},_,#GET{media},_null}|saisie_nom2classe}
94                #SET{required,''}
95                <input type="radio" name="#GET{name}" value="#GET{value}" class="radio" id="#GET{id}"[ (#GET{checked}|oui)checked="checked"][ (#GET{required}|oui)required="required"][ (#GET{media}|non)disabled="disabled"] />
96                <label for="#GET{id}" title="<:noizetier:grid_null_explication:>"[ (#GET{checked}|oui)class="on"]><:noizetier:grid_null:></label>
97       
98                <BOUCLE_columns(DATA){source table, #GET{columns}}>
99                #SET{value,#CLE|concat{#GET{media}|?{@#GET{media}}}}
100                #SET{checked,#GET{media}|?{
101                        #GET{value}|in_any{#GET{valeur/#GET{media}}},
102                        #GET{value}|=={#GET{valeur}}
103                }}
104                #SET{id,#VAL{champ_}|concat{#ENV{id,#ENV{nom}},_,#GET{media},_,#CLE}|saisie_nom2classe}
105                #SET{required,#GET{media}|non}
106                <input type="radio" name="#GET{name}" value="#GET{value}" class="radio" id="#GET{id}"[ (#GET{checked}|oui)checked="checked"][ (#GET{required}|oui)required="required"] />
107                [<label for="#GET{id}"[ (#GET{checked}|oui)class="on"][ title="(#VALEUR{explication}|attribut_html)"]>(#VALEUR{label})</label>]
108                </BOUCLE_columns>
109
110        </div>
111
112</div>
113</BOUCLE_medias>
Note: See TracBrowser for help on using the repository browser.