Remise en page du formulaire

This commit is contained in:
xdrm-brackets 2016-04-25 12:26:08 +02:00
parent e2e5bd0418
commit 8cb235f507
1 changed files with 68 additions and 46 deletions

View File

@ -176,8 +176,8 @@
</select></span> </select></span>
</h5> </h5>
<h4 data-icon='a'>Type de relation</h4>
<h5 class='nobold color0'> <h5 class='nobold color0'>
Type de relation: <br>
&nbsp&nbsp&nbsp<input type='radio' name='reltype' id='reltype0'><label for='reltype0'>père, mère ou équivalent</label><br> &nbsp&nbsp&nbsp<input type='radio' name='reltype' id='reltype0'><label for='reltype0'>père, mère ou équivalent</label><br>
&nbsp&nbsp&nbsp<input type='radio' name='reltype' id='reltype1'><label for='reltype1'>frère ou soeur</label><br> &nbsp&nbsp&nbsp<input type='radio' name='reltype' id='reltype1'><label for='reltype1'>frère ou soeur</label><br>
&nbsp&nbsp&nbsp<input type='radio' name='reltype' id='reltype2'><label for='reltype2'>autre membre de la famille</label><br> &nbsp&nbsp&nbsp<input type='radio' name='reltype' id='reltype2'><label for='reltype2'>autre membre de la famille</label><br>
@ -189,8 +189,8 @@
&nbsp&nbsp&nbsp<input type='radio' name='reltype' id='reltype8'><label for='reltype8'>autre : <input type='text' id='reltypeSpecial' placeholder='Type de relation'></label><br> &nbsp&nbsp&nbsp<input type='radio' name='reltype' id='reltype8'><label for='reltype8'>autre : <input type='text' id='reltypeSpecial' placeholder='Type de relation'></label><br>
</h5> </h5>
<h4 data-icon='m'> habite t-elle/il ?</h4>
<h5 class='nobold color0'> <h5 class='nobold color0'>
habite t-elle/il ?<br>
&nbsp&nbsp&nbsp<input type='radio' checked name='loc' data-name='loc' id='locA_0'><label for='locA_0'>- de 5 minutes</label><br> &nbsp&nbsp&nbsp<input type='radio' checked name='loc' data-name='loc' id='locA_0'><label for='locA_0'>- de 5 minutes</label><br>
&nbsp&nbsp&nbsp<input type='radio' name='loc' data-name='loc' id='locB_0'><label for='locB_0'>de 5 à 15 minutes</label><br> &nbsp&nbsp&nbsp<input type='radio' name='loc' data-name='loc' id='locB_0'><label for='locB_0'>de 5 à 15 minutes</label><br>
&nbsp&nbsp&nbsp<input type='radio' name='loc' data-name='loc' id='locC_0'><label for='locC_0'>de 15 à 60 minutes</label><br> &nbsp&nbsp&nbsp<input type='radio' name='loc' data-name='loc' id='locC_0'><label for='locC_0'>de 15 à 60 minutes</label><br>
@ -203,9 +203,8 @@
</h5> </h5>
<h4 data-icon='d'>Contexte de rencontre</h4>
<h5 class='nobold color0'> <h5 class='nobold color0'>
Contexte de rencontre :<br>
&nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte0'> <label for='contexte0'>De la même famille</label><br> &nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte0'> <label for='contexte0'>De la même famille</label><br>
&nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte1'> <label for='contexte1'>Grandi ensemble</label><br> &nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte1'> <label for='contexte1'>Grandi ensemble</label><br>
&nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte2'> <label for='contexte2'>Par mon mari/ma femme/relation amoureuse</label><br> &nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte2'> <label for='contexte2'>Par mon mari/ma femme/relation amoureuse</label><br>
@ -216,78 +215,101 @@
&nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte7'> <label for='contexte7'>Par dautres membres de la famille</label><br> &nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte7'> <label for='contexte7'>Par dautres membres de la famille</label><br>
&nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte8'> <label for='contexte8'>études</label><br> &nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte8'> <label for='contexte8'>études</label><br>
&nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte9'> <label for='contexte9'>Etudes supérieures</label><br> &nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte9'> <label for='contexte9'>Etudes supérieures</label><br>
</h5>
<h5 class='nobold color0'>
&nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte10'><label for='contexte10'>Au travail</label><br> &nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte10'><label for='contexte10'>Au travail</label><br>
&nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte11'><label for='contexte11'>Internet (quel contexte ? préciser <input type='text' id='contexteSpecial1' placeholder='partage, youtube, ..'>)</label><br> &nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte11'><label for='contexte11'>Internet (quel contexte ? préciser <input type='text' id='contexteSpecial1' placeholder='partage, youtube, ..'>)</label><br>
&nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte12'><label for='contexte12'>Par une association (quel type : <input type='text' id='contexteSpecial2' placeholder='aide à la personne, ..'>)</label><br> &nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte12'><label for='contexte12'>Par une association (quel type : <input type='text' id='contexteSpecial2' placeholder='aide à la personne, ..'>)</label><br>
&nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte13'><label for='contexte13'>Autre : <input type='text' id='contexteSpecial3' placeholder='Contexte de relation'></label><br> &nbsp&nbsp&nbsp<input type='radio' name='contexte' id='contexte13'><label for='contexte13'>Autre : <input type='text' id='contexteSpecial3' placeholder='Contexte de relation'></label><br>
</h5> </h5>
<h4 data-icon='b'>Avec quelle fréquence discutez-vous avec cette personne ?</h4>
<h5 class='nobold color0'> <h5 class='nobold color0'>
Avec quelle fréquence discutez-vous avec cette personne ?
Face à face<br> Face à face<br>
&nbsp&nbsp&nbsp<input type='radio' name='freq0' id='freq01'><label for='freq01'>plusieurs fois par semaine</label> &nbsp&nbsp&nbsp<input type='radio' name='freq0' id='freq01'><label for='freq01'>plusieurs fois par semaine</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq0' id='freq02'><label for='freq02'>1 fois par semaine</label> &nbsp&nbsp&nbsp<input type='radio' name='freq0' id='freq02'><label for='freq02'>1 fois par semaine</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq0' id='freq03'><label for='freq03'>1 fois par mois</label> &nbsp&nbsp&nbsp<input type='radio' name='freq0' id='freq03'><label for='freq03'>1 fois par mois</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq0' id='freq04'><label for='freq04'>1 fois par an ou moins</label><br><br> &nbsp&nbsp&nbsp<input type='radio' name='freq0' id='freq04'><label for='freq04'>1 fois par an ou moins</label>
</h5>
<h5 class='nobold color0'>
Téléphone ou skype et eqts<br> Téléphone ou skype et eqts<br>
&nbsp&nbsp&nbsp<input type='radio' name='freq1' id='freq11'><label for='freq11'>plusieurs fois par semaine</label> &nbsp&nbsp&nbsp<input type='radio' name='freq1' id='freq11'><label for='freq11'>plusieurs fois par semaine</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq1' id='freq12'><label for='freq12'>1 fois par semaine</label> &nbsp&nbsp&nbsp<input type='radio' name='freq1' id='freq12'><label for='freq12'>1 fois par semaine</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq1' id='freq13'><label for='freq13'>1 fois par mois</label> &nbsp&nbsp&nbsp<input type='radio' name='freq1' id='freq13'><label for='freq13'>1 fois par mois</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq1' id='freq14'><label for='freq14'>1 fois par an ou moins</label><br><br> &nbsp&nbsp&nbsp<input type='radio' name='freq1' id='freq14'><label for='freq14'>1 fois par an ou moins</label>
</h5>
<h5 class='nobold color0'>
SMS, et équivalents<br> SMS, et équivalents<br>
&nbsp&nbsp&nbsp<input type='radio' name='freq2' id='freq21'><label for='freq21'>plusieurs fois par semaine</label> &nbsp&nbsp&nbsp<input type='radio' name='freq2' id='freq21'><label for='freq21'>plusieurs fois par semaine</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq2' id='freq22'><label for='freq22'>1 fois par semaine</label> &nbsp&nbsp&nbsp<input type='radio' name='freq2' id='freq22'><label for='freq22'>1 fois par semaine</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq2' id='freq23'><label for='freq23'>1 fois par mois</label> &nbsp&nbsp&nbsp<input type='radio' name='freq2' id='freq23'><label for='freq23'>1 fois par mois</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq2' id='freq24'><label for='freq24'>1 fois par an ou moins</label><br><br> &nbsp&nbsp&nbsp<input type='radio' name='freq2' id='freq24'><label for='freq24'>1 fois par an ou moins</label>
</h5>
<h5 class='nobold color0'>
Courrier électronique<br> Courrier électronique<br>
&nbsp&nbsp&nbsp<input type='radio' name='freq3' id='freq31'><label for='freq31'>plusieurs fois par semaine</label> &nbsp&nbsp&nbsp<input type='radio' name='freq3' id='freq31'><label for='freq31'>plusieurs fois par semaine</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq3' id='freq32'><label for='freq32'>1 fois par semaine</label> &nbsp&nbsp&nbsp<input type='radio' name='freq3' id='freq32'><label for='freq32'>1 fois par semaine</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq3' id='freq33'><label for='freq33'>1 fois par mois</label> &nbsp&nbsp&nbsp<input type='radio' name='freq3' id='freq33'><label for='freq33'>1 fois par mois</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq3' id='freq34'><label for='freq34'>1 fois par an ou moins</label><br><br> &nbsp&nbsp&nbsp<input type='radio' name='freq3' id='freq34'><label for='freq34'>1 fois par an ou moins</label>
</h5>
<h5 class='nobold color0'>
Facebook ou autre réseau social<br> Facebook ou autre réseau social<br>
&nbsp&nbsp&nbsp<input type='radio' name='freq4' id='freq41'><label for='freq41'>plusieurs fois par semaine</label> &nbsp&nbsp&nbsp<input type='radio' name='freq4' id='freq41'><label for='freq41'>plusieurs fois par semaine</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq4' id='freq42'><label for='freq42'>1 fois par semaine</label> &nbsp&nbsp&nbsp<input type='radio' name='freq4' id='freq42'><label for='freq42'>1 fois par semaine</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq4' id='freq43'><label for='freq43'>1 fois par mois</label> &nbsp&nbsp&nbsp<input type='radio' name='freq4' id='freq43'><label for='freq43'>1 fois par mois</label>
&nbsp&nbsp&nbsp<input type='radio' name='freq4' id='freq44'><label for='freq44'>1 fois par an ou moins</label><br><br> &nbsp&nbsp&nbsp<input type='radio' name='freq4' id='freq44'><label for='freq44'>1 fois par an ou moins</label>
</h5>
<h4 data-icon='r'>Comment êtes-vous « connecté » à cette personne ?</h4>
<h5 class='nobold color0'>
Ses coordonnées sont dans votre carnet dadresse<br>
&nbsp&nbsp&nbsp<input type='radio' name='connect1' id='connect11'><label for='connect11'>Oui</label>
&nbsp&nbsp&nbsp<input type='radio' name='connect1' id='connect12'><label for='connect12'>Non</label>
</h5> </h5>
<h5 class='nobold color0'> <h5 class='nobold color0'>
Comment êtes-vous « connecté » à cette personne ?<br><br>
Ses coordonnées sont dans votre carnet dadresse<br>
&nbsp&nbsp&nbsp<input type='radio' name='connect1' id='connect11'><label for='connect11'>Oui</label>
&nbsp&nbsp&nbsp<input type='radio' name='connect1' id='connect12'><label for='connect12'>Non</label><br><br>
Son numéro de mobile est enregistré sur votre mobile (ou vous-mêmes êtes sur le sien)<br> Son numéro de mobile est enregistré sur votre mobile (ou vous-mêmes êtes sur le sien)<br>
&nbsp&nbsp&nbsp<input type='radio' name='connect2' id='connect21'><label for='connect21'>Oui</label> &nbsp&nbsp&nbsp<input type='radio' name='connect2' id='connect21'><label for='connect21'>Oui</label>
&nbsp&nbsp&nbsp<input type='radio' name='connect2' id='connect22'><label for='connect22'>Non</label><br><br> &nbsp&nbsp&nbsp<input type='radio' name='connect2' id='connect22'><label for='connect22'>Non</label>
</h5>
<h5 class='nobold color0'>
Elle figure parmi vos amis facebook<br> Elle figure parmi vos amis facebook<br>
&nbsp&nbsp&nbsp<input type='radio' name='connect3' id='connect31'><label for='connect31'>Oui</label> &nbsp&nbsp&nbsp<input type='radio' name='connect3' id='connect31'><label for='connect31'>Oui</label>
&nbsp&nbsp&nbsp<input type='radio' name='connect3' id='connect32'><label for='connect32'>Non</label><br><br> &nbsp&nbsp&nbsp<input type='radio' name='connect3' id='connect32'><label for='connect32'>Non</label>
</h5>
<h5 class='nobold color0'>
Elle figure parmi vos amis facebook et vous interagissez avec elle sur ce dispositif régulièrement<br> Elle figure parmi vos amis facebook et vous interagissez avec elle sur ce dispositif régulièrement<br>
&nbsp&nbsp&nbsp<input type='radio' name='connect4' id='connect41'><label for='connect41'>Oui</label> &nbsp&nbsp&nbsp<input type='radio' name='connect4' id='connect41'><label for='connect41'>Oui</label>
&nbsp&nbsp&nbsp<input type='radio' name='connect4' id='connect42'><label for='connect42'>Non</label><br><br> &nbsp&nbsp&nbsp<input type='radio' name='connect4' id='connect42'><label for='connect42'>Non</label>
</h5>
<h5 class='nobold color0'>
Vous le suivez sur Twitter<br> Vous le suivez sur Twitter<br>
&nbsp&nbsp&nbsp<input type='radio' name='connect5' id='connect51'><label for='connect51'>Oui</label> &nbsp&nbsp&nbsp<input type='radio' name='connect5' id='connect51'><label for='connect51'>Oui</label>
&nbsp&nbsp&nbsp<input type='radio' name='connect5' id='connect52'><label for='connect52'>Non</label><br><br> &nbsp&nbsp&nbsp<input type='radio' name='connect5' id='connect52'><label for='connect52'>Non</label>
</h5>
<h5 class='nobold color0'>
Vous communiquez avec cette personne sur Twitter<br> Vous communiquez avec cette personne sur Twitter<br>
&nbsp&nbsp&nbsp<input type='radio' name='connect6' id='connect61'><label for='connect61'>Oui</label> &nbsp&nbsp&nbsp<input type='radio' name='connect6' id='connect61'><label for='connect61'>Oui</label>
&nbsp&nbsp&nbsp<input type='radio' name='connect6' id='connect62'><label for='connect62'>Non</label><br><br> &nbsp&nbsp&nbsp<input type='radio' name='connect6' id='connect62'><label for='connect62'>Non</label>
</h5>
Vous communiquez dans autre réseau : <input type='text' name='connectSpecial1'><br><br> <h5 class='nobold color0'>
Vous communiquez dans autre réseau : <input type='text' name='connectSpecial1'>
</h5>
Vous communiquez dans un autre dispositif (blogs, jeu vidéo ou autre) : <input type='text' name='connectSpecial2'><br><br> <h5 class='nobold color0'>
Vous communiquez dans un autre dispositif (blogs, jeu vidéo ou autre) : <input type='text' name='connectSpecial2'>
<h5> </h5>
</article> </article>