Changed style
This commit is contained in:
Bertrand Cournaud
parent
b403eff562
commit
55a9e556ba
208
index.html
208
index.html
|
|
@ -4,7 +4,7 @@
|
|||
<head>
|
||||
<meta charset="utf8" />
|
||||
<link rel="Stylesheet" href="style.css" />
|
||||
<title>Every Questions (BETA)</title>
|
||||
<title>Every AskWeb (BETA)</title>
|
||||
|
||||
<script language="javascript">
|
||||
var nbAnswer = 1;
|
||||
|
|
@ -13,9 +13,10 @@
|
|||
var element = document.createElement("input");
|
||||
|
||||
element.setAttribute("type", "text");
|
||||
element.setAttribute("id", "answer");
|
||||
element.setAttribute("name", "answer" + nbAnswer);
|
||||
nbAnswer++;
|
||||
element.setAttribute("placeholder", "Enter the new answer");
|
||||
element.setAttribute("placeholder", "Nouvelle réponse");
|
||||
|
||||
var foo = document.getElementById("answerList");
|
||||
foo.appendChild(element);
|
||||
|
|
@ -30,133 +31,152 @@
|
|||
<a href="http://www.h2g2.com" target="_blank">
|
||||
<img src="marvin-robot_normal.png" alt="" id="banner"/>
|
||||
</a>
|
||||
<h1>Nemubot Questions (BETA)</h1>
|
||||
<h1>Nemubot AskWeb (BETA)</h1>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section id="introduction">
|
||||
<article id="bonjour">
|
||||
<h2>Bonjour,</h2>
|
||||
<h2>Bonjour</h2>
|
||||
|
||||
Bienvenue sur le site de questions de Nemubot. Vous pouvez ici
|
||||
ajouter de nouvelles questions à Nemubot. Ces questions seront
|
||||
posées sur le chan irc.
|
||||
</article>
|
||||
|
||||
<article id="fonctionnement">
|
||||
<h2>Fonctionnement</h2>
|
||||
<article id="explications">
|
||||
<h2>Nemubot AskWeb en 3 étapes</h2>
|
||||
|
||||
<p>
|
||||
Les questions que vous ajoutez vont être soumise à vérification par une
|
||||
personne tirée au sort parmis la liste des participants du chan.
|
||||
</p>
|
||||
<p>
|
||||
L'un des principes de ces questions est qu'elle aient un rapport
|
||||
avec les cours dispensés au 2eme semestres et sur lesquelles nous
|
||||
auront des partiels. Merci de poser des questions qui vont dans
|
||||
ce sens.
|
||||
<h3>Nouvelle question</h3>
|
||||
Commencez par entrer votre question ainsi que la ou les réponses
|
||||
associées. À noter que :
|
||||
<ul>
|
||||
<li>Il est conseillé d'indiquer plusieurs fois vos réponses
|
||||
avec des variations telles que : "une chaussure"
|
||||
et "chaussure"</li>
|
||||
<li>Les questions possédant seulement 2 réponses possibles
|
||||
n'ont pas beaucoup d'intêret</li>
|
||||
</ul>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
Un email va être envoyé à cette personne avec votre question et
|
||||
la/les réponse(s) que vous avez proposé. Cette personne pourra alors
|
||||
valider votre question et celle ci pourra alors apparaitre sur le chan.
|
||||
Si elle est refusée, elle sera détruite de la base de données.
|
||||
<h3>Confirmer votre question</h3>
|
||||
Une fois la question ajoutée, un email vous a été envoyé pour que
|
||||
vous confirmiez qu'il s'agit bien de vous. Cliquez sur le lien
|
||||
pour confirmer.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<h3>Validation</h3>
|
||||
Une fois confirmée, un email est envoyé à un autre membre du groupe
|
||||
pour qu'il valide la question. S'il juge votre question fausse
|
||||
ou éronée elle n'apparaitra jamais dans les qcm sur le chan.
|
||||
</p>
|
||||
|
||||
</article>
|
||||
</section>
|
||||
|
||||
<form id="formulaire" method="post" action="questions.php">
|
||||
<section id="hello">
|
||||
<h2>Nouvelle question</h2>
|
||||
<form id="formulaire" method="post" action="questions.php">
|
||||
|
||||
<section id="Form">
|
||||
<aside id="info">
|
||||
<img src="left_triangle2.gif" id="arrow" alt=""/>
|
||||
<h3>Quelques détails</h3>
|
||||
<section id="Form">
|
||||
<aside id="info">
|
||||
<img src="left_triangle2.gif" id="arrow" alt=""/>
|
||||
<h3>Quelques détails</h3>
|
||||
|
||||
<p>
|
||||
Le champ "De quelle matière s'agit-il ?" n'est là qu'a titre
|
||||
indicatif. Il va permettre à la personne qui valide votre question
|
||||
d'aller vérifier par lui même la véracité de votre réponse.<br/>
|
||||
Indiquez la matière sur laquelle porte la question lui permettra
|
||||
d'aller plus vite.<br/>
|
||||
<p>
|
||||
Le champ "De quelle matière s'agit-il ?" n'est là qu'a titre
|
||||
indicatif. Il va permettre à la personne qui valide votre question
|
||||
d'aller vérifier par lui même la véracité de votre réponse.
|
||||
</p>
|
||||
</aside>
|
||||
|
||||
</p>
|
||||
</aside>
|
||||
<article id="list">
|
||||
<label for="course">De quelle matière s'agit-il ?</label><br/>
|
||||
|
||||
<article id="list">
|
||||
<label for="course">De quelle matière s'agit-il ?</label><br/>
|
||||
<select name="course" id="course">
|
||||
|
||||
<select name="course" id="course">
|
||||
<optgroup label="Cours communs">
|
||||
<option value="SGBD">SGBD</option>
|
||||
<option value="CompressionDeDonnées">
|
||||
Compression de données</option>
|
||||
<option value="ProtocolesDeLiaisons">
|
||||
Protocoles De Liaisons</option>
|
||||
<option value="TYLA">TYLA</option>
|
||||
<option value="ActiveDirectory">
|
||||
Active Directory</option>
|
||||
<option value="GrapheFlotReseau">
|
||||
Graphes Flots Reseaux</option>
|
||||
</optgroup>
|
||||
|
||||
<optgroup label="Cours communs">
|
||||
<option value="SGBD">SGBD</option>
|
||||
<option value="CompressionDeDonnées">
|
||||
Compression de données</option>
|
||||
<option value="ProtocolesDeLiaisons">
|
||||
Protocoles De Liaisons</option>
|
||||
<option value="TYLA">TYLA</option>
|
||||
<option value="ActiveDirectory">
|
||||
Active Directory</option>
|
||||
<option value="GrapheFlotReseau">
|
||||
Graphes Flots Reseaux</option>
|
||||
</optgroup>
|
||||
<optgroup label="Electif">
|
||||
<option value="RXAN">RXAN</option>
|
||||
</optgroup>
|
||||
|
||||
<optgroup label="Electif">
|
||||
<option value="RXAN">RXAN</option>
|
||||
</optgroup>
|
||||
<optgroup label="TDA">
|
||||
<option value="TYLA">TYLA</option>
|
||||
<option value="CCMP">CCMP</option>
|
||||
<option value="SLPS">SLPS</option>
|
||||
<option value="FMPS">FMPS</option>
|
||||
</optgroup>
|
||||
|
||||
<optgroup label="TDA">
|
||||
<option value="TYLA">TYLA</option>
|
||||
<option value="CCMP">CCMP</option>
|
||||
<option value="SLPS">SLPS</option>
|
||||
<option value="FMPS">FMPS</option>
|
||||
</optgroup>
|
||||
<optgroup label="MTM">
|
||||
<option value="ITIL">ITIL</option>
|
||||
<option value="Qualite">Qualité</option>
|
||||
</optgroup>
|
||||
|
||||
<optgroup label="MTM">
|
||||
<option value="ITIL">ITIL</option>
|
||||
<option value="Qualite">Qualité</option>
|
||||
</optgroup>
|
||||
<optgroup label="Autre">
|
||||
<option value="Autre" selected>Autre</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
</article>
|
||||
|
||||
<optgroup label="Autre">
|
||||
<option value="Autre" selected>Autre</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
</article>
|
||||
<aside id="info">
|
||||
<img src="left_triangle2.gif" id="arrow2" alt=""/>
|
||||
<h3>La question</h3>
|
||||
<p>
|
||||
La question sera afficher sur 1 ligne. Donc pas la peine de
|
||||
faire de retour à la ligne.
|
||||
<p>
|
||||
</aside>
|
||||
|
||||
<article>
|
||||
<p id="questionPart">
|
||||
<label id="q" for="question">
|
||||
Quelle est votre question ? </label><br/>
|
||||
<textarea id="question" name="question"
|
||||
rows="10" cols="50"
|
||||
placeholder="Entrez votre question ici"></textarea>
|
||||
</p>
|
||||
<p id="answerList">
|
||||
<label for="answer">Quelle est la réponse ? </label><br/>
|
||||
<input id="answer" name="answer0" type="text" />
|
||||
</p>
|
||||
<article>
|
||||
<p id="questionPart">
|
||||
<label id="q" for="question">
|
||||
Quelle est votre question ? </label><br/>
|
||||
<textarea id="question" name="question"
|
||||
rows="3" cols="70"
|
||||
placeholder="Entrez votre question ici"></textarea>
|
||||
</p>
|
||||
<p id="answerList">
|
||||
<label for="answer">Quelle est la réponse ? </label><br/>
|
||||
<input id="answer" name="answer0" type="text" />
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<input type="button" value="Ajouter une réponse supplémentaire"
|
||||
onclick="add()"/>
|
||||
</p>
|
||||
<p>
|
||||
<label for="email">Merci d indiquer votre email</label><br/>
|
||||
<input id="email" name="email" type="text" />
|
||||
</p>
|
||||
<p>
|
||||
<input type="submit" name="send" value="Envoyer" />
|
||||
</p>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
</form>
|
||||
<p>
|
||||
<input type="button" value="Ajouter une réponse supplémentaire"
|
||||
onclick="add()"/>
|
||||
</p>
|
||||
<p>
|
||||
<label for="email">Merci d'indiquer votre email</label><br/>
|
||||
<input id="email" name="email" type="text" />
|
||||
</p>
|
||||
<p>
|
||||
<input type="submit" name="send" value="Envoyer" />
|
||||
</p>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
</form>
|
||||
</section>
|
||||
<footer>
|
||||
<h4>Details</h4>
|
||||
Ça fait moche un site sans pied de page.<br/>
|
||||
En voilà donc un.
|
||||
<h3>Liens utiles</h3>
|
||||
<ul>
|
||||
<li><a href="http://mastercorp.epita.eu" target="_blank">
|
||||
Le site Mastercorp</a></li>
|
||||
</ul>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
|
|
|
|||
52
style.css
52
style.css
|
|
@ -1,17 +1,18 @@
|
|||
body
|
||||
{
|
||||
text-align: center;
|
||||
width: 60%;
|
||||
width: 75%;
|
||||
margin: auto;
|
||||
background-color: #545455;
|
||||
background-color: #CCCCCC;
|
||||
}
|
||||
|
||||
header
|
||||
{
|
||||
border-radius: 10px;
|
||||
border-top-left-radius: 5px;
|
||||
border-top-right-radius: 5px;
|
||||
margin: 10px;
|
||||
padding: 8px;
|
||||
background-color: black;
|
||||
background-color: #333333;
|
||||
color: orange;
|
||||
}
|
||||
|
||||
|
|
@ -21,50 +22,38 @@ header
|
|||
float: right;
|
||||
}
|
||||
|
||||
#introduction
|
||||
#introduction, #hello
|
||||
{
|
||||
text-align: justify;
|
||||
border-radius: 5px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
#introduction article
|
||||
#introduction article, #hello
|
||||
{
|
||||
display: block;
|
||||
width: 42%;
|
||||
background-color: white;
|
||||
border: solid;
|
||||
box-shadow: 0px 5px 5px black;
|
||||
border-radius: 3px;
|
||||
border-radius: 0px;
|
||||
padding: 10px;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
article h2, form h2
|
||||
article h2, #hello h2
|
||||
{
|
||||
background-color: black;
|
||||
background-color: #333333;
|
||||
color: orange;
|
||||
margin-left: -10px;
|
||||
margin-right: -10px;
|
||||
}
|
||||
|
||||
#bonjour
|
||||
{
|
||||
float: left;
|
||||
margin-left: 2%;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
#fonctionnement
|
||||
{
|
||||
float: right;
|
||||
margin-right: 2%;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
form
|
||||
#hello
|
||||
{
|
||||
border: solid;
|
||||
border-radius: 5px;
|
||||
clear: both;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 20px;
|
||||
|
|
@ -88,10 +77,11 @@ aside
|
|||
{
|
||||
float: right;
|
||||
width: 30%;
|
||||
border-radius: 10px;
|
||||
box-shadow: 0px 5px 10px black;
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
background-color: black;
|
||||
background-color: #222222;
|
||||
color: orange;
|
||||
}
|
||||
|
||||
|
|
@ -102,8 +92,22 @@ aside
|
|||
margin-top: 80px;
|
||||
}
|
||||
|
||||
#arrow2
|
||||
{
|
||||
position: absolute;
|
||||
margin-left: -40px;
|
||||
margin-top: 45px;
|
||||
}
|
||||
|
||||
|
||||
footer
|
||||
{
|
||||
border-top: solid;
|
||||
text-align: justify;
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
|
||||
footer a
|
||||
{
|
||||
color: black;
|
||||
}
|
||||
|
|
|
|||
Reference in New Issue